renkan: comparison server/php/basic/public_html/static/lib/renkan/js/renkan.js

Mercurial Mercurial > renkan / comparison

summary | shortlog | changelog | graph | tags | bookmarks | branches | files | changeset | file | latest | revisions | annotate | diff | comparison | raw | help

server/php/basic/public_html/static/lib/renkan/js/renkan.js

changeset 652	153f5d09a11a
parent 635	dffc5ec04c87
child 658	cac26275af31

equal deleted inserted replaced

-:fd209e3af0c7
+:153f5d09a11a
 *
 *  The fact that you are presently reading this means that you have had
 *  knowledge of the CeCILL-C license and that you accept its terms.
 */
-/*! renkan - v00.12.22 - Copyright © IRI 2016 */
+/*! renkan - v00.13 - Copyright © IRI 2017 */
 this["renkanJST"] = this["renkanJST"] || {};
 this["renkanJST"]["templates/colorpicker.html"] = function(obj) {
 obj || (obj = {});
 __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: &lt;%-edge.color%>;">\n                <span class="Rk-Edit-ColorTip"></span>\n            </span>\n            ' +
-((__t = ( renkan.colorPicker )) == null ? '' : __t) +
+((__t = ( renkan.colorPicker('Rk-Editor-ColorPicker-Edge') )) == null ? '' : __t) +
 '\n            <span class="Rk-Edit-ColorPicker-Text">' +
 __e( renkan.translate("Choose color") ) +
 '</span>\n        </div>\n      </div>\n      ';
 } ;
 __p += '\n      ';
 __p += '\n            <a href="' +
 __e(node.uri) +
 '" target="_blank">\n        ';
 } ;
 __p += '\n        ' +
-__e(node.title) +
+((__t = (node.title)) == null ? '' : __t) +
 '\n        ';
 if (node.uri) { ;
 __p += '</a>';
 } ;
 __p += '\n    </span>\n</h2>\n';
 __p += '\n        <input class="Rk-Edit-Title" type="text" value="' +
 __e(node.title) +
 '" />\n    ';
 } ;
 __p += '\n</p>\n';
+if (options.show_node_title_style) { ;
+__p += '\n    <div class="Rk-Editor-p-title-style Rk-Editor-p">\n        <div class="Rk-Editor-p-title-color">\n            <span class="Rk-Editor-Label">' +
+__e(renkan.translate("Title color:")) +
+'</span>\n            <span class="Rk-Edit-Color" style="background: ' +
+__e(node.title_color) +
+';">\n                <span class="Rk-Edit-ColorTip"></span>\n            </span>\n            ' +
+((__t = ( renkan.colorPicker('Rk-Editor-ColorPicker-Title') )) == null ? '' : __t) +
+'\n        </div>\n        <div class="Rk-Editor-p-title-size">\n            <span class="Rk-Editor-Label">' +
+__e(renkan.translate("Title size:")) +
+'</span>\n            <a href="#" class="Rk-Edit-Size-Btn" id="Rk-Edit-Title-Size-Down">-</a>\n            <span class="Rk-Edit-Size-Disp" id="Rk-Edit-Title-Size-Value">' +
+__e(node.title_size.toFixed(1)) +
+'</span>\n            <a href="#" class="Rk-Edit-Size-Btn" id="Rk-Edit-Title-Size-Up">+</a>\n        </div>\n    </div>\n';
+} ;
+__p += ' ';
 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) +
 __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) +
+((__t = ( renkan.colorPicker('Rk-Editor-ColorPicker-Node') )) == null ? '' : __t) +
 '\n            <span class="Rk-Edit-ColorPicker-Text">' +
 __e( renkan.translate("Choose color") ) +
 '</span>\n        </div>\n      </div>\n      ';
 } ;
 __p += '\n      ';
 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) { ;
+if (!options.editor_mode || !options.title_editable) { ;
 __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="' +
 __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) } ;
+if (options.user_color_editable) { print(colorPicker('Rk-Editor-ColorPicker-User')) } ;
 __p += '\n                        </div>\n                    ';
 } ;
 __p += '\n                    <span class="Rk-CurrentUser-Name">&lt;unknown user&gt;</span>\n                </div>\n                <ul class="Rk-UserList"></ul>\n            </div>\n        ';
 } ;
 __p += '\n        ';
 this.options = _.defaults(_opts, Rkns.defaults, {
 templates: _.defaults(_opts.templates, renkanJST) || renkanJST,
 node_editor_templates: _.defaults(_opts.node_editor_templates, Rkns.defaults.node_editor_templates)
 });
-this.template = renkanJST['templates/main.html'];
+this.template = this.options.templates['templates/main.html'];
 var types_templates = {};
 _.each(this.options.node_editor_templates, function(value, key) {
 types_templates[key] = _this.options.templates[value];
 delete _this.options.templates[value];
 if (this.renderer) {
 this.renderer.redrawUsers();
 }
 });
-this.colorPicker = (function() {
+this.colorPicker = function(pickerClass) {
-var _tmpl = renkanJST['templates/colorpicker.html'];
+var _tmpl = _this.options.templates['templates/colorpicker.html'];
-return '<ul class="Rk-Edit-ColorPicker">' + Rkns.pickerColors.map(function(c) {
+return '<ul class="Rk-Edit-ColorPicker '+pickerClass+'">' + Rkns.pickerColors.map(function(c) {
 return _tmpl({
 c: c
 });
 }).join("") + '</ul>';
-})();
+};
 if (this.options.show_editor) {
 this.renderer = new Rkns.Renderer.Scene(this);
 }
 if (!this.options.search.length) {
 this.$.find(".Rk-Web-Search-Form").detach();
 } else {
-var _tmpl = renkanJST['templates/search.html'],
+var _tmpl = _this.options.templates['templates/search.html'],
 _select = this.$.find(".Rk-Search-List"),
 _input = this.$.find(".Rk-Web-Search-Input"),
 _form = this.$.find(".Rk-Web-Search-Form");
 _.each(this.options.search, function(_search, _key) {
 if (Rkns[_search.type] && Rkns[_search.type].Search) {
 shortenText: function(_text, _maxlength) {
 return (_text.length > _maxlength ? (_text.substr(0, _maxlength) + '…') : _text);
 },
 /* Drawing an edit box with an arrow and positioning the edit box according to the position of the node/edge being edited
 * Called by Rkns.Renderer.NodeEditor and Rkns.Renderer.EdgeEditor */
-drawEditBox: function(_options, _coords, _path, _xmargin, _selector) {
+drawEditBox: function(_options, _coords, _path, _xmargin, _selector, _renkan) {
 _selector.css({
 width: (_options.tooltip_width - 2 * _options.tooltip_padding)
 });
-var _height = _selector.outerHeight() + 2 * _options.tooltip_padding,
+var rect = _selector[0].getBoundingClientRect();
+var container_rect = _renkan.$[0].getBoundingClientRect();
+if(rect.bottom > (container_rect.bottom - 2 * _options.tooltip_padding - 10)) {
+_selector.css({
+'overflow-x': 'hidden',
+'overflow-y': 'scroll',
+'max-height':(container_rect.bottom - 2 * _options.tooltip_padding - 5 - rect.top) + 'px'
+});
+}
+var _height = _selector.outerHeight() + 2 * _options.tooltip_padding + 5,
 _isLeft = (_coords.x < paper.view.center.x ? 1 : -1),
 _left = _coords.x + _isLeft * (_xmargin + _options.tooltip_arrow_length),
 _right = _coords.x + _isLeft * (_xmargin + _options.tooltip_arrow_length + _options.tooltip_width),
 _top = _coords.y - _height / 2;
 if (_top + _height > (paper.view.size.height - _options.tooltip_margin)) {
 _path.segments[2].point.y = _path.segments[3].point.y = _top;
 _path.segments[4].point.y = _path.segments[5].point.y = _bottom;
 _path.segments[1].point.y = _coords.y - _options.tooltip_arrow_width / 2;
 _path.segments[6].point.y = _coords.y + _options.tooltip_arrow_width / 2;
 _path.fillColor = new paper.Color(new paper.Gradient([_options.tooltip_top_color, _options.tooltip_bottom_color]), [0, _top], [0, _bottom]);
 _selector.css({
 left: (_options.tooltip_padding + Math.min(_left, _right)),
 top: (_options.tooltip_padding + _top)
 });
 return _path;
 },
 // from http://stackoverflow.com/a/6444043
 increaseBrightness: function (hex, percent){
 // strip the leading # if it's there
 size_bug_fix: false,
 /* Resize the canvas after load (fixes a bug on iPad and FF Mac) */
 force_resize: false,
 allow_double_click: true,
 /* Allows Double Click to create a node on an empty background */
+double_click_open_url: true,
+/* In read_only mode open node uri in new window with a double click */
+simple_click_open_url: false,
+/* In read_only mode open node uri in new window with a simple click (do not disable the double click) */
 zoom_on_scroll: true,
 /* Allows to use the scrollwheel to zoom */
 element_delete_delay: 0,
 /* Delay between clicking on the bin on an element and really deleting it
 Set to 0 for delete confirm */
 /* show the user list */
 user_name_editable: true,
 /* allow the edition of the user name */
 user_color_editable: true,
 /* allow the edition of the user color */
+title_editable: true,
+/* allow the edition of the renkan title */
 show_user_color: true,
 /* show user colors in the list */
 show_save_button: true,
 show_export_button: true,
 show_open_button: false,
 node_stroke_width: 2,
 node_stroke_max_width: 12,
 selected_node_stroke_width: 4,
 selected_node_stroke_max_width: 24,
 node_stroke_witdh_scale: 5,
+node_title_size_min: 0,
+/* minimum relative size for node title (in graph) */
+node_title_size_max: 5,
+/* maximum relative size for node title (in graph) */
+node_title_size_step: 0.1,
+/* step for relative size for node title (in graph) */
 node_fill_color: "#ffffff",
+/* default color to fill node background */
 highlighted_node_fill_color: "#ffff00",
+/* default color to fill highlighted node background */
+node_title_color: "#000000",
+/* default title color */
 node_label_distance: 5,
 /* Vertical distance between node and label */
 node_label_max_length: 60,
 /* Maximum displayed text length */
 label_untitled_nodes: "(untitled)",
 removePlugins : 'colorbutton,find,flash,font,forms,iframe,image,newpage,smiley,specialchar,stylescombo,templates',
 },
 /* NODE EDITOR OPTIONS */
+show_node_title_style: true,
 show_node_editor_uri: true,
 show_node_editor_title: true,
 show_node_editor_title_richtext: true,
 show_node_editor_description: true,
 show_node_editor_description_richtext: true,
 show_node_editor_size: true,
-show_node_editor_style: true,
+show_node_editor_style: true, // show node title style editor
 show_node_editor_style_color: true,
 show_node_editor_style_dash: true,
 show_node_editor_style_thickness: true,
 show_node_editor_image: true,
 show_node_editor_creator: true,
 "Search in graph":"Rechercher dans carte",
 "Search in " : "Chercher dans ",
 "Show hidden nodes": "Montrer les noeuds cachés",
 "Show neighbors": "Montrer les voisins",
 "Hide": "Cacher",
-"Fullscreen not supported by your browser": "Le plein écran n'est pas supporté par votre navigateur"
+"Fullscreen not supported by your browser": "Le plein écran n'est pas supporté par votre navigateur",
+"Title size:": "Taille :",
+"Title color:": "Couleur :",
 }
 };
 /* Saves the Full JSON at each modification */
 console.error("No such LDT Bin Type");
 };
 var ProjectBin = Ldt.ProjectBin = Rkns.Utils.inherit(Rkns._BaseBin);
-ProjectBin.prototype.tagTemplate = renkanJST['templates/ldtjson-bin/tagtemplate.html'];
-ProjectBin.prototype.annotationTemplate = renkanJST['templates/ldtjson-bin/annotationtemplate.html'];
 ProjectBin.prototype._init = function(_renkan, _opts) {
 this.renkan = _renkan;
+this.tagTemplate = _renkan.options.templates['templates/ldtjson-bin/tagtemplate.html'];
+this.annotationTemplate = _renkan.options.templates['templates/ldtjson-bin/annotationtemplate.html'];
 this.proj_id = _opts.project_id;
 this.ldt_platform = _opts.ldt_platform || "http://ldt.iri.centrepompidou.fr/";
 this.title_$.html(_opts.title);
 this.title_icon_$.addClass('Rk-Ldt-Title-Icon');
 this.refresh();
 );
 };
 var ResultsBin = Ldt.ResultsBin = Rkns.Utils.inherit(Rkns._BaseBin);
-ResultsBin.prototype.segmentTemplate = renkanJST['templates/ldtjson-bin/segmenttemplate.html'];
 ResultsBin.prototype._init = function(_renkan, _opts) {
 this.renkan = _renkan;
+this.segmentTemplate = _renkan.options.templates['templates/ldtjson-bin/segmenttemplate.html'];
 this.ldt_platform = _opts.ldt_platform || "http://ldt.iri.centrepompidou.fr/";
 this.max_results = _opts.max_results || 50;
 this.search = _opts.search;
 this.title_$.html('Lignes de Temps: "' + _opts.search + '"');
 this.title_icon_$.addClass('Rk-Ldt-Title-Icon');
 Rkns.ResourceList = {};
 Rkns.ResourceList.Bin = Rkns.Utils.inherit(Rkns._BaseBin);
-Rkns.ResourceList.Bin.prototype.resultTemplate = renkanJST['templates/list-bin.html'];
 Rkns.ResourceList.Bin.prototype._init = function(_renkan, _opts) {
 this.renkan = _renkan;
+this.resultTemplate = _renkan.options.templates['templates/list-bin.html'];
 this.title_$.html(_opts.title);
 if (_opts.list) {
 this.data = _opts.list;
 }
 this.refresh();
 );
 };
 Rkns.Wikipedia.Bin = Rkns.Utils.inherit(Rkns._BaseBin);
-Rkns.Wikipedia.Bin.prototype.resultTemplate = renkanJST['templates/wikipedia-bin/resulttemplate.html'];
 Rkns.Wikipedia.Bin.prototype._init = function(_renkan, _opts) {
 this.renkan = _renkan;
 this.search = _opts.search;
+this.resultTemplate = _renkan.options.templates['templates/wikipedia-bin/resulttemplate.html'];
 this.lang = _opts.lang || "en";
 this.title_icon_$.addClass('Rk-Wikipedia-Title-Icon Rk-Wikipedia-Lang-' + this.lang);
 this.title_$.html(this.search).addClass("Rk-Wikipedia-Title");
 this.refresh();
 };
 show: function() {
 this.sector.show();
 },
 hide: function() {
 if (this.sector){
 this.sector.hide();
 }
 },
 select: function() {
 this.sector.select();
 },
 var clean_title = div.textContent || div.innerText || "";
 var _text = clean_title || this.renkan.translate(this.options.label_untitled_nodes) || "";
 _text = Utils.shortenText(_text, this.options.node_label_max_length);
+//_formatedText = _text;
 if (typeof this.highlighted === "object") {
-this.title.html(this.highlighted.replace(_(_text).escape(),'<span class="Rk-Highlighted">$1</span>'));
+_text = this.highlighted.replace(_(_text).escape(),'<span class="Rk-Highlighted">$1</span>');
-} else {
+}
-this.title.text(_text);
-}
+//TODO: default text node color
+var node_style = (this.model.get("style") || {'title_size': 1, 'title-color': '#00000' });
+var text_size = node_style.title_size || 1;
+var text_color = node_style.title_color || this.options.node_title_color;
+var text_style = {
+'line-height': "1em"
+};
+if(text_size !== 1) {
+text_style['font-size'] = text_size.toFixed(1)+"em";
+}
+//TODO: compare with default value
+if(text_color !== "#000000") {
+text_style.color = text_color;
+}
+var text_node = $("<span>").css(text_style).html(_text);
+this.title.empty().append(text_node);
 var _strokeWidth = this._getStrokeWidth();
 this.title.css({
 left: this.paper_coords.x,
 top: this.paper_coords.y + this.circle_radius * this.h_ratio + this.options.node_label_distance + 0.5*_strokeWidth,
 _(NodeEditor.prototype).extend({
 _init: function() {
 BaseEditor.prototype._init.apply(this);
 this.template = this.options.templates['templates/nodeeditor.html'];
-//this.templates['default']= this.options.templates['templates/nodeeditor.html'];
 //fusionner avec this.options.node_editor_templates
 this.readOnlyTemplate = this.options.node_editor_templates;
 },
 draw: function() {
 var _model = this.source_representation.model,
 short_uri:  Utils.shortenText((_model.get("uri") || "").replace(/^(https?:\/\/)?(www\.)?/,'').replace(/\/$/,''),40),
 description: _model.get("description"),
 image: _model.get("image") || "",
 image_placeholder: _image_placeholder,
 color: (_model.has("style") && _model.get("style").color) || _created_by.get("color"),
+title_size: (_model.has("style") && _model.get("style").title_size) || 1,
+title_color: (_model.has("style") && _model.get("style").title_color) || this.options.node_title_color,
 thickness: (_model.has("style") && _model.get("style").thickness) || 1,
 dash: _model.has("style") && _model.get("style").dash ? "checked" : "",
 clip_path: _model.get("clip_path") || false,
 created_by_color: _created_by.get("color"),
 created_by_title: _created_by.get("title"),
 }
 });
 }
 this.editor_$.find(".Rk-Edit-Title")[0].focus();
-var _picker = _this.editor_$.find(".Rk-Edit-ColorPicker");
+var _picker = _this.editor_$.find(".Rk-Editor-ColorPicker-Node");
 this.editor_$.find(".Rk-Edit-ColorPicker-Wrapper").hover(
 function(_e) {
 _e.preventDefault();
 _picker.show();
 this.editor_$.find("#Rk-Edit-Thickness-Up").click(function() {
 shiftThickness(1);
 return false;
 });
+var shiftTitleSize = function(n) {
+var min = _this.options.node_title_size_min;
+var max = _this.options.node_title_size_max;
+if (_this.renderer.isEditable()) {
+var _oldTitleSize = ((_model.has('style') && _model.get('style').title_size) || 1),
+_newTitleSize = n + _oldTitleSize;
+if(_newTitleSize < min ) {
+_newTitleSize = min;
+}
+else if (_newTitleSize > max) {
+_newTitleSize = max;
+}
+if (_newTitleSize !== _oldTitleSize) {
+_this.editor_$.find("#Rk-Edit-Title-Size-Value").text(_newTitleSize.toFixed(1));
+_model.set("style", _.assign( ((_model.has("style") && _.clone(_model.get("style"))) || {}), {title_size: _newTitleSize}));
+paper.view.draw();
+}
+}
+else {
+closeEditor();
+}
+};
+var _pickerTitle = _this.editor_$.find(".Rk-Editor-ColorPicker-Title");
+this.editor_$.find(".Rk-Editor-p-title-color").hover(
+function(_e) {
+_e.preventDefault();
+_pickerTitle.show();
+},
+function(_e) {
+_e.preventDefault();
+_pickerTitle.hide();
+}
+);
+_pickerTitle.find("li").hover(
+function(_e) {
+_e.preventDefault();
+_this.editor_$.find(".Rk-Editor-p-title-color .Rk-Edit-Color").css("background", $(this).attr("data-color"));
+},
+function(_e) {
+_e.preventDefault();
+var title_color = (_model.has("style") && _model.get("style").title_color) || _this.options.node_fill_color;
+_this.editor_$.find(".Rk-Editor-p-title-color .Rk-Edit-Color").css("background", title_color);
+}
+).click(function(_e) {
+_e.preventDefault();
+if (_this.renderer.isEditable()) {
+_model.set("style", _.assign( ((_model.has("style") && _.clone(_model.get("style"))) || {}), {title_color: $(this).attr("data-color")}));
+_pickerTitle.hide();
+paper.view.draw();
+} else {
+closeEditor();
+}
+});
+this.editor_$.find("#Rk-Edit-Title-Size-Down").click(function() {
+var step = _this.options.node_title_size_step;
+shiftTitleSize(-step);
+return false;
+});
+this.editor_$.find("#Rk-Edit-Title-Size-Up").click(function() {
+var step = _this.options.node_title_size_step;
+shiftTitleSize(step);
+return false;
+});
 this.editor_$.find(".Rk-Edit-Image-Del").click(function() {
 _this.editor_$.find(".Rk-Edit-Image").val('');
 onFieldChange();
 return false;
 });
 });
 },
 redraw: function() {
 if (this.options.popup_editor){
 var _coords = this.source_representation.paper_coords;
-Utils.drawEditBox(this.options, _coords, this.editor_block, this.source_representation.circle_radius * 0.75, this.editor_$);
+Utils.drawEditBox(this.options, _coords, this.editor_block, this.source_representation.circle_radius * 0.75, this.editor_$, this.renderer.renkan);
 }
 this.editor_$.show();
 paper.view.draw();
 },
 destroy: function() {
 } else {
 closeEditor();
 }
 });
-var _picker = _this.editor_$.find(".Rk-Edit-ColorPicker");
+var _picker = _this.editor_$.find(".Rk-Editor-ColorPicker-Edge");
 this.editor_$.find(".Rk-Edit-ColorPicker-Wrapper").hover(
 function(_e) {
 _e.preventDefault();
 _picker.show();
 }
 },
 redraw: function() {
 if (this.options.popup_editor){
 var _coords = this.source_representation.paper_coords;
-Utils.drawEditBox(this.options, _coords, this.editor_block, 5, this.editor_$);
+Utils.drawEditBox(this.options, _coords, this.editor_block, 5, this.editor_$, this.renderer.renkan);
 }
 this.editor_$.show();
 paper.view.draw();
 }
 }).value();
 }
 },
 touchend: function(_event) {
 _event.preventDefault();
 _this.onMouseUp(_event.originalEvent.changedTouches[0], true);
+},
+click: function(_event) {
+_event.preventDefault();
+_this.onClick(_event);
 },
 dblclick: function(_event) {
 _event.preventDefault();
 if (_renkan.options.allow_double_click) {
 _this.onDoubleClick(_event);
 });
 }
 if (_renkan.options.show_user_list && _renkan.options.user_color_editable) {
 var $cpwrapper = this.$.find(".Rk-Users .Rk-Edit-ColorPicker-Wrapper"),
-$cplist = this.$.find(".Rk-Users .Rk-Edit-ColorPicker");
+$cplist = this.$.find(".Rk-Users .Rk-Editor-ColorPicker-User");
 $cpwrapper.hover(
 function(_e) {
 if (_this.isEditable()) {
 _e.preventDefault();
 this.view.setScale( this.view.scale * Math.SQRT1_2, this.view.offset.add(_delta.divide(Math.SQRT2)));
 }
 this.totalScroll = 0;
 }
 },
+onClick: function(_event) {
+if (!this.isEditable()) {
+var _off = this.canvas_$.offset(),
+_point = new paper.Point([
+_event.pageX - _off.left,
+_event.pageY - _off.top
+]);
+var _hitResult = paper.project.hitTest(_point);
+if(!this._open_uri_cb &&
+this.renkan.options.simple_click_open_url &&
+_hitResult &&
+typeof _hitResult.item.__representation !== "undefined" &&
+_hitResult.item.__representation.model.get('uri') &&
+!this._node_click_open_url
+) {
+this._node_click_open_url = setTimeout(function() {
+window.open(_hitResult.item.__representation.model.get('uri'), '_blank');
+this._node_click_open_url = null;
+}.bind(this), 200);
+}
+}
+},
 onDoubleClick: function(_event) {
 var _off = this.canvas_$.offset(),
 _point = new paper.Point([
 _event.pageX - _off.left,
 _event.pageY - _off.top
 ]);
 var _hitResult = paper.project.hitTest(_point);
 if (!this.isEditable()) {
-if (_hitResult && typeof _hitResult.item.__representation !== "undefined") {
+if (this.renkan.options.double_click_open_url &&
-if (_hitResult.item.__representation.model.get('uri')){
+_hitResult &&
-window.open(_hitResult.item.__representation.model.get('uri'), '_blank');
+typeof _hitResult.item.__representation !== "undefined" &&
-}
+_hitResult.item.__representation.model.get('uri') &&
+!this._node_click_open_url
+) {
+window.open(_hitResult.item.__representation.model.get('uri'), '_blank');
 }
 return;
 }
 if (this.isEditable() && (!_hitResult || typeof _hitResult.item.__representation === "undefined")) {
 var _coords = this.toModelCoords(_point),

renkan