123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665 |
- // ----------------------------------------------------------------------------
- // markItUp! Universal MarkUp Engine, JQuery plugin
- // v 1.1.x
- // Dual licensed under the MIT and GPL licenses.
- // ----------------------------------------------------------------------------
- // Copyright (C) 2007-2012 Jay Salvat
- // http://markitup.jaysalvat.com/
- // ----------------------------------------------------------------------------
- // Permission is hereby granted, free of charge, to any person obtaining a copy
- // of this software and associated documentation files (the "Software"), to deal
- // in the Software without restriction, including without limitation the rights
- // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- // copies of the Software, and to permit persons to whom the Software is
- // furnished to do so, subject to the following conditions:
- //
- // The above copyright notice and this permission notice shall be included in
- // all copies or substantial portions of the Software.
- //
- // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
- // THE SOFTWARE.
- // ----------------------------------------------------------------------------
- (function($) {
- $.fn.markItUp = function(settings, extraSettings) {
- var method, params, options, ctrlKey, shiftKey, altKey; ctrlKey = shiftKey = altKey = false;
- if (typeof settings == 'string') {
- method = settings;
- params = extraSettings;
- }
- options = { id: '',
- nameSpace: '',
- root: '',
- previewHandler: false,
- previewInWindow: '', // 'width=800, height=600, resizable=yes, scrollbars=yes'
- previewInElement: '',
- previewAutoRefresh: true,
- previewPosition: 'after',
- previewTemplatePath: '~/templates/preview.html',
- previewParser: false,
- previewParserPath: '',
- previewParserVar: 'data',
- resizeHandle: true,
- beforeInsert: '',
- afterInsert: '',
- onEnter: {},
- onShiftEnter: {},
- onCtrlEnter: {},
- onTab: {},
- markupSet: [ { /* set */ } ]
- };
- $.extend(options, settings, extraSettings);
- // compute markItUp! path
- if (!options.root) {
- $('script').each(function(a, tag) {
- miuScript = $(tag).get(0).src.match(/(.*)jquery\.markitup(\.pack)?\.js$/);
- if (miuScript !== null) {
- options.root = miuScript[1];
- }
- });
- }
- // Quick patch to keep compatibility with jQuery 1.9
- var uaMatch = function(ua) {
- ua = ua.toLowerCase();
- var match = /(chrome)[ \/]([\w.]+)/.exec(ua) ||
- /(webkit)[ \/]([\w.]+)/.exec(ua) ||
- /(opera)(?:.*version|)[ \/]([\w.]+)/.exec(ua) ||
- /(msie) ([\w.]+)/.exec(ua) ||
- ua.indexOf("compatible") < 0 && /(mozilla)(?:.*? rv:([\w.]+)|)/.exec(ua) ||
- [];
- return {
- browser: match[ 1 ] || "",
- version: match[ 2 ] || "0"
- };
- };
- var matched = uaMatch( navigator.userAgent );
- var browser = {};
- if (matched.browser) {
- browser[matched.browser] = true;
- browser.version = matched.version;
- }
- if (browser.chrome) {
- browser.webkit = true;
- } else if (browser.webkit) {
- browser.safari = true;
- }
- return this.each(function() {
- var $$, textarea, levels, scrollPosition, caretPosition, caretOffset,
- clicked, hash, header, footer, previewWindow, template, iFrame, abort;
- $$ = $(this);
- textarea = this;
- levels = [];
- abort = false;
- scrollPosition = caretPosition = 0;
- caretOffset = -1;
- options.previewParserPath = localize(options.previewParserPath);
- options.previewTemplatePath = localize(options.previewTemplatePath);
- if (method) {
- switch(method) {
- case 'remove':
- remove();
- break;
- case 'insert':
- markup(params);
- break;
- default:
- $.error('Method ' + method + ' does not exist on jQuery.markItUp');
- }
- return;
- }
- // apply the computed path to ~/
- function localize(data, inText) {
- if (inText) {
- return data.replace(/("|')~\//g, "$1"+options.root);
- }
- return data.replace(/^~\//, options.root);
- }
- // init and build editor
- function init() {
- id = ''; nameSpace = '';
- if (options.id) {
- id = 'id="'+options.id+'"';
- } else if ($$.attr("id")) {
- id = 'id="markItUp'+($$.attr("id").substr(0, 1).toUpperCase())+($$.attr("id").substr(1))+'"';
- }
- if (options.nameSpace) {
- nameSpace = 'class="'+options.nameSpace+'"';
- }
- $$.wrap('<div '+nameSpace+'></div>');
- $$.wrap('<div '+id+' class="markItUp"></div>');
- $$.wrap('<div class="markItUpContainer"></div>');
- $$.addClass("markItUpEditor");
- // add the header before the textarea
- header = $('<div class="markItUpHeader"></div>').insertBefore($$);
- $(dropMenus(options.markupSet)).appendTo(header);
- // add the footer after the textarea
- footer = $('<div class="markItUpFooter"></div>').insertAfter($$);
- // add the resize handle after textarea
- if (options.resizeHandle === true && browser.safari !== true) {
- resizeHandle = $('<div class="markItUpResizeHandle"></div>')
- .insertAfter($$)
- .bind("mousedown.markItUp", function(e) {
- var h = $$.height(), y = e.clientY, mouseMove, mouseUp;
- mouseMove = function(e) {
- $$.css("height", Math.max(20, e.clientY+h-y)+"px");
- return false;
- };
- mouseUp = function(e) {
- $("html").unbind("mousemove.markItUp", mouseMove).unbind("mouseup.markItUp", mouseUp);
- return false;
- };
- $("html").bind("mousemove.markItUp", mouseMove).bind("mouseup.markItUp", mouseUp);
- });
- footer.append(resizeHandle);
- }
- // listen key events
- $$.bind('keydown.markItUp', keyPressed).bind('keyup', keyPressed);
-
- // bind an event to catch external calls
- $$.bind("insertion.markItUp", function(e, settings) {
- if (settings.target !== false) {
- get();
- }
- if (textarea === $.markItUp.focused) {
- markup(settings);
- }
- });
- // remember the last focus
- $$.bind('focus.markItUp', function() {
- $.markItUp.focused = this;
- });
- if (options.previewInElement) {
- refreshPreview();
- }
- }
- // recursively build header with dropMenus from markupset
- function dropMenus(markupSet) {
- var ul = $('<ul></ul>'), i = 0;
- $('li:hover > ul', ul).css('display', 'block');
- $.each(markupSet, function() {
- var button = this, t = '', title, li, j;
- title = (button.key) ? (button.name||'')+' [Ctrl+'+button.key+']' : (button.name||'');
- key = (button.key) ? 'accesskey="'+button.key+'"' : '';
- if (button.separator) {
- li = $('<li class="markItUpSeparator">'+(button.separator||'')+'</li>').appendTo(ul);
- } else {
- i++;
- for (j = levels.length -1; j >= 0; j--) {
- t += levels[j]+"-";
- }
- li = $('<li class="markItUpButton markItUpButton'+t+(i)+' '+(button.className||'')+'"><a href="" '+key+' title="'+title+'">'+(button.name||'')+'</a></li>')
- .bind("contextmenu.markItUp", function() { // prevent contextmenu on mac and allow ctrl+click
- return false;
- }).bind('click.markItUp', function(e) {
- e.preventDefault();
- }).bind("focusin.markItUp", function(){
- $$.focus();
- }).bind('mouseup', function() {
- if (button.call) {
- eval(button.call)();
- }
- setTimeout(function() { markup(button) },1);
- return false;
- }).bind('mouseenter.markItUp', function() {
- $('> ul', this).show();
- $(document).one('click', function() { // close dropmenu if click outside
- $('ul ul', header).hide();
- }
- );
- }).bind('mouseleave.markItUp', function() {
- $('> ul', this).hide();
- }).appendTo(ul);
- if (button.dropMenu) {
- levels.push(i);
- $(li).addClass('markItUpDropMenu').append(dropMenus(button.dropMenu));
- }
- }
- });
- levels.pop();
- return ul;
- }
- // markItUp! markups
- function magicMarkups(string) {
- if (string) {
- string = string.toString();
- string = string.replace(/\(\!\(([\s\S]*?)\)\!\)/g,
- function(x, a) {
- var b = a.split('|!|');
- if (altKey === true) {
- return (b[1] !== undefined) ? b[1] : b[0];
- } else {
- return (b[1] === undefined) ? "" : b[0];
- }
- }
- );
- // [![prompt]!], [![prompt:!:value]!]
- string = string.replace(/\[\!\[([\s\S]*?)\]\!\]/g,
- function(x, a) {
- var b = a.split(':!:');
- if (abort === true) {
- return false;
- }
- value = prompt(b[0], (b[1]) ? b[1] : '');
- if (value === null) {
- abort = true;
- }
- return value;
- }
- );
- return string;
- }
- return "";
- }
- // prepare action
- function prepare(action) {
- if ($.isFunction(action)) {
- action = action(hash);
- }
- return magicMarkups(action);
- }
- // build block to insert
- function build(string) {
- var openWith = prepare(clicked.openWith);
- var placeHolder = prepare(clicked.placeHolder);
- var replaceWith = prepare(clicked.replaceWith);
- var closeWith = prepare(clicked.closeWith);
- var openBlockWith = prepare(clicked.openBlockWith);
- var closeBlockWith = prepare(clicked.closeBlockWith);
- var multiline = clicked.multiline;
-
- if (replaceWith !== "") {
- block = openWith + replaceWith + closeWith;
- } else if (selection === '' && placeHolder !== '') {
- block = openWith + placeHolder + closeWith;
- } else {
- string = string || selection;
- var lines = [string], blocks = [];
-
- if (multiline === true) {
- lines = string.split(/\r?\n/);
- }
-
- for (var l = 0; l < lines.length; l++) {
- line = lines[l];
- var trailingSpaces;
- if (trailingSpaces = line.match(/ *$/)) {
- blocks.push(openWith + line.replace(/ *$/g, '') + closeWith + trailingSpaces);
- } else {
- blocks.push(openWith + line + closeWith);
- }
- }
-
- block = blocks.join("\n");
- }
- block = openBlockWith + block + closeBlockWith;
- return { block:block,
- openBlockWith:openBlockWith,
- openWith:openWith,
- replaceWith:replaceWith,
- placeHolder:placeHolder,
- closeWith:closeWith,
- closeBlockWith:closeBlockWith
- };
- }
- // define markup to insert
- function markup(button) {
- var len, j, n, i;
- hash = clicked = button;
- get();
- $.extend(hash, { line:"",
- root:options.root,
- textarea:textarea,
- selection:(selection||''),
- caretPosition:caretPosition,
- ctrlKey:ctrlKey,
- shiftKey:shiftKey,
- altKey:altKey
- }
- );
- // callbacks before insertion
- prepare(options.beforeInsert);
- prepare(clicked.beforeInsert);
- if ((ctrlKey === true && shiftKey === true) || button.multiline === true) {
- prepare(clicked.beforeMultiInsert);
- }
- $.extend(hash, { line:1 });
- if ((ctrlKey === true && shiftKey === true)) {
- lines = selection.split(/\r?\n/);
- for (j = 0, n = lines.length, i = 0; i < n; i++) {
- if ($.trim(lines[i]) !== '') {
- $.extend(hash, { line:++j, selection:lines[i] } );
- lines[i] = build(lines[i]).block;
- } else {
- lines[i] = "";
- }
- }
- string = { block:lines.join('\n')};
- start = caretPosition;
- len = string.block.length + ((browser.opera) ? n-1 : 0);
- } else if (ctrlKey === true) {
- string = build(selection);
- start = caretPosition + string.openWith.length;
- len = string.block.length - string.openWith.length - string.closeWith.length;
- len = len - (string.block.match(/ $/) ? 1 : 0);
- len -= fixIeBug(string.block);
- } else if (shiftKey === true) {
- string = build(selection);
- start = caretPosition;
- len = string.block.length;
- len -= fixIeBug(string.block);
- } else {
- string = build(selection);
- start = caretPosition + string.block.length ;
- len = 0;
- start -= fixIeBug(string.block);
- }
- if ((selection === '' && string.replaceWith === '')) {
- caretOffset += fixOperaBug(string.block);
-
- start = caretPosition + string.openBlockWith.length + string.openWith.length;
- len = string.block.length - string.openBlockWith.length - string.openWith.length - string.closeWith.length - string.closeBlockWith.length;
- caretOffset = $$.val().substring(caretPosition, $$.val().length).length;
- caretOffset -= fixOperaBug($$.val().substring(0, caretPosition));
- }
- $.extend(hash, { caretPosition:caretPosition, scrollPosition:scrollPosition } );
- if (string.block !== selection && abort === false) {
- insert(string.block);
- set(start, len);
- } else {
- caretOffset = -1;
- }
- get();
- $.extend(hash, { line:'', selection:selection });
- // callbacks after insertion
- if ((ctrlKey === true && shiftKey === true) || button.multiline === true) {
- prepare(clicked.afterMultiInsert);
- }
- prepare(clicked.afterInsert);
- prepare(options.afterInsert);
- // refresh preview if opened
- if (previewWindow && options.previewAutoRefresh) {
- refreshPreview();
- }
-
- // reinit keyevent
- shiftKey = altKey = ctrlKey = abort = false;
- }
- // Substract linefeed in Opera
- function fixOperaBug(string) {
- if (browser.opera) {
- return string.length - string.replace(/\n*/g, '').length;
- }
- return 0;
- }
- // Substract linefeed in IE
- function fixIeBug(string) {
- if (browser.msie) {
- return string.length - string.replace(/\r*/g, '').length;
- }
- return 0;
- }
-
- // add markup
- function insert(block) {
- if (document.selection) {
- var newSelection = document.selection.createRange();
- newSelection.text = block;
- } else {
- textarea.value = textarea.value.substring(0, caretPosition) + block + textarea.value.substring(caretPosition + selection.length, textarea.value.length);
- }
- }
- // set a selection
- function set(start, len) {
- if (textarea.createTextRange){
- // quick fix to make it work on Opera 9.5
- if (browser.opera && browser.version >= 9.5 && len == 0) {
- return false;
- }
- range = textarea.createTextRange();
- range.collapse(true);
- range.moveStart('character', start);
- range.moveEnd('character', len);
- range.select();
- } else if (textarea.setSelectionRange ){
- textarea.setSelectionRange(start, start + len);
- }
- textarea.scrollTop = scrollPosition;
- textarea.focus();
- }
- // get the selection
- function get() {
- textarea.focus();
- scrollPosition = textarea.scrollTop;
- if (document.selection) {
- selection = document.selection.createRange().text;
- if (browser.msie) { // ie
- var range = document.selection.createRange(), rangeCopy = range.duplicate();
- rangeCopy.moveToElementText(textarea);
- caretPosition = -1;
- while(rangeCopy.inRange(range)) {
- rangeCopy.moveStart('character');
- caretPosition ++;
- }
- } else { // opera
- caretPosition = textarea.selectionStart;
- }
- } else { // gecko & webkit
- caretPosition = textarea.selectionStart;
- selection = textarea.value.substring(caretPosition, textarea.selectionEnd);
- }
- return selection;
- }
- // open preview window
- function preview() {
- if (typeof options.previewHandler === 'function') {
- previewWindow = true;
- } else if (options.previewInElement) {
- previewWindow = $(options.previewInElement);
- } else if (!previewWindow || previewWindow.closed) {
- if (options.previewInWindow) {
- previewWindow = window.open('', 'preview', options.previewInWindow);
- $(window).unload(function() {
- previewWindow.close();
- });
- } else {
- iFrame = $('<iframe class="markItUpPreviewFrame"></iframe>');
- if (options.previewPosition == 'after') {
- iFrame.insertAfter(footer);
- } else {
- iFrame.insertBefore(header);
- }
- previewWindow = iFrame[iFrame.length - 1].contentWindow || frame[iFrame.length - 1];
- }
- } else if (altKey === true) {
- if (iFrame) {
- iFrame.remove();
- } else {
- previewWindow.close();
- }
- previewWindow = iFrame = false;
- }
- if (!options.previewAutoRefresh) {
- refreshPreview();
- }
- if (options.previewInWindow) {
- previewWindow.focus();
- }
- }
- // refresh Preview window
- function refreshPreview() {
- renderPreview();
- }
- function renderPreview() {
- var phtml;
- if (options.previewHandler && typeof options.previewHandler === 'function') {
- options.previewHandler( $$.val() );
- } else if (options.previewParser && typeof options.previewParser === 'function') {
- var data = options.previewParser( $$.val() );
- writeInPreview(localize(data, 1) );
- } else if (options.previewParserPath !== '') {
- $.ajax({
- type: 'POST',
- dataType: 'text',
- global: false,
- url: options.previewParserPath,
- data: options.previewParserVar+'='+encodeURIComponent($$.val()),
- success: function(data) {
- writeInPreview( localize(data, 1) );
- }
- });
- } else {
- if (!template) {
- $.ajax({
- url: options.previewTemplatePath,
- dataType: 'text',
- global: false,
- success: function(data) {
- writeInPreview( localize(data, 1).replace(/<!-- content -->/g, $$.val()) );
- }
- });
- }
- }
- return false;
- }
-
- function writeInPreview(data) {
- if (options.previewInElement) {
- $(options.previewInElement).html(data);
- } else if (previewWindow && previewWindow.document) {
- try {
- sp = previewWindow.document.documentElement.scrollTop
- } catch(e) {
- sp = 0;
- }
- previewWindow.document.open();
- previewWindow.document.write(data);
- previewWindow.document.close();
- previewWindow.document.documentElement.scrollTop = sp;
- }
- }
-
- // set keys pressed
- function keyPressed(e) {
- shiftKey = e.shiftKey;
- altKey = e.altKey;
- ctrlKey = (!(e.altKey && e.ctrlKey)) ? (e.ctrlKey || e.metaKey) : false;
- if (e.type === 'keydown') {
- if (ctrlKey === true) {
- li = $('a[accesskey="'+((e.keyCode == 13) ? '\\n' : String.fromCharCode(e.keyCode))+'"]', header).parent('li');
- if (li.length !== 0) {
- ctrlKey = false;
- setTimeout(function() {
- li.triggerHandler('mouseup');
- },1);
- return false;
- }
- }
- if (e.keyCode === 13 || e.keyCode === 10) { // Enter key
- if (ctrlKey === true) { // Enter + Ctrl
- ctrlKey = false;
- markup(options.onCtrlEnter);
- return options.onCtrlEnter.keepDefault;
- } else if (shiftKey === true) { // Enter + Shift
- shiftKey = false;
- markup(options.onShiftEnter);
- return options.onShiftEnter.keepDefault;
- } else { // only Enter
- markup(options.onEnter);
- return options.onEnter.keepDefault;
- }
- }
- if (e.keyCode === 9) { // Tab key
- if (shiftKey == true || ctrlKey == true || altKey == true) {
- return false;
- }
- if (caretOffset !== -1) {
- get();
- caretOffset = $$.val().length - caretOffset;
- set(caretOffset, 0);
- caretOffset = -1;
- return false;
- } else {
- markup(options.onTab);
- return options.onTab.keepDefault;
- }
- }
- }
- }
- function remove() {
- $$.unbind(".markItUp").removeClass('markItUpEditor');
- $$.parent('div').parent('div.markItUp').parent('div').replaceWith($$);
- $$.data('markItUp', null);
- }
- init();
- });
- };
- $.fn.markItUpRemove = function() {
- return this.each(function() {
- $(this).markItUp('remove');
- }
- );
- };
- $.markItUp = function(settings) {
- var options = { target:false };
- $.extend(options, settings);
- if (options.target) {
- return $(options.target).each(function() {
- $(this).focus();
- $(this).trigger('insertion', [options]);
- });
- } else {
- $('textarea').trigger('insertion', [options]);
- }
- };
- })(jQuery);
|