Using JavaScript in Storyline

Do you just want each in a new line? Like <br> tag does in HTML?

Here is a snippet of code from one of my projects that I think might help. It is part of an email link where I am populating the content of the email using several variables and double spacing between the lines.  The code for the carriage return is %0d%0A and you can see I put 2 of them back to back at the end of each line to cause the double spacing.

var content="Name: "+name1+"%0d%0A%0d%0A";
content+="Badge: "+badge1+"%0d%0A%0d%0A";
content+="Certification: "+cert1;

var mailto_link='mailto:'+targetemail+'?subject='+subject+'&body='+content;

The result looks like the following (some details redacted).

Hey Zsolt,

For each of the variables (Blue text) yes. Between the lines with questions I need an extra space as it is showed in the Output screenshot.

Hey Owen,

Thanks for sharing....this could be helpful! ;)

Okay, so you're passing the argument as a giant string, splitting it by ~~ and then write the document. Since the final document is written as HTML, I think all you need is a <br> tag after each variable. Now, if passing the "<" and ">" don't work because of encoding, try adding "&#60;br&#62;" after each variable. 

Sorry guys, I tried all your solutions, but they didn't solve the problem.

Any other thoughts!?

Anyway, thanks for taking the time to share your ideas. Really appreciated!!

It should work :) Send me the actual argument that you created in the browser. 

Do you mean this page?

The print.pdf is a pdf file from the print.html that I added to the uoutput folder of Storyline.

I mean the content of the args variable from your JS after adding all the info. Not what you see after but the actual args variable. 

Hey Zsolt,

I hope that this can help you out!

I tried this and it works for me. var1 and var2 I made up, those are text variables. The end result is two variables under each other.

var p = GetPlayer();
var header = "<b>TESTING</b><br><br>"
var args = "VAR1 = "+p.GetVar("var1")+"<br>"+"VAR2 = "+p.GetVar("var2");
var url = "print.html?="+header+args;
window.open(url,"_blank");

Hey Zsolt, many thanks for the update. i played around with your solution and the output is much better than it was. (see the attachment)

Two last questions;

Do you have any idea how to get a white space (line) between the two VARS en the second Topic?

The variables are not aligned correctly with the rest of the text. Any ideas how to solve this?

Thanks again for helping me out! 

In your CSS style sheet h1 (the one big blue title) has a margin-top: 27px; That margin before the title makes the space.

Your Topic 1 and Topic 2 I think are h3. h3 doesn't have margin-top added in the style (print.html). To make space above the Topic, add margin-top: 20px; (you can play with the exact number) to the h3 { ... } style just like you have for the h1 {...}

That should care of the space.

The variables are not aligned because I think they don't have any tags associated with to have a margin (h1 and h3 have margin-left). You can try to modify the code to wrap each variable in <p> tag: +"<p>"+player.GetVar(whateveryouneedhere)+"</p>"

When you do this you might need <br> anymore because the <p> comes in a new line.  

Hey Zsolt,

Thank you for sharing your ideas and thoughts. After another night of playing around with your script I was able to help my client to track all the variables from their course! Attached you can find a PDF file of the final result.

Thanks!

I learned some Dutch! 

Me too. :-D