From 004d3e58aab20889cb31cf164abf83c66311bdc7 Mon Sep 17 00:00:00 2001 From: Jason Park Date: Fri, 20 May 2016 10:40:37 -0500 Subject: [PATCH] fix some bugs --- css/stylesheet.css | 5 ++ js/module/array2d.js | 109 +++++++++++++++++++++++++------------------ js/module/graph.js | 4 +- js/script.js | 16 ++++++- js/tracer.js | 12 +++++ 5 files changed, 97 insertions(+), 49 deletions(-) diff --git a/css/stylesheet.css b/css/stylesheet.css index 43a4a19..3db9253 100644 --- a/css/stylesheet.css +++ b/css/stylesheet.css @@ -234,6 +234,11 @@ pre { background: rgba(120, 0, 0, .8); } +.mtbl-wrapper { + width: 100%; + height: 100%; +} + .mtbl-table { display: inline-table; color: white; diff --git a/js/module/array2d.js b/js/module/array2d.js index 36442ef..80c6b92 100644 --- a/js/module/array2d.js +++ b/js/module/array2d.js @@ -3,7 +3,6 @@ var $table = null; function Array2DTracer(module) { if (Tracer.call(this, module || Array2DTracer)) { initTable(); - initNavigator(this); return true; } return false; @@ -44,12 +43,20 @@ Array2DTracer.prototype.createRandomData = function (N, M, min, max) { // Override Array2DTracer.prototype.setData = function (D) { this.D = D; - if (Tracer.prototype.setData.call(this, arguments)) return true; - this.viewX = this.viewY = 0; this.paddingH = 6; this.paddingV = 3; this.fontSize = 16; + + if (Tracer.prototype.setData.call(this, arguments)) { + $('.mtbl-row').each(function (i) { + $(this).children().each(function (j) { + $(this).text(D[i][j]); + }); + }); + return true; + } + $table.empty(); for (var i = 0; i < D.length; i++) { var $row = $('
'); @@ -167,8 +174,8 @@ Array2DTracer.prototype.processStep = function (step, options) { Array2DTracer.prototype.getCellCss = function () { return { - padding: this.paddingV + 'px ' + this.paddingH + 'px', - 'font-size': this.fontSize + padding: this.paddingV.toFixed(1) + 'px ' + this.paddingH.toFixed(1) + 'px', + 'font-size': this.fontSize.toFixed(1) + 'px' }; }; @@ -198,48 +205,58 @@ Array2DTracer.prototype.prevStep = function () { this.step(finalIndex); }; -var initTable = function () { - $('.module_container').empty(); - $table = $('
'); - $('.module_container').append($table); +// Override +Array2DTracer.prototype.mousedown = function (e) { + Tracer.prototype.mousedown.call(this, e); + + this.dragX = e.pageX; + this.dragY = e.pageY; + this.dragging = true; }; -var initNavigator = function (tracer) { - var x, y, dragging = false; - var $parent = $table.parent(); - $parent.mousedown(function (e) { - x = e.pageX; - y = e.pageY; - dragging = true; - }); - $parent.mousemove(function (e) { - if (dragging) { - tracer.viewX += e.pageX - x; - tracer.viewY += e.pageY - y; - x = e.pageX; - y = e.pageY; - tracer.refresh(); - } - }); - $(document).mouseup(function (e) { - dragging = false; - }); - - $parent.bind('DOMMouseScroll mousewheel', function (e, delta) { - e = e.originalEvent; - var delta = (e.wheelDelta !== undefined && e.wheelDelta) || - (e.detail !== undefined && -e.detail); - var weight = 1.01; - var ratio = delta > 0 ? 1 / weight : weight; - if (tracer.fontSize < 8 && ratio < 1) return false; - if (tracer.fontSize > 36 && ratio > 1) return false; - tracer.paddingV *= ratio; - tracer.paddingH *= ratio; - tracer.fontSize *= ratio; - $('.mtbl-cell').css(tracer.getCellCss()); - tracer.refresh(); - e.preventDefault(); - }); +// Override +Array2DTracer.prototype.mousemove = function (e) { + Tracer.prototype.mousemove.call(this, e); + + if (this.dragging) { + this.viewX += e.pageX - this.dragX; + this.viewY += e.pageY - this.dragY; + this.dragX = e.pageX; + this.dragY = e.pageY; + this.refresh(); + } +}; + +// Override +Array2DTracer.prototype.mouseup = function (e) { + Tracer.prototype.mouseup.call(this, e); + + this.dragging = false; +}; + +// Override +Array2DTracer.prototype.mousewheel = function (e) { + Tracer.prototype.mousewheel.call(this, e); + + e.preventDefault(); + e = e.originalEvent; + var delta = (e.wheelDelta !== undefined && e.wheelDelta) || + (e.detail !== undefined && -e.detail); + var weight = 1.01; + var ratio = delta > 0 ? 1 / weight : weight; + if (this.fontSize < 4 && ratio < 1) return; + if (this.fontSize > 40 && ratio > 1) return; + this.paddingV *= ratio; + this.paddingH *= ratio; + this.fontSize *= ratio; + $('.mtbl-cell').css(this.getCellCss()); + this.refresh(); +}; + +var initTable = function () { + $module_container.empty(); + $table = $('
'); + $module_container.append($table); }; var paintColor = function (sx, sy, ex, ey, colorClass, addClass) { @@ -254,7 +271,7 @@ var paintColor = function (sx, sy, ex, ey, colorClass, addClass) { }; var clearTableColor = function () { - $table.find('.mtbl-cell').css('background', ''); + $table.find('.mtbl-cell').removeClass(Object.keys(tableColorClass).join(' ')); }; var tableColorClass = { diff --git a/js/module/graph.js b/js/module/graph.js index 3ca666a..d006776 100644 --- a/js/module/graph.js +++ b/js/module/graph.js @@ -182,7 +182,7 @@ GraphTracer.prototype.prevStep = function () { }; var initGraph = function () { - $('.module_container').empty(); + $module_container.empty(); if (sigmaCanvas == null) { sigmaCanvas = $.extend(true, {}, sigma.canvas); } else { @@ -190,7 +190,7 @@ var initGraph = function () { } s = new sigma({ renderer: { - container: $('.module_container')[0], + container: $module_container[0], type: 'canvas' }, settings: { diff --git a/js/script.js b/js/script.js index 936d7a1..be10e75 100644 --- a/js/script.js +++ b/js/script.js @@ -1,5 +1,6 @@ $.ajaxSetup({cache: false, dataType: "text"}); +var $module_container = $('.module_container'); var _tracer = new Tracer(); var initEditor = function (id) { var editor = ace.edit(id); @@ -257,4 +258,17 @@ for (var i = 0; i < dividers.length; i++) { $second.append($divider); })(divider); -} \ No newline at end of file +} + +$module_container.mousedown(function (e) { + _tracer.mousedown(e); +}); +$module_container.mousemove(function (e) { + _tracer.mousemove(e); +}); +$(document).mouseup(function (e) { + _tracer.mouseup(e); +}); +$module_container.bind('DOMMouseScroll mousewheel', function (e) { + _tracer.mousewheel(e); +}); \ No newline at end of file diff --git a/js/tracer.js b/js/tracer.js index 9f14e81..32e23c0 100644 --- a/js/tracer.js +++ b/js/tracer.js @@ -141,6 +141,18 @@ Tracer.prototype.nextStep = function () { this.step(this.traceIndex + 1); }; +Tracer.prototype.mousedown = function (e) { +}; + +Tracer.prototype.mousemove = function (e) { +}; + +Tracer.prototype.mouseup = function (e) { +}; + +Tracer.prototype.mousewheel = function (e) { +}; + var printTrace = function (message) { $('#tab_trace .wrapper').append($('').append(message + '
')); }; -- GitLab