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