X-Git-Url: https://git.mdrn.pl/redakcja.git/blobdiff_plain/7d90e33be7ee1de4f79216b33ce9e28794685dc4..8c43021c5d0731cf35203cb32bbc63c89271cbb5:/redakcja/static/js/wiki/view_editor_wysiwyg.js?ds=inline diff --git a/redakcja/static/js/wiki/view_editor_wysiwyg.js b/redakcja/static/js/wiki/view_editor_wysiwyg.js index d8704fde..3ccaea71 100644 --- a/redakcja/static/js/wiki/view_editor_wysiwyg.js +++ b/redakcja/static/js/wiki/view_editor_wysiwyg.js @@ -43,8 +43,8 @@ return true; } - /* Convert HTML frament to plaintext */ - var ANNOT_FORBIDDEN = ['pt', 'pa', 'pr', 'pe', 'begin', 'end', 'theme']; + /* Convert HTML fragment to plaintext */ + var ANNOT_FORBIDDEN = ['pt', 'pa', 'pr', 'pe', 'begin', 'end', 'motyw']; function html2plainText(fragment){ var text = ""; @@ -91,7 +91,6 @@ // BUG #273 - selected text can contain themes, which should be omitted from // defining term var text = html2plainText(range.cloneContents()); - var tag = $('<span></span>'); range.collapse(false); range.insertNode(tag[0]); @@ -194,6 +193,161 @@ }); } + function addSymbol() { + if($('div.html-editarea textarea')[0]) { + var specialCharsContainer = $("<div id='specialCharsContainer'><a href='#' id='specialCharsClose'>Zamknij</a><table id='tableSpecialChars' style='width: 600px;'></table></div>"); + + var specialChars = ['Ä','Ä ','Ä','Ä','Ä','Ä','Å','Å','Å','Å','Ã','ó','Å','Å','Å»','ż','Ź','ź','Ã','á','Ã','à ', + 'Ã','â','Ã','ä','à ','Ã¥','Ä','Ä','Ä','Ä','Ã','ã', + 'Ã','æ','Ã','ç','Ä','Ä','Ä','Ä','Ä','Ä','Ã','é','Ã','è', + 'Ã','ê','Ã','ë','Ä','Ä','Ä','Ä','Ä ','Ä¡','Ħ','ħ','Ã','Ã','Ã','î', + 'Ī','Ä«','Ĭ','Ä','Ľ','ľ','Ã','ñ','Å','Å','Ã','ó','Ã','ö', + 'Ã','ô','Å','Å','Ç','Ç','Å','Å','Ã','ø','Å','Å','Å ', + 'Å¡','Å','Å','Ť','Å¥','Å¢','Å£','Å°','ű','Ã','ú','Ã','ù', + 'Ã','ü','Å®','ů','Ū','Å«','Ã','û','Ŭ','Å', + 'Ã','ý','Ž','ž','Ã','Ã','ð','Ã','þ','Ð','а','Ð', + 'б','Ð','в','Ð','г','Ð','д','Ð','е','Ð','Ñ','Ð', + 'ж','Ð','з','Ð','и','Ð','й','Ð','к','Ð','л','Ð', + 'м','Ð','н','Ð','о','Ð','п','Ð ','Ñ','С','Ñ', + 'Т','Ñ','У','Ñ','Ф','Ñ','Ð¥','Ñ ','Ц','Ñ','Ч', + 'Ñ','Ш','Ñ','Щ','Ñ','Ъ','Ñ','Ы','Ñ','Ь','Ñ','Ð', + 'Ñ','Ю','Ñ','Я','Ñ','Ñ','Ñ','Ñ','Ñ','Ñ','Ñ','Ñ', + 'Ò','Ò','Î','α','Î','β','Î','γ','Î','δ','Î','ε', + 'Î','ζ','Î','η','Î','θ','Î','ι','Î','κ','Î','λ','Î', + 'μ','Î','ν','Î','ξ','Î','ο','Î ','Ï','Ρ','Ï','Σ','Ï','Ï', + 'Τ','Ï','Î¥','Ï ','Φ','Ï','Χ','Ï','Ψ','Ï','Ω','Ï','â', + 'â','¡','¿','$','¢','£','â¬','©','®','°','¹','²','³', + '¼','½','¾','â ','§','â°','â¢','â','â','â','â', + 'â','â','ââ','«','»','«»','»«','â','[',']','~','|','â','·', + 'Ã','÷','â','â ','±','â¤','â¥','â']; + var tableContent = "<tr>"; + + for(var i in specialChars) { + if(i % 14 == 0 && i > 0) { + tableContent += "</tr><tr>"; + } + tableContent += "<td><input type='button' class='specialBtn' value='"+specialChars[i]+"'/></td>"; + } + + tableContent += "</tr>"; + $("#content").append(specialCharsContainer); + + + // localStorage for recently used characters - reading + if (typeof(localStorage) != 'undefined') { + if (localStorage.getItem("recentSymbols")) { + var recent = localStorage.getItem("recentSymbols"); + var recentArray = recent.split(";"); + var recentRow = ""; + for(var i in recentArray.reverse()) { + recentRow += "<td><input type='button' class='specialBtn recentSymbol' value='"+recentArray[i]+"'/></td>"; + } + recentRow = "<tr>" + recentRow + "</tr>"; + } + } + $("#tableSpecialChars").append(recentRow); + $("#tableSpecialChars").append(tableContent); + + /* events */ + + $('.specialBtn').click(function(){ + var editArea = $('div.html-editarea textarea')[0]; + var insertVal = $(this).val(); + + // if we want to surround text with quotes + // not sure if just check if value has length == 2 + + if (insertVal.length == 2) { + var startTag = insertVal[0]; + var endTag = insertVal[1]; + var textAreaOpened = editArea; + //IE support + if (document.selection) { + textAreaOpened.focus(); + sel = document.selection.createRange(); + sel.text = startTag + sel.text + endTag; + } + //MOZILLA/NETSCAPE support + else if (textAreaOpened.selectionStart || textAreaOpened.selectionStart == '0') { + var startPos = textAreaOpened.selectionStart; + var endPos = textAreaOpened.selectionEnd; + textAreaOpened.value = textAreaOpened.value.substring(0, startPos) + + startTag + textAreaOpened.value.substring(startPos, endPos) + endTag + textAreaOpened.value.substring(endPos, textAreaOpened.value.length); + } + } else { + // if we just want to insert single symbol + insertAtCaret(editArea, insertVal); + } + + // localStorage for recently used characters - saving + if (typeof(localStorage) != 'undefined') { + if (localStorage.getItem("recentSymbols")) { + var recent = localStorage.getItem("recentSymbols"); + var recentArray = recent.split(";"); + var valIndex = $.inArray(insertVal, recentArray); + //alert(valIndex); + if(valIndex == -1) { + // value not present in array yet + if(recentArray.length > 13){ + recentArray.shift(); + recentArray.push(insertVal); + } else { + recentArray.push(insertVal); + } + } else { + // value already in the array + for(var i = valIndex; i < recentArray.length; i++){ + recentArray[i] = recentArray[i+1]; + } + recentArray[recentArray.length-1] = insertVal; + } + localStorage.setItem("recentSymbols", recentArray.join(";")); + } else { + localStorage.setItem("recentSymbols", insertVal); + } + } + + $(specialCharsContainer).remove(); + }); + $('#specialCharsClose').click(function(){ + $(specialCharsContainer).remove(); + }); + + } else { + window.alert('Najedź na fragment tekstu, wybierz "Edytuj" i ustaw kursor na miejscu gdzie chcesz wstawiÄ symbol.'); + } + } + + function insertAtCaret(txtarea,text) { + /* http://www.scottklarr.com/topic/425/how-to-insert-text-into-a-textarea-where-the-cursor-is/ */ + var scrollPos = txtarea.scrollTop; + var strPos = 0; + var br = ((txtarea.selectionStart || txtarea.selectionStart == '0') ? "ff" : (document.selection ? "ie" : false ) ); + if (br == "ie") { + txtarea.focus(); + var range = document.selection.createRange(); + range.moveStart ('character', -txtarea.value.length); + strPos = range.text.length; + } else if (br == "ff") strPos = txtarea.selectionStart; + var front = (txtarea.value).substring(0,strPos); + var back = (txtarea.value).substring(strPos,txtarea.value.length); + txtarea.value=front+text+back; + strPos = strPos + text.length; + if (br == "ie") { + txtarea.focus(); + var range = document.selection.createRange(); + range.moveStart ('character', -txtarea.value.length); + range.moveStart ('character', strPos); + range.moveEnd ('character', 0); + range.select(); + } else if (br == "ff") { + txtarea.selectionStart = strPos; + txtarea.selectionEnd = strPos; + txtarea.focus(); + } + txtarea.scrollTop = scrollPos; + } + /* open edition window for selected fragment */ function openForEdit($origin){ var $box = null @@ -205,32 +359,42 @@ else { $box = $origin; } - var x = $box[0].offsetLeft; - var y = $box[0].offsetTop; + var y = $box[0].offsetTop; + var w = $box.outerWidth(); var h = $box.innerHeight(); if ($origin.is(".annotation-inline-box")) { w = Math.max(w, 400); h = Math.max(h, 60); + if($('.htmlview div').offset().left + $('.htmlview div').width() > ($('.vsplitbar').offset().left - 480)){ + x = -(Math.max($origin.offset().left, $origin.width())); + } else { + x = 100; + } } // start edition on this node - var $overlay = $('<div class="html-editarea"><button class="accept-button">Zapisz</button><button class="delete-button">UsuÅ</button><textarea></textarea></div>').css({ + var $overlay = $('<div class="html-editarea"><button class="accept-button">Zapisz</button><button class="delete-button">UsuÅ</button><button class="tytul-button akap-edit-button">tytuÅ dzieÅa</button><button class="wyroznienie-button akap-edit-button">wyróżnienie</button><button class="slowo-button akap-edit-button">sÅowo obce</button><button class="znak-button akap-edit-button">znak spec.</button><textarea></textarea></div>').css({ position: 'absolute', height: h, left: x, top: y, width: w }).appendTo($box[0].offsetParent || $box.parent()).show(); + if ($origin.is('.motyw')) { - $('textarea', $overlay).autocomplete(THEMES, { - autoFill: true, - multiple: true, - selectFirst: true - }); + $('.akap-edit-button').remove(); + withThemes(function(canonThemes){ + $('textarea', $overlay).autocomplete(canonThemes, { + autoFill: true, + multiple: true, + selectFirst: true, + highlight: false + }); + }) } if ($origin.is('.motyw')){ @@ -254,7 +418,14 @@ }); } else { - $('.delete-button', $overlay).hide(); + $('.delete-button', $overlay).html("Anuluj"); + $('.delete-button', $overlay).click(function(){ + if (window.confirm("Czy jesteÅ pewien, że chcesz anulowaÄ zmiany?")) { + $overlay.remove(); + $(document).unbind('click.blur-overlay'); + return false; + }; + }); } @@ -281,7 +452,13 @@ xml2html({ xml: '<' + nodeName + '>' + insertedText + '</' + nodeName + '>', success: function(element){ - $origin.html($(element).html()); + if (nodeName == 'out-of-flow-text') { + $(element).children().insertAfter($origin); + $origin.remove() + } + else { + $origin.html($(element).html()); + } $overlay.remove(); }, error: function(text){ @@ -289,8 +466,51 @@ alert('BÅÄ d! ' + text); } }) + + var msg = $("<div class='saveNotify'><p>PamiÄtaj, żeby zapisaÄ swoje zmiany.</p></div>"); + $("#base").prepend(msg); + $('#base .saveNotify').fadeOut(3000, function(){ + $(this).remove(); + }); } + $('.akap-edit-button', $overlay).click(function(){ + var textAreaOpened = $('textarea', $overlay)[0]; + var startTag = ""; + var endTag = ""; + var buttonName = this.innerHTML; + + if(buttonName == "sÅowo obce") { + startTag = "<slowo_obce>"; + endTag = "</slowo_obce>"; + } else if (buttonName == "wyróżnienie") { + startTag = "<wyroznienie>"; + endTag = "</wyroznienie>"; + } else if (buttonName == "tytuÅ dzieÅa") { + startTag = "<tytul_dziela>"; + endTag = "</tytul_dziela>"; + } else if(buttonName == "znak spec."){ + addSymbol(); + return false; + } + + var myField = textAreaOpened; + + //IE support + if (document.selection) { + textAreaOpened.focus(); + sel = document.selection.createRange(); + sel.text = startTag + sel.text + endTag; + } + //MOZILLA/NETSCAPE support + else if (textAreaOpened.selectionStart || textAreaOpened.selectionStart == '0') { + var startPos = textAreaOpened.selectionStart; + var endPos = textAreaOpened.selectionEnd; + textAreaOpened.value = textAreaOpened.value.substring(0, startPos) + + startTag + textAreaOpened.value.substring(startPos, endPos) + endTag + textAreaOpened.value.substring(endPos, textAreaOpened.value.length); + } + }); + $('.accept-button', $overlay).click(function(){ save(); }); @@ -300,7 +520,6 @@ return; } save(); - $(document).unbind('click.blur-overlay'); }); @@ -347,7 +566,7 @@ $('#insert-theme-button').click(function(){ addTheme(); return false; - }); + }); $('.edit-button').live('click', function(event){ event.preventDefault(); @@ -391,12 +610,11 @@ $('#html-view').html(element); _finalize(success); }, - error: function(text){ - var message = $('<pre></pre>'); - message.text(text); - $('#html-view').html('<p class="error">WystÄ piÅ bÅÄ d:</p><pre>' + - message.html() + - '</pre>'); + error: function(text, source){ + err = '<p class="error">WystÄ piÅ bÅÄ d:</p><p>'+text+'</p>'; + if (source) + err += '<pre>'+source.replace(/&/g, '&').replace(/</g, '<')+'</pre>' + $('#html-view').html(err); _finalize(failure); } }); @@ -419,7 +637,8 @@ return _finalize(failure); html2text({ - element: $('#html-view div').get(0), + element: $('#html-view').get(0), + stripOuter: true, success: function(text){ self.doc.setText(text); _finalize(success);