From 90f4d3fcf6f844ce18779bb4f6fe8f72867c4ef7 Mon Sep 17 00:00:00 2001 From: =?utf8?q?Aleksander=20=C5=81ukasz?= Date: Mon, 24 Mar 2014 10:17:15 +0100 Subject: [PATCH] editor - popup for inserting/editing links --- src/editor/modules/documentCanvas/commands.js | 157 +++++++++++++----- 1 file changed, 114 insertions(+), 43 deletions(-) diff --git a/src/editor/modules/documentCanvas/commands.js b/src/editor/modules/documentCanvas/commands.js index 7302df3..55de02c 100644 --- a/src/editor/modules/documentCanvas/commands.js +++ b/src/editor/modules/documentCanvas/commands.js @@ -1,9 +1,11 @@ define([ './canvas/utils', +'views/dialog/dialog', 'fnpjs/datetime' -], function(utils, datetime) { +], function(utils, Dialog, datetime) { 'use strict'; +/* globals gettext */ var gridToggled = false; @@ -105,15 +107,21 @@ commands.register('newNodeRequested', function(canvas, params, user) { var cursor = canvas.getCursor(), selectionStart = cursor.getSelectionStart(), selectionEnd = cursor.getSelectionEnd(), - wlxmlNode, caretTo, wrapper, wrapperCanvasElement; + wlxmlNode, caretTo, wrapperCanvasElement; - var insertNode = function(insertion) { + var insertNode = function(insertion, callback) { var doc = canvas.wlxmlDocument, - node, metadata, creator; + node, metadata, creator, dialog; - doc.startTransaction(); - node = insertion(); - if(node.getTagName() === 'aside' && node.getClass() === 'comment') { + var execCallback = function(node) { + if(callback) { + callback(node); + } + }; + + if(params.wlxmlTag === 'aside' && params.wlxmlClass === 'comment') { + doc.startTransaction(); + node = insertion(); if(user) { creator = user.name; if(user.email) { @@ -126,38 +134,68 @@ commands.register('newNodeRequested', function(canvas, params, user) { metadata = node.getMetadata(); metadata.add({key: 'creator', value: creator}); metadata.add({key: 'date', value: datetime.currentStrfmt()}); + doc.endTransaction(); + execCallback(node); + } else if(params.wlxmlClass === 'link') { + dialog = Dialog.create({ + title: gettext('Create link'), + executeButtonText: gettext('Apply'), + cancelButtonText: gettext('Cancel'), + fields: [ + {label: gettext('Link'), name: 'href', type: 'input'} + ] + }); + dialog.on('execute', function(event) { + doc.startTransaction(); + node = insertion(); + node.setAttr('href', event.formData.href); + doc.endTransaction(); + event.success(); + execCallback(node); + }); + dialog.show(); + } else { + doc.startTransaction(); + node = insertion(); + doc.endTransaction(); + execCallback(node); } - doc.endTransaction(); - return node; }; - if(cursor.isSelecting()) { if(cursor.isSelectingSiblings()) { if(cursor.isSelectingWithinElement()) { wlxmlNode = selectionStart.element.data('wlxmlNode'); caretTo = selectionStart.offset < selectionEnd.offset ? 'start' : 'end'; - wrapper = insertNode(function() { - return wlxmlNode.wrapWith({tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}, start: selectionStart.offset, end: selectionEnd.offset}); - }); - wrapperCanvasElement = utils.findCanvasElement(wrapper); - canvas.setCurrentElement(wrapperCanvasElement.children()[0], {caretTo: caretTo}); + insertNode( + function() { + return wlxmlNode.wrapWith({tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}, start: selectionStart.offset, end: selectionEnd.offset}); + }, + function(wrapper) { + wrapperCanvasElement = utils.findCanvasElement(wrapper); + canvas.setCurrentElement(wrapperCanvasElement.children()[0], {caretTo: caretTo}); + } + ); } else { wlxmlNode = selectionStart.element.data('wlxmlNode').parent(); caretTo = selectionStart.element.sameNode(cursor.getSelectionAnchor().element) ? 'end' : 'start'; - wrapper = insertNode(function() { - return wlxmlNode.wrapText({ - _with: {tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}}, - offsetStart: selectionStart.offset, - offsetEnd: selectionEnd.offset, - textNodeIdx: [wlxmlNode.indexOf(selectionStart.element.data('wlxmlNode')), wlxmlNode.indexOf(selectionEnd.element.data('wlxmlNode'))] //parent.childIndex(selectionEnd.element)] - }); - }); - wrapperCanvasElement = utils.findCanvasElement(wrapper); - canvas.setCurrentElement(wrapperCanvasElement.children()[caretTo === 0 ? 0 : wrapperCanvasElement.children().length - 1], {caretTo: caretTo}); + insertNode( + function() { + return wlxmlNode.wrapText({ + _with: {tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}}, + offsetStart: selectionStart.offset, + offsetEnd: selectionEnd.offset, + textNodeIdx: [wlxmlNode.indexOf(selectionStart.element.data('wlxmlNode')), wlxmlNode.indexOf(selectionEnd.element.data('wlxmlNode'))] //parent.childIndex(selectionEnd.element)] + }); + }, + function(wrapper) { + wrapperCanvasElement = utils.findCanvasElement(wrapper); + canvas.setCurrentElement(wrapperCanvasElement.children()[caretTo === 0 ? 0 : wrapperCanvasElement.children().length - 1], {caretTo: caretTo}); + } + ); } } else { var node1 = selectionStart.element.data('wlxmlNode'), @@ -165,32 +203,65 @@ commands.register('newNodeRequested', function(canvas, params, user) { siblingParents = canvas.wlxmlDocument.getSiblingParents({node1: node1, node2: node2}); if(siblingParents) { - insertNode(function() { - return canvas.wlxmlDocument.wrapNodes({ - node1: siblingParents.node1, - node2: siblingParents.node2, - _with: {tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}} - }); - }); + insertNode( + function() { + return canvas.wlxmlDocument.wrapNodes({ + node1: siblingParents.node1, + node2: siblingParents.node2, + _with: {tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}} + }); + } + ); } } } else if(canvas.getCurrentNodeElement()) { wlxmlNode = canvas.getCurrentNodeElement().data('wlxmlNode'); + + var linkFound = [wlxmlNode].concat(wlxmlNode.parents()).some(function(node) { + if(node.getClass() === 'link') { + var dialog = Dialog.create({ + title: gettext('Edit link'), + executeButtonText: gettext('Apply'), + cancelButtonText: gettext('Cancel'), + fields: [ + {label: gettext('Link'), name: 'href', type: 'input', initialValue: node.getAttr('href')}, + ] + }); + dialog.on('execute', function(event) { + canvas.wlxmlDocument.startTransaction(); + node.setAttr('href', event.formData.href); + event.success(); + canvas.wlxmlDocument.endTransaction(); + }); + dialog.show(); + return true; + } + }); + if(linkFound) { + return; + } + if(params.ctrlKey) { - wrapper = insertNode(function() { - return wlxmlNode.wrapWith({tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}}); - }); + insertNode( + function() { + return wlxmlNode.wrapWith({tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}}); + }, + function(wrapper) { + canvas.setCurrentElement(utils.findCanvasElement(wrapper)); + } + ); } else { - wrapper = insertNode(function() { - var node = wlxmlNode.after({tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}}); - node.append({text:''}); - return node; - }); + insertNode( + function() { + var node = wlxmlNode.after({tagName: params.wlxmlTag, attrs: {'class': params.wlxmlClass}}); + node.append({text:''}); + return node; + }, function(wrapper) { + canvas.setCurrentElement(utils.findCanvasElement(wrapper)); + } + ); } - canvas.setCurrentElement(utils.findCanvasElement(wrapper)); } - - }); commands.register('footnote', function(canvas, params) { -- 2.20.1