mod/scorm/module.js

   1 // This file is part of Moodle - http://moodle.org/
   2 //
   3 // Moodle is free software: you can redistribute it and/or modify
   4 // it under the terms of the GNU General Public License as published by
   5 // the Free Software Foundation, either version 3 of the License, or
   6 // (at your option) any later version.
   7 //
   8 // Moodle is distributed in the hope that it will be useful,
   9 // but WITHOUT ANY WARRANTY; without even the implied warranty of
  10 // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  11 // GNU General Public License for more details.
  12 //
  13 // You should have received a copy of the GNU General Public License
  14 // along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
  15
  16 /**
  17  * Javascript helper function for IMS Content Package module.
  18  *
  19  * @package   mod-scorm
  20  * @copyright 2009 Petr Skoda (http://skodak.org)
  21  * @license   http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
  22  */
  23
  24 mod_scorm_next = null;
  25 mod_scorm_prev = null;
  26 mod_scorm_activate_item = null;
  27
  28 M.mod_scorm = {};
  29
  30 M.mod_scorm.init = function(Y, hide_nav, hide_toc, toc_title, window_name, launch_sco) {
  31     var scorm_disable_toc = false;
  32     var scorm_hide_nav = true;
  33     var scorm_hide_toc = true;
  34     if (hide_toc == 0) {
  35         if (hide_nav != 1) {
  36             scorm_hide_nav = false;
  37         }
  38         scorm_hide_toc = false;
  39     } else if (hide_toc == 3) {
  40         scorm_disable_toc = true;
  41     }
  42
  43     var scorm_layout_widget;
  44     var scorm_current_node;
  45     var scorm_buttons = [];
  46     var scorm_bloody_labelclick = false;
  47     var scorm_nav_panel;
  48
  49     Y.use('yui2-resize', 'yui2-dragdrop', 'yui2-container', 'yui2-button', 'yui2-layout', 'yui2-treeview', 'yui2-json', 'yui2-event', function(Y) {
  50
  51         var scorm_activate_item = function(node) {
  52             if (!node) {
  53                 return;
  54             }
  55             scorm_current_node = node;
  56             scorm_current_node.highlight();
  57
  58             // remove any reference to the old API
  59             if (window.API) {
  60                 window.API = null;
  61             }
  62             if (window.API_1484_11) {
  63                 window.API_1484_11 = null;
  64             }
  65             var url_prefix = M.cfg.wwwroot + '/mod/scorm/loadSCO.php?';
  66             var el_old_api = document.getElementById('scormapi123');
  67             if (el_old_api) {
  68                 el_old_api.parentNode.removeChild(el_old_api);
  69             }
  70
  71             if (node.title) {
  72                 var el_scorm_api = document.getElementById("external-scormapi");
  73                 el_scorm_api.parentNode.removeChild(el_scorm_api);
  74                 el_scorm_api = document.createElement('script');
  75                 el_scorm_api.setAttribute('id','external-scormapi');
  76                 el_scorm_api.setAttribute('type','text/javascript');
  77                 var pel_scorm_api = document.getElementById('scormapi-parent');
  78                 pel_scorm_api.appendChild(el_scorm_api);
  79                 var api_url = M.cfg.wwwroot + '/mod/scorm/api.php?' + node.title;
  80                 document.getElementById('external-scormapi').src = api_url;
  81             }
  82
  83             var content = new YAHOO.util.Element('scorm_content');
  84             try {
  85                 // first try IE way - it can not set name attribute later
  86                 // and also it has some restrictions on DOM access from object tag
  87                 if (window_name || node.title == null) {
  88                     var obj = document.createElement('<iframe id="scorm_object" src="">');
  89                     if (window_name) {
  90                         var mine = window.open('','','width=1,height=1,left=0,top=0,scrollbars=no');
  91                         if(! mine) {
  92                              alert(M.str.scorm.popupsblocked);
  93                         }
  94                         mine.close()
  95                     }
  96                 }
  97                 else {
  98                     var obj = document.createElement('<iframe id="scorm_object" src="'+url_prefix + node.title+'">');
  99                 }
 100                 // fudge IE7 to redraw the screen
 101                 if (YAHOO.env.ua.ie > 5 && YAHOO.env.ua.ie < 8) {
 102                     obj.attachEvent("onload", scorm_resize_parent);
 103                 }
 104             } catch (e) {
 105                 var obj = document.createElement('object');
 106                 obj.setAttribute('id', 'scorm_object');
 107                 obj.setAttribute('type', 'text/html');
 108                 if (!window_name && node.title != null) {
 109                     obj.setAttribute('data', url_prefix + node.title);
 110                 }
 111                 if (window_name) {
 112                     var mine = window.open('','','width=1,height=1,left=0,top=0,scrollbars=no');
 113                     if(! mine) {
 114                          alert(M.str.scorm.popupsblocked);
 115                     }
 116                     mine.close()
 117                 }
 118             }
 119             var old = YAHOO.util.Dom.get('scorm_object');
 120             if (old) {
 121                 if(window_name) {
 122                     var cwidth = scormplayerdata.cwidth;
 123                     var cheight = scormplayerdata.cheight;
 124                     var poptions = scormplayerdata.popupoptions;
 125                     scorm_openpopup(M.cfg.wwwroot + "/mod/scorm/loadSCO.php?" + node.title, window_name, poptions, cwidth, cheight);
 126                 } else {
 127                     content.replaceChild(obj, old);
 128                 }
 129             } else {
 130                 content.appendChild(obj);
 131             }
 132
 133             scorm_resize_frame();
 134
 135             var left = scorm_layout_widget.getUnitByPosition('left');
 136             if (left.expanded) {
 137                 scorm_current_node.focus();
 138             }
 139             if (scorm_hide_nav == false) {
 140                 scorm_fixnav();
 141             }
 142         };
 143
 144         mod_scorm_activate_item = scorm_activate_item;
 145
 146         /**
 147          * Enables/disables navigation buttons as needed.
 148          * @return void
 149          */
 150         var scorm_fixnav = function() {
 151             scorm_buttons[0].set('disabled', (scorm_skipprev(scorm_current_node) == null || scorm_skipprev(scorm_current_node).title == null));
 152             scorm_buttons[1].set('disabled', (scorm_prev(scorm_current_node) == null || scorm_prev(scorm_current_node).title == null));
 153             scorm_buttons[2].set('disabled', (scorm_up(scorm_current_node) == null) || scorm_up(scorm_current_node).title == null);
 154             scorm_buttons[3].set('disabled', (scorm_next(scorm_current_node) == null) || scorm_next(scorm_current_node).title == null);
 155             scorm_buttons[4].set('disabled', (scorm_skipnext(scorm_current_node) == null || scorm_skipnext(scorm_current_node).title == null));
 156         };
 157
 158         var scorm_resize_parent = function() {
 159             // fudge  IE7 to redraw the screen
 160             parent.resizeBy(-10, -10);
 161             parent.resizeBy(10, 10);
 162             var ifr = YAHOO.util.Dom.get('scorm_object');
 163             if (ifr) {
 164                 ifr.detachEvent("onload", scorm_resize_parent);
 165             }
 166         };
 167
 168         var scorm_resize_layout = function(alsowidth) {
 169             if (window_name) {
 170                 return;
 171             }
 172
 173             if (alsowidth) {
 174                 scorm_layout_widget.setStyle('width', '');
 175                 var newwidth = scorm_get_htmlelement_size('content', 'width');
 176             }
 177             // make sure that the max width of the TOC doesn't go to far
 178
 179             var left = scorm_layout_widget.getUnitByPosition('left');
 180             var maxwidth = parseInt(YAHOO.util.Dom.getStyle('scorm_layout', 'width'));
 181             left.set('maxWidth', (maxwidth - 10));
 182             var cwidth = left.get('width');
 183             if (cwidth > (maxwidth - 10)) {
 184                 left.set('width', (maxwidth - 10));
 185             }
 186
 187             scorm_layout_widget.setStyle('height', '100%');
 188             var center = scorm_layout_widget.getUnitByPosition('center');
 189             center.setStyle('height', '100%');
 190
 191             // calculate the rough new height
 192             newheight = YAHOO.util.Dom.getViewportHeight() *.82;
 193             if (newheight < 600) {
 194                 newheight = 600;
 195             }
 196             scorm_layout_widget.set('height', newheight);
 197
 198             scorm_layout_widget.render();
 199             scorm_resize_frame();
 200
 201             if (scorm_nav_panel) {
 202                 scorm_nav_panel.align('bl', 'bl');
 203             }
 204         };
 205
 206         var scorm_get_htmlelement_size = function(el, prop) {
 207             var val = YAHOO.util.Dom.getStyle(el, prop);
 208             if (val == 'auto') {
 209                 if (el.get) {
 210                     el = el.get('element'); // get real HTMLElement from YUI element
 211                 }
 212                 val = YAHOO.util.Dom.getComputedStyle(YAHOO.util.Dom.get(el), prop);
 213             }
 214             return parseInt(val);
 215         };
 216
 217         var scorm_resize_frame = function() {
 218             var obj = YAHOO.util.Dom.get('scorm_object');
 219             if (obj) {
 220                 var content = scorm_layout_widget.getUnitByPosition('center').get('wrap');
 221                 // basically trap IE6 and 7
 222                 if (YAHOO.env.ua.ie > 5 && YAHOO.env.ua.ie < 8) {
 223                     if( obj.style.setAttribute ) {
 224                         obj.style.setAttribute("cssText", 'width: ' +(content.offsetWidth - 6)+'px; height: ' + (content.offsetHeight - 10)+'px;');
 225                     }
 226                     else {
 227                         obj.style.setAttribute('width', (content.offsetWidth - 6)+'px', 0);
 228                         obj.style.setAttribute('height', (content.offsetHeight - 10)+'px', 0);
 229                     }
 230                 }
 231                 else {
 232                     obj.style.width = (content.offsetWidth - 6)+'px';
 233                     obj.style.height = (content.offsetHeight - 10)+'px';
 234                 }
 235             }
 236         };
 237
 238         var scorm_up = function(node) {
 239             var node = scorm_tree_node.getHighlightedNode();
 240             if (node.depth > 0) {
 241                 return node.parent;
 242             }
 243             return null;
 244         };
 245
 246         var scorm_lastchild = function(node) {
 247             if (node.children.length) {
 248                 return scorm_lastchild(node.children[node.children.length-1]);
 249             } else {
 250                 return node;
 251             }
 252         };
 253
 254         var scorm_prev = function(node) {
 255             if (node.previousSibling && node.previousSibling.children.length) {
 256                 return scorm_lastchild(node.previousSibling);
 257             }
 258             return scorm_skipprev(node);
 259         };
 260
 261         var scorm_skipprev = function(node) {
 262             if (node.previousSibling) {
 263                 return node.previousSibling;
 264             } else if (node.depth > 0) {
 265                 return node.parent;
 266             }
 267             return null;
 268         };
 269
 270         var scorm_next = function(node) {
 271             if (node === false) {
 272                 return scorm_tree_node.getRoot().children[0];
 273             }
 274             if (node.children.length) {
 275                 return node.children[0];
 276             }
 277             return scorm_skipnext(node);
 278         };
 279
 280         var scorm_skipnext = function(node) {
 281             if (node.nextSibling) {
 282                 return node.nextSibling;
 283             } else if (node.depth > 0) {
 284                 return scorm_skipnext(node.parent);
 285             }
 286             return null;
 287         };
 288
 289         mod_scorm_next = scorm_next;
 290         mod_scorm_prev = scorm_prev;
 291
 292         // layout
 293         YAHOO.widget.LayoutUnit.prototype.STR_COLLAPSE = M.str.moodle.hide;
 294         YAHOO.widget.LayoutUnit.prototype.STR_EXPAND = M.str.moodle.show;
 295
 296         if (scorm_disable_toc) {
 297             scorm_layout_widget = new YAHOO.widget.Layout('scorm_layout', {
 298                 minWidth: 255,
 299                 minHeight: 600,
 300                 units: [
 301                     { position: 'left', body: 'scorm_toc', header: toc_title, width: 0, resize: true, gutter: '0px 0px 0px 0px', collapse: false},
 302                     { position: 'center', body: '<div id="scorm_content"></div>', gutter: '0px 0px 0px 0px', scroll: true}
 303                 ]
 304             });
 305         } else {
 306             scorm_layout_widget = new YAHOO.widget.Layout('scorm_layout', {
 307                 minWidth: 255,
 308                 minHeight: 600,
 309                 units: [
 310                     { position: 'left', body: 'scorm_toc', header: toc_title, width: 250, resize: true, gutter: '2px 5px 5px 2px', collapse: true, minWidth:250, maxWidth: 590},
 311                     { position: 'center', body: '<div id="scorm_content"></div>', gutter: '2px 5px 5px 2px', scroll: true}
 312                 ]
 313             });
 314         }
 315
 316         scorm_layout_widget.render();
 317         var left = scorm_layout_widget.getUnitByPosition('left');
 318         if (!scorm_disable_toc) {
 319             left.on('collapse', function() {
 320                 scorm_resize_frame();
 321             });
 322             left.on('expand', function() {
 323                 scorm_resize_frame();
 324             });
 325         }
 326         // ugly resizing hack that works around problems with resizing of iframes and objects
 327         left._resize.on('startResize', function() {
 328             var obj = YAHOO.util.Dom.get('scorm_object');
 329             obj.style.display = 'none';
 330         });
 331         left._resize.on('endResize', function() {
 332             var obj = YAHOO.util.Dom.get('scorm_object');
 333             obj.style.display = 'block';
 334             scorm_resize_frame();
 335         });
 336
 337         // hide the TOC if that is the default
 338         if (!scorm_disable_toc) {
 339             if (scorm_hide_toc == true) {
 340                left.collapse();
 341             }
 342         }
 343         // TOC tree
 344         var tree = new YAHOO.widget.TreeView('scorm_tree');
 345         scorm_tree_node = tree;
 346         tree.singleNodeHighlight = true;
 347         tree.subscribe('labelClick', function(node) {
 348             scorm_activate_item(node);
 349             if (node.children.length) {
 350                 scorm_bloody_labelclick = true;
 351             }
 352         });
 353         if (!scorm_disable_toc) {
 354             tree.subscribe('collapse', function(node) {
 355                 if (scorm_bloody_labelclick) {
 356                     scorm_bloody_labelclick = false;
 357                     return false;
 358                 }
 359             });
 360             tree.subscribe('expand', function(node) {
 361                 if (scorm_bloody_labelclick) {
 362                     scorm_bloody_labelclick = false;
 363                     return false;
 364                 }
 365             });
 366         }
 367         tree.expandAll();
 368         tree.render();
 369
 370         // navigation
 371         if (scorm_hide_nav == false) {
 372             scorm_nav_panel = new YAHOO.widget.Panel('scorm_navpanel', { visible:true, draggable:true, close:false, xy: [250, 450],
 373                                                                     autofillheight: "body"} );
 374             scorm_nav_panel.setHeader(M.str.scorm.navigation);
 375
 376             //TODO: make some better&accessible buttons
 377             scorm_nav_panel.setBody('<span id="scorm_nav"><button id="nav_skipprev">&lt;&lt;</button><button id="nav_prev">&lt;</button><button id="nav_up">^</button><button id="nav_next">&gt;</button><button id="nav_skipnext">&gt;&gt;</button></span>');
 378             scorm_nav_panel.render();
 379             scorm_buttons[0] = new YAHOO.widget.Button('nav_skipprev');
 380             scorm_buttons[1] = new YAHOO.widget.Button('nav_prev');
 381             scorm_buttons[2] = new YAHOO.widget.Button('nav_up');
 382             scorm_buttons[3] = new YAHOO.widget.Button('nav_next');
 383             scorm_buttons[4] = new YAHOO.widget.Button('nav_skipnext');
 384             scorm_buttons[0].on('click', function(ev) {
 385                 scorm_activate_item(scorm_skipprev(scorm_tree_node.getHighlightedNode()));
 386             });
 387             scorm_buttons[1].on('click', function(ev) {
 388                 scorm_activate_item(scorm_prev(scorm_tree_node.getHighlightedNode()));
 389             });
 390             scorm_buttons[2].on('click', function(ev) {
 391                 scorm_activate_item(scorm_up(scorm_tree_node.getHighlightedNode()));
 392             });
 393             scorm_buttons[3].on('click', function(ev) {
 394                 scorm_activate_item(scorm_next(scorm_tree_node.getHighlightedNode()));
 395             });
 396             scorm_buttons[4].on('click', function(ev) {
 397                 scorm_activate_item(scorm_skipnext(scorm_tree_node.getHighlightedNode()));
 398             });
 399             scorm_nav_panel.render();
 400         }
 401
 402         // finally activate the chosen item
 403         var scorm_first_url = tree.getRoot().children[0];
 404         var nxt = false;
 405         while (nxt = scorm_next(nxt)) {
 406             if (nxt.title) {
 407                 expression = new RegExp('^.*?scoid=' + launch_sco + '.*?$');
 408                 matches = nxt.title.match(expression);
 409                 if (matches != null) {
 410                     scorm_first_url = nxt;
 411                     break;
 412                 }
 413             }
 414         }
 415         scorm_activate_item(scorm_first_url);
 416
 417         // resizing
 418         scorm_resize_layout(false);
 419
 420         // fix layout if window resized
 421         window.onresize = function() {
 422             scorm_resize_layout(true);
 423         };
 424     });
 425 };
 426
 427
 428 function scorm_get_prev() {
 429         scorm_tree_node = YAHOO.widget.TreeView.getTree('scorm_tree');
 430     if (scorm_tree_node) {
 431         var hnode = scorm_tree_node.getHighlightedNode();
 432         var prev = mod_scorm_prev(hnode);
 433         if (prev) {
 434             mod_scorm_activate_item(prev);
 435         }
 436     }
 437 }
 438
 439 function scorm_get_next() {
 440         scorm_tree_node = YAHOO.widget.TreeView.getTree('scorm_tree');
 441     if (scorm_tree_node) {
 442         var hnode = scorm_tree_node.getHighlightedNode();
 443         var next = mod_scorm_next(hnode);
 444         if (next) {
 445             mod_scorm_activate_item(next);
 446         }
 447     }
 448 }