8 function highlight(colour) {
10 if (window.getSelection) {
12 sel = window.getSelection();
14 range = sel.getRangeAt(0);
16 document.designMode = "on";
18 sel.removeAllRanges();
21 // Use HiliteColor since some browsers apply BackColor to the whole block
22 if ( !document.execCommand("HiliteColor", false, colour) ) {
23 document.execCommand("BackColor", false, colour);
25 document.designMode = "off";
26 } else if (document.selection && document.selection.createRange) {
28 range = document.selection.createRange();
29 range.execCommand("BackColor", false, colour);
33 // function unselectThemes(themeId) {
34 // $('.Apple-style-span').each(function() {
35 // $(this).after($(this).html());
40 function gallery(element, url) {
41 var element = $(element);
42 var imageDimensions = {};
43 element.data('images', []);
45 function changePage(pageNumber) {
46 $('img', element).attr('src', element.data('images')[pageNumber - 1]);
49 function normalizeNumber(pageNumber) {
50 // Numer strony musi być pomiędzy 1 a najwyższym numerem
51 var pageCount = element.data('images').length;
52 pageNumber = parseInt(pageNumber, 10);
54 if (!pageNumber || pageNumber == NaN || pageNumber == Infinity || pageNumber == -Infinity) {
56 } else if (pageNumber < 1) {
58 } else if (pageNumber > pageCount) {
65 var pn = $('.page-number', element);
66 pn.change(function(event) {
67 event.preventDefault();
68 var n = normalizeNumber(pn.val());
72 $('.previous-page', element).click(function() {
73 pn.val(normalizeNumber(pn.val()) - 1);
76 $('.next-page', element).click(function() {
77 pn.val(normalizeNumber(pn.val()) + 1);
82 var image = $('img', element).attr('unselectable', 'on');
87 $('.zoom-in', element).click(function() {
88 zoomFactor = Math.min(2, zoomFactor + 0.2);
91 $('.zoom-out', element).click(function() {
92 zoomFactor = Math.max(0.2, zoomFactor - 0.2);
95 $('.change-gallery', element).click(function() {
96 $('.chosen-gallery').val($('#document-meta .gallery').html() || '/platforma/gallery/');
97 $('.gallery-image').animate({top: 53}, 200);
98 $('.chosen-gallery').focus();
100 $('.change-gallery-ok', element).click(function() {
101 if ($('#document-meta .gallery').length == 0) {
102 $('<div class="gallery"></div>').appendTo('#document-meta');
104 $('#document-meta .gallery').html($('.chosen-gallery').val());
105 updateGallery($('.chosen-gallery').val());
106 $('.gallery-image').animate({top: 27}, 200);
108 $('.change-gallery-cancel', element).click(function() {
109 $('.gallery-image').animate({top: 27}, 200);
112 $('img', element).load(function() {
113 image.css({width: null, height: null});
115 width: $(this).width() * zoomFactor,
116 height: $(this).height() * zoomFactor,
117 originWidth: $(this).width(),
118 originHeight: $(this).height(),
119 galleryWidth: $(this).parent().width(),
120 galleryHeight: $(this).parent().height()
123 if (!(imageDimensions.width && imageDimensions.height)) {
124 setTimeout(function() { $('img', element).load(); }, 100);
126 var position = normalizePosition(
127 image.position().left,
128 image.position().top,
129 imageDimensions.galleryWidth,
130 imageDimensions.galleryHeight,
131 imageDimensions.width,
132 imageDimensions.height
134 image.css({left: position.x, top: position.y, width: $(this).width() * zoomFactor, height: $(this).height() * zoomFactor});
137 $(window).resize(function() {
138 imageDimensions.galleryWidth = image.parent().width();
139 imageDimensions.galleryHeight = image.parent().height();
142 function bounds(galleryWidth, galleryHeight, imageWidth, imageHeight) {
146 minX: galleryWidth - imageWidth,
147 minY: galleryHeight - imageHeight
151 function normalizePosition(x, y, galleryWidth, galleryHeight, imageWidth, imageHeight) {
152 var b = bounds(galleryWidth, galleryHeight, imageWidth, imageHeight);
154 x: Math.min(b.maxX, Math.max(b.minX, x)),
155 y: Math.min(b.maxY, Math.max(b.minY, y))
159 function onMouseMove(event) {
160 var position = normalizePosition(
161 event.clientX - origin.x + imageOrigin.left,
162 event.clientY - origin.y + imageOrigin.top,
163 imageDimensions.galleryWidth,
164 imageDimensions.galleryHeight,
165 imageDimensions.width,
166 imageDimensions.height
168 image.css({position: 'absolute', top: position.y, left: position.x});
172 function setZoom(factor) {
177 imageDimensions.width = imageDimensions.originWidth * zoomFactor;
178 imageDimensions.height = imageDimensions.originHeight * zoomFactor;
179 var position = normalizePosition(
180 image.position().left,
181 image.position().top,
182 imageDimensions.galleryWidth,
183 imageDimensions.galleryHeight,
184 imageDimensions.width,
185 imageDimensions.height
187 image.css({width: imageDimensions.width, height: imageDimensions.height,
188 left: position.x, top: position.y});
192 function onMouseUp(event) {
194 .unbind('mousemove.gallery')
195 .unbind('mouseup.gallery');
199 image.bind('mousedown', function(event) {
204 imageOrigin = image.position();
206 .bind('mousemove.gallery', onMouseMove)
207 .bind('mouseup.gallery', onMouseUp);
211 function updateGallery(url) {
217 success: function(data) {
218 element.data('images', data);
221 $('img', element).show();
224 error: function(data) {
225 element.data('images', []);
228 $('img', element).hide();
239 function transform(editor) {
240 $.blockUI({message: 'Ładowanie...'});
241 setTimeout(function() {
243 xml: editor.getCode(),
244 success: function(element) {
245 $('#html-view').html(element);
247 }, error: function(text) {
248 $('#html-view').html('<p class="error">Wystąpił błąd:</p><pre>' + text + '</pre>');
256 function reverseTransform(editor, cont) {
257 var serializer = new XMLSerializer();
258 if ($('#html-view .error').length > 0) {
261 $.blockUI({message: 'Ładowanie...'});
262 setTimeout(function() {
264 xml: serializer.serializeToString($('#html-view div').get(0)),
265 success: function(text) {
266 editor.setCode(text);
271 }, error: function(text) {
272 $('#source-editor').html('<p>Wystąpił błąd:</p><pre>' + text + '</pre>');
283 function html(element) {
284 var element = $(element);
286 function selectTheme(themeId)
288 var selection = window.getSelection();
289 selection.removeAllRanges();
291 var range = document.createRange();
292 var s = $(".motyw[theme-class='"+themeId+"']")[0];
293 var e = $(".end[theme-class='"+themeId+"']")[0];
296 range.setStartAfter(s);
297 range.setEndBefore(e);
298 selection.addRange(range);
302 function verifyTagInsertPoint(node) {
303 if(node.nodeType == 3) { // Text Node
304 node = node.parentNode;
307 if (node.nodeType != 1) {
311 console.log('Selection point:', node);
314 var xtype = node.attr('x-node');
316 if (!xtype || (xtype.search(':') >= 0) ||
317 xtype == 'motyw' || xtype == 'begin' || xtype == 'end') {
321 // don't allow themes inside annotations
322 if( node.is('*[x-annotation-box] *') )
328 function addAnnotation()
330 var selection = window.getSelection();
331 var n = selection.rangeCount;
333 console.log("Range count:", n);
335 window.alert("Nie zaznaczono żadnego obszaru");
339 // for now allow only 1 range
341 window.alert("Zaznacz jeden obszar");
345 // remember the selected range
346 var range = selection.getRangeAt(0);
348 if (!verifyTagInsertPoint(range.endContainer)) {
349 window.alert("Nie można wstawić w to miejsce przypisu.");
353 var text = range.toString();
354 var tag = $('<span></span>');
355 range.collapse(false);
356 range.insertNode(tag[0]);
359 xml: '<pr><slowo_obce>'+text+'</slowo_obce> --- </pr>',
360 success: function(text) {
367 alert('Błąd przy dodawaniu przypisu:' + errors);
374 var selection = window.getSelection();
375 var n = selection.rangeCount;
377 console.log("Range count:", n);
379 window.alert("Nie zaznaczono żadnego obszaru");
383 // for now allow only 1 range
385 window.alert("Zaznacz jeden obszar");
389 // remember the selected range
390 var range = selection.getRangeAt(0);
391 console.log(range.startContainer, range.startOffset, range.endContainer, range.endOffset);
393 // verify if the start/end points make even sense -
394 // they must be inside a x-node (otherwise they will be discarded)
395 // and the x-node must be a main text
396 if (!verifyTagInsertPoint(range.startContainer)) {
397 window.alert("Motyw nie może się zaczynać w tym miejscu.");
401 if (!verifyTagInsertPoint(range.endContainer)) {
402 window.alert("Motyw nie może się kończyć w tym miejscu.");
406 var date = (new Date()).getTime();
407 var random = Math.floor(4000000000*Math.random());
408 var id = (''+date) + '-' + (''+random);
410 var spoint = document.createRange();
411 var epoint = document.createRange();
413 spoint.setStart(range.startContainer, range.startOffset);
414 epoint.setStart(range.endContainer, range.endOffset);
416 console.log('spoint', spoint.startContainer, spoint.startOffset, spoint.endContainer, spoint.endOffset);
417 console.log('epoint', epoint.startContainer, epoint.startOffset, epoint.endContainer, epoint.endOffset);
419 var mtag, btag, etag, errors;
424 xml: '<end id="e'+id+'" />',
425 success: function(text) {
426 etag = $('<span></span>');
427 epoint.insertNode(etag[0]);
428 etag.replaceWith(text);
430 xml: '<motyw id="m'+id+'">motyw</motyw>',
431 success: function(text) {
432 mtag = $('<span></span>');
433 spoint.insertNode(mtag[0]);
434 mtag.replaceWith(text);
436 xml: '<begin id="b'+id+'" />',
437 success: function(text) {
438 btag = $('<span></span>');
439 spoint.insertNode(btag[0])
440 btag.replaceWith(text);
441 selection.removeAllRanges();
442 openForEdit($('.motyw[theme-class=' + id + ']'));
451 // function removeTheme($origin) {
455 function openForEdit($origin)
459 // annotations overlay their sub box - not their own box //
460 if($origin.is(".annotation-inline-box")) {
461 $box = $("*[x-annotation-box]", $origin);
462 console.log('annotation!', $box);
467 var x = $box[0].offsetLeft;
468 var y = $box[0].offsetTop;
469 var w = $box.outerWidth();
470 var h = $box.innerHeight();
472 if ($origin.is(".annotation-inline-box")) {
473 w = Math.max(w, 400);
477 console.log('width:', w, 'height:', h);
479 // start edition on this node
480 var $overlay = $('<div class="html-editarea"><button class="accept-button">Zapisz</button><button class="delete-button">Usuń</button><textarea></textarea></div>').css({
481 position: 'absolute',
486 }).appendTo($box[0].offsetParent || $box.parent()).show();
488 $('.delete-button', $overlay).click(function() {
489 if ($origin.is('.motyw')) {
490 $('[theme-class=' + $origin.attr('theme-class') + ']').remove();
495 $(document).unbind('click.blur-overlay');
499 console.log($overlay, $box[0].offsetParent || $box.parent());
501 var serializer = new XMLSerializer();
503 console.log($box.html());
505 xml: serializer.serializeToString($box[0]),
507 success: function(text) {
508 $('textarea', $overlay).val($.trim(text));
509 console.log($.trim(text));
511 setTimeout(function() {
512 $('textarea', $overlay).focus();
515 function save(argument) {
516 var nodeName = $box.attr('x-node') || 'pe';
518 xml: '<' + nodeName + '>' + $('textarea', $overlay).val() + '</' + nodeName + '>',
519 success: function(element) {
520 $box.html($(element).html());
523 error: function(text) {
525 alert('Błąd! ' + text);
530 $('.accept-button', $overlay).click(function() {
534 $(document).bind('click.blur-overlay', function(event) {
535 if ($(event.target).parents('.html-editarea').length > 0) {
540 $(document).unbind('click.blur-overlay');
543 // $('textarea', $overlay).one('blur', function(event) {
544 // var nodeName = $box.attr('x-node') || 'pe';
546 // xml: '<' + nodeName + '>' + $('textarea', $overlay).val() + '</' + nodeName + '>',
547 // success: function(element) {
548 // $box.html($(element).html());
549 // $overlay.remove();
551 // error: function(text) {
552 // $overlay.remove();
553 // alert('Błąd! ' + text);
557 }, error: function(text) {
558 alert('Błąd! ' + text);
563 $('.edit-button').live('click', function(event) {
564 event.preventDefault();
565 openForEdit($(this).parent());
570 var button = $('<button class="edit-button">Edytuj</button>');
571 $(element).bind('mousemove', function(event) {
572 var editable = $(event.target).closest('*[x-editable]');
573 $('.active[x-editable]', element).not(editable).removeClass('active').children('.edit-button').remove();
574 if (!editable.hasClass('active')) {
575 editable.addClass('active').append(button);
579 $('.motyw').live('click', function() {
580 selectTheme($(this).attr('theme-class'));
583 $('#insert-annotation-button').click(function() {
588 $('#insert-theme-button').click(function() {
596 gallery('#sidebar', $('#document-meta .gallery').html());
599 CodeMirror.fromTextArea('id_text', {
600 parserfile: 'parsexml.js',
601 path: STATIC_URL + "js/lib/codemirror/",
602 stylesheet: STATIC_URL + "css/xmlcolors.css",
604 useHTMLKludges: false
606 iframeClass: 'xml-iframe',
610 initCallback: function(editor) {
611 $('#save-button').click(function(event) {
612 event.preventDefault();
613 $.blockUI({message: $('#save-dialog')});
616 $('#save-ok').click(function() {
617 $.blockUI({message: 'Zapisywanie...'});
619 function doSave (argument) {
620 var metaComment = '<!--';
621 $('#document-meta div').each(function() {
622 metaComment += '\n\t' + $(this).attr('class') + ': ' + $(this).html();
624 metaComment += '\n-->'
627 name: $('#document-name').html(),
628 text: metaComment + editor.getCode(),
629 revision: $('#document-revision').html(),
630 author: 'annonymous',
631 comment: $('#komentarz').val()
637 url: document.location.href,
641 success: function(data) {
643 editor.setCode(data.text);
644 $('#document-revision').html(data.revision);
646 console.log(data.errors);
651 error: function(xhr, textStatus, errorThrown) {
652 alert('error: ' + textStatus + ' ' + errorThrown);
657 if ('#simple-view-tab.active') {
658 reverseTransform(editor, doSave);
664 $('#save-cancel').click(function() {
668 $('#simple-view-tab').click(function() {
669 if ($(this).hasClass('active')) {
672 $(this).addClass('active');
673 $('#source-view-tab').removeClass('active');
674 $('#source-editor').hide();
675 $('#simple-editor').show();
679 $('#source-view-tab').click(function() {
680 if ($(this).hasClass('active')) {
683 $(this).addClass('active');
684 $('#simple-view-tab').removeClass('active');
685 $('#simple-editor').hide();
686 $('#source-editor').show();
687 reverseTransform(editor);
690 $('#source-editor .toolbar button').click(function(event) {
691 event.preventDefault();
692 var params = eval("(" + $(this).attr('ui:action-params') + ")");
693 scriptletCenter.scriptlets[$(this).attr('ui:action')](editor, params);
696 $('.toolbar select').change(function() {
697 var slug = $(this).val();
699 $('.toolbar-buttons-container').hide().filter('[data-group=' + slug + ']').show();
703 $('.toolbar-buttons-container').hide();
704 $('.toolbar select').change();
706 $('#simple-view-tab').click();
710 $(window).resize(function() {
711 $('iframe').height($(window).height() - $('#tabs').outerHeight() - $('#source-editor .toolbar').outerHeight());
716 $('.vsplitbar').click(function() {
717 if ($('#sidebar').width() == 0) {
718 $('#sidebar').width(480).css({right: 0}).show();
719 $('#source-editor, #simple-editor').css({right: 495});
720 $('.vsplitbar').css({right: 480}).addClass('active');
722 $('#sidebar').width(0).hide();
723 $('#source-editor, #simple-editor').css({right: 15});
724 $('.vsplitbar').css({right: 0}).removeClass('active');