--- a/client/data/example-cinema-src.json Wed Sep 09 13:10:01 2015 +0200
+++ b/client/data/example-cinema-src.json Wed Sep 09 15:05:30 2015 +0200
@@ -630,6 +630,13 @@
{
"_id": "view-2014-02-18-628af15b-12ad-457a-8ac0-a28c8998cc3b-0001",
"zoom_level": 0.8275032552816195,
+ "offset_x": 532.0104075533723,
+ "offset_y": 102.8917139487223,
+ "hidden_nodes":["node-2013-04-06-e1c743b12401d6ec-0002","node-2013-04-06-e1c743b12401d6ec-0006"]
+ },
+ {
+ "_id": "view-2014-02-18-628af15b-12ad-457a-8ac0-a28c8998cc3b-0002",
+ "zoom_level": 0.8275032552816195,
"offset_x": 832.0104075533723,
"offset_y": 402.8917139487223
}
--- a/client/js/defaults.js Wed Sep 09 13:10:01 2015 +0200
+++ b/client/js/defaults.js Wed Sep 09 15:05:30 2015 +0200
@@ -50,6 +50,10 @@
default_view: false,
/* Allows to load default view (zoom+offset) at start on read_only mode, instead of autoScale. the default_view will be the last */
+ /* URL parsing */
+ update_url:true,
+ /* update the url each time the paper shift or on zoom in/out, with the serialized view (offset and scale) */
+
/* TOP BAR BUTTONS */
show_search_field: true,
--- a/client/js/main-renderer.js Wed Sep 09 13:10:01 2015 +0200
+++ b/client/js/main-renderer.js Wed Sep 09 15:05:30 2015 +0200
@@ -39,8 +39,9 @@
'renderer/edgeremovebutton',
'renderer/edgerevertbutton',
'renderer/miniframe',
- 'renderer/scene'
- ], function(BaseRepresentation, BaseButton, NodeRepr, Edge, TempEdge, BaseEditor, NodeEditor, EdgeEditor, NodeButton, NodeEditButton, NodeRemoveButton, NodeHideButton, NodeShowButton, NodeRevertButton, NodeLinkButton, NodeEnlargeButton, NodeShrinkButton, EdgeEditButton, EdgeRemoveButton, EdgeRevertButton, MiniFrame, Scene){
+ 'renderer/scene',
+ 'renderer/viewrepr'
+ ], function(BaseRepresentation, BaseButton, NodeRepr, Edge, TempEdge, BaseEditor, NodeEditor, EdgeEditor, NodeButton, NodeEditButton, NodeRemoveButton, NodeHideButton, NodeShowButton, NodeRevertButton, NodeLinkButton, NodeEnlargeButton, NodeShrinkButton, EdgeEditButton, EdgeRemoveButton, EdgeRevertButton, MiniFrame, Scene, ViewRepr){
'use strict';
@@ -55,6 +56,7 @@
Renderer._BaseButton = BaseButton;
Renderer.Node = NodeRepr;
Renderer.Edge = Edge;
+ Renderer.View = ViewRepr;
Renderer.TempEdge = TempEdge;
Renderer._BaseEditor = BaseEditor;
Renderer.NodeEditor = NodeEditor;
--- a/client/js/renderer/basebutton.js Wed Sep 09 13:10:01 2015 +0200
+++ b/client/js/renderer/basebutton.js Wed Sep 09 15:05:30 2015 +0200
@@ -18,7 +18,9 @@
this.sector.show();
},
hide: function() {
- this.sector.hide();
+ if (this.sector){
+ this.sector.hide();
+ }
},
select: function() {
this.sector.select();
--- a/client/js/renderer/nodehidebutton.js Wed Sep 09 13:10:01 2015 +0200
+++ b/client/js/renderer/nodehidebutton.js Wed Sep 09 15:05:30 2015 +0200
@@ -23,7 +23,7 @@
this.renderer.is_dragging = false;
this.renderer.removeRepresentationsOfType("editor");
if (this.renderer.isEditable()) {
- this.renderer.addHiddenNode(this.source_representation.model);
+ this.renderer.view.addHiddenNode(this.source_representation.model);
}
}
}).value();
--- a/client/js/renderer/noderepr.js Wed Sep 09 13:10:01 2015 +0200
+++ b/client/js/renderer/noderepr.js Wed Sep 09 15:05:30 2015 +0200
@@ -96,7 +96,7 @@
if (!this.is_dragging || !this.paper_coords) {
this.paper_coords = this.renderer.toPaperCoords(_model_coords);
}
- this.circle_radius = _baseRadius * this.renderer.scale;
+ this.circle_radius = _baseRadius * this.renderer.view.scale;
if (this.last_circle_radius !== this.circle_radius) {
this.all_buttons.forEach(function(b) {
b.setSectorSize();
@@ -347,7 +347,7 @@
this.redraw();
}
} else {
- this.renderer.paperShift(_delta);
+ this.renderer.view.paperShift(_delta);
}
},
openEditor: function() {
@@ -455,6 +455,7 @@
this.title.css('opacity', this.options.ghost_opacity);
this.minimap_circle.opacity = this.options.ghost_opacity;
} else {
+ this.minimap_circle.opacity = 1;
this.hidden = false;
this.redraw();
}
@@ -502,9 +503,9 @@
if (repr && repr.hidden) {
repr.show(ghost);
if (!ghost){
- var indexNode = _this.renderer.hiddenNodes.indexOf(repr.model.id);
+ var indexNode = _this.renderer.view.hiddenNodes.indexOf(repr.model.id);
if (indexNode !== -1){
- _this.renderer.hiddenNodes.splice(indexNode, 1);
+ _this.renderer.view.hiddenNodes.splice(indexNode, 1);
}
}
}
@@ -551,9 +552,9 @@
this.saveCoords();
} else {
if (this.hidden) {
- var index = this.renderer.hiddenNodes.indexOf(this.model.id);
+ var index = this.renderer.view.hiddenNodes.indexOf(this.model.id);
if (index !== -1){
- this.renderer.hiddenNodes.splice(index, 1);
+ this.renderer.view.hiddenNodes.splice(index, 1);
}
this.show(false);
this.select();
--- a/client/js/renderer/scene.js Wed Sep 09 13:10:01 2015 +0200
+++ b/client/js/renderer/scene.js Wed Sep 09 15:05:30 2015 +0200
@@ -21,11 +21,7 @@
}
this.notif_$ = this.$.find(".Rk-Notifications");
paper.setup(this.canvas_$[0]);
- this.scale = 1;
- this.initialScale = 1;
- this.offset = paper.view.center;
this.totalScroll = 0;
- this.hiddenNodes = [];
this.mouse_down = false;
this.click_target = null;
this.selected_target = null;
@@ -128,7 +124,7 @@
_lastTap = new Date();
_lastTapX = _touches.pageX;
_lastTapY = _touches.pageY;
- _originalScale = _this.scale;
+ _originalScale = _this.view.scale;
_zooming = false;
_this.onMouseDown(_touches, true);
}
@@ -149,12 +145,12 @@
return;
}
var _newScale = _event.originalEvent.scale * _originalScale,
- _scaleRatio = _newScale / _this.scale,
+ _scaleRatio = _newScale / _this.view.scale,
_newOffset = new paper.Point([
_this.canvas_$.width(),
_this.canvas_$.height()
- ]).multiply( 0.5 * ( 1 - _scaleRatio ) ).add(_this.offset.multiply( _scaleRatio ));
- _this.setScale(_newScale, _newOffset);
+ ]).multiply( 0.5 * ( 1 - _scaleRatio ) ).add(_this.view.offset.multiply( _scaleRatio ));
+ _this.view.setScale(_newScale, _newOffset);
}
},
touchend: function(_event) {
@@ -234,34 +230,6 @@
});
};
- bindClick(".Rk-ZoomOut", "zoomOut");
- bindClick(".Rk-ZoomIn", "zoomIn");
- bindClick(".Rk-ZoomFit", "autoScale");
- this.$.find(".Rk-ZoomSave").click( function() {
- // Save scale and offset point
- _this.renkan.project.addView( { zoom_level:_this.scale, offset:_this.offset, hidden_nodes: _this.hiddenNodes } );
- });
- this.$.find(".Rk-ZoomSetSaved").click( function() {
- var view = _this.renkan.project.get("views").last();
- if(view){
- _this.showNodes(false);
- _this.setScale(view.get("zoom_level"), new paper.Point(view.get("offset")));
- if (_this.renkan.options.hide_nodes){
- _this.hiddenNodes = (view.get("hidden_nodes") || []).concat();
- _this.hideNodes();
- }
- }
- });
- this.$.find(".Rk-ShowHiddenNodes").mouseenter( function() {
- _this.showNodes(true);
- _this.$.find(".Rk-ShowHiddenNodes").mouseleave( function() {
- _this.hideNodes();
- });
- });
- this.$.find(".Rk-ShowHiddenNodes").click( function() {
- _this.showNodes(false);
- _this.$.find(".Rk-ShowHiddenNodes").off( "mouseleave" );
- });
if(this.renkan.project.get("views").length > 0 && this.renkan.options.save_view){
this.$.find(".Rk-ZoomSetSaved").show();
}
@@ -314,7 +282,7 @@
_ratio = ratioW;
}
- _this.resizeZoom(ratioW, ratioH, _ratio);
+ _this.view.resizeZoom(ratioW, ratioH, _ratio);
_this.redraw();
@@ -323,7 +291,7 @@
var _thRedraw = _.throttle(function() {
_this.redraw();
},50);
-
+
this.addRepresentations("Node", this.renkan.project.get("nodes"));
this.addRepresentations("Edge", this.renkan.project.get("edges"));
this.renkan.project.on("change:title", function() {
@@ -370,6 +338,7 @@
}
else{
Backbone.history.start();
+ _thRedraw();
}
});
@@ -518,13 +487,12 @@
_(Scene.prototype).extend({
fixSize: function() {
- if( this.renkan.options.default_view && this.renkan.project.get("views").length > 0) {
- var view = this.renkan.project.get("views").last();
- this.setScale(view.get("zoom_level"), new paper.Point(view.get("offset")));
- }
- else{
- this.autoScale();
- }
+// if(typeothis.view) {
+// this.view.setScale(view.get("zoom_level"), new paper.Point(view.get("offset")));
+// }
+// else{
+// this.view.autoScale();
+// }
},
drawSector: function(_repr, _inR, _outR, _startAngle, _endAngle, _padding, _imgname, _caption) {
var _options = this.renkan.options,
@@ -674,38 +642,6 @@
}
this.redrawUsers();
},
- setScale: function(_newScale, _offset) {
- if ((_newScale/this.initialScale) > Utils._MIN_SCALE && (_newScale/this.initialScale) < Utils._MAX_SCALE) {
- this.scale = _newScale;
- if (_offset) {
- this.offset = _offset;
- }
- this.redraw();
- }
- },
- autoScale: function(force_view) {
- var nodes = this.renkan.project.get("nodes");
- if (nodes.length > 1) {
- var _xx = nodes.map(function(_node) { return _node.get("position").x; }),
- _yy = nodes.map(function(_node) { return _node.get("position").y; }),
- _minx = Math.min.apply(Math, _xx),
- _miny = Math.min.apply(Math, _yy),
- _maxx = Math.max.apply(Math, _xx),
- _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_view !== "undefined") && parseFloat(force_view.zoom_level)>0 && parseFloat(force_view.offset.x)>0 && parseFloat(force_view.offset.y)>0){
- this.setScale(parseFloat(force_view.zoom_level), new paper.Point(parseFloat(force_view.offset.x), parseFloat(force_view.offset.y)));
- }
- else{
- 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])));
- }
- },
redrawMiniframe: function() {
var topleft = this.toMinimapCoords(this.toModelCoords(new paper.Point([0,0]))),
bottomright = this.toMinimapCoords(this.toModelCoords(paper.view.bounds.bottomRight));
@@ -721,8 +657,8 @@
_maxx = Math.max.apply(Math, _xx),
_maxy = Math.max.apply(Math, _yy);
var _scale = Math.min(
- this.scale * 0.8 * this.renkan.options.minimap_width / paper.view.bounds.width,
- this.scale * 0.8 * this.renkan.options.minimap_height / paper.view.bounds.height,
+ this.view.scale * 0.8 * this.renkan.options.minimap_width / paper.view.bounds.width,
+ this.view.scale * 0.8 * this.renkan.options.minimap_height / paper.view.bounds.height,
( this.renkan.options.minimap_width - 2 * this.renkan.options.minimap_padding ) / (_maxx - _minx),
( this.renkan.options.minimap_height - 2 * this.renkan.options.minimap_padding ) / (_maxy - _miny)
);
@@ -736,19 +672,19 @@
this.redraw();
},
toPaperCoords: function(_point) {
- return _point.multiply(this.scale).add(this.offset);
+ return _point.multiply(this.view.scale).add(this.view.offset);
},
toMinimapCoords: function(_point) {
return _point.multiply(this.minimap.scale).add(this.minimap.offset).add(this.minimap.topleft);
},
toModelCoords: function(_point) {
- return _point.subtract(this.offset).divide(this.scale);
+ return _point.subtract(this.view.offset).divide(this.view.scale);
},
addRepresentation: function(_type, _model) {
var RendererType = requtils.getRenderer()[_type];
var _repr = new RendererType(this, _model);
this.representations.push(_repr);
- return _repr;
+ return _repr;
},
addRepresentations: function(_type, _collection) {
var _this = this;
@@ -864,7 +800,7 @@
_.each(this.representations, function(_representation) {
_representation.redraw({ dontRedrawEdges:true });
});
- if (this.minimap) {
+ if (this.minimap && typeof this.view !== 'undefined') {
this.redrawMiniframe();
}
paper.view.draw();
@@ -876,40 +812,6 @@
_tmpEdge.redraw();
this.click_target = _tmpEdge;
},
- addHiddenNode: function(_model){
- this.hideNode(_model);
- this.hiddenNodes.push(_model.id);
- },
- hideNode: function(_model){
- var _this = this;
- if (typeof _this.getRepresentationByModel(_model) !== 'undefined'){
- _this.getRepresentationByModel(_model).hide();
- }
- },
- hideNodes: function(){
- var _this = this;
- this.hiddenNodes.forEach(function(_id, index){
- var node = _this.renkan.project.get("nodes").get(_id);
- if (typeof node !== 'undefined'){
- return _this.hideNode(_this.renkan.project.get("nodes").get(_id));
- }else{
- _this.hiddenNodes.splice(index, 1);
- }
- });
- paper.view.draw();
- },
- showNodes: function(ghost){
- var _this = this;
- var i = 0;
- this.hiddenNodes.forEach(function(_id){
- i++;
- _this.getRepresentationByModel(_this.renkan.project.get("nodes").get(_id)).show(ghost);
- });
- if (!ghost){
- this.hiddenNodes = [];
- }
- paper.view.draw();
- },
findTarget: function(_hitResult) {
if (_hitResult && typeof _hitResult.item.__representation !== "undefined") {
var _newTarget = _hitResult.item.__representation;
@@ -927,10 +829,6 @@
this.selected_target = null;
}
},
- paperShift: function(_delta) {
- this.offset = this.offset.add(_delta);
- this.redraw();
- },
onMouseMove: function(_event) {
var _off = this.canvas_$.offset(),
_point = new paper.Point([
@@ -947,7 +845,7 @@
if (this.click_target && typeof this.click_target.paperShift === "function") {
this.click_target.paperShift(_delta);
} else {
- this.paperShift(_delta);
+ this.view.paperShift(_delta);
}
} else {
this.findTarget(_hitResult);
@@ -1020,6 +918,7 @@
if (_isTouch) {
this.unselectAll();
}
+ this.view.updateUrl();
}
paper.view.draw();
},
@@ -1030,11 +929,11 @@
_delta = new paper.Point([
_event.pageX - _off.left,
_event.pageY - _off.top
- ]).subtract(this.offset).multiply( Math.SQRT2 - 1 );
+ ]).subtract(this.view.offset).multiply( Math.SQRT2 - 1 );
if (this.totalScroll > 0) {
- this.setScale( this.scale * Math.SQRT2, this.offset.subtract(_delta) );
+ this.view.setScale( this.view.scale * Math.SQRT2, this.view.offset.subtract(_delta) );
} else {
- this.setScale( this.scale * Math.SQRT1_2, this.offset.add(_delta.divide(Math.SQRT2)));
+ this.view.setScale( this.view.scale * Math.SQRT1_2, this.view.offset.add(_delta.divide(Math.SQRT2)));
}
this.totalScroll = 0;
}
@@ -1234,30 +1133,6 @@
this.redraw();
}
},
- zoomOut: function() {
- var _newScale = this.scale * Math.SQRT1_2,
- _offset = new paper.Point([
- this.canvas_$.width(),
- this.canvas_$.height()
- ]).multiply( 0.5 * ( 1 - Math.SQRT1_2 ) ).add(this.offset.multiply( Math.SQRT1_2 ));
- this.setScale( _newScale, _offset );
- },
- zoomIn: function() {
- var _newScale = this.scale * Math.SQRT2,
- _offset = new paper.Point([
- this.canvas_$.width(),
- this.canvas_$.height()
- ]).multiply( 0.5 * ( 1 - Math.SQRT2 ) ).add(this.offset.multiply( Math.SQRT2 ));
- this.setScale( _newScale, _offset );
- },
- resizeZoom: function(_scaleWidth, _scaleHeight, _ratio) {
- var _newScale = this.scale * _ratio,
- _offset = new paper.Point([
- (this.offset.x * _scaleWidth),
- (this.offset.y * _scaleHeight)
- ]);
- this.setScale( _newScale, _offset );
- },
addNodeBtn: function() {
if (this.click_mode === Utils._CLICKMODE_ADDNODE) {
this.click_mode = false;
@@ -1325,9 +1200,42 @@
},
parameters: function(_params){
- if (typeof _params.idnode !== 'undefined'){
+ if ($.isEmptyObject(_params)){
+ this.view = this.addRepresentation("View", this.renkan.project.get("views").last());
+ return;
+ }
+ if (typeof _params.view !== 'undefined'){
+ var viewParams = _params.view.split(",");
+ if (viewParams.length >= 3){
+ var params = {
+ "project": this.renkan.project,
+ "offset": {
+ "x": parseFloat(viewParams[0]),
+ "y": parseFloat(viewParams[1])
+ },
+ "zoom_level": parseFloat(viewParams[2])
+ };
+ for (var i = 3; i < viewParams.length; i++){
+ params.hidden_nodes.push(viewParams[i]);
+ }
+ //var view = new Rkns.Models.View(params);
+
+ if (this.view){
+ this.view.showNodes(false);
+ this.removeRepresentation(this.view);
+ }
+
+ this.view = this.addRepresentation("View", null);
+ this.view.params = params;
+ this.view.init();
+ } else {
+ this.view = this.addRepresentation("View", this.renkan.project.get("views").last());
+ }
+ }
+ //other parameters must go after because most of them depends on a view that must be initialize before
+ if (typeof _params.idNode !== 'undefined'){
this.unhighlightAll();
- this.highlightModel(this.renkan.project.get("nodes").get(_params.idnode));
+ this.highlightModel(this.renkan.project.get("nodes").get(_params.iNnode));
}
},
foldBins: function() {
@@ -1357,7 +1265,7 @@
sizeAft = sizeBef+300;
foldBinsButton.html("»");
}
- _this.resizeZoom(1, 1, (sizeAft/sizeBef));
+ _this.view.resizeZoom(1, 1, (sizeAft/sizeBef));
},
save: function() { },
open: function() { }
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/client/js/renderer/viewrepr.js Wed Sep 09 15:05:30 2015 +0200
@@ -0,0 +1,211 @@
+define(['jquery', 'underscore', 'requtils', 'renderer/baserepresentation'], function ($, _, requtils, BaseRepresentation) {
+ 'use strict';
+
+ var Utils = requtils.getUtils();
+
+ /* Rkns.Renderer.View Class */
+
+ /* The representation for the view. */
+
+ var ViewRepr = Utils.inherit(BaseRepresentation);
+
+ _(ViewRepr.prototype).extend({
+ _init: function() {
+ var _this = this;
+ this.$ = $(".Rk-Render");
+ this.type = "View";
+ this.hiddenNodes = [];
+ this.scale = 1;
+ this.initialScale = 1;
+ this.offset = paper.view.center;
+ this.params = {};
+
+ if (this.model){
+ this.params = {
+ "zoom_level": _this.model.get("zoom_level"),
+ "offset": _this.model.get("offset"),
+ "hidden_nodes": _this.model.get("hidden_nodes")
+ };
+ }
+
+ this.init();
+
+ var bindClick = function(selector, fname) {
+ _this.$.find(selector).click(function(evt) {
+ _this[fname](evt);
+ return false;
+ });
+ };
+
+ bindClick(".Rk-ZoomOut", "zoomOut");
+ bindClick(".Rk-ZoomIn", "zoomIn");
+ bindClick(".Rk-ZoomFit", "autoScale");
+
+ this.$.find(".Rk-ZoomSave").click( function() {
+ var offset = {
+ "x": _this.offset.x,
+ "y": _this.offset.y
+ };
+ //TODO: make the if else the same function
+ if (_this.model){
+ _this.model.set( { zoom_level:_this.scale, offset:offset, hidden_nodes: _this.hiddenNodes.concat() } );
+ }else{
+ _this.model = _this.renkan.project.addView( { zoom_level:_this.scale, offset:offset, hidden_nodes: _this.hiddenNodes.concat() } );
+ }
+ _this.params = {
+ "zoom_level": _this.model.get("zoom_level"),
+ "offset": _this.model.get("offset"),
+ "hidden_nodes": _this.model.get("hidden_nodes")
+ };
+ });
+
+ this.$.find(".Rk-ZoomSetSaved").click( function() {
+ _this.setScale(_this.params.zoom_level, new paper.Point(_this.params.offset));
+ _this.showNodes(false);
+ if (_this.options.hide_nodes){
+ _this.hiddenNodes = (_this.params.hidden_nodes || []).concat();
+ _this.hideNodes();
+ }
+ });
+
+ this.$.find(".Rk-ShowHiddenNodes").mouseenter( function() {
+ _this.showNodes(true);
+ _this.$.find(".Rk-ShowHiddenNodes").mouseleave( function() {
+ _this.hideNodes();
+ });
+ });
+ this.$.find(".Rk-ShowHiddenNodes").click( function() {
+ _this.showNodes(false);
+ _this.$.find(".Rk-ShowHiddenNodes").off( "mouseleave" );
+ });
+ if(this.renkan.project.get("views").length > 0 && this.renkan.options.save_view){
+ this.$.find(".Rk-ZoomSetSaved").show();
+ }
+ },
+ redraw: function(options) {
+ //console.log("view : ", this.model.toJSON());
+ },
+ init: function(){
+ var _this = this;
+ _this.setScale(_this.params.zoom_level, new paper.Point(_this.params.offset));
+ _this.showNodes(false);
+ if (_this.options.hide_nodes){
+ _this.hiddenNodes = (_this.params.hidden_nodes || []).concat();
+ _this.hideNodes();
+ }
+ },
+ addHiddenNode: function(_model){
+ this.hideNode(_model);
+ this.hiddenNodes.push(_model.id);
+ this.updateUrl();
+ },
+ hideNode: function(_model){
+ if (typeof this.renderer.getRepresentationByModel(_model) !== 'undefined'){
+ this.renderer.getRepresentationByModel(_model).hide();
+ }
+ },
+ hideNodes: function(){
+ var _this = this;
+ this.hiddenNodes.forEach(function(_id, index){
+ var node = _this.renkan.project.get("nodes").get(_id);
+ if (typeof node !== 'undefined'){
+ return _this.hideNode(_this.renkan.project.get("nodes").get(_id));
+ }else{
+ _this.hiddenNodes.splice(index, 1);
+ }
+ });
+ paper.view.draw();
+ },
+ showNodes: function(ghost){
+ var _this = this;
+ this.hiddenNodes.forEach(function(_id){
+ _this.renderer.getRepresentationByModel(_this.renkan.project.get("nodes").get(_id)).show(ghost);
+ });
+ if (!ghost){
+ this.hiddenNodes = [];
+ }
+ paper.view.draw();
+ },
+ setScale: function(_newScale, _offset) {
+ if ((_newScale/this.initialScale) > Utils._MIN_SCALE && (_newScale/this.initialScale) < Utils._MAX_SCALE) {
+ this.scale = _newScale;
+ if (_offset) {
+ this.offset = _offset;
+ }
+ this.renderer.redraw();
+ this.updateUrl();
+ }
+ },
+ zoomOut: function() {
+ var _newScale = this.scale * Math.SQRT1_2,
+ _offset = new paper.Point([
+ this.renderer.canvas_$.width(),
+ this.renderer.canvas_$.height()
+ ]).multiply( 0.5 * ( 1 - Math.SQRT1_2 ) ).add(this.offset.multiply( Math.SQRT1_2 ));
+ this.setScale( _newScale, _offset );
+ },
+ zoomIn: function() {
+ var _newScale = this.scale * Math.SQRT2,
+ _offset = new paper.Point([
+ this.renderer.canvas_$.width(),
+ this.renderer.canvas_$.height()
+ ]).multiply( 0.5 * ( 1 - Math.SQRT2 ) ).add(this.offset.multiply( Math.SQRT2 ));
+ this.setScale( _newScale, _offset );
+ },
+ resizeZoom: function(_scaleWidth, _scaleHeight, _ratio) {
+ var _newScale = this.scale * _ratio,
+ _offset = new paper.Point([
+ (this.offset.x * _scaleWidth),
+ (this.offset.y * _scaleHeight)
+ ]);
+ this.setScale( _newScale, _offset );
+ },
+ autoScale: function(force_view) {
+ var nodes = this.renkan.project.get("nodes");
+ if (nodes.length > 1) {
+ var _xx = nodes.map(function(_node) { return _node.get("position").x; }),
+ _yy = nodes.map(function(_node) { return _node.get("position").y; }),
+ _minx = Math.min.apply(Math, _xx),
+ _miny = Math.min.apply(Math, _yy),
+ _maxx = Math.max.apply(Math, _xx),
+ _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_view !== "undefined") && parseFloat(force_view.zoom_level)>0 && parseFloat(force_view.offset.x)>0 && parseFloat(force_view.offset.y)>0){
+ this.setScale(parseFloat(force_view.zoom_level), new paper.Point(parseFloat(force_view.offset.x), parseFloat(force_view.offset.y)));
+ }
+ else{
+ 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])));
+ }
+ },
+ paperShift: function(_delta) {
+ this.offset = this.offset.add(_delta);
+ this.renderer.redraw();
+ },
+ updateUrl: function(){
+ if(this.options.update_url){
+ var result = {};
+ var parameters = Backbone.history.getFragment().split('?');
+ if (parameters.length > 1){
+ parameters[1].split("&").forEach(function(part) {
+ var item = part.split("=");
+ result[item[0]] = decodeURIComponent(item[1]);
+ });
+ }
+ result.view = Math.round(this.offset.x*1000)/1000 + ',' + Math.round(this.offset.y*1000)/1000 + ',' + Math.round(this.scale*1000)/1000;
+// if (this.hiddenNodes.length > 0){
+// result.hiddenNodes = this.hiddenNodes.join();
+// }
+ this.renkan.router.navigate("?" + decodeURIComponent($.param(result)), {trigger: false, replace: false});
+ }
+ },
+ }).value();
+
+ return ViewRepr;
+
+});
--- a/client/js/router.js Wed Sep 09 13:10:01 2015 +0200
+++ b/client/js/router.js Wed Sep 09 15:05:30 2015 +0200
@@ -11,14 +11,13 @@
index: function (parameters) {
var result = {};
- if (parameters === null){
- return;
+ if (parameters !== null){
+ parameters.split("&").forEach(function(part) {
+ var item = part.split("=");
+ result[item[0]] = decodeURIComponent(item[1]);
+ });
}
- parameters.split("&").forEach(function(part) {
- var item = part.split("=");
- result[item[0]] = decodeURIComponent(item[1]);
- });
- this.trigger('router', result);
+ this.trigger('router', result);
}
});
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/server/php/basic/public_html/static/lib/renkan/js/templates.js Wed Sep 09 15:05:30 2015 +0200
@@ -0,0 +1,819 @@
+this["renkanJST"] = this["renkanJST"] || {};
+
+this["renkanJST"]["templates/colorpicker.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape;
+with (obj) {
+__p += '<li data-color="' +
+((__t = (c)) == null ? '' : __t) +
+'" style="background: ' +
+((__t = (c)) == null ? '' : __t) +
+'"></li>';
+
+}
+return __p
+};
+
+this["renkanJST"]["templates/edgeeditor.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape, __j = Array.prototype.join;
+function print() { __p += __j.call(arguments, '') }
+with (obj) {
+__p += '<h2>\n <span class="Rk-CloseX">×</span>' +
+__e(renkan.translate("Edit Edge")) +
+'</span>\n</h2>\n<p>\n <label>' +
+__e(renkan.translate("Title:")) +
+'</label>\n <input class="Rk-Edit-Title" type="text" value="' +
+__e(edge.title) +
+'" />\n</p>\n';
+ if (options.show_edge_editor_uri) { ;
+__p += '\n <p>\n <label>' +
+__e(renkan.translate("URI:")) +
+'</label>\n <input class="Rk-Edit-URI" type="text" value="' +
+__e(edge.uri) +
+'" />\n <a class="Rk-Edit-Goto" href="' +
+__e(edge.uri) +
+'" target="_blank"></a>\n </p>\n ';
+ if (options.properties.length) { ;
+__p += '\n <p>\n <label>' +
+__e(renkan.translate("Choose from vocabulary:")) +
+'</label>\n <select class="Rk-Edit-Vocabulary">\n ';
+ _.each(options.properties, function(ontology) { ;
+__p += '\n <option class="Rk-Edit-Vocabulary-Class" value="">\n ' +
+__e( renkan.translate(ontology.label) ) +
+'\n </option>\n ';
+ _.each(ontology.properties, function(property) { var uri = ontology["base-uri"] + property.uri; ;
+__p += '\n <option class="Rk-Edit-Vocabulary-Property" value="' +
+__e( uri ) +
+'"\n ';
+ if (uri === edge.uri) { ;
+__p += ' selected';
+ } ;
+__p += '>\n ' +
+__e( renkan.translate(property.label) ) +
+'\n </option>\n ';
+ }) ;
+__p += '\n ';
+ }) ;
+__p += '\n </select>\n </p>\n';
+ } } ;
+__p += '\n';
+ if (options.show_edge_editor_style) { ;
+__p += '\n <div class="Rk-Editor-p">\n ';
+ if (options.show_edge_editor_style_color) { ;
+__p += '\n <div id="Rk-Editor-p-color">\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("Edge color:")) +
+'</span>\n <div class="Rk-Edit-ColorPicker-Wrapper">\n <span class="Rk-Edit-Color" style="background: <%-edge.color%>;">\n <span class="Rk-Edit-ColorTip"></span>\n </span>\n ' +
+((__t = ( renkan.colorPicker )) == null ? '' : __t) +
+'\n <span class="Rk-Edit-ColorPicker-Text">' +
+__e( renkan.translate("Choose color") ) +
+'</span>\n </div>\n </div>\n ';
+ } ;
+__p += '\n ';
+ if (options.show_edge_editor_style_dash) { ;
+__p += '\n <div id="Rk-Editor-p-dash">\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("Dash:")) +
+'</span>\n <input type="checkbox" name="Rk-Edit-Dash" class="Rk-Edit-Dash" ' +
+__e( edge.dash ) +
+' />\n </div>\n ';
+ } ;
+__p += '\n ';
+ if (options.show_edge_editor_style_thickness) { ;
+__p += '\n <div id="Rk-Editor-p-thickness">\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("Thickness:")) +
+'</span>\n <a href="#" class="Rk-Edit-Size-Btn" id="Rk-Edit-Thickness-Down">-</a>\n <span class="Rk-Edit-Size-Disp" id="Rk-Edit-Thickness-Value">' +
+__e( edge.thickness ) +
+'</span>\n <a href="#" class="Rk-Edit-Size-Btn" id="Rk-Edit-Thickness-Up">+</a>\n </div>\n ';
+ } ;
+__p += '\n ';
+ if (options.show_edge_editor_style_arrow) { ;
+__p += '\n <div id="Rk-Editor-p-arrow">\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("Arrow:")) +
+'</span>\n <input type="checkbox" name="Rk-Edit-Arrow" class="Rk-Edit-Arrow" ' +
+__e( edge.arrow ) +
+' />\n </div>\n ';
+ } ;
+__p += '\n </div>\n';
+ } ;
+__p += '\n';
+ if (options.show_edge_editor_direction) { ;
+__p += '\n <p>\n <span class="Rk-Edit-Direction">' +
+__e( renkan.translate("Change edge direction") ) +
+'</span>\n </p>\n';
+ } ;
+__p += '\n';
+ if (options.show_edge_editor_nodes) { ;
+__p += '\n <p>\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("From:")) +
+'</span>\n <span class="Rk-UserColor" style="background: ' +
+__e(edge.from_color) +
+';"></span>\n ' +
+__e( shortenText(edge.from_title, 25) ) +
+'\n </p>\n <p>\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("To:")) +
+'</span>\n <span class="Rk-UserColor" style="background: >%-edge.to_color%>;"></span>\n ' +
+__e( shortenText(edge.to_title, 25) ) +
+'\n </p>\n';
+ } ;
+__p += '\n';
+ if (options.show_edge_editor_creator && edge.has_creator) { ;
+__p += '\n <p>\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("Created by:")) +
+'</span>\n <span class="Rk-UserColor" style="background: <%-edge.created_by_color%>;"></span>\n ' +
+__e( shortenText(edge.created_by_title, 25) ) +
+'\n </p>\n';
+ } ;
+__p += '\n';
+
+}
+return __p
+};
+
+this["renkanJST"]["templates/edgeeditor_readonly.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape, __j = Array.prototype.join;
+function print() { __p += __j.call(arguments, '') }
+with (obj) {
+__p += '<h2>\n <span class="Rk-CloseX">×</span>\n ';
+ if (options.show_edge_tooltip_color) { ;
+__p += '\n <span class="Rk-UserColor" style="background: ' +
+__e( edge.color ) +
+';"></span>\n ';
+ } ;
+__p += '\n <span class="Rk-Display-Title">\n ';
+ if (edge.uri) { ;
+__p += '\n <a href="' +
+__e(edge.uri) +
+'" target="_blank">\n ';
+ } ;
+__p += '\n ' +
+__e(edge.title) +
+'\n ';
+ if (edge.uri) { ;
+__p += ' </a> ';
+ } ;
+__p += '\n </span>\n</h2>\n';
+ if (options.show_edge_tooltip_uri && edge.uri) { ;
+__p += '\n <p class="Rk-Display-URI">\n <a href="' +
+__e(edge.uri) +
+'" target="_blank">' +
+__e( edge.short_uri ) +
+'</a>\n </p>\n';
+ } ;
+__p += '\n<p>' +
+((__t = (edge.description)) == null ? '' : __t) +
+'</p>\n';
+ if (options.show_edge_tooltip_nodes) { ;
+__p += '\n <p>\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("From:")) +
+'</span>\n <span class="Rk-UserColor" style="background: ' +
+__e( edge.from_color ) +
+';"></span>\n ' +
+__e( shortenText(edge.from_title, 25) ) +
+'\n </p>\n <p>\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("To:")) +
+'</span>\n <span class="Rk-UserColor" style="background: ' +
+__e( edge.to_color ) +
+';"></span>\n ' +
+__e( shortenText(edge.to_title, 25) ) +
+'\n </p>\n';
+ } ;
+__p += '\n';
+ if (options.show_edge_tooltip_creator && edge.has_creator) { ;
+__p += '\n <p>\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("Created by:")) +
+'</span>\n <span class="Rk-UserColor" style="background: ' +
+__e( edge.created_by_color ) +
+';"></span>\n ' +
+__e( shortenText(edge.created_by_title, 25) ) +
+'\n </p>\n';
+ } ;
+__p += '\n';
+
+}
+return __p
+};
+
+this["renkanJST"]["templates/ldtjson-bin/annotationtemplate.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape;
+with (obj) {
+__p += '<li class="Rk-Bin-Item" draggable="true"\n data-image="' +
+__e( Rkns.Utils.getFullURL(image) ) +
+'"\n data-uri="' +
+((__t = (ldt_platform)) == null ? '' : __t) +
+'ldtplatform/ldt/front/player/' +
+((__t = (mediaid)) == null ? '' : __t) +
+'/#id=' +
+((__t = (annotationid)) == null ? '' : __t) +
+'"\n data-title="' +
+__e(title) +
+'" data-description="' +
+__e(description) +
+'">\n\n <img class="Rk-Ldt-Annotation-Icon" src="' +
+((__t = (image)) == null ? '' : __t) +
+'" />\n <h4>' +
+((__t = (htitle)) == null ? '' : __t) +
+'</h4>\n <p>' +
+((__t = (hdescription)) == null ? '' : __t) +
+'</p>\n <p>Start: ' +
+((__t = (start)) == null ? '' : __t) +
+', End: ' +
+((__t = (end)) == null ? '' : __t) +
+', Duration: ' +
+((__t = (duration)) == null ? '' : __t) +
+'</p>\n <div class="Rk-Clear"></div>\n</li>\n';
+
+}
+return __p
+};
+
+this["renkanJST"]["templates/ldtjson-bin/segmenttemplate.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape;
+with (obj) {
+__p += '<li class="Rk-Bin-Item" draggable="true"\n data-image="' +
+__e( Rkns.Utils.getFullURL(image) ) +
+'"\n data-uri="' +
+((__t = (ldt_platform)) == null ? '' : __t) +
+'ldtplatform/ldt/front/player/' +
+((__t = (mediaid)) == null ? '' : __t) +
+'/#id=' +
+((__t = (annotationid)) == null ? '' : __t) +
+'"\n data-title="' +
+__e(title) +
+'" data-description="' +
+__e(description) +
+'">\n\n <img class="Rk-Ldt-Annotation-Icon" src="' +
+((__t = (image)) == null ? '' : __t) +
+'" />\n <h4>' +
+((__t = (htitle)) == null ? '' : __t) +
+'</h4>\n <p>' +
+((__t = (hdescription)) == null ? '' : __t) +
+'</p>\n <p>Start: ' +
+((__t = (start)) == null ? '' : __t) +
+', End: ' +
+((__t = (end)) == null ? '' : __t) +
+', Duration: ' +
+((__t = (duration)) == null ? '' : __t) +
+'</p>\n <div class="Rk-Clear"></div>\n</li>\n';
+
+}
+return __p
+};
+
+this["renkanJST"]["templates/ldtjson-bin/tagtemplate.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape;
+with (obj) {
+__p += '<li class="Rk-Bin-Item" draggable="true"\n data-image="' +
+__e( Rkns.Utils.getFullURL(static_url+'img/ldt-tag.png') ) +
+'"\n data-uri="' +
+((__t = (ldt_platform)) == null ? '' : __t) +
+'ldtplatform/ldt/front/search/?search=' +
+((__t = (encodedtitle)) == null ? '' : __t) +
+'&field=all"\n data-title="' +
+__e(title) +
+'" data-description="Tag \'' +
+__e(title) +
+'\'">\n\n <img class="Rk-Ldt-Tag-Icon" src="' +
+__e(static_url) +
+'img/ldt-tag.png" />\n <h4>' +
+((__t = (htitle)) == null ? '' : __t) +
+'</h4>\n <div class="Rk-Clear"></div>\n</li>\n';
+
+}
+return __p
+};
+
+this["renkanJST"]["templates/list-bin.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape, __j = Array.prototype.join;
+function print() { __p += __j.call(arguments, '') }
+with (obj) {
+__p += '<li class="Rk-Bin-Item Rk-ResourceList-Item" draggable="true"\n data-uri="' +
+__e(url) +
+'" data-title="' +
+__e(title) +
+'"\n data-description="' +
+__e(description) +
+'"\n ';
+ if (image) { ;
+__p += '\n data-image="' +
+__e( Rkns.Utils.getFullURL(image) ) +
+'"\n ';
+ } else { ;
+__p += '\n data-image=""\n ';
+ } ;
+__p += '\n>';
+ if (image) { ;
+__p += '\n <img class="Rk-ResourceList-Image" src="' +
+__e(image) +
+'" />\n';
+ } ;
+__p += '\n<h4 class="Rk-ResourceList-Title">\n ';
+ if (url) { ;
+__p += '\n <a href="' +
+__e(url) +
+'" target="_blank">\n ';
+ } ;
+__p += '\n ' +
+((__t = (htitle)) == null ? '' : __t) +
+'\n ';
+ if (url) { ;
+__p += '</a>';
+ } ;
+__p += '\n </h4>\n ';
+ if (description) { ;
+__p += '\n <p class="Rk-ResourceList-Description">' +
+((__t = (hdescription)) == null ? '' : __t) +
+'</p>\n ';
+ } ;
+__p += '\n ';
+ if (image) { ;
+__p += '\n <div style="clear: both;"></div>\n ';
+ } ;
+__p += '\n</li>\n';
+
+}
+return __p
+};
+
+this["renkanJST"]["templates/main.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape, __j = Array.prototype.join;
+function print() { __p += __j.call(arguments, '') }
+with (obj) {
+
+ if (options.show_bins) { ;
+__p += '\n <div class="Rk-Bins">\n <div class="Rk-Bins-Head">\n <h2 class="Rk-Bins-Title">' +
+__e( translate("Select contents:")) +
+'</h2>\n <form class="Rk-Web-Search-Form Rk-Search-Form">\n <input class="Rk-Web-Search-Input Rk-Search-Input" type="search"\n placeholder="' +
+__e( translate('Search the Web') ) +
+'" />\n <div class="Rk-Search-Select">\n <div class="Rk-Search-Current"></div>\n <ul class="Rk-Search-List"></ul>\n </div>\n <input type="submit" value=""\n class="Rk-Web-Search-Submit Rk-Search-Submit" title="' +
+__e( translate('Search the Web') ) +
+'" />\n </form>\n <form class="Rk-Bins-Search-Form Rk-Search-Form">\n <input class="Rk-Bins-Search-Input Rk-Search-Input" type="search"\n placeholder="' +
+__e( translate('Search in Bins') ) +
+'" /> <input\n type="submit" value=""\n class="Rk-Bins-Search-Submit Rk-Search-Submit"\n title="' +
+__e( translate('Search in Bins') ) +
+'" />\n </form>\n </div>\n <ul class="Rk-Bin-List"></ul>\n </div>\n';
+ } ;
+__p += ' ';
+ if (options.show_editor) { ;
+__p += '\n <div class="Rk-Render Rk-Render-';
+ if (options.show_bins) { ;
+__p += 'Panel';
+ } else { ;
+__p += 'Full';
+ } ;
+__p += '"></div>\n';
+ } ;
+__p += '\n';
+
+}
+return __p
+};
+
+this["renkanJST"]["templates/nodeeditor.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape, __j = Array.prototype.join;
+function print() { __p += __j.call(arguments, '') }
+with (obj) {
+
+ //TODO: change class to id ;
+__p += '\n<h2>\n <span class="Rk-CloseX">×</span>' +
+__e(renkan.translate("Edit Node")) +
+'</span>\n</h2>\n<p>\n <label>' +
+__e(renkan.translate("Title:")) +
+'</label>\n <input class="Rk-Edit-Title" type="text" value="' +
+__e(node.title) +
+'" />\n</p>\n';
+ if (options.show_node_editor_uri) { ;
+__p += '\n <p>\n <label>' +
+__e(renkan.translate("URI:")) +
+'</label>\n <input class="Rk-Edit-URI" type="text" value="' +
+__e(node.uri) +
+'" />\n <a class="Rk-Edit-Goto" href="' +
+__e(node.uri) +
+'" target="_blank"></a>\n </p>\n';
+ } ;
+__p += ' ';
+ if (options.change_types) { ;
+__p += '\n <p>\n <label>' +
+__e(renkan.translate("Types available")) +
+':</label>\n <select class="Rk-Edit-Type">\n ';
+ _.each(types, function(type) { ;
+__p += '\n <option class="Rk-Edit-Vocabulary-Property" value="' +
+__e( type ) +
+'"';
+ if (node.type === type) { ;
+__p += ' selected';
+ } ;
+__p += '>\n ' +
+__e( renkan.translate(type.charAt(0).toUpperCase() + type.substring(1)) ) +
+'\n </option>\n ';
+ }); ;
+__p += '\n </select>\n </p>\n';
+ } ;
+__p += ' ';
+ if (options.show_node_editor_description) { ;
+__p += '\n <p>\n <label>' +
+__e(renkan.translate("Description:")) +
+'</label>\n ';
+ if (options.show_node_editor_description_richtext) { ;
+__p += '\n <div class="Rk-Edit-Description" contenteditable="true">' +
+((__t = (node.description)) == null ? '' : __t) +
+'</div>\n ';
+ } else { ;
+__p += '\n <textarea class="Rk-Edit-Description">' +
+((__t = (node.description)) == null ? '' : __t) +
+'</textarea>\n ';
+ } ;
+__p += '\n </p>\n';
+ } ;
+__p += ' ';
+ if (options.show_node_editor_size) { ;
+__p += '\n <p>\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("Size:")) +
+'</span>\n <a href="#" class="Rk-Edit-Size-Btn" id="Rk-Edit-Size-Down">-</a>\n <span class="Rk-Edit-Size-Disp" id="Rk-Edit-Size-Value">' +
+__e(node.size) +
+'</span>\n <a href="#" class="Rk-Edit-Size-Btn" id="Rk-Edit-Size-Up">+</a>\n </p>\n';
+ } ;
+__p += ' ';
+ if (options.show_node_editor_style) { ;
+__p += '\n <div class="Rk-Editor-p">\n ';
+ if (options.show_node_editor_style_color) { ;
+__p += '\n <div id="Rk-Editor-p-color">\n <span class="Rk-Editor-Label">\n ' +
+__e(renkan.translate("Node color:")) +
+'</span>\n <div class="Rk-Edit-ColorPicker-Wrapper">\n <span class="Rk-Edit-Color" style="background: ' +
+__e(node.color) +
+';">\n <span class="Rk-Edit-ColorTip"></span>\n </span>\n ' +
+((__t = ( renkan.colorPicker )) == null ? '' : __t) +
+'\n <span class="Rk-Edit-ColorPicker-Text">' +
+__e( renkan.translate("Choose color") ) +
+'</span>\n </div>\n </div>\n ';
+ } ;
+__p += '\n ';
+ if (options.show_node_editor_style_dash) { ;
+__p += '\n <div id="Rk-Editor-p-dash">\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("Dash:")) +
+'</span>\n <input type="checkbox" name="Rk-Edit-Dash" class="Rk-Edit-Dash" ' +
+__e( node.dash ) +
+' />\n </div>\n ';
+ } ;
+__p += '\n ';
+ if (options.show_node_editor_style_thickness) { ;
+__p += '\n <div id="Rk-Editor-p-thickness">\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("Thickness:")) +
+'</span>\n <a href="#" class="Rk-Edit-Size-Btn" id="Rk-Edit-Thickness-Down">-</a>\n <span class="Rk-Edit-Size-Disp" id="Rk-Edit-Thickness-Value">' +
+__e(node.thickness) +
+'</span>\n <a href="#" class="Rk-Edit-Size-Btn" id="Rk-Edit-Thickness-Up">+</a>\n </div>\n ';
+ } ;
+__p += '\n </div>\n';
+ } ;
+__p += ' ';
+ if (options.show_node_editor_image) { ;
+__p += '\n <div class="Rk-Edit-ImgWrap">\n <div class="Rk-Edit-ImgPreview">\n <img src="' +
+__e(node.image || node.image_placeholder) +
+'" />\n ';
+ if (node.clip_path) { ;
+__p += '\n <svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewbox="0 0 1 1" preserveAspectRatio="none">\n <path style="stroke-width: .02; stroke:red; fill-opacity:.3; fill:red;" d="' +
+__e( node.clip_path ) +
+'" />\n </svg>\n ';
+ };
+__p += '\n </div>\n </div>\n <p>\n <label>' +
+__e(renkan.translate("Image URL:")) +
+'</label>\n <div>\n <a class="Rk-Edit-Image-Del" href="#"></a>\n <input class="Rk-Edit-Image" type="text" value=\'' +
+__e(node.image) +
+'\' />\n </div>\n </p>\n';
+ if (options.allow_image_upload) { ;
+__p += '\n <p>\n <label>' +
+__e(renkan.translate("Choose Image File:")) +
+'</label>\n <input class="Rk-Edit-Image-File" type="file" accept="image/*" />\n </p>\n';
+ };
+
+ } ;
+__p += ' ';
+ if (options.show_node_editor_creator && node.has_creator) { ;
+__p += '\n <p>\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("Created by:")) +
+'</span>\n <span class="Rk-UserColor" style="background: ' +
+__e(node.created_by_color) +
+';"></span>\n ' +
+__e( shortenText(node.created_by_title, 25) ) +
+'\n </p>\n';
+ } ;
+__p += ' ';
+ if (options.change_shapes) { ;
+__p += '\n <p>\n <label>' +
+__e(renkan.translate("Shapes available")) +
+':</label>\n <select class="Rk-Edit-Shape">\n ';
+ _.each(shapes, function(shape) { ;
+__p += '\n <option class="Rk-Edit-Vocabulary-Property" value="' +
+__e( shape ) +
+'"';
+ if (node.shape === shape) { ;
+__p += ' selected';
+ } ;
+__p += '>\n ' +
+__e( renkan.translate(shape.charAt(0).toUpperCase() + shape.substring(1)) ) +
+'\n </option>\n ';
+ }); ;
+__p += '\n </select>\n </p>\n';
+ } ;
+__p += '\n';
+
+}
+return __p
+};
+
+this["renkanJST"]["templates/nodeeditor_readonly.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape, __j = Array.prototype.join;
+function print() { __p += __j.call(arguments, '') }
+with (obj) {
+__p += '<h2>\n <span class="Rk-CloseX">×</span>\n ';
+ if (options.show_node_tooltip_color) { ;
+__p += '\n <span class="Rk-UserColor" style="background: ' +
+__e(node.color) +
+';"></span>\n ';
+ } ;
+__p += '\n <span class="Rk-Display-Title">\n ';
+ if (node.uri) { ;
+__p += '\n <a href="' +
+__e(node.uri) +
+'" target="_blank">\n ';
+ } ;
+__p += '\n ' +
+__e(node.title) +
+'\n ';
+ if (node.uri) { ;
+__p += '</a>';
+ } ;
+__p += '\n </span>\n</h2>\n';
+ if (node.uri && options.show_node_tooltip_uri) { ;
+__p += '\n <p class="Rk-Display-URI">\n <a href="' +
+__e(node.uri) +
+'" target="_blank">' +
+__e(node.short_uri) +
+'</a>\n </p>\n';
+ } ;
+__p += ' ';
+ if (options.show_node_tooltip_description) { ;
+__p += '\n <p class="Rk-Display-Description">' +
+((__t = (node.description)) == null ? '' : __t) +
+'</p>\n';
+ } ;
+__p += ' ';
+ if (node.image && options.show_node_tooltip_image) { ;
+__p += '\n <img class="Rk-Display-ImgPreview" src="' +
+__e(node.image) +
+'" />\n';
+ } ;
+__p += ' ';
+ if (node.has_creator && options.show_node_tooltip_creator) { ;
+__p += '\n <p>\n <span class="Rk-Editor-Label">' +
+__e(renkan.translate("Created by:")) +
+'</span>\n <span class="Rk-UserColor" style="background: ' +
+__e(node.created_by_color) +
+';"></span>\n ' +
+__e( shortenText(node.created_by_title, 25) ) +
+'\n </p>\n';
+ } ;
+__p += '\n <a href="#?idnode=' +
+__e(node._id) +
+'">' +
+__e(renkan.translate("Link to the node")) +
+'</a>\n';
+
+}
+return __p
+};
+
+this["renkanJST"]["templates/nodeeditor_video.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape, __j = Array.prototype.join;
+function print() { __p += __j.call(arguments, '') }
+with (obj) {
+__p += '<h2>\n <span class="Rk-CloseX">×</span>\n ';
+ if (options.show_node_tooltip_color) { ;
+__p += '\n <span class="Rk-UserColor" style="background: ' +
+__e(node.color) +
+';"></span>\n ';
+ } ;
+__p += '\n <span class="Rk-Display-Title">\n ';
+ if (node.uri) { ;
+__p += '\n <a href="' +
+__e(node.uri) +
+'" target="_blank">\n ';
+ } ;
+__p += '\n ' +
+__e(node.title) +
+'\n ';
+ if (node.uri) { ;
+__p += '</a>';
+ } ;
+__p += '\n </span>\n</h2>\n';
+ if (node.uri && options.show_node_tooltip_uri) { ;
+__p += '\n <video width="320" height="240" controls>\n <source src="' +
+__e(node.uri) +
+'" type="video/mp4">\n </video> \n';
+ } ;
+__p += '\n <a href="#?idnode=' +
+__e(node._id) +
+'">' +
+__e(renkan.translate("Link to the node")) +
+'</a>\n';
+
+}
+return __p
+};
+
+this["renkanJST"]["templates/scene.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape, __j = Array.prototype.join;
+function print() { __p += __j.call(arguments, '') }
+with (obj) {
+
+ if (options.show_top_bar) { ;
+__p += '\n <div class="Rk-TopBar">\n <div class="loader"></div>\n ';
+ if (!options.editor_mode) { ;
+__p += '\n <h2 class="Rk-PadTitle">\n ' +
+__e( project.get("title") || translate("Untitled project")) +
+'\n </h2>\n ';
+ } else { ;
+__p += '\n <input type="text" class="Rk-PadTitle" value="' +
+__e( project.get('title') || '' ) +
+'" placeholder="' +
+__e(translate('Untitled project')) +
+'" />\n ';
+ } ;
+__p += '\n ';
+ if (options.show_user_list) { ;
+__p += '\n <div class="Rk-Users">\n <div class="Rk-CurrentUser">\n ';
+ if (options.show_user_color) { ;
+__p += '\n <div class="Rk-Edit-ColorPicker-Wrapper">\n <span class="Rk-CurrentUser-Color">\n ';
+ if (options.user_color_editable) { ;
+__p += '\n <span class="Rk-Edit-ColorTip"></span>\n ';
+ } ;
+__p += '\n </span>\n ';
+ if (options.user_color_editable) { print(colorPicker) } ;
+__p += '\n </div>\n ';
+ } ;
+__p += '\n <span class="Rk-CurrentUser-Name"><unknown user></span>\n </div>\n <ul class="Rk-UserList"></ul>\n </div>\n ';
+ } ;
+__p += '\n ';
+ if (options.home_button_url) {;
+__p += '\n <div class="Rk-TopBar-Separator"></div>\n <a class="Rk-TopBar-Button Rk-Home-Button" href="' +
+__e( options.home_button_url ) +
+'">\n <div class="Rk-TopBar-Tooltip">\n <div class="Rk-TopBar-Tooltip-Contents">\n ' +
+__e( translate(options.home_button_title) ) +
+'\n </div>\n </div>\n </a>\n ';
+ } ;
+__p += '\n ';
+ if (options.show_fullscreen_button) { ;
+__p += '\n <div class="Rk-TopBar-Separator"></div>\n <div class="Rk-TopBar-Button Rk-FullScreen-Button">\n <div class="Rk-TopBar-Tooltip">\n <div class="Rk-TopBar-Tooltip-Contents">\n ' +
+__e(translate("Full Screen")) +
+'\n </div>\n </div>\n </div>\n ';
+ } ;
+__p += '\n ';
+ if (options.editor_mode) { ;
+__p += '\n ';
+ if (options.show_addnode_button) { ;
+__p += '\n <div class="Rk-TopBar-Separator"></div>\n <div class="Rk-TopBar-Button Rk-AddNode-Button">\n <div class="Rk-TopBar-Tooltip">\n <div class="Rk-TopBar-Tooltip-Contents">\n ' +
+__e(translate("Add Node")) +
+'\n </div>\n </div>\n </div>\n ';
+ } ;
+__p += '\n ';
+ if (options.show_addedge_button) { ;
+__p += '\n <div class="Rk-TopBar-Separator"></div>\n <div class="Rk-TopBar-Button Rk-AddEdge-Button">\n <div class="Rk-TopBar-Tooltip">\n <div class="Rk-TopBar-Tooltip-Contents">\n ' +
+__e(translate("Add Edge")) +
+'\n </div>\n </div>\n </div>\n ';
+ } ;
+__p += '\n ';
+ if (options.show_export_button) { ;
+__p += '\n <div class="Rk-TopBar-Separator"></div>\n <div class="Rk-TopBar-Button Rk-Export-Button">\n <div class="Rk-TopBar-Tooltip">\n <div class="Rk-TopBar-Tooltip-Contents">\n ' +
+__e(translate("Download Project")) +
+'\n </div>\n </div>\n </div>\n ';
+ } ;
+__p += '\n ';
+ if (options.show_save_button) { ;
+__p += '\n <div class="Rk-TopBar-Separator"></div>\n <div class="Rk-TopBar-Button Rk-Save-Button">\n <div class="Rk-TopBar-Tooltip">\n <div class="Rk-TopBar-Tooltip-Contents"></div>\n </div>\n </div>\n ';
+ } ;
+__p += '\n ';
+ if (options.show_open_button) { ;
+__p += '\n <div class="Rk-TopBar-Separator"></div>\n <div class="Rk-TopBar-Button Rk-Open-Button">\n <div class="Rk-TopBar-Tooltip">\n <div class="Rk-TopBar-Tooltip-Contents">\n ' +
+__e(translate("Open Project")) +
+'\n </div>\n </div>\n </div>\n ';
+ } ;
+__p += '\n ';
+ if (options.show_bookmarklet) { ;
+__p += '\n <div class="Rk-TopBar-Separator"></div>\n <a class="Rk-TopBar-Button Rk-Bookmarklet-Button" href="#">\n <div class="Rk-TopBar-Tooltip">\n <div class="Rk-TopBar-Tooltip-Contents">\n ' +
+__e(translate("Renkan \'Drag-to-Add\' bookmarklet")) +
+'\n </div>\n </div>\n </a>\n <div class="Rk-TopBar-Separator"></div>\n ';
+ } ;
+__p += '\n ';
+ } else { ;
+__p += '\n ';
+ if (options.show_export_button) { ;
+__p += '\n <div class="Rk-TopBar-Separator"></div>\n <div class="Rk-TopBar-Button Rk-Export-Button">\n <div class="Rk-TopBar-Tooltip">\n <div class="Rk-TopBar-Tooltip-Contents">\n ' +
+__e(translate("Download Project")) +
+'\n </div>\n </div>\n </div>\n <div class="Rk-TopBar-Separator"></div>\n ';
+ } ;
+__p += '\n ';
+ }; ;
+__p += '\n ';
+ if (options.show_search_field) { ;
+__p += '\n <form action="#" class="Rk-GraphSearch-Form">\n <input type="search" class="Rk-GraphSearch-Field" placeholder="' +
+__e( translate('Search in graph') ) +
+'" />\n </form>\n <div class="Rk-TopBar-Separator"></div>\n ';
+ } ;
+__p += '\n </div>\n';
+ } ;
+__p += '\n<div class="Rk-Editing-Space';
+ if (!options.show_top_bar) { ;
+__p += ' Rk-Editing-Space-Full';
+ } ;
+__p += '">\n <div class="Rk-Labels"></div>\n <canvas class="Rk-Canvas" ';
+ if (options.resize) { ;
+__p += ' resize="" ';
+ } ;
+__p += ' ></canvas>\n <div class="Rk-Notifications"></div>\n <div class="Rk-Editor">\n ';
+ if (options.show_bins) { ;
+__p += '\n <div class="Rk-Fold-Bins">«</div>\n ';
+ } ;
+__p += '\n ';
+ if (options.show_zoom) { ;
+__p += '\n <div class="Rk-ZoomButtons">\n <div class="Rk-ZoomIn" title="' +
+__e(translate('Zoom In')) +
+'"></div>\n <div class="Rk-ZoomFit" title="' +
+__e(translate('Zoom Fit')) +
+'"></div>\n <div class="Rk-ZoomOut" title="' +
+__e(translate('Zoom Out')) +
+'"></div>\n ';
+ if (options.editor_mode && options.save_view) { ;
+__p += '\n <div class="Rk-ZoomSave" title="' +
+__e(translate('Save view')) +
+'"></div>\n ';
+ } ;
+__p += '\n ';
+ if (options.save_view) { ;
+__p += '\n <div class="Rk-ZoomSetSaved" title="' +
+__e(translate('View saved view')) +
+'"></div>\n ';
+ if (options.hide_nodes) { ;
+__p += '\n \t <div class="Rk-ShowHiddenNodes" title="' +
+__e(translate('Show hidden nodes')) +
+'"></div>\n ';
+ } ;
+__p += ' \n ';
+ } ;
+__p += '\n </div>\n ';
+ } ;
+__p += '\n </div>\n</div>\n';
+
+}
+return __p
+};
+
+this["renkanJST"]["templates/search.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape;
+with (obj) {
+__p += '<li class="' +
+((__t = ( className )) == null ? '' : __t) +
+'" data-key="' +
+((__t = ( key )) == null ? '' : __t) +
+'">' +
+((__t = ( title )) == null ? '' : __t) +
+'</li>';
+
+}
+return __p
+};
+
+this["renkanJST"]["templates/wikipedia-bin/resulttemplate.html"] = function(obj) {
+obj || (obj = {});
+var __t, __p = '', __e = _.escape;
+with (obj) {
+__p += '<li class="Rk-Wikipedia-Result Rk-Bin-Item" draggable="true"\n data-uri="' +
+__e(url) +
+'" data-title="Wikipedia: ' +
+__e(title) +
+'"\n data-description="' +
+__e(description) +
+'"\n data-image="' +
+__e( Rkns.Utils.getFullURL( static_url + 'img/wikipedia.png' ) ) +
+'">\n\n <img class="Rk-Wikipedia-Icon" src="' +
+__e(static_url) +
+'img/wikipedia.png">\n <h4 class="Rk-Wikipedia-Title">\n <a href="' +
+__e(url) +
+'" target="_blank">' +
+((__t = (htitle)) == null ? '' : __t) +
+'</a>\n </h4>\n <p class="Rk-Wikipedia-Snippet">' +
+((__t = (hdescription)) == null ? '' : __t) +
+'</p>\n</li>\n';
+
+}
+return __p
+};
\ No newline at end of file