Note that there are some explanatory texts on larger screens.

plurals
  1. POWeird JavaScript code that can't live without console.log()
    primarykey
    data
    text
    <p>I got this very weird code: <strong>No debug, no work!</strong> I am almost crazy about it. </p> <p>The code is to show an notification in Chrome. That's lot of comments among the code.</p> <p>Look at the !!IMPORTANT&amp;&amp;WEIRD!!, next line is "console.log(_notification);" that can't be omitted, if it does, no events bind could work. </p> <p>Though now the code works OK, but I just curious about this, why I can't remove "console.log(_notification);" ?</p> <pre><code> /** * Notification * @author: ijse * @require: Chrome10+ * @params: same as webkitNotifications.create[HTML]Notification() * @usage: * new Notify("http://www.baidu.com").onshow(function() { * alert("show"); * }).onclose(function() { * alert("close"); * }).show(); */ var Notify = function() { var _params = arguments; // Validate arguments if(_params.length == 0) { console.error("Notify need at least one argument"); return ; } // Check browser support if(!window.webkitNotifications) { console.error("Your browser does not support webkitNotifications feature!!"); return ; } var _onclose, _onclick, _onerror, _onshow; var _notification, _replaceId, _showFlag = false; function bindEvents() { // Add event listeners // In W3C, display event is called show _notification.addEventListener("display", _onshow, false); _notification.addEventListener("click", _onclick, false); _notification.addEventListener("error", _onerror, false); _notification.addEventListener("close", _onclose, false); if(_replaceId) _notification.replaceId = _replaceId; // !!IMPORTANT&amp;&amp;WEIRD!! remove next line no events will work console.log(_notification); } function createfn(permission) { // About permission on Chrome: // PERMISSION_ALLOWED (0) indicates that the user has granted permission to scripts with this origin to show notifications. // PERMISSION_NOT_ALLOWED (1) indicates that the user has not taken an action regarding notifications for scripts from this origin. // PERMISSION_DENIED (2) indicates that the user has explicitly blocked scripts with this origin from showing notifications. if(permission == 0) { // If permission is allowed // Create notification if(_params.length == 1) _notification = window.webkitNotifications.createHTMLNotification(_params[0]); else _notification = window.webkitNotifications.createNotification(_params[0],_params[1],_params[2]); // Bind events console.log("bind event in createfn"); bindEvents(); // Show, if yes flag !!_showFlag &amp;&amp; _notification.show(); } else { if(_onerror) _onerror.call(this); console.error("Notification permission is denied!!"); } } // If permission already allowed, do not require again if(window.webkitNotifications.checkPermission() != 0) { // Require permission from user window.webkitNotifications.requestPermission(function() { createfn.call(this, window.webkitNotifications.checkPermission()); }); } else { createfn.call(this, window.webkitNotifications.checkPermission()); } // Return handler methods return { onclose: function(fn) { _onclose = fn; console.log(1); return this; }, onclick: function(fn) { _onclick = fn; console.log(2); return this; }, onerror: function(fn) { _onerror = fn; console.log(3); return this; }, onshow : function(fn) { _onshow = fn; console.log(4); return this; }, show: function(replaceId) { console.log("method show"); _replaceId = replaceId; if(_notification) { // Notification already been created bindEvents(); _notification.show(); } else { // Flag yes to show _showFlag = true; } return _notification; }, cancel: function() { _notification.cancel(); } } // return handler } new Notify("","Success!!", "Welcome to use empcy!!").onshow(function() { var that = this; window.setTimeout(function() { that.cancel(); }, 3000); }).onclose(function() { alert("close"); }).onclick(function() { alert("clicked"); }).show("Welcome"); </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload