bgreenawald / madgab-online

1 stars 0 forks source link

Splitting clue lines #2

Open bgreenawald opened 4 years ago

bgreenawald commented 4 years ago

I've noticed that having the entire clue in one line makes the game a lot easier. You can mentally squish the words together and see what it's supposed to be. Having the clue split across multiple lines (which is the way the actual game does it), would be much more effective. I'm sure the best way to it would be to set some sort of max-width argument in the container for the clue that breaks it up if it gets too wide. Another would be a function (like the one included below), which takes in the clue and a maximum length per line and splits up the clue into lines.

function split_words(text, max_length) {

    // Ensure the arguments are the correct type
    if (typeof(text) != "string" || typeof(max_length) != "number") {
        console.log("Invalid argument types.");
        return;
    }

    // Ensure a valid line length
    if (max_length < 0 || max_length == NaN) {
        console.log("Invalid max_length.");
        return;
    }

    // Split the words based on spaces
    var words = text.split(" ");

    // Make the return string equal to the first word and records its length
    var ret = words.shift();
    var cur_length = ret.length;

    // Iterate over the remaining words
    for (i in words) {
        var cur_word = words[i];

        // If the current line plus the next word is still less than max
        // length, add the current word to the current line
        if (cur_length + cur_word.length + 1 <= max_length) {
            ret += " " + cur_word;
            cur_length += cur_word.length + 1;
        }
        // Otherwise, add a line break and make the new line equal to the next word
        else {
            ret += "<br>" + cur_word;
            cur_length = cur_word.length;
        }
    }

    return ret;
}
JocelynYH commented 4 years ago

I think, replacing each " " with \n would also achieve the same effect?

bgreenawald commented 4 years ago

That would certainly be the simplest (though I think you would have to replace it with
to have the HTML render correctly). My only concern would be that sometimes it generates really short words that don't seem like they should be on their own lines.

JocelynYH commented 4 years ago

Okay I can tweak the script you provided, and inject it into the frontend! Thanks for providing the script!

El mar., 31 de diciembre de 2019 07:58, Benjamin Greenawald < notifications@github.com> escribió:

That would certainly be the simplest (though I think you would have to replace it with to have the HTML render correctly). My only concern would be that sometimes it generates really short words that don't seem like they should be on their own lines.

— You are receiving this because you were assigned. Reply to this email directly, view it on GitHub https://github.com/bgreenawald/madgab-online/issues/2?email_source=notifications&email_token=AGMDHIIGOXOEQ5RU76RFT3LQ3M6W7A5CNFSM4J6URVR2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEH4F2NI#issuecomment-569924917, or unsubscribe https://github.com/notifications/unsubscribe-auth/AGMDHIMLSRGCPBGEWLTH6VTQ3M6W7ANCNFSM4J6URVRQ .

JocelynYH commented 3 years ago

Do you have any opinions on the max length? in other words, do we want to specify the value from the backend?

bgreenawald commented 3 years ago

We may have to play around with it a bit. But I think this is something we would specify on the frontend instead of the backend since it's a front-end only variable.