From 4a32121a06731d8ae3b02bbdb67db1c336c7345b Mon Sep 17 00:00:00 2001
From: Thierry Parmentelat <thierry.parmentelat@inria.fr>
Date: Mon, 8 Apr 2013 13:09:03 +0200
Subject: [PATCH] comment

---
 plugins/hazelnut/hazelnut.js   |   1 +
 plugins/messages/messages.css  |  11 +++-
 plugins/messages/messages.html |   8 ++-
 plugins/messages/messages.js   | 103 ++++++++++++++++++---------------
 4 files changed, 73 insertions(+), 50 deletions(-)

diff --git a/plugins/hazelnut/hazelnut.js b/plugins/hazelnut/hazelnut.js
index 31927b32..f38488c5 100644
--- a/plugins/hazelnut/hazelnut.js
+++ b/plugins/hazelnut/hazelnut.js
@@ -339,6 +339,7 @@
 
     /***************************************************************************
      * Private methods
+     * xxx I'm not sure why this should not be methods in the Hazelnut class above
      ***************************************************************************/
 
     /** 
diff --git a/plugins/messages/messages.css b/plugins/messages/messages.css
index c886ce0e..685ae358 100644
--- a/plugins/messages/messages.css
+++ b/plugins/messages/messages.css
@@ -1,9 +1,13 @@
-/* http://www.w3schools.com/html/html_colornames.asp */
-/* someone please feel free to pick a better set of colors */
+div.messages-buttons { padding: 0px 20px 8px 50px; }
+div.messages-buttons>input {
+    padding: 10px;
+}
+
 ul.messages {
-    background-color: #d0f0d0;
+/*    background-color: #d0f0d0; */
     list-style-type: none;
 }
+/* someone please feel free to pick a better set of colors */
 li.fatal { background-color: CornflowerBlue;}
 li.error { background-color: Coral; }
 li.warning { background-color: Gold; }
@@ -20,3 +24,4 @@ span.messages-level {
     width: 40px;
     font-size: 90%;
 }
+
diff --git a/plugins/messages/messages.html b/plugins/messages/messages.html
index 9f4d65a9..e219a5c4 100644
--- a/plugins/messages/messages.html
+++ b/plugins/messages/messages.html
@@ -1,2 +1,8 @@
-{# xxx could use radio buttons to filter out messages, and one for clearing up #}
+<div class="messages-buttons row-fluid">
+<input type="checkbox" name="fatal" />fatal
+<input type="checkbox" name="error" />error
+<input type="checkbox" name="warning" />warning
+<input type="checkbox" name="info" />info
+<input type="checkbox" name="debug" />debug
+</div>
 <ul class="messages" id={{ domid }}></ul>
diff --git a/plugins/messages/messages.js b/plugins/messages/messages.js
index 18568bea..abc18179 100644
--- a/plugins/messages/messages.js
+++ b/plugins/messages/messages.js
@@ -1,11 +1,6 @@
 /**
- * MySlice Messages plugin
- * Version: 0.1.0
- * URL: http://www.myslice.info
- * Description: Display debug messages in a DIV
- * Requires: 
- * Author: The MySlice Team
- * Copyright: Copyright 2012 UPMC Sorbonne Universités
+ * Description: display messages in a dedicated area, with buttons for filtering on level
+ * Copyright (c) 2012 UPMC Sorbonne Universite - INRIA
  * License: GPLv3
  */
 
@@ -22,39 +17,29 @@
 	}    
     };
 
+    var levels = {'fatal': true, 'error': true, 'warning' : true, 'info' : true, 'debug' : false};
+
     var methods = {
         init : function( options ) {
 
-            return this.each(function(){
-                var $this = $(this),
-                  data = $this.data('Messages'), 
-                  Messages = $('<div />', { text : $this.attr('title') });
-
-                // If the plugin hasn't been initialized yet
-                if ( ! data ) {
-                    $(this).data('Messages', {
-                        plugin_uuid: options.plugin_uuid,
-                        target : $this,
-                        Messages : Messages,
-		    });
-         
-                    /* Plugin initialization */
-                    $.subscribe("messages:fatal", {'plugindiv': $this,'level':'fatal'}, display_message);
-                    $.subscribe("messages:error", {'plugindiv': $this,'level':'error'}, display_message);
-                    $.subscribe("messages:warning", {'plugindiv': $this,'level':'warning'}, display_message);
-                    $.subscribe("messages:info", {'plugindiv': $this,'level':'info'}, display_message);
-                    $.subscribe("messages:debug", {'plugindiv': $this,'level':'debug'}, display_message);
-                    $.publish  ("messages:info", 'Subscribed to all 5 message channels');
-                    /* End of plugin initialization */
-                }
+            return this.each (function() {
+                var $this = $(this);
+		instance=new Messages (options,$this);
+		$this.data('Messages',instance);
+		for (level in levels) {
+		    (function (instance,level) {
+			$.subscribe("messages:"+level, function (e, msg){ instance.display_message (msg,level)});
+		    }) (instance,level);
+		}
+                $.publish  ("messages:info", 'Subscribed to all 5 message channels');
             });
         },
         destroy : function( ) {
 
             return this.each(function(){
-                var $this = $(this), data = $this.data('Messages');
+                var $this = $(this), instance = $this.data('Messages');
                 $(window).unbind('Messages');
-                data.Messages.remove();
+                instance.remove();
                 $this.removeData('Messages');
             });
         },
@@ -66,19 +51,44 @@
         update : function( content ) { },
     };
 
-    /* Private methods */
+    function Messages (options,plugindiv) {
+	this.options=options;
+	this.plugindiv=plugindiv;
+	/* cannot use 'this' directly of course */
+	(function (instance) { $( function () {instance.init_buttons();}) }) (this);
 
-    function display_message(e, message) {
-	var level=e.data.level;
-	var domid=e.data.plugindiv.data('Messages').plugin_uuid;
-	var html="";
-	html += "<li class='" + level + "'>";
-	html += "<span class='messages-date'>" + new Date() + "</span>";
-	html += "<span class='messages-level'>[" + level + "]</span>";
-//	html += "[" + domid + "]";
-	html += " " + message + "</li>";
-	$("ul#"+domid+".messages").append(html);
-    }
+	this.is_active = function (level) { 
+	    return this.plugindiv.find("div.messages-buttons>input[name="+level+"]").get(0).checked;
+	}
+	this.display_message = function (incoming, level) {
+	    var domid=this.plugindiv.attr('id');
+	    var html="";
+	    html += "<li class='" + level +"'"; 
+	    if ( ! this.is_active(level) ) html += " style='display:none'";
+	    html += ">";
+	    html += "<span class='messages-date'>" + new Date() + "</span>";
+	    html += "<span class='messages-level'>[" + level + "]</span>";
+	    //	html += "[" + domid + "]";
+	    html += " " + incoming + "</li>";
+	    $("ul#"+domid+".messages").append(html);
+	},
+
+
+	this.init_buttons = function () {
+	    this.plugindiv.find("div.messages-buttons>input").each(this.init_button);
+	},
+	this.init_button = function (_,input) {
+	    var level=input.name;
+	    input.checked=levels[level];
+	    console.log ("init_button did set initial status of " + level + " to " + input.checked);
+	    $(input).on('click',this.toggle_level);
+	},
+
+	this.toggle_level = function () {
+	    console.log("clicked, this= " + this + " this.name=" + this.name + " this.checked=" + this.checked);
+	}
+
+    };
     
 })(jQuery);
 
@@ -86,8 +96,8 @@
 
 var messages_test = {
     // set this to 0 to disable
-    counter : 3,
-    period : 3000,
+    counter : 2,
+    period : 1000,
     sample : function () { 
 	$.publish("messages:fatal","a fatal message (" + messages_test.counter + " runs to go)");
 	$.publish("messages:error","an error message");
@@ -99,7 +109,8 @@ var messages_test = {
 	    window.clearInterval (messages_test.interval_id);
     },
     run: function () {
-	messages_test.interval_id=window.setInterval(messages_test.sample , 5000);
+	messages_test.interval_id=window.setInterval(messages_test.sample , messages_test.period);
     }
 }
 messages_test.run()
+
-- 
2.43.0