Difference between revisions of "IframeEmbedding1"

From WeBWorK_wiki
Jump to navigation Jump to search
m
(Add link to PGML version in OPL)
(2 intermediate revisions by the same user not shown)
Line 3: Line 3:
 
[[File:IframeEmbedding1.png|300px|thumb|right|Click to enlarge]]
 
[[File:IframeEmbedding1.png|300px|thumb|right|Click to enlarge]]
 
<p style="background-color:#f9f9f9;border:black solid 1px;padding:3px;">
 
<p style="background-color:#f9f9f9;border:black solid 1px;padding:3px;">
This PG code shows how to embed content using an <code>iframe</code> in html.
+
This PG code shows how to embed content such as a Google slide show or a YouTube video using an <code>iframe</code> in html.
 
</p>
 
</p>
 
* File location in OPL: [https://github.com/openwebwork/webwork-open-problem-library/blob/master/OpenProblemLibrary/FortLewis/Authoring/Templates/Misc/IframeEmbedding1.pg FortLewis/Authoring/Templates/Misc/IframeEmbedding1.pg]
 
* File location in OPL: [https://github.com/openwebwork/webwork-open-problem-library/blob/master/OpenProblemLibrary/FortLewis/Authoring/Templates/Misc/IframeEmbedding1.pg FortLewis/Authoring/Templates/Misc/IframeEmbedding1.pg]
  +
* PGML location in OPL: [https://github.com/openwebwork/webwork-open-problem-library/blob/master/OpenProblemLibrary/FortLewis/Authoring/Templates/Misc/IframeEmbedding1_PGML.pg FortLewis/Authoring/Templates/Misc/IframeEmbedding1_PGML.pg]
   
 
<br clear="all" />
 
<br clear="all" />
Line 73: Line 74:
 
);
 
);
   
  +
$video = MODES(
  +
HTML=>
  +
'<iframe width="420" height="315" src="//www.youtube.com/embed/NpDXXjClErk"
  +
frameborder="0" allowfullscreen></iframe>',
  +
TeX =>
  +
"An embedded YouTube video."
  +
);
 
</pre>
 
</pre>
 
</td>
 
</td>
Line 78: Line 86:
 
<p>
 
<p>
 
<b>Setup:</b>
 
<b>Setup:</b>
We create a mode dependent variable <code>$slideshow</code> that displays a Google slideshow inside an html <code>iframe</code> when in html mode, and the message "An embedded Google slide show." in TeX mode. If you omit the TeX mode stuff, then there will be errors when the pdf hardcopy is generated.
+
We create a mode dependent variable <code>$slideshow</code> that displays a Google slideshow inside an html <code>iframe</code> when in html mode, and the message "An embedded Google slide show." in TeX mode. If you omit the TeX mode stuff, then there will be errors when the pdf hardcopy is generated. Similarly for the <code>$video</code>. (Searching the web for "YouTube embed video" should bring up instructions for how to get the code to embed a YouTube video into a webpage.)
 
</p>
 
</p>
 
</td>
 
</td>
Line 92: Line 100:
 
${BCENTER}
 
${BCENTER}
 
$slideshow
 
$slideshow
  +
$BR
  +
Google slides embedded using an iframe.
  +
$BR
  +
$BR
  +
$video
  +
$BR
  +
YouTube video of Arthur Benjamin, mathemagician, embedded using an iframe.
  +
$BR
  +
If the video does not work,
  +
\{ htmlLink("http://www.youtube.com/embed/NpDXXjClErk",
  +
"click here to go to YouTube directly.") \}
 
${ECENTER}
 
${ECENTER}
 
END_TEXT
 
END_TEXT

Revision as of 22:18, 7 June 2015

HTML iframe Embedded Content

Click to enlarge

This PG code shows how to embed content such as a Google slide show or a YouTube video using an iframe in html.


Templates by Subject Area

PG problem file Explanation

Problem tagging data

Problem tagging:

DOCUMENT();

loadMacros(
"PGstandard.pl",
"MathObjects.pl",
"AnswerFormatHelp.pl",
"PGcourse.pl",
);
TEXT(beginproblem());

Initialization:

Context("Numeric");

$slideshow = MODES(
HTML=> 
"<iframe src='https://docs.google.com/presentation/d/1pk0FxsamBuZsVh1WGGmHGEb5AlfC68KUlz7zRRIYAUg/embed#slide=id.i0'
frameborder='0' width='555' height='451'></iframe>", 
TeX =>
"An embedded Google slide show."
);

$video = MODES(
HTML=> 
'<iframe width="420" height="315" src="//www.youtube.com/embed/NpDXXjClErk" 
frameborder="0" allowfullscreen></iframe>', 
TeX =>
"An embedded YouTube video."
);

Setup: We create a mode dependent variable $slideshow that displays a Google slideshow inside an html iframe when in html mode, and the message "An embedded Google slide show." in TeX mode. If you omit the TeX mode stuff, then there will be errors when the pdf hardcopy is generated. Similarly for the $video. (Searching the web for "YouTube embed video" should bring up instructions for how to get the code to embed a YouTube video into a webpage.)

Context()->texStrings;
BEGIN_TEXT
${BCENTER}
$slideshow
$BR
Google slides embedded using an iframe.
$BR
$BR
$video
$BR
YouTube video of Arthur Benjamin, mathemagician, embedded using an iframe.
$BR
If the video does not work, 
\{ htmlLink("http://www.youtube.com/embed/NpDXXjClErk",
"click here to go to YouTube directly.") \}
${ECENTER}
END_TEXT
Context()->normalStrings;

Main Text: Include the $slideshow wherever you like.

$showPartialCorrectAnswers = 1;

Answer Evaluation:

Context()->texStrings;
BEGIN_SOLUTION
${PAR}SOLUTION:${PAR}
Solution explanation goes here.
END_SOLUTION
Context()->normalStrings;

COMMENT('MathObject version.');

ENDDOCUMENT();

Solution:

Templates by Subject Area