Split util into two file:

 - util.js that contains essential functions
 - webutils.js that contains the GUI utility function.js

this helps to include noVNC in other project, especially Cappuccino Application
i

include/default_controls.js

@@ -56,8 +56,8 @@ load: function(target) {
     // Stylesheet selection dropdown
     html += '            <li><select id="VNC_stylesheet" name="vncStyle">';
     html += '              <option value="default">default</option>';
-    sheet = Util.selectStylesheet();
-    sheets = Util.getStylesheets();
+    sheet = WebUtil.selectStylesheet();
+    sheets = WebUtil.getStylesheets();
     for (i = 0; i < sheets.length; i += 1) {
         html += '<option value="' + sheets[i].title + '">' + sheets[i].title + '</option>';
     }
@@ -102,11 +102,11 @@ load: function(target) {
 
     // Settings with immediate effects
     DC.initSetting('logging', 'warn');
-    Util.init_logging(DC.getSetting('logging'));
+    WebUtil.init_logging(DC.getSetting('logging'));
     DC.initSetting('stylesheet', 'default');
 
-    Util.selectStylesheet(null); // call twice to get around webkit bug
-    Util.selectStylesheet(DC.getSetting('stylesheet'));
+    WebUtil.selectStylesheet(null); // call twice to get around webkit bug
+    WebUtil.selectStylesheet(DC.getSetting('stylesheet'));
 
     /* Populate the controls if defaults are provided in the URL */
     DC.initSetting('host', '');
@@ -134,7 +134,7 @@ load: function(target) {
 // Read form control compatible setting from cookie
 getSetting: function(name) {
     var val, ctrl = $('VNC_' + name);
-    val = Util.readCookie(name);
+    val = WebUtil.readCookie(name);
     if (ctrl.type === 'checkbox') {
         if (val.toLowerCase() in {'0':1, 'no':1, 'false':1}) {
             val = false;
@@ -151,7 +151,7 @@ updateSetting: function(name, value) {
     var i, ctrl = $('VNC_' + name);
     // Save the cookie for this session
     if (typeof value !== 'undefined') {
-        Util.createCookie(name, value);
+        WebUtil.createCookie(name, value);
     }
 
     // Update the settings control
@@ -180,7 +180,7 @@ saveSetting: function(name) {
     } else {
         val = ctrl.value;
     }
-    Util.createCookie(name, val);
+    WebUtil.createCookie(name, val);
     //Util.Debug("Setting saved '" + name + "=" + val + "'");
     return val;
 },
@@ -190,9 +190,9 @@ initSetting: function(name, defVal) {
     var val;
 
     // Check Query string followed by cookie
-    val = Util.getQueryVar(name);
+    val = WebUtil.getQueryVar(name);
     if (val === null) {
-        val = Util.readCookie(name, defVal);
+        val = WebUtil.readCookie(name, defVal);
     }
     DefaultControls.updateSetting(name, val);
     //Util.Debug("Setting '" + name + "' initialized to '" + val + "'");
@@ -267,8 +267,8 @@ settingsApply: function() {
     DC.saveSetting('logging');
 
     // Settings with immediate (non-connected related) effect
-    Util.selectStylesheet(DC.getSetting('stylesheet'));
-    Util.init_logging(DC.getSetting('logging'));
+    WebUtil.selectStylesheet(DC.getSetting('stylesheet'));
+    WebUtil.init_logging(DC.getSetting('logging'));
 
     //Util.Debug("<< settingsApply");
 },

include/util.js

@@ -62,9 +62,6 @@ Array.prototype.push32 = function (num) {
 Util._log_level = 'warn';
 Util.init_logging = function (level) {
     if (typeof level === 'undefined') {
-        Util._log_level = (document.location.href.match(
-                /logging=([A-Za-z0-9\._\-]*)/) ||
-                ['', Util._log_level])[1];
         level = Util._log_level;
     } else {
         Util._log_level = level;
@@ -96,39 +93,11 @@ Util.init_logging = function (level) {
     }
 };
 Util.get_logging = function () {
-        return Util._log_level;
-    }
+    return Util._log_level;
+}
 // Initialize logging level
 Util.init_logging();
 
-Util.dirObj = function (obj, depth, parent) {
-    var i, msg = "", val = "";
-    if (! depth) { depth=2; }
-    if (! parent) { parent= ""; }
-
-    // Print the properties of the passed-in object 
-    for (i in obj) {
-        if ((depth > 1) && (typeof obj[i] === "object")) { 
-            // Recurse attributes that are objects
-            msg += Util.dirObj(obj[i], depth-1, parent + "." + i);
-        } else {
-            //val = new String(obj[i]).replace("\n", " ");
-            val = obj[i].toString().replace("\n", " ");
-            if (val.length > 30) {
-                val = val.substr(0,30) + "...";
-            } 
-            msg += parent + "." + i + ": " + val + "\n";
-        }
-    }
-    return msg;
-};
-
-// Read a query string variable
-Util.getQueryVar = function(name, defVal) {
-    var re = new RegExp('[?][^#]*' + name + '=([^&#]*)');
-    if (typeof defVal === 'undefined') { defVal = null; }
-    return (document.location.href.match(re) || ['',defVal])[1];
-};
 
 // Set defaults for Crockford style function namespaces
 Util.conf_default = function(cfg, api, v, type, defval, desc) {
@@ -269,70 +238,4 @@ Util.Flash = (function(){
     }
     version = v.match(/\d+/g);
     return {version: parseInt(version[0] || 0 + '.' + version[1], 10) || 0, build: parseInt(version[2], 10) || 0};
-}()); 
-
-/*
- * Cookie handling. Dervied from: http://www.quirksmode.org/js/cookies.html
- */
-
-// No days means only for this browser session
-Util.createCookie = function(name,value,days) {
-    var date, expires;
-    if (days) {
-        date = new Date();
-        date.setTime(date.getTime()+(days*24*60*60*1000));
-        expires = "; expires="+date.toGMTString();
-    }
-    else {
-        expires = "";
-    }
-    document.cookie = name+"="+value+expires+"; path=/";
-};
-
-Util.readCookie = function(name, defaultValue) {
-    var i, c, nameEQ = name + "=", ca = document.cookie.split(';');
-    for(i=0; i < ca.length; i += 1) {
-        c = ca[i];
-        while (c.charAt(0) === ' ') { c = c.substring(1,c.length); }
-        if (c.indexOf(nameEQ) === 0) { return c.substring(nameEQ.length,c.length); }
-    }
-    return (typeof defaultValue !== 'undefined') ? defaultValue : null;
-};
-
-Util.eraseCookie = function(name) {
-    Util.createCookie(name,"",-1);
-};
-
-/*
- * Alternate stylesheet selection
- */
-Util.getStylesheets = function() { var i, links, sheets = [];
-    links = document.getElementsByTagName("link");
-    for (i = 0; i < links.length; i += 1) {
-        if (links[i].title &&
-            links[i].rel.toUpperCase().indexOf("STYLESHEET") > -1) {
-            sheets.push(links[i]);
-        }
-    }
-    return sheets;
-};
-
-// No sheet means try and use value from cookie, null sheet used to
-// clear all alternates.
-Util.selectStylesheet = function(sheet) {
-    var i, link, sheets = Util.getStylesheets();
-    if (typeof sheet === 'undefined') {
-        sheet = 'default';
-    }
-    for (i=0; i < sheets.length; i += 1) {
-        link = sheets[i];
-        if (link.title === sheet) {    
-            Util.Debug("Using stylesheet " + sheet);
-            link.disabled = false;
-        } else {
-            //Util.Debug("Skipping stylesheet " + link.title);
-            link.disabled = true;
-        }
-    }
-    return sheet;
-};
+}()); 

include/vnc.js

@@ -31,6 +31,7 @@ function get_VNC_uri_prefix() {
     //         "firebug-lite-compressed.js'><\/script>";
 
     extra += start + "util.js" + end;
+    extra += start + "webutil.js" + end;
     extra += start + "base64.js" + end;
     extra += start + "des.js" + end;
     extra += start + "canvas.js" + end;

include/webutil.js

@@ -0,0 +1,144 @@
+/*
+ * noVNC: HTML5 VNC client
+ * Copyright (C) 2010 Joel Martin
+ * Licensed under LGPL-3 (see LICENSE.txt)
+ *
+ * See README.md for usage and integration instructions.
+ */
+
+"use strict";
+/*jslint bitwise: false, white: false */
+/*global window, console, document, navigator, ActiveXObject*/
+
+// Globals defined here
+var WebUtil = {}, $;
+
+/*
+ * Simple DOM selector by ID
+ */
+if (!window.$) {
+    $ = function (id) {
+        if (document.getElementById) {
+            return document.getElementById(id);
+        } else if (document.all) {
+            return document.all[id];
+        } else if (document.layers) {
+            return document.layers[id];
+        }
+        return undefined;
+    };
+}
+
+
+/* 
+ * ------------------------------------------------------
+ * Namespaced in WebUtil
+ * ------------------------------------------------------
+ */
+
+// init log level reading the logging HTTP param
+WebUtil.init_logging = function() {
+    Util._log_level = (document.location.href.match(
+         /logging=([A-Za-z0-9\._\-]*)/) ||
+         ['', Util._log_level])[1];
+    
+    Util.init_logging()
+}
+WebUtil.init_logging();
+
+
+WebUtil.dirObj = function (obj, depth, parent) {
+    var i, msg = "", val = "";
+    if (! depth) { depth=2; }
+    if (! parent) { parent= ""; }
+
+    // Print the properties of the passed-in object 
+    for (i in obj) {
+        if ((depth > 1) && (typeof obj[i] === "object")) { 
+            // Recurse attributes that are objects
+            msg += WebUtil.dirObj(obj[i], depth-1, parent + "." + i);
+        } else {
+            //val = new String(obj[i]).replace("\n", " ");
+            val = obj[i].toString().replace("\n", " ");
+            if (val.length > 30) {
+                val = val.substr(0,30) + "...";
+            } 
+            msg += parent + "." + i + ": " + val + "\n";
+        }
+    }
+    return msg;
+};
+
+// Read a query string variable
+WebUtil.getQueryVar = function(name, defVal) {
+    var re = new RegExp('[?][^#]*' + name + '=([^&#]*)');
+    if (typeof defVal === 'undefined') { defVal = null; }
+    return (document.location.href.match(re) || ['',defVal])[1];
+};
+
+
+/*
+ * Cookie handling. Dervied from: http://www.quirksmode.org/js/cookies.html
+ */
+
+// No days means only for this browser session
+WebUtil.createCookie = function(name,value,days) {
+    var date, expires;
+    if (days) {
+        date = new Date();
+        date.setTime(date.getTime()+(days*24*60*60*1000));
+        expires = "; expires="+date.toGMTString();
+    }
+    else {
+        expires = "";
+    }
+    document.cookie = name+"="+value+expires+"; path=/";
+};
+
+WebUtil.readCookie = function(name, defaultValue) {
+    var i, c, nameEQ = name + "=", ca = document.cookie.split(';');
+    for(i=0; i < ca.length; i += 1) {
+        c = ca[i];
+        while (c.charAt(0) === ' ') { c = c.substring(1,c.length); }
+        if (c.indexOf(nameEQ) === 0) { return c.substring(nameEQ.length,c.length); }
+    }
+    return (typeof defaultValue !== 'undefined') ? defaultValue : null;
+};
+
+WebUtil.eraseCookie = function(name) {
+    WebUtil.createCookie(name,"",-1);
+};
+
+/*
+ * Alternate stylesheet selection
+ */
+WebUtil.getStylesheets = function() { var i, links, sheets = [];
+    links = document.getElementsByTagName("link");
+    for (i = 0; i < links.length; i += 1) {
+        if (links[i].title &&
+            links[i].rel.toUpperCase().indexOf("STYLESHEET") > -1) {
+            sheets.push(links[i]);
+        }
+    }
+    return sheets;
+};
+
+// No sheet means try and use value from cookie, null sheet used to
+// clear all alternates.
+WebUtil.selectStylesheet = function(sheet) {
+    var i, link, sheets = WebUtil.getStylesheets();
+    if (typeof sheet === 'undefined') {
+        sheet = 'default';
+    }
+    for (i=0; i < sheets.length; i += 1) {
+        link = sheets[i];
+        if (link.title === sheet) {    
+            Util.Debug("Using stylesheet " + sheet);
+            link.disabled = false;
+        } else {
+            //Util.Debug("Skipping stylesheet " + link.title);
+            link.disabled = true;
+        }
+    }
+    return sheet;
+};

tests/base64.html

@@ -3,6 +3,7 @@
   <head> 
     <title>Native Base64 Tests</title> 
     <script src="include/util.js"></script> 
+    <script src="include/webutil.js"></script> 
     <script src="include/base64.js"></script> 
   </head> 
   <body> 

tests/canvas.html

@@ -6,6 +6,7 @@
             src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
         -->
         <script src="include/util.js"></script>
+        <script src="include/webutil.js"></script>
         <script src="include/base64.js"></script>
         <script src="include/canvas.js"></script>
         <script src="face.png.js"></script>

tests/cursor.html

@@ -8,6 +8,7 @@
                     src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
     -->
     <script src="include/util.js"></script> 
+    <script src="include/webutil.js"></script> 
     <script src="include/base64.js"></script> 
     <script src="include/canvas.js"></script> 
   </head> 

tests/input.html

@@ -19,6 +19,7 @@
         src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
     -->
     <script src="include/util.js"></script>
+    <script src="include/webutil.js"></script> 
     <script src="include/base64.js"></script>
     <script src="include/canvas.js"></script>
     <script>

tests/vnc_playback.html

@@ -50,7 +50,7 @@
             cell.scrollTop = cell.scrollHeight;
         }
 
-        fname = Util.getQueryVar('data', null);
+        fname = WebUtil.getQueryVar('data', null);
 
         if (fname) {
             message("Loading " + fname);
@@ -109,9 +109,9 @@
         }
 
         window.onload = function() {
-            iterations = Util.getQueryVar('iterations', 3);
+            iterations = WebUtil.getQueryVar('iterations', 3);
             $('iterations').value = iterations;
-            mode = Util.getQueryVar('mode', 3);
+            mode = WebUtil.getQueryVar('mode', 3);
             if (mode === 'realtime') {
                 $('mode2').checked = true;
             } else {

tests/ws.html

@@ -4,6 +4,7 @@
         <title>WebSockets Test</title>
         <script src="include/base64.js"></script>
         <script src="include/util.js"></script>
+        <script src="include/webutil.js"></script> 
         <!-- Uncomment to activate firebug lite -->
         <!--
         <script type='text/javascript' 

tests/wsencoding.html

@@ -24,6 +24,7 @@
 
     <script src="include/base64.js"></script>
     <script src="include/util.js"></script>
+    <script src="include/webutil.js"></script>
 
     <script>
 

vnc_auto.html

@@ -91,18 +91,18 @@
 
             $('sendCtrlAltDelButton').onclick = sendCtrlAltDel;
 
-            host = Util.getQueryVar('host', null);
-            port = Util.getQueryVar('port', null);
-            password = Util.getQueryVar('password', '');
+            host = WebUtil.getQueryVar('host', null);
+            port = WebUtil.getQueryVar('port', null);
+            password = WebUtil.getQueryVar('password', '');
             if ((!host) || (!port)) {
                 updateState('failed',
                     "Must specify host and port in URL");
                 return;
             }
 
-            rfb = new RFB({'encrypt':      Util.getQueryVar('encrypt', false),
-                       'true_color':   Util.getQueryVar('true_color', true),
-                       'local_cursor': Util.getQueryVar('cursor', true),
+            rfb = new RFB({'encrypt':      WebUtil.getQueryVar('encrypt', false),
+                       'true_color':   WebUtil.getQueryVar('true_color', true),
+                       'local_cursor': WebUtil.getQueryVar('cursor', true),
                        'updateState':  updateState});
             rfb.connect(host, port, password);
         };