Skip to content

Commit

Permalink
Update to jmol / embeddiv page models so they work with different scr…
Browse files Browse the repository at this point in the history 
…een size options

git-svn-id: https://xerteonlinetoolkits.googlecode.com/svn/trunk@216 912cdd6b-5c7d-d5a7-a2ba-d0f0cdb91641
  • Loading branch information
@FayCross
FayCross committed Nov 2, 2011
1 parent 0eff464 commit f599932
Show file tree
Hide file tree
Showing 4 changed files with 69 additions and 36 deletions.
31 changes: 15 additions & 16 deletions JMolViewer/jmol.htm
View file
Expand Up @@ -81,33 +81,32 @@

setUpInfo += " set antialiasDisplay true;";

var windowW = str.split(';')[7].split('width=')[1];
var windowH = str.split(';')[8].split('height=')[1];

var modelW = windowW-4;
var modelH = windowH-4;

if (controls == "true") {
modelH = windowH-80;
}

document.write('<style>.holder {width: ' + windowW + 'px; height: ' + (windowH-11) + 'px;}</style>');
</script>

<style type="text/css">
<!--
.style1 {
font-size: 11px;
}

.holder {
width: 370px;
height: 389px;
}

.header {
border: solid 2px white;
background-color: #E6E6E6;
font-size: 13px;
padding: 5px 10px 5px 10px;
}
}

.model {
border: solid 2px white;
background-color: white;
text-align: center;
}

.controls {
.controlBar {
border: solid 2px white;
background-color: #E6E6E6;
padding: 10px;
Expand All @@ -127,7 +126,7 @@
<script type="text/javascript">
jmolInitialize("jmol");
jmolSetAppletColor(bgColour);
jmolApplet([345, 309], setUpInfo);
jmolApplet([modelW, modelH], setUpInfo);
jmolSetButtonCssClass("style1");
jmolSetCheckboxCssClass("style1");
jmolSetMenuCssClass("style1");
Expand All @@ -136,7 +135,7 @@

<script type="text/javascript">
if (controls == "true") {
document.write('<div class="controls">');
document.write('<div class="controlBar">');

jmolHtml("Display: ");
jmolMenu(displayOptions);
Expand Down
2 changes: 1 addition & 1 deletion modules/xerte/parent_templates/Nottingham/models/embedDiv.rlm
View file
@@ -1 +1 @@
<PG name="embedDiv"> <SCR name="setup"><![CDATA[pageIcon = icon.parentNode.clip();if (extXML == undefined){ // Page Wizard pageIcon.templateData = pageIcon.extXML.toObject(); pageIcon.templateData = pageIcon.templateData.pageWizard[0];} else { // Toolkits myXML = new XML(extXML.firstChild.childNodes[rootIcon.getPageIndex() - pgOffset]); pageIcon.templateData = myXML.toObject(); rootIcon.setTitleText(templateData.learningObject[0].name);}if (pageIcon.templateData.embedDiv[0].narration != undefined){ narration = pageIcon.templateData.embedDiv[0].narration; rootIcon.broadcast('showAudio');}]]></SCR> <SCR name="makeDiv"><![CDATA[params = new Object();if (pageIcon.templateData.embedDiv[0].src.substr(0,1) == '<'){ params.type = 'div';} else { params.type = 'iframe';}params.x = '84';params.y = '20';params.width = '760';params.height = '474';params.src = pageIcon.templateData.embedDiv[0].src;params.bgColour = '#FFFFFF';params.borderColour = '#000000';callJS('makePopUp', params);popupActive = true;]]></SCR> </PG>
<PG name="embedDiv"> <SCR name="setup"><![CDATA[pageIcon = icon.parentNode.clip();if (extXML == undefined){ // Page Wizard pageIcon.templateData = pageIcon.extXML.toObject(); pageIcon.templateData = pageIcon.templateData.pageWizard[0];} else { // Toolkits myXML = new XML(extXML.firstChild.childNodes[rootIcon.getPageIndex() - pgOffset]); pageIcon.templateData = myXML.toObject(); rootIcon.setTitleText(templateData.learningObject[0].name);}if (pageIcon.templateData.embedDiv[0].narration != undefined){ narration = pageIcon.templateData.embedDiv[0].narration; rootIcon.broadcast('showAudio');}]]></SCR> <SCR name="makeDiv"><![CDATA[params = new Object();params.id = "popup0";if (pageIcon.templateData.embedDiv[0].src.substr(0,1) == '<'){ params.type = 'div';} else { params.type = 'iframe';}params.screenSize = rootIcon.sizes.getValue();params.calcW = 95;params.calcH = 79;params.calcX = 2.5;params.calcY = 14;params.width = Stage.width;params.height = Stage.height;params.src = pageIcon.templateData.embedDiv[0].src;params.bgColour = '#FFFFFF';params.borderColour = '#000000';callJS('makePopUp', params);popupActive = true;]]></SCR> </PG>
Expand Down
2 changes: 1 addition & 1 deletion modules/xerte/parent_templates/Nottingham/models/jmol.rlm
View file
@@ -1 +1 @@
<PG name="JMol"> <SCR name="getPageID"><![CDATA[pageIcon = icon.parentNode.clip();if (extXML == undefined){ // Page Wizard pageIcon.templateData = pageIcon.extXML.toObject(); pageIcon.templateData = pageIcon.templateData.pageWizard[0];} else { // Toolkits myXML = new XML(extXML.firstChild.childNodes[rootIcon.getPageIndex() - pgOffset]); pageIcon.templateData = myXML.toObject(); rootIcon.setTitleText(templateData.learningObject[0].name);}if (pageIcon.templateData.jmol[0].narration != undefined){ narration = pageIcon.templateData.jmol[0].narration; rootIcon.broadcast('showAudio');}]]></SCR> <SCR name="JMol"><![CDATA[if (pageIcon.templateData.jmol[0].xyz2 != undefined) { numXYZ = 2; textW = 760; textH = 80; windowH = 389;} else { numXYZ = 1; textW = 340; textH = 474; windowH = 474;}windowW = 370;for (i=0; i<numXYZ; i++) { params = new Object(); params.id = "popup"+i; //params.y = '85'; params.y = 85 * numXYZ; params.width = windowW; params.height = windowH; params.type = 'iframe'; if (i == 0) { myFile = pageIcon.templateData.jmol[0].xyz; } else { myFile = pageIcon.templateData.jmol[0].xyz2; } params.x = 800 - ((windowW+20)*(i+1)); params.src = 'JMolViewer/jmol.htm?xyz=../' + expression(myFile, engine) + ';spin=' + pageIcon.templateData.jmol[0].initSpin + ';controls=' + pageIcon.templateData.jmol[0].controls + ';bgColour=' + pageIcon.templateData.jmol[0].bgColour + ';initLook=' + pageIcon.templateData.jmol[0].initLook + ';cartoonOpt=' + pageIcon.templateData.jmol[0].cartoonOpt + ';backOpt=' + pageIcon.templateData.jmol[0].backOpt; params.bgColour = '#FFFFFF'; params.borderColour = '#FFFFFF'; callJS('makePopUp', params); popupActive = true;}]]></SCR> <DIS scrolling="auto" h="textH" name="text" x="20" y="20" w="textW" type="text"><![CDATA[{pageIcon.templateData.jmol[0].text}]]></DIS> </PG>
<PG name="JMol"> <SCR name="getPageID"><![CDATA[pageIcon = icon.parentNode.clip();if (extXML == undefined){ // Page Wizard pageIcon.templateData = pageIcon.extXML.toObject(); pageIcon.templateData = pageIcon.templateData.pageWizard[0];} else { // Toolkits myXML = new XML(extXML.firstChild.childNodes[rootIcon.getPageIndex() - pgOffset]); pageIcon.templateData = myXML.toObject(); rootIcon.setTitleText(templateData.learningObject[0].name);}if (pageIcon.templateData.jmol[0].narration != undefined){ narration = pageIcon.templateData.jmol[0].narration; rootIcon.broadcast('showAudio');}]]></SCR> <SCR name="JMol"><![CDATA[if (pageIcon.templateData.jmol[0].xyz2 != undefined) { numXYZ = 2; textW = 760; textH = 80;} else { numXYZ = 1; textW = 340; textH = 474;}for (i=0; i<numXYZ; i++) { params = new Object(); params.id = "popup"+i; params.screenSize = rootIcon.sizes.getValue(); params.calcW = 46.25; params.calcH = 65; params.calcX = 2.5; params.calcY = 14 * numXYZ; params.width = Stage.width; params.height = Stage.height; params.type = 'jmol'; if (i == 0) { myFile = pageIcon.templateData.jmol[0].xyz; } else { myFile = pageIcon.templateData.jmol[0].xyz2; } params.src = 'JMolViewer/jmol.htm?xyz=../' + expression(myFile, engine) + ';spin=' + pageIcon.templateData.jmol[0].initSpin + ';controls=' + pageIcon.templateData.jmol[0].controls + ';bgColour=' + pageIcon.templateData.jmol[0].bgColour + ';initLook=' + pageIcon.templateData.jmol[0].initLook + ';cartoonOpt=' + pageIcon.templateData.jmol[0].cartoonOpt + ';backOpt=' + pageIcon.templateData.jmol[0].backOpt; params.bgColour = '#FFFFFF'; params.borderColour = '#FFFFFF'; callJS('makePopUp', params); popupActive = true;}]]></SCR> <DIS scrolling="auto" h="textH" name="text" x="20" y="20" w="textW" type="text"><![CDATA[{pageIcon.templateData.jmol[0].text}]]></DIS> </PG>
Expand Down
70 changes: 52 additions & 18 deletions modules/xerte/preview_xerte_top
View file
Expand Up @@ -32,33 +32,67 @@ function makePopUp(params)
parent.removeChild(popup);
}

//make the div and style it...
//make the div and style it
var create_div = document.createElement("DIV");

create_div.id = params.id;
create_div.style.height = params.height + "px";
create_div.style.width = params.width + "px";
create_div.style.position = "absolute";

create_div.style.left = params.x + "px";
create_div.style.top = params.y + "px";
create_div.style.background = params.bgColour;
create_div.style.border = "1px solid " + params.borderColour;

//if we make a div, set the innerHTML
if (params.type == 'div'){
create_div.innerHTML = params.src;
if (params.borderColour != "none") {
create_div.style.border = "1px solid " + params.borderColour;
}
else if (params.type == 'iframe')
{
var iframe_create_div = document.createElement("IFRAME");

var stageW = params.width;
var stageH = params.height;
var divNum = Number(params.id.substring(5, params.id.length));
if (params.screenSize == "full screen" || params.screenSize == "fill window" || (params.width == 1600 && params.height == 1200)) {
if (document.body && document.body.offsetWidth) {
stageW = document.body.offsetWidth;
stageH = document.body.offsetHeight;
}
if (document.compatMode=='CSS1Compat' && document.documentElement && document.documentElement.offsetWidth ) {
stageW = document.documentElement.offsetWidth;
stageH = document.documentElement.offsetHeight;
}
if (window.innerWidth && window.innerHeight) {
stageW = window.innerWidth;
stageH = window.innerHeight;
}

if (params.screenSize == "full screen" && stageH / stageW != 0.75) {
var ratio = stageH / stageW;
if (ratio > 0.75) {
stageH = stageW * 0.75;
} else {
stageW = stageH / 0.75;
}
}

}

var divW = stageW / 100 * params.calcW;
var divH = stageH / 100 * params.calcH;
var divX = stageW - ((divW + (stageW / 100 * params.calcX) ) * (divNum + 1));
var divY = stageH / 100 * params.calcY;

create_div.style.width = divW + "px";
create_div.style.height = divH + "px";
create_div.style.left = divX + "px";
create_div.style.top = divY + "px";

if (params.type == 'div'){
create_div.innerHTML = params.src;
} else {
var iframe_create_div = document.createElement("IFRAME");
iframe_create_div.src = params.src;
iframe_create_div.style.height = params.height + "px";
iframe_create_div.style.width = params.width + "px";
if (params.type == 'jmol') {
iframe_create_div.src += ';width=' + divW + ';height=' + divH;
}
iframe_create_div.style.height = divH + "px";
iframe_create_div.style.width = divW + "px";
iframe_create_div.frameBorder='no';
create_div.appendChild(iframe_create_div);

}

//finally append the div
parent.appendChild(create_div);
}
Expand Down

0 comments on commit f599932

Please sign in to comment.