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