help.cpp

#include "help.hpp"

const QString code(const QString str) {
    const QString codeRepl = "<span style='"
        "background-color:" "grey;"
        "font-family:" "monospace;"
        "padding:" "2px;"
    "'>%1</span>";
    return codeRepl.arg(str);
}
const QString hl(const QString str) {
    const QString hlRepl = "<span style='background-color:" "#C89353;'>"
        "&nbsp;%1&nbsp;"
    "</span>";
    return hlRepl.arg(str);
}
const QString nl(const QString str) {
    const QString nlRepl = "<div style='"
        "display:" "inline-block;"
        "margin-left:" "20px;"
    "'>%1</div>";
    return nlRepl.arg(str);
}
const QString qu = "<span style='background-color:" "#AAAAAA;'>&nbsp;</span>&nbsp;";


const QString APP_HELP = 
"<h1>How the app works</h1>"
    "<p>This app is a flashcard app where you complete flashcards in order to grow a tree.</p>"
    "<p>You can make it as complex or easy as you like!</p>"
    "<p>You'll get it as you go along, but if not you can always check the help for specifc things in the <b>Help &gt; This screen</b> menu.</p>"
"<h2>What's in the app?</h2>"
    "<p>The app is split into these main scenes:</p>"
    "<ul>"
        "<li>"+hl("The home screen")+" is what you see when you first open the app and contains deck management stuff.</li>"
        "<li>"+hl("The browse cards scene")+" is where you create flashcards</li>"
        "<li>"+hl("The plugin manager scene")+" is where you manage plugins</li>"
        "<li>"+hl("The game scene")+" is where you study the flashcards!</li>"
    "</ul>"
    "<p>Each scene explains how it works in detail in the <b>Help &gt; This screen</b> menu.</p>"
"<h2>How does the app work?</h2>"
    "<p>There are <i>Decks</i> which contain <i>Notes</i> which generate (using note features) <i>Cards</i>. Decks are like different subjects, Notes are like different concepts, and Cards are the physical flashcards that you study.</p>"
"<h2>What's the best way to quickly get started?</h2>"
    "<p>In the browse cards scene, <b>File &gt; Reset notes to default</b> will do just that and you can look at all the notes for examples!</p>"
    "<p>Also there, <b>Help &gt; Note feature help</b> is quite useful for seeing everything you can do.</p>"
"<h2>Keybinds</h2>"
    "<p>These work in any scene, as long as you aren't selecting an editable element.</p>"
    "<ul>"
        "<li>H or &lt;Escape&gt; to go home</li>"
        "<li>B to browse cards</li>"
        "<li>G to play the game</li>"
        "<li>P to manage plugins</li>"
    "</ul>"
"<h2>Menu options</h2>"
    "<ul>"
        "<li><b>File</b> contains scene-specific things</li>"
        "<li><b>Go To</b> is for when you've forgotten the above keybinds (or are using a touchscreen)</li>"
        "<li>Sometimes extra scene-specific menues will appear here, e.g. the number of cards in the browse scene</li>"
        "<li><b>Help</b> contains popups to help you (sometimes with extra scene-specific popup options avaliable too)</li>"
    "</ul>"
"<h1>FAQ</h1>"
    "<ul>"
        "<li><b>Did it save my changes?</b>"
            +nl("Yes. Every time you change even one letter it saves to the file. This includes renaming."
            )+"</li>"
        "<li><b>How do I find the logs/config directory?</b>"
            +nl("To see the logs: <b>Help &gt; Logs</b>. Config directory is the first log on the list."
            )+"</li>"
        "<li><b>Why can't I do anything in the app, it's frozen!</b>"
            +nl("When <i>some</i> dialog windows are open, the app will not respond to user interactions. Close them first!"
            )+"</li>"
    "</ul>"
;

const QString HOME_HELP = 
"<h2>Menu items</h2>"
    "<ul>"
        "<li><b>File</b><ul>"
            "<li>Delete all temporary decks (decks starting with "+hl(".")+") (moves them to the recycle bin if possible)</li>"
            "<li>Import deck</li>"
        "</ul></li>"
    "</ul>"
"<h2>Decks</h2>"
    "<h3>Basic deck stuff</h3>"
        "<p>Use the 'Deck Select' to select a deck. Click on it and you can choose a deck (or blank to make a new deck!).</p>"
        "<p>Whatever's present there is the deck you are currently using.</p>"
        "<p>The rename box below allows you to rename the deck, just type in it to edit!</p>"
        "<p><i>If the rename text is red, blank or not matching up with the deck selector dropdown then the name is invalid.</i> There may be an existing deck with that name or another problem.</p>"
    "<h3>Making new decks</h3>"
        "<p>To make a new deck, select the empty deck. Adding notes will make it into a new deck! You can rename it before or after you add a note to it.</p>"
    "<h3>Deleting decks</h3>"
        "<p>To delete a deck, backspace the name in the <i>rename deck field</i> then press backspace one more time to give an "+hl("Are you sure?")+" dialog.</p>"
        "<p>Or, you can use the delete button in the deck options popup.</p>"
        "<p>OR, you can prefix the deck with "+hl(".")+" and it will be deleted next app reset or on demand through the menu item.</p>"
    "<h3>Deck options (for the current deck)</h3>"
        "<ul>"
            "<li>Delete the deck (does the same thing as backspacing the name, except <i>does not ask for verification first</i>)</li>"
            "<li>Export the deck"
            +nl(
                "From the system file select popup, you can select different file types to export it as."
                "<br>The 'original' filetype options allow for reimporting as it exports the original code, while 'rendered' filetypes render the cards and cannot be reimported (nicely)."
            )+"</li>"
            "<li>Copy the deck with some requirements, e.g. to make it temporary</li>"
        "</ul>"
"<h2>Temporary decks</h2>"
    "<p>Decks starting with a "+hl(".")+" are temporary and will be <i>put in the recycle bin</i> next app startup (or on request via the menu option)</p>"
    "<p>Removing the "+hl(".")+" at the start of a deck name will make it not temporary anymore, and adding one will make it temporary.</p>"
;

const QString BROWSE_HELP = 
"<h2>Keybinds</h2>"
    "<ul>"
        "<li>&lt;Ctrl+Shift+Delete&gt; to delete currently selected item</li>"
        "<li>&lt;Ctrl+Shift+Enter&gt; to make a new note</li>"
        "<li>&lt;Esc&gt; to go back</li>"
    "</ul>"
"<h2>Menu items</h2>"
    "<ul>"
        "<li><b>File</b><ul>"
            "<li>Options for deleting/resetting notes</li>"
            "<li>New note/delete current note (with keybind)</li>"
        "</ul></li>"
        "<li><b>Help</b><ul>"
            "<li>Note feature help screen - <b>very helpful!</b> The features are only described there, please look there for help.</li>"
        "</ul></li>"
    "</ul>"
"<h2>Tree column headers</h2>"
    "<p>You can click on any header to sort by it, and click again to sort the other direction. "
        "You can also resize the headers!</p>"
    "<ul>"
        "<li><i>Name</i> - the name of the note (a one-line representation of the note's contents)</li>"
        "<li>📚 - <b>Cards</b> (The amount of cards produced by the note)</li>"
        "<li>📝 - <b>Templates</b> (The amount of templates specified by the note)</li>"
        "<li>% - <b>Percent complete</b> (on average over every card)</li>"
        "<li>🏷️ - <b>Tags</b> (The list of tags provided)</li>"
        "<li>‼️ - <b>Errors</b> (The amount of errors in the note)</li>"
    "</ul>"
"<h2>Notes and cards</h2>"
    "<p><i>Notes</i> are blocks of information and <i>cards</i> are generated from them.</p>"
    "<p>Cards are created when specific features are added to cards.</p>"
    "<p>For example, you can split your note into a front and a back side with <b>---</b> to create a 'single sided note'.</p>"
    "<p>There are some sample cards for you to look at for help.</p>"
"<h2>Creating/Deleting notes</h2>"
    "<p>"+hl("<b>WHEN THE NOTE INPUT BOX IS EMPTY, TYPING IN IT WILL CREATE A NEW NOTE. IF YOU DELETE ALL THE TEXT IN IT, IT WILL DELETE THAT NOTE.</b>"
        )+"</p>"
    "<p>There are 3 ways to create a note: either press the File &gt; New note, press the keybind it says, or press &lt;Esc&gt;. In all cases it will clear the note edit box for you to create a new note!</p>"
    "<p>With deleting you can either use File &gt; Delete note or use the keybind it states.</p>"
"<h2>Markdown support</h2>"
    "<p>This app contains various ways to markup your text;</p>"
    "<ul>"
        "<li><i>*italics*</i></li>"
        "<li><b>**bold**</b></li>"
        "<li><u>_underline_</u></li>"
        "<li><s>~~strikethrough~~</s></li>"
        "<li>Bullet points: Can use one of these characters for different bullet symbols: * - +</li>"
        "<li>"+hl("==highlight==")+"</li>"
        "<li>"+code("`code`")+"</li>"
    "</ul>"
"<h2>Escaping</h2>"
    "<p>Sometimes you may want to use things in your notes literally (e.g. "+code("---")+") without it being recognised as a note feature or whatever. "
        "For that, we have backslashes!</p>"
    "<p>All backslashes will be removed from the final text, but you can use this to your advantage. "
        "Using backslashes in places e.g. "+code("\\---")+" or "+code("-\\--")+" will make the feature not parse as a feature!</p>"
    "<p>Rules for backslashes: place it wherever it works (try on the inside or the left of features)</p>"
    "<h3>Additional uses for backslash</h3>"
    "<ul>"
        "<li>To get a regular backslash in your text you can escape the backslash itself; i.e. "+code("\\\\")+"</li>"
        "<li>You can also backslash and then have a newline to remove the newline in the final note, useful if you want to break a complex statement/expression for one line into multiple.</li>"
        "<li>If you write "+code("\\n")+" then it will insert a newline there. Useful if you want to write multiple lines in one (but pls don't)</li>"
    "</ul>"
    "<p><b>HINT</b>: (hopefully) if you are escaping a feature it will not have its colour, and that can be used to see if it worked.</p>"
"<h2>Scheduling</h2>"
    "<p>Scheduling for cards is auto generated and updated at the bottom of the file.</p>"
    "<p>Adding text after it will still work, but the text will get moved before it when the card is next completed.</p>"
    "<p>The scheduling info is different for different card features, so copying it to another card may/may not work.</p>"
    "<p>To reset scheduling you can just delete the line. It will get recreated later, but with a new schedule.</p>"
"<h2>How to use</h2>"
    "<p>You can select notes on the left and edit their contents on the right</p>"
    "<p>There is a bar in the middle you can move left/right to adjust the screen to your needs</p>"
    "<p>Press the "+hl("New note")+" button in the title to make a new note</p>"
    "<p>Notes can contain things in them that create cards or that affect the text."
        +nl("By default, notes create 0 cards so don't expect them to do stuff unless you add things to them"
        )+"</p>"
    "<p>Things you can add to your notes are in a layout above the note."
        +nl(
        "Pressing the arrow expands/contracts to see extra."
        "<br>Pressing the settings button allows you to see all of them at once, and clicking on each will reveal details and help for if you are unsure of what they do."
        )+"</p>"
    "<p>Below the note input there is a preview. Click on the preview to change side (front vs back) and use the arrows to select between different cards generated by that note."
        +nl("The preview will display errors that are present in the note too."
        )+"</p>"
"<h2>Random tidbit of info</h2>"
    "<p>Making separate cards is preferred over making one card with randomness</p>"
"<h2>Note templates</h2>"
    "<p><i>This may seem complicated or overwhelming at first but a lot of this is just for reference and is entirely unecessary if you don't want to use it.</i> Look at the sample notes for some simple uses!</p>"
    "<p>Note templates are used in 2 phases - defining them, then using them.</p>"
    "<p>There are some examples of note template uses in the example cards</p>"
    "<h3>Structure</h3>"
        "<p>Note templates are comprised of a header and contents, and are contained in "+code("|| ... ||")+" for usage (or "+code("|! ... ||")+" for one char usage) or "+code("|= ... =|")+" for definitions (or "+code("|: ... :|")+" for local definitions).</p>"
        "<p>The header is separated from the body of the template via a "+code(":")+" or a "+code("|")+" or a space (including newlines) <i>unless you use a one char usage (see below)</i>.</p>"
        "<p>After the header <i>of definitions only</i> is an optional argument specification. This is contained within "+code("[]")+" and is separated from the body in the exact same way as the header. See below for more info about arguments."
            +nl("Here is an example: "+code("|= name [stuff here] conts =|")
            )+"</p>"
        "<p>The body for template usages is split up into multiple arguments, which are separated by a "+code("|")+" only (<b>Or "+code("|>| ... |<|")+" to allow for escaping</b>).</p>"
        "<p>Please do not put note template things inside other note template things. Nesting is not supported.</p>"
        "<p><b>Unlike other features</b>, this will not keep spacing in between arguments (so it still will before and after)."
            +nl(
            "That means that this: "+code("|= hi : bye =|")+" is the same as this: "+code("|=hi:bye=|")+"."
            "<br>The spacing is <i>only</i> stripped at the start/end of the header, contents or between arguments (e.g. "+code("|| hi | arg1 | arg2 ||")+" -> "+code("||hi|arg1|arg2||")+")"
            )+"</p>"
        "<p><i>To use a note template, use the same header as the definition.</i></p>"
        "<p><b>The note template usage with "+code("|!")+" is special and does not follow the rules above.</b> Instead if having "+code("|| name args ||")+" the first character after "+code("!")+" is the name."
            +nl(
            "For example, if a note template had the name "+code("-")+" then a usage that would work is "+code("|!-args||")+"."
            "<br>Another example for understanding: If the note template was named "+code("!")+" Then it could be used like this: "+code("|!! args ||")+" (as stated above, there can be extra spaces. But keep in mind if you have "+code("|! ! arg ||")+" it will use the note template with name "+code(" ")+"!)"
            "<br>You can skip the extra gap between the title and the contents here, e.g. "+code("|!-contents||")+
            "<br><i>Please remember for these that the name must be one character long</i>"
            )+"</p>"
        "<p>"+qu+"Multiple note templates of the same type (global&global or local&local) cannot have the same name, but if a local note template has the same name as a global one the local one will be used instead.</p>"
    "<h3>Arguments</h3>"
        "<p>For more info on or methods for utilising arguments or the argument specifier, see the <b>Help &gt; Argument Help</b> menu (it is too common to require scrolling to the bottom of this long menu for).</p>"
;

const QString ARGUMENT_HELP =
"<h1>Arguments quick reference</h1>"
"<p><i>This may seem complicated or overwhelming at first but a lot of this is just for reference and is entirely unecessary if you don't want to use it.</i> Look at the sample notes for some simple uses!</p>"
"<h2><u>Basics</u></h2>"
    "<p>Arguments are used in note template definitions by a % then the name then either another % or a space.</p>"
    "<p>Arguments can also be used as a $ then the name (but NOT end with $)."
        "The difference with $ is it cannot contain suffixes (but it can have prefixes) and it ends on any other non-alphanumeric character "
        "(so you can have e.g. "+code("$1$2")+" instead of "+code("%1%%2%")+", but you will have to use % for e.g. "+code("%1%hi")+" where there are alphanumeric characters after)"
    "<p><i>Argument names must only contain letters and numbers</i>, except for the special specifiers (below)</p>"
    "<p>A special way for escaping unique to arguments (you can still use \\ btw) is encasing the text within (), e.g. "+code("%1|(this is a test)")+" (the spaces are escaped by being inside the brackets). "
        "<b>If a \\ is placed before a ( or ) then the \\ will be consumed.</b></p>"
    "<p><b>If your text in an argument definition begins with [ then it will be treated as an argument specifier</b>."
        +nl("There are ways around this, including having an empty argument specifier before the text ("+code("[]")+")."
       )+"</p>"
"<h2><u>Argument specifier</u></h2>"
    "<p>The argument specifier is in between the template name and contents, and is contained within "+code("[]")+"."
        +nl("It is separated from both by either a "+code(":")+" or a "+code("|")+" or a space or a newline."
       )+"</p>"
    "<p>Inside the brackets is a space separated list of names. The arguments will be named by this in the order they are passed in.</p>"
    "<p>The argument name in the argument specifier can have suffixes like regular argument usage, for example "+code("[name|default]")+". It also can have prefixes, but those will be ignored when using a macro.</p>"
    "<p>You can also specify for an argument to use the previous number by prefixing it with /, e.g. "+code("[first /alsofirst]")+"</p>"
    "<p>You must use \\ to escape spaces, the first =, or ]. That means you must use \\\\ to include a literal \\ behind those characters (and to insert a real \\ behind an escaped space or ] you need 3 \\s). Otherwise, a \\ will stay like normal.</p>"
    "<h3>Macros</h3>"
        "<p>Using "+code("name=thing")+" allows you to set macros which don't take up an argument (e.g. "+code("[macro=this firstarg secondarg]")+")"
            +nl(
            "Macros are substituted in-place. You can also use % in your macros, but there is a recursion limit."
            "<br>For example, "+code("|: test [name=Hello,\\ %1] Remember to say '%name' :|")+" applied via "+code("||test me||")+" will output "+hl("Remember to say 'Hello, me'")
            )+"</p>"
        "<p>Using "+code("name&=thing")+" is a shorthand for "+code("name=%x&")+", useful for equations (below)</p>"
        "<p><i>All the above macro definitions will also expand inner $args or %args too</i>, so if you do not want this then use "+code("name#=thing")+".</p>"
        "<p>Using "+code("name(=thing)")+" is the same as "+code("name#=(thing)")+" except removing the outer ().</p>"
    "<h3>Special specifiers</h3>"
        "<p>Special specifiers are things you can do instead of an argument or macro in an argument specifier. Here are the options:</p>"
        "<ul>"
            "<li>"+code("-")+" will skip that argument (e.g. "+code("[arg1 - arg3]")+")</li>"
            "<li>"+code("*")+" will toggle between reverse order (e.g. "+code("[first second * last secondLast * third]")+")</li>"
        "</ul>"
"<h2><u>Argument usage</u></h2>"
    "<p>Arguments are specified as either %index (e.g. "+code("%1")+" for the first argument) or "
        "%name (when defined in an argument specifier) or "
        +code("%0")+" or "+code("%#")+" (for every argument separated by space (with spaces escaped; for use with "+code("{")+")) or "
        +code("%+")+" (for every argument separated by "+code(" | ")+" (so it won't accidentally equate to |>| or |<|)).</p>"
    "<p>"+code("%#")+" is equivalent to "+code("%0")+" and "+code("%+")+" is equivalent to "+code("%0+( | )")+" for convenience</p>"
    "<p>Arguments must end with either a space (in which case the space is kept) or a %</p>"
    "<p>%index arguments can be negative, e.g. "+code("%-1")+" which would give the last argument.</p>"
    "<p>There is a special argument type: "+code("%-")+". This argument represents every number in existance and is used with { to get a sequence of numbers."
        "If you do not include { directly after there is a good chance it fails. An example of it working is "+code("%-{1:5")+"</p>"
    "<p>Arguments can be used with prefixes and/or suffixes, for example "+code("%.name")+", "+code("%name[1")+" or "+code("%.name[0")+".</p>"
    "<p>Suffixes can have variables inside them, but only $ variables; as otherwise the % would close the variable! (But you can use a macro to get around this)</p>"
    "<p>They can be stacked and will be executed in the order you put them in, so e.g. "+code(".^")+" would first lower <i>then</i> title case, converting e.g. "+hl("hElLo wOrLd!")+" to "+hl("Hello World!")+".</p>"
    "<h3>Argument prefixes</h3>"
    "<ul>"
        "<li>"+code(".")+" - converts text to lower case</li>"
        "<li>"+code("*")+" - converts text to UPPER CASE</li>"
        "<li>"+code("^")+" - converts text to Title Case (<i>other letters will not be touched</i>)</li>"
        "<li>"+code("\"")+" - converts text to Sentence case (<i>other letters will not be touched</i>)</li>"
        "<li>"+code("_")+" - replaces the text with its length in words (can split by nothing to get length in characters)</li>"
        "<li>"+code("&")+" - evaluates the contents of the variable. Because prefixes are evaluated after suffixes this applies to their result.</li>"
    "</ul>"
    "<h3>Argument suffixes</h3>"
    "<ul>"
        "<li>"+code("[idx")+" - get the <idx>th char of the input (can be negative to get the last characters instead of the first)</li>"
        "<li>"+code("[start:stop")+" - get the <start>th to <stop>th chars of the input (can both also be negative)"
            "<br><i>Additionally</i>, the numbers can be left blank. If they are, it will go from the start or until the end depending on which was blank.</li>"
        "<li>"+code("[start:stop:step")+" - Same as above start:stop, except only displays every stepth char between the range."
            "<br><i>The step can be negative to reverse the text.</i></li>"
        "<li>"+code("{idx")+" or "+code("{start:stop")+" or "+code("{start:stop:step")+" - same as above, but for words instead of characters."
        "<li>"+code("|def")+" - if the output is currently empty (e.g. no argument or you indexed out of bounds), display the text after instead.</li>"
        "<li>"+code(">cng")+" - if the output is currently <b>NOT</b> empty, displays the text after instead. Basically the opposite of |</li>"
        "<li>"+code(";sep")+" - splits the text by 'sep' (converts all sep characters to spaces so you can use "+code("{")+" to index)"
            "<br><b>NOTE<b>: It replaces all existing spaces with a special character that gets replaced with a space at the end to make everything work. "
            "But don't worry, you can still split by a space (remember to escape it tho)</li>"
        "<li>"+code("+sep")+" - joins the text with 'sep' (replaces all spacing)"
        "<li>"+code("=exp")+" - sets the text to blank if it equals the expression (remember can use $ for vars)</li>"
        "<li>"+code("!exp")+" - sets the text to blank if it does NOT equal the expression</li>"
        "<li>"+code("&equ")+" - runs an equation (see below) with x being the current contents</li>"
    "</ul>"
"<h2><u>Equations</u></h2>"
    "<p>One suffix for a variable is & which allows the creation of equations.</p>"
    "<p>Equations are a string of variables ($ or %), operations and numbers.</p>"
    "<p>"+hl("x")+" is a special variable (still need to use $ or %, remember!) equating to the contents this is a suffix for..</p>"
    "<p>Usable symbols are + (addition) - (subtraction) * (multiplication) / (division) ~ (modulo, "+hl("note modulo is ~ to not conflict with anything else")+")</p>"
    "<p><i>There is no order of operations</i> (x+1*2 is literally (x+1)*2)</p>"
    "<p>Usually variables used MUST be numbers, but with addition and multiplication strings can be used (but the second argument of multiplication must be a number)</p>"
    "<p>You can use {} as brackets to change the order of operations if required.</p>"
    "<p>Use | to escape text (surround the text, e.g. "+code("|e$c*pe\\|d}!+|")+")</p>"
    "<p>This is helpful when you want to do e.g. "+code("|%1>\\[\\[%|")+"</p>"
    "<p>This means you cannot use the above symbols  in variables inside equations</p>"
    "<p>Failing equations output "+hl("???")+"</p>"
    "<p>Here is an example which multiplies %1 by 3 "+code("%1&($x*3)%")+"</p>"
    "<p>You can also reference other variables. These will be evaluated and substituted, but you can use $x in them!"
        +nl(
        "Variables will by default be directly equated and substituted in the equation, e.g. "+code("[hi=hello] %1&($hi+$x)")+"."
        "<br>These variables can contain expressions, and if you make it contain an expression where x is still x ("+code("[eq=%x&($x+1)]")+") then it will run that like as if it was in the outer function. Additionally, using &= instead of = in a macro is a shorthand for %x&."
        )+"</p>"
    "<p>Using () to escape the contents (wherever you use this, e.g. in the macro definition) is a good idea.</p>"
"<h2><u>Loops</u></h2>"
    "<p>Loops in the contents can be designated with "+code("@@var items @ ... @@")+".</p>"
    "<p>Loop argument specifiers can be used exactly the same as regular argument specifiers (like this: "+code("@@var [a1 a2] items @ ... @@")+"). "
        "They work in the exact same way. They also do not care what the last specifier's index was so for every loop definition it always starts from argument 1 going up.</p>"
    "<p>The var name does not have a $ or % behind it (like defining a macro)</p>"
    "<p>The items part is just an expression, and the var loops over every item in items (split by spaces, just like the above argument suffixes)</p>"
    "<p>The spacing at the start and middle get removed (basically everywhere but the very end), for clarity using \\ and then making a newline to put the end @@ on can help</p>"
"<h2><u>Argument tricks</u></h2>"
    "<ul>"
        "<li>If you want to do something on multiple variables you can use equations."
            "<br>Here is an example which wraps text in () brackets: "+code("[eq=\\($x\\)] %1&$eq %2&$eq")+"</li>"
        "<li>If/else statements can be made by using > then |; so IF it is not blank it will output the > text ELSE it will output the | text"
            "<br>An example is checking length: "+code("%1{2:>Longer|Shorter% than 2 words")+
            "<br>Another example is checking if the argument is equal to a string; e.g. "+code("You %1!hello>typed|(did not type) hello")+"</li>"
    "</ul>"
;

const QString PLUGVIEW_HELP = 
"<p>Select plugins to view information about them and disable them.</p>"
"<p>Plugin descriptions will only show for enabled plugins.</p>"
"<p>Press the <b>Load plugin</b> menu item to load one or more plugins from your hard drive. "
    "This gives you the option to move them or to copy them (move gets rid of the original file, copy keeps the original).</p>"
"<h2>Status types</h2>"
    "<ul>"
        "<li>💖 - the plugin loaded successfully!</li>"
        "<li>💔 - the plugin failed to load</li>"
        "<li>🤎 - the plugin is disabled</li>"
    "</ul>"
;

const QString GAME_HELP =
"<p>Click while hovering over a card or press space if there's only one card to flip (can do again to unflip), and once flipped press a button or key on your keyboard as listed on the right to finish and reschedule the card.</p>"
"<p>The numbers represent how well you remembered the card. 1 means completely forgot, 2 is slightly forgot, 3 is slightly remembered, 4 is remembered, and 5 is remembered it really well and just want to be done with it already.</p>"
"<p>Reset and Skip both don't change the score of the card but just reschedule it for later (skip a lot longer away than reset)</p>"
"<p>The times present are only an aim. The app gives you cards sorted based on these times, so when you will recieve these cards is independent of the times.</p>"
"<p>The dark text and ! in the titles (except 'new') of the progress bar showcase how many cards are due. The more dark text, the more cards are due. This makes each piece of text it's own little progress bar! "
    "But note this text only updates when the game 'refreshes' (when a new game scene is loaded)</p>"
"<h2>Keybinds</h2>"
    "<ul>"
        "<li>All the keys shown on the buttons that show when you press on a card. The numbers/symbols in bold aren't just for pretty you know</li>"
    "</ul>"
"<h2>Menu items</h2>"
    "<ul>"
        "<li><b>File</b><ul>"
            "<li>Reset current set of cards you're looking at. This will mean you get a whole new set of cards (tho the card you're looking at will stay)</li>"
        "</ul></li>"
    "</ul>"
;