From 5328871ba6a294a7ae8aa2e0d1150ad5cce26fe7 Mon Sep 17 00:00:00 2001 From: cohitre Date: Thu, 21 Jun 2012 13:56:26 -0700 Subject: [PATCH 1/2] Moving the formatting buttons to a plugin. --- available_plugins/ep_formatting/ep.json | 13 ++++ available_plugins/ep_formatting/package.json | 10 +++ available_plugins/ep_formatting/plugin.js | 6 ++ .../ep_formatting/static/js/toolbarButtons.js | 58 +++++++++++++++ .../ep_formatting/templates/buttons.ejs | 58 +++++++++++++++ src/static/js/pad_editbar.js | 71 +++++++------------ src/templates/pad.html | 66 ++--------------- 7 files changed, 176 insertions(+), 106 deletions(-) create mode 100644 available_plugins/ep_formatting/ep.json create mode 100644 available_plugins/ep_formatting/package.json create mode 100644 available_plugins/ep_formatting/plugin.js create mode 100644 available_plugins/ep_formatting/static/js/toolbarButtons.js create mode 100644 available_plugins/ep_formatting/templates/buttons.ejs diff --git a/available_plugins/ep_formatting/ep.json b/available_plugins/ep_formatting/ep.json new file mode 100644 index 000000000..ebe4d1aa3 --- /dev/null +++ b/available_plugins/ep_formatting/ep.json @@ -0,0 +1,13 @@ +{ + "parts": [ + { + "name": "basic-formatting", + "client_hooks": { + "postAceInit": "ep_formatting/static/js/toolbarButtons:postAceInit" + }, + "hooks": { + "eejsBlock_editbarMenuLeft": "ep_formatting/plugin:eejsBlock_editbarMenuLeft" + } + } + ] +} diff --git a/available_plugins/ep_formatting/package.json b/available_plugins/ep_formatting/package.json new file mode 100644 index 000000000..48b687618 --- /dev/null +++ b/available_plugins/ep_formatting/package.json @@ -0,0 +1,10 @@ +{ + "author": "cohitre (http://cohitre.com)", + "name": "ep_formatting", + "description": "Show basic formatting options in the etherpad-lite toolbar.", + "version": "0.0.1", + "repository": { + "type": "git", + "url": "https://github.com/Pita/etherpad-lite" + } +} diff --git a/available_plugins/ep_formatting/plugin.js b/available_plugins/ep_formatting/plugin.js new file mode 100644 index 000000000..f82c1183e --- /dev/null +++ b/available_plugins/ep_formatting/plugin.js @@ -0,0 +1,6 @@ +var eejs = require('ep_etherpad-lite/node/eejs/'); + +exports.eejsBlock_editbarMenuLeft = function (hook_name, args, cb) { + args.content = args.content + eejs.require("ep_formatting/templates/buttons.ejs"); + return cb(); +} diff --git a/available_plugins/ep_formatting/static/js/toolbarButtons.js b/available_plugins/ep_formatting/static/js/toolbarButtons.js new file mode 100644 index 000000000..d5ffb22cf --- /dev/null +++ b/available_plugins/ep_formatting/static/js/toolbarButtons.js @@ -0,0 +1,58 @@ +var _ = require('ep_etherpad-lite/static/js/underscore') + , padeditor = require('ep_etherpad-lite/static/js/pad_editor').padeditor + , padeditbar = require('ep_etherpad-lite/static/js/pad_editbar').padeditbar + , simpleCommands = ["bold", "italic", "underline", "strikethrough"]; + +function registerCallWithAceCommand(commandName, callback) { + padeditbar.registerToolbarCommand(commandName, function () { + padeditor.ace.callWithAce(callback, commandName, true); + }); +} + +exports.postAceInit = function () { + _.each(simpleCommands, function (commandName) { + registerCallWithAceCommand(commandName, function (ace) { + ace.ace_toggleAttributeOnSelection(commandName) + }); + }); + + _.each(["undo", "redo"], function (commandName) { + registerCallWithAceCommand(commandName, function (ace) { + ace.ace_doUndoRedo(commandName); + }); + }); + + registerCallWithAceCommand('insertunorderedlist', function (ace) { + ace.ace_doInsertUnorderedList(); + }); + + registerCallWithAceCommand("insertorderedlist", function (ace) { + ace.ace_doInsertOrderedList(); + }); + + registerCallWithAceCommand("indent", function (ace) { + if (!ace.ace_doIndentOutdent(false)) { + ace.ace_doInsertUnorderedList(); + } + }); + + registerCallWithAceCommand("outdent", function (ace) { + ace.ace_doIndentOutdent(true); + }); + + registerCallWithAceCommand("clearauthorship", function (ace) { + if ((!(ace.ace_getRep().selStart && ace.ace_getRep().selEnd)) || ace.ace_isCaret()) + { + if (window.confirm("Clear authorship colors on entire document?")) + { + ace.ace_performDocumentApplyAttributesToCharRange(0, ace.ace_getRep().alltext.length, [ + ['author', ''] + ]); + } + } + else + { + ace.ace_setAttributeOnSelection('author', ''); + } + }); +}; diff --git a/available_plugins/ep_formatting/templates/buttons.ejs b/available_plugins/ep_formatting/templates/buttons.ejs new file mode 100644 index 000000000..25caec5fd --- /dev/null +++ b/available_plugins/ep_formatting/templates/buttons.ejs @@ -0,0 +1,58 @@ +
  • + + + +
    • +
  • + + + +
    • +
  • + + + +
    • +
  • + + + +
    • +
  • +
  • + + + +
    • +
  • + + + +
    • +
  • + + + +
    • +
  • + + + +
    • +
  • +
  • + + + +
    • +
  • + + + +
    • +
  • +
  • + + + +
    • diff --git a/src/static/js/pad_editbar.js b/src/static/js/pad_editbar.js index 51c5a3c6a..b0fea00b5 100644 --- a/src/static/js/pad_editbar.js +++ b/src/static/js/pad_editbar.js @@ -1,5 +1,5 @@ /** - * This code is mostly from the old Etherpad. Please help us to comment this code. + * This code is mostly from the old Etherpad. Please help us to comment this code. * This helps other people to understand this code better and helps them to improve it. * TL;DR COMMENTS ON THIS FILE ARE HIGHLY APPRECIATED */ @@ -116,8 +116,25 @@ var padeditbar = (function() { $("#editbar").addClass('disabledtoolbar').removeClass("enabledtoolbar"); }, + hasToolbarCommand: function (commandName) { + return this.toolbarCommands && this.toolbarCommands[commandName] !== undefined; + }, + registerToolbarCommand: function (commandName, method) { + this.toolbarCommands = this.toolbarCommands || {}; + this.toolbarCommands[commandName] = method; + return this; + }, + executeToolbarCommand: function (commandName) { + var args = Array.prototype.slice.call(arguments, 1); + + if (this.hasToolbarCommand(commandName)) { + this.toolbarCommands[commandName].apply(this, args); + } + + return this; + }, toolbarClick: function(cmd) - { + { if (self.isEnabled()) { if(cmd == "showusers") @@ -136,48 +153,14 @@ var padeditbar = (function() } else if (cmd == 'import_export') { - self.toogleDropDown("importexport"); + self.toogleDropDown("importexport"); } else if (cmd == 'savedRevision') { padsavedrevs.saveNow(); } - else - { - padeditor.ace.callWithAce(function(ace) - { - if (cmd == 'bold' || cmd == 'italic' || cmd == 'underline' || cmd == 'strikethrough') ace.ace_toggleAttributeOnSelection(cmd); - else if (cmd == 'undo' || cmd == 'redo') ace.ace_doUndoRedo(cmd); - else if (cmd == 'insertunorderedlist') ace.ace_doInsertUnorderedList(); - else if (cmd == 'insertorderedlist') ace.ace_doInsertOrderedList(); - else if (cmd == 'indent') - { - if (!ace.ace_doIndentOutdent(false)) - { - ace.ace_doInsertUnorderedList(); - } - } - else if (cmd == 'outdent') - { - ace.ace_doIndentOutdent(true); - } - else if (cmd == 'clearauthorship') - { - if ((!(ace.ace_getRep().selStart && ace.ace_getRep().selEnd)) || ace.ace_isCaret()) - { - if (window.confirm("Clear authorship colors on entire document?")) - { - ace.ace_performDocumentApplyAttributesToCharRange(0, ace.ace_getRep().alltext.length, [ - ['author', ''] - ]); - } - } - else - { - ace.ace_setAttributeOnSelection('author', ''); - } - } - }, cmd, true); + else if (self.hasToolbarCommand(cmd)) { + self.executeToolbarCommand(cmd); } } if(padeditor.ace) padeditor.ace.focus(); @@ -185,7 +168,7 @@ var padeditbar = (function() toogleDropDown: function(moduleName) { var modules = ["settings", "importexport", "embed", "users"]; - + // hide all modules and remove highlighting of all buttons if(moduleName == "none") { @@ -194,9 +177,9 @@ var padeditbar = (function() //skip the userlist if(modules[i] == "users") continue; - + var module = $("#" + modules[i]); - + if(module.css('display') != "none") { $("#" + modules[i] + "link").removeClass("selected"); @@ -204,14 +187,14 @@ var padeditbar = (function() } } } - else + else { // hide all modules that are not selected and remove highlighting // respectively add highlighting to the corresponding button for(var i=0;i
      @@ -325,13 +267,13 @@