Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
HTML5 - fixed bugs in bullet page (remove blank lines) & added new jm…
…ol page git-svn-id: https://xerteonlinetoolkits.googlecode.com/svn/trunk@499 912cdd6b-5c7d-d5a7-a2ba-d0f0cdb91641
- Loading branch information
Showing
3 changed files
with
132 additions
and
5 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
125 changes: 125 additions & 0 deletions
125
modules/xerte/parent_templates/Nottingham/models_html5/jmol.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,125 @@ | ||
| <script type="text/javascript"> | ||
|
|
||
| // pageChanged & sizeChanged functions are needed in every model file | ||
| // other functions for model should also be in here to avoid conflicts | ||
| var jmol = new function() { | ||
| // function called every time the page is viewed after it has initially loaded | ||
| this.pageChanged = function() { | ||
|
|
||
| } | ||
|
|
||
| // function called every time the size of the LO is changed | ||
| this.sizeChanged = function() { | ||
| var $pageContents = $("#pageContents"); | ||
| var $textHolder = $("#textHolder"); | ||
| if ($pageContents.data("modelSize") == "Large") { | ||
| var $iFrame = $("#iFrameHolder iframe"); | ||
| $iFrame | ||
| .height((jmol.calcHeight() * 0.8) - 20) | ||
| .width(jmol.calcWidth()); | ||
| $textHolder.height(jmol.calcHeight() * 0.2); | ||
| document.getElementById("iFrame0").contentWindow.resize($iFrame.width(), $iFrame.height()); | ||
| } else if ($pageContents.data("numXYZ") == 2) { | ||
| $textHolder.height(jmol.calcHeight() * 0.2); | ||
| } | ||
| } | ||
|
|
||
| this.calcHeight = function() { | ||
| var frameHeight; | ||
| if (x_browserInfo.mobile == false) { | ||
| frameHeight = $x_pageHolder.height() - parseInt($x_pageDiv.css("padding-top")) * 3; | ||
| } else { | ||
| frameHeight = $x_mobileScroll.height() - $x_headerBlock.height() - $x_footerBlock.height() - (parseInt($x_pageDiv.css("padding-top")) * 2) - 3; | ||
| } | ||
| return frameHeight; | ||
| } | ||
|
|
||
| this.calcWidth = function() { | ||
| return $x_pageHolder.width() - (parseInt($x_pageDiv.css("padding-right")) * 2) - 13; | ||
| } | ||
| } | ||
|
|
||
| var $iFrameHolder = $("#iFrameHolder"); | ||
| var $pageContents = $("#pageContents"); | ||
| var $textHolder = $("#textHolder"); | ||
| $textHolder.html(x_addLineBreaks(x_currentPageXML.getAttribute("text"))); | ||
|
|
||
| var numXYZ = 1; | ||
| var controls = x_currentPageXML.getAttribute("controls"); | ||
| var scriptOpt = x_currentPageXML.getAttribute("scriptOpt"); | ||
| var size = x_currentPageXML.getAttribute("size"); | ||
| var dimensions = []; | ||
|
|
||
| if (size == undefined) { | ||
| size = "Medium"; | ||
| } | ||
| if (x_currentPageXML.getAttribute("xyz2") != undefined) { // if there's a 2nd jmol file it defaults to medium size | ||
| size = "Medium"; | ||
| numXYZ = 2; | ||
| } | ||
|
|
||
| $pageContents.data({ | ||
| "modelSize" :size, | ||
| "numXYZ" :numXYZ | ||
| }); | ||
|
|
||
| if (size == "Small") { | ||
| controls = false; // no space for control bar when model is small | ||
| scriptOpt = false; | ||
| $iFrameHolder.addClass("x_floatRight"); | ||
| dimensions = [250,250]; | ||
| } else if (size == "Medium") { | ||
| dimensions = [350,350]; | ||
| if (x_currentPageXML.getAttribute("xyz2") == undefined) { | ||
| $iFrameHolder.addClass("x_floatRight"); | ||
| } else { | ||
| $iFrameHolder | ||
| .appendTo($pageContents) | ||
| .addClass("centerAlign"); | ||
| $textHolder.height(jmol.calcHeight() * 0.2); | ||
| } | ||
| } else { | ||
| $iFrameHolder | ||
| .appendTo($pageContents) | ||
| .addClass("centerAlign"); | ||
| $textHolder.height(jmol.calcHeight() * 0.2); | ||
| dimensions = [jmol.calcWidth(),(jmol.calcHeight() * 0.8) - 20]; | ||
| } | ||
|
|
||
| for (i=0; i<numXYZ; i++) { | ||
| var myFile; | ||
| if (i == 0) { | ||
| myFile = x_currentPageXML.getAttribute("xyz"); | ||
| } else { | ||
| myFile = x_currentPageXML.getAttribute("xyz2"); | ||
| } | ||
| var url = "JMolViewer/jmol.htm?xyz=../" + eval(myFile) + ",spin=" + x_currentPageXML.getAttribute("initSpin") + ",controls=" + controls + ",bgColour=" + x_currentPageXML.getAttribute("bgColour") + ",initLook=" + x_currentPageXML.getAttribute("initLook") + ",cartoonOpt=" + x_currentPageXML.getAttribute("cartoonOpt") + ",backOpt=" + x_currentPageXML.getAttribute("backOpt") + ",initColour=" + x_currentPageXML.getAttribute("colour") + ",initScript=" + x_currentPageXML.getAttribute("initScript") + ",scriptOpt=" + scriptOpt + ",surfaceOpt=" + x_currentPageXML.getAttribute("surfaceOpt") + ",labelOpt=" + x_currentPageXML.getAttribute("labelOpt") + ",colourOpt=" + x_currentPageXML.getAttribute("colourOpt") + ",width=" + dimensions[0] + ",height=" + dimensions[1]; | ||
| var iFrameTag = '<iframe id="iFrame' + i + '" src="' + url + '" width="' + dimensions[0] + '" height="' + dimensions[1] + '"></iframe>'; | ||
| $iFrameHolder.append(iFrameTag); | ||
| } | ||
|
|
||
| // call this function in every model once everything's loaded | ||
| x_pageLoaded(); | ||
|
|
||
| </script> | ||
|
|
||
| <style type="text/css"> | ||
|
|
||
| #textHolder { | ||
| margin-bottom: 5px; | ||
| overflow: auto; | ||
| } | ||
|
|
||
| #iFrameHolder iframe { | ||
| margin: 5px; | ||
| } | ||
|
|
||
| </style> | ||
|
|
||
| <div id="pageContents"> | ||
|
|
||
| <div id="iFrameHolder"></div> | ||
|
|
||
| <div id="textHolder"></div> | ||
|
|
||
| </div> |