JavaScript output for variables to print filename working locally but not on Moodle...

No would not work you are giving the variable a value. If you look at the playground you can add styles and apply these using style: 'header'

 styles: {
 header: {
 fontSize: 18,
 bold: true
 },
 bigger: {
 fontSize: 15,
 italics: true
 }
 }

Thanks Phil!

Almost, the variable is in bold but the left margin is at zero...

Could try adding margins outside of the square brackets: If that doest work may have to set up some styling

 {
 text: [
 {text:'51. Yesterday the inspector asked me when ', fontSize: 15, color: '#000000', alignment: 'left'},
 {text: Q51, fontSize: 15, color: '#000000', bold: true},
 {text:' last', fontSize: 15, color: '#000000', alignment: 'left'}

 ],
 margin: [40, 10, 0, 0]

 },

Excellent!!!

},
{
text: [
{text:'51. Yesterday the inspector asked me when ', fontSize: 15, color: '#000000'},
{text: Q51, fontSize: 15, color: '#000000', bold: true},
{text: ' last', fontSize: 15, color: '#000000'}
],
alignment: 'left',
margin: [40, 10, 0, 0]
},

Thank you Phil!!!

Thanks for posting back the code that worked!

I did think about moving alignment, would have helped if I tested it in the playground myself rather than using you as a test ground and working from there!

Glad it worked in the end.

Thank you! Thank you! Thank you!

The PDF solution is better than the HTML page option, so worth the hassle once it is working.

I have three different modules, each to pdf, then a teacher evaluation interaction that provides a certificate of completion to the student also to pdf.

Almost done...one more question?

How would one go about setting up something that would return the text value "Null" if the variable was empty???

I REALLY APPRECIATE ALL YOUR HELP!!!

Maybe easier to capture that in storyline using a trigger to set value to null if equal to blank. Or use IF statement in the PDF file . I would have thought a blank value would already report as null

Probably easier for me in Storyline...

Thanks, I can do this there :)

If that doesn't work then something like 

if (myVar == null) {

myVar = "null"

}

I'll try it.

Thanks!!!!

No luck with the java, I'll try something in SL.

It really depends on how the text variable is reporting, you can check that in the console. Much easier to manage in storyline.

Sent from my iPhone

Do make a simple sample that shows what is going wrong and then someone might check upon it and correct it. And as Phil and me already suggested do use the console in your browser

console.log("fill in whatever"+yourvariable);

to find wherever things are wrong.

Thank Math!

I've got it all pretty much working the way it should, finally...

I do have a curious question; how could I change the colour of a variable based on its actual content with PDFMake. That is, the variable will either have an answer, some text, or it will return INCOMPLETE. If it's incomplete I would like it to change colour, red for example. I've been trying for the last several hours but it is beyond me.

It's not hypercritical at this point, just would like to have the esthetics in the PDF.

Any ideas?

The variables are Q51 to Q60 in the attached HTML.

Thank you if you can help!

Just to add that I could not have finished my project without the great help from all you Heroes!!!

Thank you all very much!!!

Hello Heroes!!!

Just asking again about the question above...

Any takers :)

Thanks again!!!

Out of my head...no checking or testing...

if(conditon == true){
do something
}else if(someotherconditon == true){
do something else
}else{
do something if all conditions fail
}

Offcourse this was dummy code.. it should be something like...

if(isQuestionAnswered == true){
console.log("1: isQuestionAnswered: "+isQuestionAnswered);
}else if(isQuestionAnswered == false && myValue == "sometext"){
console.log("2: isQuestionAnswered: "+isQuestionAnswered+" | myValue: "+myValue);
}else if(myValue == "INCOMPLETE"){
console.log("3: myValue: "+myValue);
}else{
console.log("3: all conditions fail");
}

When copying this watch the "", because they fail on copying from the forum.
Something like this might work.
In the if/else statements you can then add the styling for your texts.

Thank you Math!

Could you please walk me through it? :/

I am trying to deal with open-ended questions. That is, the actual text variable will have an unknown text value. In articulate, if the field is empty, I have assigned an "INCOMPLETE" value to the variable. I would like those variables with this value to be red in the pdf. 

If possible...

Thanks again!!!

Ok here you can see how to it can work setting any text to a color.

https://360.articulate.com/review/content/02e09208-82b8-43b6-9ac8-01fd314c3009/review

A few things to keep in mind. Storyline gives different types of text different classes. A textfield with a referenced variable in it gets the classname 'text-segment'. Thus when referring to a textfield with a variable in it can be set to any color with this code...

var textSegments = document.getElementsByClassName("text-segment");
gsap.to(textSegments, 1, { fill: "pink" });

As getElementsByClassName gets all elements with that classname on your page, you have to loop them if you have more.

The code to ensure when the input is 'INCOMPLETE' the text gets red is like this...

var textSegments = document.getElementsByClassName("text-segment");

if(ipQ1 != "INCOMPLETE"){
console.log("filled: "+ipQ1);
gsap.to(textSegments, 1, { fill: "green" });
}else if(ipQ1 == null || ipQ1 == "INCOMPLETE"){
console.log("not filled: "+ipQ1);

gsap.to(textSegments, 1, { fill: "red" });
}else{
}

Adding my Storyline sample to help out...

PS. Doublechecked adding multiple textfields and more textfields with referenced variables. All textfields with a referenced variable ( %myvariable% ) get the class 'text-segment' and thus all these will be changed in color. So if you want to only change one of those...the code is...

gsap.to(textSegments[0], 1, { fill: "red" });

Try this one.

Russell that is a really elegant solution, made me wish I thought of it!

Thanks Phil, sorry that I didn't help out more this weekend. I don't have a computer at home and don't like trying to code on my phone.

Thank you all so very much!!!

Russel's solution is working excellent, just will have to adjust this for my four different docs and change incomplete to full caps.

Thank you ever so much!!!

Off-topic, would anyone know how to put an accordion, with a smooth transition, onto a moodle page? I found the code, but it snags for a split second on opening and closing. I am sure it's a javascript solution, but I don't know where to put this in moodle....

Any takers? :)

https://getbootstrap.com/docs/4.0/components/collapse/