define([
'libs/jquery',
- './dialog',
+ 'views/dialog/dialog',
'wlxml/wlxml',
'wlxml/extensions/list/list',
'fnpjs/logging/logging',
+++ /dev/null
-@import 'dialog.less';
\ No newline at end of file
+++ /dev/null
-<div class="rng-dialog modal hide static">
- <div class="modal-header">
- <button type="button" class="close">×</button>
- <h1><%= title %></h1>
- </div>
- <div class="modal-body">
- </div>
- <div class="modal-footer">
- <a href="#" class="btn btn-info btn-mini execute-btn"><%= executeButtonText %></a>
- <a href="#" class="btn btn-danger btn-mini cancel-btn"><%= cancelButtonText %></a>
- </div>
-</div>
\ No newline at end of file
+++ /dev/null
-define(function(require) {
-
- /* globals gettext */
- 'use strict';
-
- var _ = require('libs/underscore'),
- Backbone = require('libs/backbone'),
- dialogTemplate = require('libs/text!./dialog.html'),
- fieldTemplates = {};
- fieldTemplates.checkbox = require('libs/text!./templates/checkbox.html');
- fieldTemplates.select = require('libs/text!./templates/select.html');
- fieldTemplates.textarea = require('libs/text!./templates/textarea.html');
- fieldTemplates.input = require('libs/text!./templates/input.html');
-
-
-
- var DialogView = Backbone.View.extend({
- template: _.template(dialogTemplate),
- events: {
- 'click .execute-btn': 'onExecute',
- 'click .cancel-btn': 'onCancel',
- 'click .close': 'close'
- },
- initialize: function() {
- _.bindAll(this);
- this.actionsDisabled = false;
- },
- show: function() {
- this.setElement(this.template(_.extend({
- executeButtonText: gettext('Submit'),
- cancelButtonText: gettext('Cancel')
- }, this.options)));
-
- var body = this.$('.modal-body');
- (this.options.fields || []).forEach(function(field) {
- var template = fieldTemplates[field.type];
- if(!template) {
- throw new Error('Field type {type} not recognized.'.replace('{type}', field.type));
- }
- body.append(
- _.template(template)(_.extend({description: ''}, field))
- );
- });
-
- if(this.options.text) {
- body.append('<p>' + this.options.text + '</p>');
- }
-
- this.$el.modal({backdrop: 'static'});
- this.$el.modal('show');
- this.$('textarea').focus();
- },
- onExecute: function(e) {
- e.preventDefault();
- var view = this,
- formData = {};
-
- (this.options.fields || []).forEach(function(field) {
- var widget = view.$('[name=' + field.name +']');
- formData[field.name] = widget.val();
- });
-
- this.trigger('execute', {
- formData: formData,
- success: function() { view.actionsDisabled = false; view.close(); },
- error: function() { view.actionsDisabled = false; view.close(); },
- });
- },
- onCancel: function() {
- this.trigger('cancel');
- this.close();
- },
- close: function(e) {
- if(e) {
- e.preventDefault();
- }
- if(!this.actionsDisabled) {
- this.$el.modal('hide');
- this.$el.remove();
- }
- this.trigger('close');
- },
- toggleButtons: function(toggle) {
- this.$('.btn, button').toggleClass('disabled', !toggle);
- this.$('textarea').attr('disabled', !toggle);
- this.actionsDisabled = !toggle;
- }
- });
-
- return {
- create: function(config) {
- return new DialogView(config);
- }
- };
-
-});
\ No newline at end of file
+++ /dev/null
-.rng-dialog {
- textarea {
- padding: 3px 3px;
- margin: 5px auto;
- width: 95%;
- display: block;
- }
-
- h1, label {
- font-size: 12px;
- line-height: 12px;
-
- }
-
- h1 {
- margin: 2px 5px;
- font-weight: bold;
- }
-
- .description {
- font-size: .8em;
- }
-
- width: 620px;
-}
\ No newline at end of file
+++ /dev/null
-<p>
- <div style="float: left; width:100px;"><%= label %>:</div>
- <input type="checkbox" name="<%= name %>"/>
- <span class="description"><%= description %></span>
-</p>
\ No newline at end of file
+++ /dev/null
-<p>
- <div style="float: left; width:100px;">
- <%= label %>:
- </div>
- <div>
- <input type="input" name="<%= name %>"/>
- <span class="description"><%= description %></span>
- </div>
-
-</p>
\ No newline at end of file
+++ /dev/null
-<p>
- <div style="float: left; width:100px;"><%= label %>:</div>
- <select name="<%= name %>">
- <% options.forEach(function(option) { %>
- <option value="<%= option.value %>"><%= option.text %></option>
- <% }); %>
- </select>
- <span class="description"><%= description %></span>
-</p>
\ No newline at end of file
+++ /dev/null
-<p>
- <label><%= label %></label>
- <textarea name="<%= name %>" rows="5"></textarea>
- <span class="description"><%= description %></span>
-</p>
define([
-'./canvas/utils'
-], function(utils) {
+'./canvas/utils',
+'views/dialog/dialog',
+'fnpjs/datetime'
+], function(utils, Dialog, datetime) {
'use strict';
+/* globals gettext */
var gridToggled = false;
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, currentDate, dt;
+ node, metadata, creator, dialog;
- var pad = function(number) {
- if(number < 10) {
- number = '0' + number;
+ var execCallback = function(node) {
+ if(callback) {
+ callback(node);
}
- return number;
};
- doc.startTransaction();
- node = insertion();
- if(node.getTagName() === 'aside' && node.getClass() === 'comment') {
+ if(params.wlxmlTag === 'aside' && params.wlxmlClass === 'comment') {
+ doc.startTransaction();
+ node = insertion();
if(user) {
creator = user.name;
if(user.email) {
creator = 'anonymous';
}
- currentDate = new Date();
- dt = pad(currentDate.getDate()) + '-' +
- pad((currentDate.getMonth() + 1)) + '-' +
- pad(currentDate.getFullYear()) + ' ' +
- pad(currentDate.getHours()) + ':' +
- pad(currentDate.getMinutes()) + ':' +
- pad(currentDate.getSeconds());
-
metadata = node.getMetadata();
metadata.add({key: 'creator', value: creator});
- metadata.add({key: 'date', value: dt});
+ 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'),
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) {
@import 'common.less';
@import '../views/openSelect/openSelect.less';
-@import '../modules/data/data.less';
+@import '../views/dialog/dialog.less';
@import '../modules/rng/rng.less';
@import '../modules/documentCanvas/documentCanvas.less';
@import '../modules/sourceEditor/sourceEditor.less';
--- /dev/null
+<div class="rng-dialog modal hide static">
+ <div class="modal-header">
+ <button type="button" class="close">×</button>
+ <h1><%= title %></h1>
+ </div>
+ <div class="modal-body">
+ </div>
+ <div class="modal-footer">
+ <a href="#" class="btn btn-info btn-mini execute-btn"><%= executeButtonText %></a>
+ <a href="#" class="btn btn-danger btn-mini cancel-btn"><%= cancelButtonText %></a>
+ </div>
+</div>
\ No newline at end of file
--- /dev/null
+define(function(require) {
+
+ /* globals gettext */
+ 'use strict';
+
+ var _ = require('libs/underscore'),
+ Backbone = require('libs/backbone'),
+ dialogTemplate = require('libs/text!./dialog.html'),
+ fieldTemplates = {};
+ fieldTemplates.checkbox = require('libs/text!./templates/checkbox.html');
+ fieldTemplates.select = require('libs/text!./templates/select.html');
+ fieldTemplates.textarea = require('libs/text!./templates/textarea.html');
+ fieldTemplates.input = require('libs/text!./templates/input.html');
+
+
+
+ var DialogView = Backbone.View.extend({
+ template: _.template(dialogTemplate),
+ events: {
+ 'click .execute-btn': 'onExecute',
+ 'click .cancel-btn': 'onCancel',
+ 'click .close': 'close'
+ },
+ initialize: function() {
+ _.bindAll(this);
+ this.actionsDisabled = false;
+ },
+ show: function() {
+ this.setElement(this.template(_.extend({
+ executeButtonText: gettext('Submit'),
+ cancelButtonText: gettext('Cancel')
+ }, this.options)));
+
+ var body = this.$('.modal-body');
+ (this.options.fields || []).forEach(function(field) {
+ var template = fieldTemplates[field.type];
+ if(!template) {
+ throw new Error('Field type {type} not recognized.'.replace('{type}', field.type));
+ }
+ body.append(
+ _.template(template)(_.extend({description: '', initialValue: ''}, field))
+ );
+ });
+
+ if(this.options.text) {
+ body.append('<p>' + this.options.text + '</p>');
+ }
+
+ this.$el.modal({backdrop: 'static'});
+ this.$el.modal('show');
+ this.$('textarea, input').first().focus();
+ },
+ onExecute: function(e) {
+ e.preventDefault();
+ var view = this,
+ formData = {};
+
+ (this.options.fields || []).forEach(function(field) {
+ var widget = view.$('[name=' + field.name +']');
+ formData[field.name] = widget.val();
+ });
+
+ this.trigger('execute', {
+ formData: formData,
+ success: function() { view.actionsDisabled = false; view.close(); },
+ error: function() { view.actionsDisabled = false; view.close(); },
+ });
+ },
+ onCancel: function() {
+ this.trigger('cancel');
+ this.close();
+ },
+ close: function(e) {
+ if(e) {
+ e.preventDefault();
+ }
+ if(!this.actionsDisabled) {
+ this.$el.modal('hide');
+ this.$el.remove();
+ }
+ this.trigger('close');
+ },
+ toggleButtons: function(toggle) {
+ this.$('.btn, button').toggleClass('disabled', !toggle);
+ this.$('textarea').attr('disabled', !toggle);
+ this.actionsDisabled = !toggle;
+ }
+ });
+
+ return {
+ create: function(config) {
+ return new DialogView(config);
+ }
+ };
+
+});
\ No newline at end of file
--- /dev/null
+.rng-dialog {
+ textarea {
+ padding: 3px 3px;
+ margin: 5px auto;
+ width: 95%;
+ display: block;
+ }
+
+ h1, label {
+ font-size: 12px;
+ line-height: 12px;
+
+ }
+
+ h1 {
+ margin: 2px 5px;
+ font-weight: bold;
+ }
+
+ .description {
+ font-size: .8em;
+ }
+
+ width: 620px;
+}
\ No newline at end of file
--- /dev/null
+<p>
+ <div style="float: left; width:100px;"><%= label %>:</div>
+ <input type="checkbox" name="<%= name %>"/>
+ <span class="description"><%= description %></span>
+</p>
\ No newline at end of file
--- /dev/null
+<p>
+ <div style="float: left; width:100px;">
+ <%= label %>:
+ </div>
+ <div>
+ <input type="input" name="<%= name %>" value="<%= initialValue %>"/>
+ <span class="description"><%= description %></span>
+ </div>
+
+</p>
\ No newline at end of file
--- /dev/null
+<p>
+ <div style="float: left; width:100px;"><%= label %>:</div>
+ <select name="<%= name %>">
+ <% options.forEach(function(option) { %>
+ <option value="<%= option.value %>"><%= option.text %></option>
+ <% }); %>
+ </select>
+ <span class="description"><%= description %></span>
+</p>
\ No newline at end of file
--- /dev/null
+<p>
+ <label><%= label %></label>
+ <textarea name="<%= name %>" rows="5"><%= initialValue %></textarea>
+ <span class="description"><%= description %></span>
+</p>