pmux-logview 0.3.4 → 0.3.10

data/lib/pmux-logview/static/js/jquery.activity-indicator-1.0.0.min.js

@@ -7,4 +7,4 @@
  * Author: Felix Gnass [fgnass at neteye dot de]
  * Version: 1.0.0
  */
-(function($){$.fn.activity=function(opts){this.each(function(){var $this=$(this);var el=$this.data("activity");if(el){clearInterval(el.data("interval"));el.remove();$this.removeData("activity");}if(opts!==false){opts=$.extend({color:$this.css("color")},$.fn.activity.defaults,opts);el=render($this,opts).css("position","absolute").prependTo(opts.outside?"body":$this);var h=$this.outerHeight()-el.height();var w=$this.outerWidth()-el.width();var margin={top:opts.valign=="top"?opts.padding:opts.valign=="bottom"?h-opts.padding:Math.floor(h/2),left:opts.align=="left"?opts.padding:opts.align=="right"?w-opts.padding:Math.floor(w/2)};var offset=$this.offset();if(opts.outside){el.css({top:offset.top+"px",left:offset.left+"px"});}else{margin.top-=el.offset().top-offset.top;margin.left-=el.offset().left-offset.left;}el.css({marginTop:margin.top+"px",marginLeft:margin.left+"px"});animate(el,opts.segments,Math.round(10/opts.speed)/10);$this.data("activity",el);}});return this;};$.fn.activity.defaults={segments:12,space:3,length:7,width:4,speed:1.2,align:"center",valign:"center",padding:4};$.fn.activity.getOpacity=function(opts,i){var steps=opts.steps||opts.segments-1;var end=opts.opacity!==undefined?opts.opacity:1/steps;return 1-Math.min(i,steps)*(1-end)/steps;};var render=function(){return $("<div>").addClass("busy");};var animate=function(){};function svg(tag,attr){var el=document.createElementNS("http://www.w3.org/2000/svg",tag||"svg");if(attr){$.each(attr,function(k,v){el.setAttributeNS(null,k,v);});}return $(el);}if(document.createElementNS&&document.createElementNS("http://www.w3.org/2000/svg","svg").createSVGRect){render=function(target,d){var innerRadius=d.width*2+d.space;var r=(innerRadius+d.length+Math.ceil(d.width/2)+1);var el=svg().width(r*2).height(r*2);var g=svg("g",{"stroke-width":d.width,"stroke-linecap":"round",stroke:d.color}).appendTo(svg("g",{transform:"translate("+r+","+r+")"}).appendTo(el));for(var i=0;i<d.segments;i++){g.append(svg("line",{x1:0,y1:innerRadius,x2:0,y2:innerRadius+d.length,transform:"rotate("+(360/d.segments*i)+", 0, 0)",opacity:$.fn.activity.getOpacity(d,i)}));}return $("<div>").append(el).width(2*r).height(2*r);};if(document.createElement("div").style.WebkitAnimationName!==undefined){var animations={};animate=function(el,steps,duration){if(!animations[steps]){var name="spin"+steps;var rule="@-webkit-keyframes "+name+" {";for(var i=0;i<steps;i++){var p1=Math.round(100000/steps*i)/1000;var p2=Math.round(100000/steps*(i+1)-1)/1000;var value="% { -webkit-transform:rotate("+Math.round(360/steps*i)+"deg); }\n";rule+=p1+value+p2+value;}rule+="100% { -webkit-transform:rotate(100deg); }\n}";document.styleSheets[0].insertRule(rule);animations[steps]=name;}el.css("-webkit-animation",animations[steps]+" "+duration+"s linear infinite");};}else{animate=function(el,steps,duration){var rotation=0;var g=el.find("g g").get(0);el.data("interval",setInterval(function(){g.setAttributeNS(null,"transform","rotate("+(++rotation%steps*(360/steps))+")");},duration*1000/steps));};}}else{var s=$("<shape>").css("behavior","url(#default#VML)").appendTo("body");if(s.get(0).adj){var sheet=document.createStyleSheet();$.each(["group","shape","stroke"],function(){sheet.addRule(this,"behavior:url(#default#VML);");});render=function(target,d){var innerRadius=d.width*2+d.space;var r=(innerRadius+d.length+Math.ceil(d.width/2)+1);var s=r*2;var o=-Math.ceil(s/2);var el=$("<group>",{coordsize:s+" "+s,coordorigin:o+" "+o}).css({top:o,left:o,width:s,height:s});for(var i=0;i<d.segments;i++){el.append($("<shape>",{path:"m "+innerRadius+",0  l "+(innerRadius+d.length)+",0"}).css({width:s,height:s,rotation:(360/d.segments*i)+"deg"}).append($("<stroke>",{color:d.color,weight:d.width+"px",endcap:"round",opacity:$.fn.activity.getOpacity(d,i)})));}return $("<group>",{coordsize:s+" "+s}).css({width:s,height:s,overflow:"hidden"}).append(el);};animate=function(el,steps,duration){var rotation=0;var g=el.get(0);el.data("interval",setInterval(function(){g.style.rotation=++rotation%steps*(360/steps);},duration*1000/steps));};}$(s).remove();}})(jQuery);
+(function($){$.fn.activity=function(opts){this.each(function(){var $this=$(this);var el=$this.data("activity");if(el){clearInterval(el.data("interval"));el.remove();$this.removeData("activity");}if(opts!==false){opts=$.extend({color:$this.css("color")},$.fn.activity.defaults,opts);el=render($this,opts).css("position","absolute").prependTo(opts.outside?"body":$this);var h=$this.outerHeight()-el.height();var w=$this.outerWidth()-el.width();var margin={top:opts.valign=="top"?opts.padding:opts.valign=="bottom"?h-opts.padding:Math.floor(h/2),left:opts.align=="left"?opts.padding:opts.align=="right"?w-opts.padding:Math.floor(w/2)};var offset=$this.offset();if(opts.outside){el.css({top:offset.top+"px",left:offset.left+"px"});}else{margin.top-=el.offset().top-offset.top;margin.left-=el.offset().left-offset.left;}el.css({marginTop:margin.top+"px",marginLeft:margin.left+"px"});animate(el,opts.segments,Math.round(10/opts.speed)/10);$this.data("activity",el);}});return this;};$.fn.activity.defaults={segments:12,space:3,length:7,width:4,speed:1.2,align:"center",valign:"center",padding:4};$.fn.activity.getOpacity=function(opts,i){var steps=opts.steps||opts.segments-1;var end=opts.opacity!==undefined?opts.opacity:1/steps;return 1-Math.min(i,steps)*(1-end)/steps;};var render=function(){return $("<div>").addClass("busy");};var animate=function(){};function svg(tag,attr){var el=document.createElementNS("http://www.w3.org/2000/svg",tag||"svg");if(attr){$.each(attr,function(k,v){el.setAttributeNS(null,k,v);});}return $(el);}if(document.createElementNS&&document.createElementNS("http://www.w3.org/2000/svg","svg").createSVGRect){render=function(target,d){var innerRadius=d.width*2+d.space;var r=(innerRadius+d.length+Math.ceil(d.width/2)+1);var el=svg().width(r*2).height(r*2);var g=svg("g",{"stroke-width":d.width,"stroke-linecap":"round",stroke:d.color}).appendTo(svg("g",{transform:"translate("+r+","+r+")"}).appendTo(el));for(var i=0;i<d.segments;i++){g.append(svg("line",{x1:0,y1:innerRadius,x2:0,y2:innerRadius+d.length,transform:"rotate("+(360/d.segments*i)+", 0, 0)",opacity:$.fn.activity.getOpacity(d,i)}));}return $("<div>").append(el).width(2*r).height(2*r);};if(document.createElement("div").style.WebkitAnimationName!==undefined){var animations={};animate=function(el,steps,duration){if(!animations[steps]){var name="spin"+steps;var rule="@-webkit-keyframes "+name+" {";for(var i=0;i<steps;i++){var p1=Math.round(100000/steps*i)/1000;var p2=Math.round(100000/steps*(i+1)-1)/1000;var value="% { -webkit-transform:rotate("+Math.round(360/steps*i)+"deg); }\n";rule+=p1+value+p2+value;}rule+="100% { -webkit-transform:rotate(100deg); }\n}";document.styleSheets[0].insertRule(rule,0);animations[steps]=name;}el.css("-webkit-animation",animations[steps]+" "+duration+"s linear infinite");};}else{animate=function(el,steps,duration){var rotation=0;var g=el.find("g g").get(0);el.data("interval",setInterval(function(){g.setAttributeNS(null,"transform","rotate("+(++rotation%steps*(360/steps))+")");},duration*1000/steps));};}}else{var s=$("<shape>").css("behavior","url(#default#VML)").appendTo("body");if(s.get(0).adj){var sheet=document.createStyleSheet();$.each(["group","shape","stroke"],function(){sheet.addRule(this,"behavior:url(#default#VML);");});render=function(target,d){var innerRadius=d.width*2+d.space;var r=(innerRadius+d.length+Math.ceil(d.width/2)+1);var s=r*2;var o=-Math.ceil(s/2);var el=$("<group>",{coordsize:s+" "+s,coordorigin:o+" "+o}).css({top:o,left:o,width:s,height:s});for(var i=0;i<d.segments;i++){el.append($("<shape>",{path:"m "+innerRadius+",0  l "+(innerRadius+d.length)+",0"}).css({width:s,height:s,rotation:(360/d.segments*i)+"deg"}).append($("<stroke>",{color:d.color,weight:d.width+"px",endcap:"round",opacity:$.fn.activity.getOpacity(d,i)})));}return $("<group>",{coordsize:s+" "+s}).css({width:s,height:s,overflow:"hidden"}).append(el);};animate=function(el,steps,duration){var rotation=0;var g=el.get(0);el.data("interval",setInterval(function(){g.style.rotation=++rotation%steps*(360/steps);},duration*1000/steps));};}$(s).remove();}})(jQuery);

data/lib/pmux-logview/static/js/pmux-logview-index.js

@@ -5,9 +5,8 @@ pmux_logview.index = {
     job_log_sort_order:                "desc",
     job_log_nitems:                    20,
     job_log_page:                      0,
-    job_log_jobs:                      {},
-    job_log_jobs_cookie:               0,
-    reload_job_log_type:               "archive",
+    job_log_realtime_jobs:             {},
+    job_log_search_jobs:               {},
     reload_job_log_initialized:        false,
     reload_dispatcher_log_initialized: false,
     job_log_ajax_requested:            false,
@@ -20,11 +19,16 @@ pmux_logview.index = {
     tab_active_index:                  0,
     selected_job_id:                   null,
     $main_tab:                         null,
-    $job_log_table:                    null,
+    $job_log_realtime_table:           null,
+    $job_log_search_table:             null,
+    $job_log_type:                     null,
     $dispatcher_log_table:             null,
+    $load_button:                      null,
     $more_button:                      null,
     $job_chart_tchart:                 null,
-    max_mapper_length:                 35
+    max_mapper_length:                 35,
+    $start_date_picker:                null,
+    $end_date_picker:                  null
 };
 
 pmux_logview.index.draw_job_chart = function() {
@@ -44,22 +48,42 @@ pmux_logview.index.draw_job_chart = function() {
        tasks : {}
     };
     var job_count = 0;
-    for (job_id in this.job_log_jobs) {
-        var from = Number(this.job_log_jobs[job_id].start_time_msec);
-        var to;
-        if ("end_time_msec" in this.job_log_jobs[job_id]) {
-            to = Number(this.job_log_jobs[job_id].end_time_msec);
-        } else {
-            continue;
+    if (this.$job_log_type.val() == "realtime") {
+        for (job_id in this.job_log_realtime_jobs) {
+            var from = Number(this.job_log_realtime_jobs[job_id].start_time_msec);
+            var to;
+            if ("end_time_msec" in this.job_log_realtime_jobs[job_id]) {
+                to = Number(this.job_log_realtime_jobs[job_id].end_time_msec);
+            } else {
+                continue;
+            }
+            source.tasks[job_id] = {
+                name: "id " + job_id,
+                from: from,
+                to: to,
+                clickEventArg: this.job_log_realtime_jobs[job_id],
+                nextTasks: null
+            }
+            job_count += 1;
         }
-        source.tasks[job_id] = {
-            name: "id " + job_id,
-            from: from,
-            to: to,
-            clickEventArg: this.job_log_jobs[job_id],
-            nextTasks: null
+    } else {
+        for (job_id in this.job_log_search_jobs) {
+            var from = Number(this.job_log_search_jobs[job_id].start_time_msec);
+            var to;
+            if ("end_time_msec" in this.job_log_search_jobs[job_id]) {
+                to = Number(this.job_log_search_jobs[job_id].end_time_msec);
+            } else {
+                continue;
+            }
+            source.tasks[job_id] = {
+                name: "id " + job_id,
+                from: from,
+                to: to,
+                clickEventArg: this.job_log_search_jobs[job_id],
+                nextTasks: null
+            }
+            job_count += 1;
         }
-        job_count += 1;
     }
     if (job_count != 0) {
         this.$job_chart_tchart.tchart('update', source);
@@ -78,47 +102,141 @@ pmux_logview.index.update_progress_bar = function() {
     });
 };
 
-pmux_logview.index.reload_job_log = function(force) {
+pmux_logview.index.reload_job_log = function(force, change_ui) {
     if (!this.parent.can_reload) {
         return;
     }
     if (!force && this.job_log_ajax_requested) {
         return;
     }
+    this.job_log_ajax_requested = true;
     var self = this;
-    var param = { sort_key: this.job_log_sort_key,
-                  sort_order: this.job_log_sort_order,
-                  type: this.reload_job_log_type,
+    var param = { sort_order: this.job_log_sort_order,
                   nitems: this.job_log_nitems,
-                  page: this.job_log_page,
-                  jobs_cookie: this.job_log_jobs_cookie };
+                  page: this.job_log_page }
     this.parent.ajax_base("log/job", "GET", param).done(function(data, textStatus, XMLHttpRequest) {
-        if (!("jobs_cookie" in data && "jobs" in data)) {
-             self.$job_log_table.fnClearTable();
-             self.$job_log_table.fnAddData(["invalid response", "", "", "", ""]);
-             self.parent.activityOff(function(){ self.$main_tab.tabs("option", "disabled", false) });
+        if (!("jobs" in data)) {
+             self.$job_log_realtime_table.fnClearTable();
+             self.$job_log_realtime_table.fnAddData(["invalid response", "", "", "", ""]);
+             self.job_log_ajax_requested = false;
+             if (change_ui) {
+                 self.parent.activityOff(function(){ self.$main_tab.tabs("option", "disabled", false) });
+                 self.$more_button.show();
+             }
              return;
         }
-        $.extend(true, self.job_log_jobs, data.jobs);
-        self.job_log_jobs_cookie = data.jobs_cookie;
-        self.$job_log_table.fnClearTable();
+        $.extend(true, self.job_log_realtime_jobs, data.jobs);
+        self.$job_log_realtime_table.fnClearTable();
         var sorted_jobs = [];
-        for (var job_id in self.job_log_jobs) {
-            if (self.$job_log_table.fnSettings().aaSorting.length == 0) {
-                var inserted = false; 
-                for (var i = 0; i < sorted_jobs.length; i++) {
-                    if (Number(self.job_log_jobs[job_id]["start_time_msec"]) > Number(sorted_jobs[i]["start_time_msec"])) {
-                        sorted_jobs.splice(i, 0, self.job_log_jobs[job_id]);
-                        inserted = true;
-                        break;
-                    }
-                }
-                if (!inserted) {
-                    sorted_jobs.push(self.job_log_jobs[job_id]);
-                }
+        for (var job_id in self.job_log_realtime_jobs) {
+            sorted_jobs.push(self.job_log_realtime_jobs[job_id]);
+	}
+        if (self.$job_log_realtime_table.fnSettings().aaSorting.length == 0) {
+            sorted_jobs.sort(function(a,b){
+                var aTime = Number(a.start_time_msec);
+                var bTime = Number(b.start_time_msec);
+                if ( aTime < bTime ) return 1;
+                if ( aTime > bTime ) return -1;
+                return 0;
+            });
+        }
+        var body_array = [];
+        for (i = 0; i < sorted_jobs.length; i++) {
+            var row_array = []
+            var job_id_html = '';
+            job_id_html += '<button class="detail-button container button-color button-normalize ui-corner-all" data-job-id="' + sorted_jobs[i]["job_id"] + '">';
+            if ("error_status" in sorted_jobs[i]) {
+                job_id_html += '    <span class="icon-space"><font color="red">' + sorted_jobs[i].job_id + '</font></span>';
             } else {
-                sorted_jobs.push(self.job_log_jobs[job_id]);
+                job_id_html += '    <span class="icon-space">' + sorted_jobs[i].job_id + '</span>';
             }
+            job_id_html += '    </span><span class="button-icon-adjust ui-icon ui-icon-info"></span>';
+            job_id_html += '</button>';
+            if ("error_status" in sorted_jobs[i]) {
+                job_id_html += '<button class="error-button error-info button-color button-normalize ui-corner-all" data-error-status="' + sorted_jobs[i].error_status  + '" data-error-message="' +  self.parent.html_escape(sorted_jobs[i].error_message) + '">';
+                job_id_html += '<div class="error-info ui-state-error"><span class="error-info ui-icon ui-icon-alert"></span></div>';
+                job_id_html += '</button>';
+            } 
+            row_array.push(job_id_html)
+            if (sorted_jobs[i].mapper && sorted_jobs[i].mapper.length > self.max_mapper_length) {
+                row_array.push('<span class="text-ellipsis">'+ self.parent.html_escape(sorted_jobs[i].mapper.substring(0, self.max_mapper_length)) + '...</span>');
+            } else {
+                row_array.push('<span class="text-ellipsis">'+ self.parent.html_escape(sorted_jobs[i].mapper) + '</span>');
+            }
+            row_array.push('<span class="cell-nowrap">' + sorted_jobs[i].start_time + '</span>');
+            if (sorted_jobs[i].end_time.match(/^\d+%$/)) {
+                var percent = sorted_jobs[i].end_time.replace("%","");
+                row_array.push('<span class="cell-nowrap"><div class="progress-bar" data-value="' + percent + '" ></div></span>');
+            } else {
+                row_array.push('<span class="cell-nowrap">' + sorted_jobs[i].end_time + '</span>');
+            }
+            row_array.push(sorted_jobs[i].elapsed_time);
+            body_array.push(row_array);
+        }
+        self.$job_log_realtime_table.fnAddData(body_array);
+        self.update_progress_bar();
+        self.valid_last_job_id = true; 
+        self.job_log_ajax_requested = false;
+        if (change_ui) {
+            self.parent.activityOff(function(){ self.$main_tab.tabs("option", "disabled", false) });
+            self.$more_button.show();
+        }
+    }).fail(function(XMLHttpRequest, textStatus, errorThrown) {
+        self.parent.open_dialog("job log の読み込みに失敗しました。");
+        self.job_log_ajax_requested = false;
+        if (change_ui) {
+            self.parent.activityOff(function(){ self.$main_tab.tabs("option", "disabled", false) });
+            self.$more_button.show();
+        }
+    });
+};
+
+pmux_logview.index.load_job_log = function(force, change_ui) {
+    if (!this.parent.can_reload) {
+        return;
+    }
+    if (!force && this.job_log_ajax_requested) {
+        return;
+    }
+    this.job_log_ajax_requested = true;
+    var self = this;
+    var param = { sort_order: this.job_log_sort_order,
+                  nitems: this.job_log_nitems,
+                  page: this.job_log_page }
+    var start_date = this.$start_date_picker.datepicker('getDate');
+    var end_date = this.$end_date_picker.datepicker('getDate');
+    if (start_date != null) {
+        param.start_time_msec = start_date.getTime();
+    }
+    if (end_date != null) {
+        param.end_time_msec = end_date.getTime();
+    }
+    this.parent.ajax_base("log/job", "GET", param).done(function(data, textStatus, XMLHttpRequest) {
+        if (!("jobs" in data)) {
+             self.$job_log_search_table.fnClearTable();
+             self.$job_log_search_table.fnAddData(["invalid response", "", "", "", ""]);
+             self.job_log_ajax_requested = false;
+             if (change_ui) {
+                 self.parent.activityOff(function(){ self.$main_tab.tabs("option", "disabled", false) });
+                 self.$load_button.show();
+             }
+             return;
+        }
+        self.job_log_search_jobs = {};
+        $.extend(true, self.job_log_search_jobs, data.jobs);
+        self.$job_log_search_table.fnClearTable();
+        var sorted_jobs = [];
+        for (var job_id in self.job_log_search_jobs) {
+            sorted_jobs.push(self.job_log_search_jobs[job_id]);
+	}
+        if (self.$job_log_search_table.fnSettings().aaSorting.length == 0) {
+            sorted_jobs.sort(function(a,b){
+                var aTime = Number(a.start_time_msec);
+                var bTime = Number(b.start_time_msec);
+                if ( aTime < bTime ) return 1;
+                if ( aTime > bTime ) return -1;
+                return 0;
+            });
         }
         var body_array = [];
         for (i = 0; i < sorted_jobs.length; i++) {
@@ -153,18 +271,22 @@ pmux_logview.index.reload_job_log = function(force) {
             row_array.push(sorted_jobs[i].elapsed_time);
             body_array.push(row_array);
         }
-        self.$job_log_table.fnAddData(body_array);
+        self.$job_log_search_table.fnAddData(body_array);
         self.update_progress_bar();
-        self.parent.activityOff(function(){ self.$main_tab.tabs("option", "disabled", false) });
         self.valid_last_job_id = true; 
-        self.reload_job_log_type = "update";
         self.job_log_ajax_requested = false;
+        if (change_ui) {
+            self.parent.activityOff(function(){ self.$main_tab.tabs("option", "disabled", false) });
+            self.$load_button.show();
+        }
     }).fail(function(XMLHttpRequest, textStatus, errorThrown) {
         self.parent.open_dialog("job log の読み込みに失敗しました。");
-        self.parent.activityOff(function(){ self.$main_tab.tabs("option", "disabled", false) });
         self.job_log_ajax_requested = false;
+        if (change_ui) {
+            self.parent.activityOff(function(){ self.$main_tab.tabs("option", "disabled", false) });
+            self.$load_button.show();
+        }
     });
-    self.job_log_ajax_requested = true;
 };
 
 pmux_logview.index.reload_dispatcher_log = function() {
@@ -197,13 +319,12 @@ pmux_logview.index.reload = function() {
     if (this.need_reload_job_log) {
         if (this.reload_job_log_timer_id == null) {
             this.reload_job_log_timer_id = setInterval(function(){
-                self.reload_job_log(false); 
+                self.reload_job_log(false, false); 
             }, 3000);
         }
         if (!this.reload_job_log_initialized) {
             this.parent.activityOn(function(){ self.$main_tab.tabs("option", "disabled", true) });
-            this.reload_job_log_type = "archive";
-            this.reload_job_log(true);
+            this.reload_job_log(true, true);
             this.reload_job_log_initialized = true;
         } 
     } else {
@@ -251,16 +372,62 @@ pmux_logview.index.initialize = function() {
                              if (self.tab_active_index == 0) { 
                                   self.need_reload_job_log = true;
                                   self.need_reload_dispatcher_log = false;
-                             } else if (self.tab_active_index == 1) {
+                             }else if (self.tab_active_index == 1) { 
                                   self.need_reload_job_log = false;
-                                  self.need_reload_dispatcher_log = true;
+                                  self.need_reload_dispatcher_log = false;
                              } else if (self.tab_active_index == 2) {
+                                  self.need_reload_job_log = false;
+                                  self.need_reload_dispatcher_log = true;
+                             } else if (self.tab_active_index == 3) {
+                                  self.need_reload_job_log = false;
+                                  self.need_reload_dispatcher_log = false;
                                   self.draw_job_chart();
                              }
                              self.reload();
                          }
                      });
-    this.$job_log_table = $("#job-log-table").dataTable({
+    this.$job_log_realtime_table = $("#job-log-realtime-table").dataTable({
+                              aaSorting: [],
+                              bPaginate: false,
+                              bScrollCollapse: true,
+                              bSort: true,
+                              bFilter: true,
+                              bJQueryUI: true,
+                              bAutoWidth: true,
+                              sPaginationType: "full_numbers",
+                              fnRowCallback: function(nRow) {
+                                  if (nRow.cells[0]) nRow.cells[0].noWrap = true;
+                                  if (nRow.cells[1]) nRow.cells[1].noWrap = true;
+                                  return nRow
+                              },
+                              fnDrawCallback: function() { 
+                                  self.update_progress_bar();
+                                  var $this = (this)
+                                  if ($this.fnSettings().aaSorting.length  != 0) {
+                                      var sort_key = self.job_log_sort_keys[$this.fnSettings().aaSorting[0][0]];
+                                      var sort_order = $this.fnSettings().aaSorting[0][1];
+                                      if (self.job_log_sort_key != sort_key || self.job_log_sort_order != sort_order) {
+                                          self.job_log_sort_key = sort_key;
+                                          self.job_log_sort_order = sort_order;
+                                      }
+                                  }
+                                  self.$error_button = $(".error-button").click(function(event) {
+                                                           var html = '<table class="border task-tooltip"><thead class="task-tooltip"></thead>';
+                                                           html += '<tbody class="task-tooltip"><tr class="task-tooltip">';
+                                                           html += '<td class="task-tooltip">status:</td>';
+                                                           html += '<td class="task-tooltip">' + $(event.currentTarget).attr("data-error-status") +'</td>';
+                                                           html += '</tr><tr class="task-tooltip">';
+                                                           html += '<td class="task-tooltip">message:</td>';
+                                                           html += '<td class="task-tooltip">' + $(event.currentTarget).attr("data-error-message") +'</td>';
+                                                           html += '</tr></tbody></table>';
+                                                           self.parent.open_tooltip(html, event.target, event);
+                                                       });
+                                  self.$detail_button = $(".detail-button").click(function(event) {
+                                                           self.open_detail($(event.currentTarget).attr("data-job-id"));
+                                                       });
+                              } 
+                         });
+    this.$job_log_search_table = $("#job-log-search-table").dataTable({
                               aaSorting: [],
                               bPaginate: false,
                               bScrollCollapse: true,
@@ -283,9 +450,6 @@ pmux_logview.index.initialize = function() {
                                       if (self.job_log_sort_key != sort_key || self.job_log_sort_order != sort_order) {
                                           self.job_log_sort_key = sort_key;
                                           self.job_log_sort_order = sort_order;
-                                          self.job_log_page = 0;
-                                          self.reload_job_log_type = "archive";
-                                          self.reload_job_log(true);
                                       }
                                   }
                                   self.$error_button = $(".error-button").click(function(event) {
@@ -315,9 +479,9 @@ pmux_logview.index.initialize = function() {
                                  });
     this.$more_button = $("#more-button").click(function() {
                             self.job_log_page += 1;
-                            self.reload_job_log_type = "archive";
+                            self.$more_button.hide();
                             self.parent.activityOn(function(){ self.$main_tab.tabs("option", "disabled", true) });
-                            self.reload_job_log(true);
+                            self.reload_job_log(true, true);
                         });
     this.$job_chart_tchart = $("#job-chart-tchart").tchart({
                                  onTaskClick: function(task, target, event) {
@@ -338,11 +502,25 @@ pmux_logview.index.initialize = function() {
                                      self.parent.open_tooltip(html, target, event);
                                  }
                              });
+    this.$start_date_picker = $("#start-date-picker").datetimepicker({ dateFormat: "yy-mm-dd",
+                                                                       timeFormat: 'HH:mm:ss',
+                                                                       showMonthAfterYear: true });
+    this.$end_date_picker = $("#end-date-picker").datetimepicker({ dateFormat: 'yy-mm-dd',
+                                                                   timeFormat: 'HH:mm:ss',
+                                                                   showMonthAfterYear: true});
     $(window).resize(function() {
         if (self.draw_invoke_timer_id == null) {
             self.draw_invoke_timer_id = setInterval(function() { self.draw_invoke() }, 1000);
         }
     });
+    this.$load_button = $("#load-button").click(function() {
+                            self.$load_button.hide();
+                            self.parent.activityOn(function(){ self.$main_tab.tabs("option", "disabled", true) });
+                            self.load_job_log(true, true);
+                        });
+    this.$job_log_type = $("#job-log-type").change(function() {
+                            self.draw_job_chart();
+                         });
     this.reload();
 };
 

data/lib/pmux-logview/static/js/tchart.js

@@ -151,8 +151,8 @@
         commonData.tasks = [];
         commonData.containers = [ {cls: "scrollButtonsContainer"},
                                   {cls: "optionsContainer" } ];
-        commonData.datePickerContainersData = [ {cls: "datePickerContainer startDatePickerContainer", label: "start :"},
-                                                {cls: "datePickerContainer endDatePickerContainer", label: "end :"} ]
+        commonData.datePickerContainersData = [ {cls: "datePickerContainer startDatePickerContainer", label: "start date :"},
+                                                {cls: "datePickerContainer endDatePickerContainer", label: "end date :"} ]
         commonData.datePickersData = [ {span: "span.startDatePickerContainer", data: [{ cls: "startDatePicker" }] },
                                        {span: "span.endDatePickerContainer", data: [{ cls: "endDatePicker" }] } ]
         if (source.actors != null) {

data/lib/pmux-logview/version.rb

@@ -1,5 +1,5 @@
 module Pmux
   module LogView
-    VERSION = "0.3.4"
+    VERSION = "0.3.10"
   end
 end

data/lib/pmux-logview/views/index.erb

@@ -9,11 +9,13 @@
         <script type="text/javascript" src="js/jquery.dataTables.min.js"></script>
         <script type="text/javascript" src="js/d3.v3.min.js"></script>
         <script type="text/javascript" src="js/jquery.activity-indicator-1.0.0.min.js"></script>
+        <script type="text/javascript" src="js/jquery-ui-timepicker-addon.js"></script>
         <script type="text/javascript" src="js/tchart.js"></script>
         <script type="text/javascript" src="js/pmux-logview-base.js"></script>
         <script type="text/javascript" src="js/pmux-logview-index.js"></script>
         <link rel="stylesheet" type="text/css" href="css/jquery-ui-1.10.0.css" />
         <link rel="stylesheet" type="text/css" href="css/jquery.dataTables.css" />
+        <link rel="stylesheet" type="text/css" href="css/jquery-ui-timepicker-addon.css" />
         <link rel="stylesheet" type="text/css" href="css/tchart.css" />
         <link rel="stylesheet" type="text/css" href="css/pmux-logview.css" />
     </head>
@@ -42,12 +44,13 @@
         <div class="tabs-container">
             <div id="main-tabs">
                 <ul>
-                    <li><a href="#job-log">job log</a></li>
+                    <li><a href="#job-log-realtime">job log (realtime)</a></li>
+                    <li><a href="#job-log-search">job log (search)</a></li>
                     <li><a href="#dispatcher-log">dispatcher log</a></li>
                     <li><a href="#job-chart">job chart</a></li>
                </ul>
-               <div id="job-log">
-                   <table id="job-log-table" class="border">
+               <div id="job-log-realtime">
+                   <table id="job-log-realtime-table" class="border">
                        <thead>
                             <tr>
                                 <th>id</th>
@@ -57,7 +60,7 @@
                                 <th>elapsed time</th>
                             </tr>
                        </thead>
-                       <tbody id="job-log-table-body">
+                       <tbody id="job-log-realtime-table-body">
                        </tbody>
                    </table>
                    <div>
@@ -66,6 +69,37 @@
                        </button>
                    </div>
                </div>
+               <div id="job-log-search">
+                   <div id="date-picker">
+                       <table class="y-space">
+                           <thead>
+                           </thead>
+                           <tbody>
+                               <tr>
+                                   <td class="x-space">end timeの日時で絞り込み</td>
+                                   <td class="x-space">検索開始日:</td>
+                                   <td class="x-space"><input type="text" id="start-date-picker"></input></td>
+                                   <td class="x-space">検索終了日:</td>
+                                   <td class="x-space"><input type="text" id="end-date-picker"></input></td>
+                                   <td class="x-space"><button id="load-button" class="button-color button-normalize ui-corner-all">ロード</button></td>
+                               </tr>
+                           </tbody>
+                       </table>
+                   </div>
+                   <table id="job-log-search-table" class="border">
+                       <thead>
+                            <tr>
+                                <th>id</th>
+                                <th>mapper</th>
+                                <th>start time</th>
+                                <th>end time</th>
+                                <th>elapsed time</th>
+                            </tr>
+                       </thead>
+                       <tbody id="job-log-search-table-body">
+                       </tbody>
+                   </table>
+               </div>
                <div id="dispatcher-log">
                    <table id="dispatcher-log-table" class="border">
                        <thead>
@@ -78,6 +112,12 @@
                    </table>
                </div>
                <div id="job-chart">
+                 <div class="y-space">
+                     <select id="job-log-type">
+                         <option value="realtime" selected>realtime</option>
+                         <option value="search">search</option>
+                     </select>
+                 </div>
                  <div class="job-chart-container background-gradient">
                    <div id="job-chart-tchart">
                    </div>