X-Git-Url: https://git.mdrn.pl/redakcja.git/blobdiff_plain/35ca9353f12d0c6b65da2ac05675791d38793ab1..661a128f3a3f7bcaac5a33c7f00eb7e790f469d5:/platforma/static/js/main.js diff --git a/platforma/static/js/main.js b/platforma/static/js/main.js index ed22f590..9262c187 100644 --- a/platforma/static/js/main.js +++ b/platforma/static/js/main.js @@ -253,7 +253,7 @@ function transform(editor) { }; -function reverseTransform(editor) { +function reverseTransform(editor, cont) { var serializer = new XMLSerializer(); if ($('#html-view .error').length > 0) { return; @@ -265,6 +265,9 @@ function reverseTransform(editor) { success: function(text) { editor.setCode(text); $.unblockUI(); + if (cont) { + cont(); + } }, error: function(text) { $('#source-editor').html('

Wystąpił błąd:

' + text + '
'); $.unblockUI(); @@ -296,47 +299,211 @@ function html(element) { } }; + function verifyTagInsertPoint(node) { + if(node.nodeType == 3) { // Text Node + node = node.parentNode; + } + + if (node.nodeType != 1) { + return false; + } + + console.log('Selection point:', node); + + node = $(node); + var xtype = node.attr('x-node'); + + if (!xtype || (xtype.search(':') >= 0) || + xtype == 'motyw' || xtype == 'begin' || xtype == 'end') { + return false; + } + + // don't allow themes inside annotations + if( node.is('*[x-annotation-box] *') ) + return false; + + return true; + } + + function addAnnotation() + { + var selection = window.getSelection(); + var n = selection.rangeCount; + + console.log("Range count:", n); + if (n == 0) { + window.alert("Nie zaznaczono żadnego obszaru"); + return false; + } + + // for now allow only 1 range + if (n > 1) { + window.alert("Zaznacz jeden obszar"); + return false; + } + + // remember the selected range + var range = selection.getRangeAt(0); + + if (!verifyTagInsertPoint(range.endContainer)) { + window.alert("Nie można wstawić w to miejsce przypisu."); + return false; + } + + var text = range.toString(); + var tag = $(''); + range.collapse(false); + range.insertNode(tag[0]); + + xml2html({ + xml: ''+text+' --- ', + success: function(text) { + var t = $(text); + tag.replaceWith(t); + openForEdit(t); + }, + error: function() { + tag.remove(); + alert('Błąd przy dodawaniu przypisu:' + errors); + } + }) + } + + function addTheme() + { + var selection = window.getSelection(); + var n = selection.rangeCount; + + console.log("Range count:", n); + if(n == 0) { + window.alert("Nie zaznaczono żadnego obszaru"); + return false; + } + + // for now allow only 1 range + if(n > 1) { + window.alert("Zaznacz jeden obszar"); + return false; + } + + // remember the selected range + var range = selection.getRangeAt(0); + console.log(range.startContainer, range.startOffset, range.endContainer, range.endOffset); + + // verify if the start/end points make even sense - + // they must be inside a x-node (otherwise they will be discarded) + // and the x-node must be a main text + if (!verifyTagInsertPoint(range.startContainer)) { + window.alert("Motyw nie może się zaczynać w tym miejscu."); + return false; + } + + if (!verifyTagInsertPoint(range.endContainer)) { + window.alert("Motyw nie może się kończyć w tym miejscu."); + return false; + } + + var date = (new Date()).getTime(); + var random = Math.floor(4000000000*Math.random()); + var id = (''+date) + '-' + (''+random); + + var spoint = document.createRange(); + var epoint = document.createRange(); + + spoint.setStart(range.startContainer, range.startOffset); + epoint.setStart(range.endContainer, range.endOffset); + + console.log('spoint', spoint.startContainer, spoint.startOffset, spoint.endContainer, spoint.endOffset); + console.log('epoint', epoint.startContainer, epoint.startOffset, epoint.endContainer, epoint.endOffset); + + var mtag, btag, etag, errors; + + // insert theme-ref + + xml2html({ + xml: '', + success: function(text) { + etag = $(''); + epoint.insertNode(etag[0]); + etag.replaceWith(text); + xml2html({ + xml: 'motyw', + success: function(text) { + mtag = $(''); + spoint.insertNode(mtag[0]); + mtag.replaceWith(text); + xml2html({ + xml: '', + success: function(text) { + btag = $(''); + spoint.insertNode(btag[0]) + btag.replaceWith(text); + selection.removeAllRanges(); + openForEdit($('.motyw[theme-class=' + id + ']')); + } + }); + } + }); + } + }); + } function openForEdit($origin) { - // if(this.currentOpen && this.currentOpen != $origin) { - // this.closeWithSave(this.currentOpen); - // } - var $box = null // annotations overlay their sub box - not their own box // - if($origin.is(".annotation-inline-box")) + if($origin.is(".annotation-inline-box")) { $box = $("*[x-annotation-box]", $origin); - else + console.log('annotation!', $box); + } else { $box = $origin; + } var x = $box[0].offsetLeft; 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); + } + + console.log('width:', w, 'height:', h); + // start edition on this node - var $overlay = $('
'); + var $overlay = $('
').css({ + position: 'absolute', + height: h, + left: x, + top: y, + width: w + }).appendTo($box[0].offsetParent || $box.parent()).show(); + + console.log($overlay, $box[0].offsetParent || $box.parent()); + var serializer = new XMLSerializer(); + console.log($box.html()); html2xml({ - xml: serializer.serializeToString($box.get(0)), + xml: serializer.serializeToString($box[0]), + inner: true, success: function(text) { $('textarea', $overlay).val($.trim(text)); + console.log($.trim(text)); setTimeout(function() { - console.log('focus!'); $('textarea', $overlay).focus(); - }, 100); + }, 50); $('textarea', $overlay).one('blur', function(event) { + var nodeName = $box.attr('x-node') || 'pe'; xml2html({ - xml: $('textarea', $overlay).val(), + xml: '<' + nodeName + '>' + $('textarea', $overlay).val() + '', success: function(element) { - $box.after(element); + $box.html($(element).html()); $overlay.remove(); - $box.remove(); }, error: function(text) { $overlay.remove(); @@ -348,21 +515,6 @@ function html(element) { alert('Błąd! ' + text); } }); - - // h = Math.max(h, 2*parseInt($box.css('line-height'))); - - console.log(h); - - $overlay.css({ - position: 'absolute', - height: h, - left: x, - top: y, - right: 0 - }); - - $($box[0].offsetParent).append($overlay); - console.log($overlay); } $('.edit-button').live('click', function(event) { @@ -382,6 +534,16 @@ function html(element) { $('.motyw').live('click', function() { selectTheme($(this).attr('theme-class')); }); + + $('#insert-annotation-button').click(function() { + addAnnotation(); + return false; + }); + + $('#insert-theme-button').click(function() { + addTheme(); + return false; + }); } @@ -409,41 +571,49 @@ $(function() { $('#save-ok').click(function() { $.blockUI({message: 'Zapisywanie...'}); - var metaComment = '' - - var data = { - name: $('#document-name').html(), - text: metaComment + editor.getCode(), - revision: $('#document-revision').html(), - author: 'annonymous', - comment: $('#komentarz').val() - }; - - console.log(data); + function doSave (argument) { + var metaComment = '' + + var data = { + name: $('#document-name').html(), + text: metaComment + editor.getCode(), + revision: $('#document-revision').html(), + author: 'annonymous', + comment: $('#komentarz').val() + }; + + console.log(data); + + $.ajax({ + url: document.location.href, + type: "POST", + dataType: "json", + data: data, + success: function(data) { + if (data.text) { + editor.setCode(data.text); + $('#document-revision').html(data.revision); + } else { + console.log(data.errors); + alert(data.errors); + } + $.unblockUI(); + }, + error: function(xhr, textStatus, errorThrown) { + alert('error: ' + textStatus + ' ' + errorThrown); + }, + }) + } - $.ajax({ - url: document.location.href, - type: "POST", - dataType: "json", - data: data, - success: function(data) { - if (data.text) { - editor.setCode(data.text); - $('#document-revision').html(data.revision); - } else { - console.log(data.errors); - alert(data.errors); - } - $.unblockUI(); - }, - error: function(xhr, textStatus, errorThrown) { - alert('error: ' + textStatus + ' ' + errorThrown); - }, - }) + if ('#simple-view-tab.active') { + reverseTransform(editor, doSave); + } else { + doSave(); + } }); $('#save-cancel').click(function() {