plugins/messages/messages.js

   1 /**
   2  * Description: display messages in a dedicated area, with buttons for filtering on level
   3  * Copyright (c) 2012 UPMC Sorbonne Universite - INRIA
   4  * License: GPLv3
   5  */
   6
   7 ( function($) {
   8
   9     /* Method calling logic */
  10     $.fn.Messages = function( method ) {
  11         if ( methods[method] ) {
  12             return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
  13         } else if ( typeof method === 'object' || ! method ) {
  14             return methods.init.apply( this, arguments );
  15         } else {
  16             $.error( 'Method ' +  method + ' does not exist on $.Messages' );
  17         }
  18     };
  19
  20     var levels = {'fatal': true, 'error': true, 'warning' : true, 'info' : true, 'debug' : false};
  21
  22     var methods = {
  23         init : function( options ) {
  24
  25             return this.each (function() {
  26                 var $this = $(this);
  27                 instance=new Messages (options,$this);
  28                 $this.data('Messages',instance);
  29                 for (level in levels) {
  30                     (function (instance,level) {
  31                         $.subscribe("messages:"+level, function (e, msg){ instance.display_message (msg,level)});
  32                     }) (instance,level);
  33                 }
  34                 $.publish  ("messages:info", 'Subscribed to all 5 message channels');
  35             });
  36         },
  37         destroy : function( ) {
  38
  39             return this.each(function(){
  40                 var $this = $(this), instance = $this.data('Messages');
  41                 $(window).unbind('Messages');
  42                 instance.remove();
  43                 $this.removeData('Messages');
  44             });
  45         },
  46 /*
  47     reposition : function( ) { // ... },
  48     show : function( ) { // ... },
  49     hide : function( ) { // ... },
  50 */
  51         update : function( content ) { },
  52     };
  53
  54     function Messages (options,plugindiv) {
  55         this.options=options;
  56         this.plugindiv=plugindiv;
  57         /* cannot use 'this' directly of course */
  58         (function (instance) { $( function () {instance.init_buttons();}) }) (this);
  59
  60         this.is_active = function (level) {
  61             return this.plugindiv.find("div.messages-buttons>input[name="+level+"]").get(0).checked;
  62         }
  63         this.display_message = function (incoming, level) {
  64             var domid=this.plugindiv.attr('id');
  65             var html="";
  66             html += "<li class='" + level +"'";
  67             if ( ! this.is_active(level) ) html += " style='display:none'";
  68             html += ">";
  69             html += "<span class='messages-date'>" + new Date() + "</span>";
  70             html += "<span class='messages-level'>[" + level + "]</span>";
  71             //  html += "[" + domid + "]";
  72             html += " " + incoming + "</li>";
  73             $("ul#"+domid+".messages").append(html);
  74         },
  75
  76
  77         this.init_buttons = function () {
  78             this.plugindiv.find("div.messages-buttons>input").each(this.init_button);
  79         },
  80         this.init_button = function (_,input) {
  81             /* set 'checked' state for that input from global 'levels' above */
  82             var level=input.name;
  83             input.checked=levels[level];
  84             var toggle_level = function (input,level) {
  85                 console.log("input=" + input + " name=" + input.name);
  86                 var was_visible=input.checked;
  87                 var visible=!was_visible;
  88                 console.log('clic - was_visible=' + was_visible + " visible=" + visible);
  89                 var css_display=(visible ? "display:list-item" : "display:none");
  90                 console.log("Before setting input.checked=" + input.checked);
  91                 input.checked=visible;
  92                 console.log("After setting input.checked=" + input.checked);
  93                 var plugindiv=$(input).closest("div.Messages");
  94                 console.log("setting css display: " + css_display + " for level=" + level);
  95                 plugindiv.find("li."+level).css(css_display);
  96                 console.log("leaving input with checked=" + input.checked);
  97             };
  98             $(input).click(function (event) {
  99                 event.preventDefault();
 100                 toggle_level(this,level);
 101             });
 102         }
 103
 104     };
 105
 106 })(jQuery);
 107
 108 // temporary
 109
 110 var messages_test = {
 111     // set this to 0 to disable
 112     counter : 2,
 113     period : 1000,
 114     sample : function () {
 115         $.publish("messages:fatal","a fatal message (" + messages_test.counter + " runs to go)");
 116         $.publish("messages:error","an error message");
 117         $.publish("messages:warning","a warning message");
 118         $.publish("messages:info","an info message");
 119         $.publish("messages:debug","a debug message");
 120         messages_test.counter -= 1;
 121         if (messages_test.counter == 0)
 122             window.clearInterval (messages_test.interval_id);
 123     },
 124     run: function () {
 125         messages_test.interval_id=window.setInterval(messages_test.sample , messages_test.period);
 126     }
 127 }
 128 messages_test.run()
 129