--- a/client/js/paper-renderer.js Fri Feb 14 12:42:09 2014 +0100
+++ b/client/js/paper-renderer.js Mon Feb 17 17:20:30 2014 +0100
@@ -17,6 +17,7 @@
_MIN_DRAG_DISTANCE = 2,
/* Distance between the inner and outer radius of buttons that appear when hovering on a node */
_NODE_BUTTON_WIDTH = 40,
+
_EDGE_BUTTON_INNER = 2,
_EDGE_BUTTON_OUTER = 40,
/* Constants used to know if a specific action is to be performed when clicking on the canvas */
@@ -27,6 +28,7 @@
_NODE_SIZE_STEP = Math.LN2/4,
_MIN_SCALE = 1/20,
_MAX_SCALE = 20,
+ _SCALE_STEPS = 16,
_MOUSEMOVE_RATE = 80,
_DOUBLETAP_DELAY = 800,
/* Maximum distance in pixels (squared, to reduce calculations)
@@ -1792,6 +1794,50 @@
bindClick(".Rk-ZoomOut", "zoomOut");
bindClick(".Rk-ZoomIn", "zoomIn");
bindClick(".Rk-ZoomFit", "autoScale");
+ this.$.find(".Rk-ZoomSet").click( function() { _this.$.find(".Rk-ZoomSetContainer").toggle(); } );
+ this.$.find(".Rk-ZoomSlider").slider({
+ orientation: "vertical",
+ value:8,
+ min: 1,
+ max: 16,
+ step: 1,
+ slide: function( event, ui ) {
+ _this.$.find(".Rk-ZoomSetValue").val( ui.value );
+ },
+ change: function( event, ui ) {
+ _this.$.find(".Rk-ZoomSetValue").val( ui.value );
+ },
+ stop: function( event, ui ) {
+ _this.$.find(".Rk-ZoomSetValue").val( ui.value );
+ // Get value
+ var current_zoom = parseInt(_this.$.find(".Rk-ZoomSetValue").val()),
+ nb_step = 0,
+ mid_step = (_SCALE_STEPS/2),
+ scale_factor = 1;
+ if(current_zoom < mid_step){
+ nb_step = mid_step - current_zoom;
+ scale_factor = Math.SQRT1_2;
+ }
+ else if(current_zoom > mid_step){
+ nb_step = current_zoom - mid_step;
+ scale_factor = Math.SQRT2;
+ }
+ var _newScale = _this.initialScale;
+ for(var i=0;i<nb_step;i++){
+ _newScale = _newScale * scale_factor;
+ }
+ var _offset = new paper.Point([
+ _this.canvas_$.width(),
+ _this.canvas_$.height()
+ ]).multiply( .5 * ( 1 - _newScale ) ).add(_this.offset.multiply( _newScale ));
+ _this.setScale( _newScale, _offset );
+ }
+ });
+ this.$.find(".Rk-ZoomSetButton").click( function() {
+ console.log("SAVE ZOOM FOR REAL", _this, _this.scale);
+ _this.renkan.project.set("zoom_level", _this.scale); // Save scale
+ //_this.$.find(".Rk-ZoomSetContainer").toggle();
+ });
this.$.find(".Rk-CurrentUser").mouseenter(
function() { _this.$.find(".Rk-UserList").slideDown(); }
);
@@ -2001,10 +2047,13 @@
+ '<div class="Rk-Editing-Space<% if (!options.show_top_bar) { %> Rk-Editing-Space-Full<% } %>">'
+ '<div class="Rk-Labels"></div><canvas class="Rk-Canvas" resize></canvas><div class="Rk-Notifications"></div><div class="Rk-Editor">'
+ '<% if (options.show_bins) { %><div class="Rk-Fold-Bins">«</div><% } %>'
- + '<div class="Rk-ZoomButtons"><div class="Rk-ZoomIn" title="<%-translate("Zoom In")%>"></div><div class="Rk-ZoomFit" title="<%-translate("Zoom Fit")%>"></div><div class="Rk-ZoomOut" title="<%-translate("Zoom Out")%>"></div></div>'
+ + '<div class="Rk-ZoomButtons"><div class="Rk-ZoomIn" title="<%-translate("Zoom In")%>"></div><div class="Rk-ZoomFit" title="<%-translate("Zoom Fit")%>"></div><div class="Rk-ZoomOut" title="<%-translate("Zoom Out")%>"></div>'
+ + '<div class="Rk-ZoomSet" title="<%-translate("Zoom Set")%>"></div><div class="Rk-ZoomSetContainer"><div class="Rk-ZoomSlider"></div>'
+ + '<p><input type="text" class="Rk-ZoomSetValue" value="8" /><span class="Rk-ZoomSetButton ui-icon ui-icon-disk large" title="<%-translate("Save")%>"></span></p></div>'
+ '</div></div>'
),
fixSize: function(_autoscale) {
+ console.log("fixSize", _autoscale, this.renkan.project.get("zoom_level"));
var w = this.$.width(),
h = this.$.height();
if (this.renkan.options.show_top_bar) {
@@ -2018,7 +2067,8 @@
paper.view.viewSize = new paper.Size([w, h]);
if (_autoscale) {
- this.autoScale();
+ // If _autoscale, we get the initial zoom level set in the project datas.
+ this.autoScale(this.renkan.project.get("zoom_level"));
}
},
drawSector: function(_repr, _inR, _outR, _startAngle, _endAngle, _padding, _imgname, _caption) {
@@ -2177,7 +2227,8 @@
this.redraw();
}
},
-autoScale: function() {
+autoScale: function(force_scale) {
+ console.log("autoScale", force_scale);
var nodes = this.renkan.project.get("nodes");
if (nodes.length > 1) {
var _xx = nodes.map(function(_node) { return _node.get("position").x; }),
@@ -2188,11 +2239,16 @@
_maxy = Math.max.apply(Math, _yy);
var _scale = Math.min( (paper.view.size.width - 2 * this.renkan.options.autoscale_padding) / (_maxx - _minx), (paper.view.size.height - 2 * this.renkan.options.autoscale_padding) / (_maxy - _miny));
this.initialScale = _scale;
+ // Override calculated scale if asked
+ if((typeof force_scale !== "undefined") && parseFloat(force_scale)>0){
+ _scale = parseFloat(force_scale);
+ }
this.setScale(_scale, paper.view.center.subtract(new paper.Point([(_maxx + _minx) / 2, (_maxy + _miny) / 2]).multiply(_scale)));
}
if (nodes.length === 1) {
this.setScale(1, paper.view.center.subtract(new paper.Point([nodes.at(0).get("position").x, nodes.at(0).get("position").y])));
}
+ this.$.find(".Rk-ZoomSlider").slider('value', (_SCALE_STEPS/2));
},
redrawMiniframe: function() {
var topleft = this.toMinimapCoords(this.toModelCoords(new paper.Point([0,0]))),
@@ -2669,6 +2725,7 @@
this.canvas_$.width(),
this.canvas_$.height()
]).multiply( .5 * ( 1 - Math.SQRT1_2 ) ).add(this.offset.multiply( Math.SQRT1_2 ));
+ this.$.find(".Rk-ZoomSlider").slider('value', this.$.find(".Rk-ZoomSlider").slider("option", "value") - 1);
this.setScale( _newScale, _offset );
},
zoomIn: function() {
@@ -2677,6 +2734,7 @@
this.canvas_$.width(),
this.canvas_$.height()
]).multiply( .5 * ( 1 - Math.SQRT2 ) ).add(this.offset.multiply( Math.SQRT2 ));
+ this.$.find(".Rk-ZoomSlider").slider('value', this.$.find(".Rk-ZoomSlider").slider("option", "value") + 1);
this.setScale( _newScale, _offset );
},
addNodeBtn: function() {