From 9b42e899e6ac5e678938965fb6c4da5811869696 Mon Sep 17 00:00:00 2001 From: Lukasz Rekucki Date: Fri, 30 Oct 2009 11:36:44 +0100 Subject: [PATCH 1/1] Poprawki w edycji przypisow. --- platforma/static/css/html.css | 119 ++++++++++++++++++-------- platforma/static/js/button_scripts.js | 18 +++- platforma/static/js/models.js | 2 +- platforma/static/js/views/html.js | 98 +++++++++++++++++---- 4 files changed, 179 insertions(+), 58 deletions(-) mode change 100644 => 100755 platforma/static/js/button_scripts.js diff --git a/platforma/static/css/html.css b/platforma/static/css/html.css index a580ec26..fd5af3b3 100755 --- a/platforma/static/css/html.css +++ b/platforma/static/css/html.css @@ -26,6 +26,10 @@ text-decoration: none; } +.htmlview a:hover { + text-decoration: none; +} + .htmlview h1 { font-size: 3em; margin: 1.5em 0; @@ -210,6 +214,11 @@ margin: 1em; } + .parse-warning .message { + color: purple; + font-weight: bold; +} + /* Motywy */ /* ======================== */ @@ -241,21 +250,69 @@ z-index: 1; } -/* Przypisy */ +/* + * Przypisy + */ + +/* Znaczniki w tekście */ .htmlview .annotation { vertical-align: super; text-decoration: none; - font-size: 0.66em; + font-size: 0.66em; } -.htmlview a:hover { - text-decoration: none; +.htmlview .annotation:before { + content: "[" counter(main) "]"; + counter-increment: main; } -/* .htmlview .annotation:before { - content: "[\2217]"; -} */ +.htmlview .annotation:hover { + background-color: #dfdfdf; +} +.htmlview .annotation-inline-box[x-focused] > .annotation { + background-color: #860000; + color: #dfdfdf; +} + +*.htmlview *.annotation-inline-box { + position: static; +} + +/* + * Przypisy w tekście + */ + .htmlview .annotation-inline-box > span[x-annotation-box] + { + display: none; + position: absolute; + + max-width: 36em; + + font-size: 8pt; + line-height: 12pt; + font-weight: normal; + font-style: normal; + + background: white; + border-color: gray; + border-width: 2px; + border-style: outset; + padding: 3px 5px; + + text-decoration: none; + z-index: 10; + } + +.htmlview .annotation-inline-box[x-focused] > span[x-annotation-box], +.htmlview .annotation-inline-box:hover > span[x-annotation-box] { + display: block; + } + + +/* + * Przypisy na końcu utworu (aktualnie nieuzywane) + */ .htmlview .annotations-block { counter-reset: secondary; } @@ -280,41 +337,32 @@ counter-increment: secondary; } -.htmlview span.annotation:before { - content: "[" counter(main) "]"; - counter-increment: main; -} -.htmlview .annotation:hover { - background-color: #dfdfdf; -} -.parse-warning .message { - color: purple; - font-weight: bold; -} /* * EDITABLE ELEMENTS */ + + .htmlview *[x-editable] { padding-left: 3px; } /* focused editable element */ -.htmlview *[x-editable]:hover +/* .htmlview *[x-editable]:hover { -} +} */ .htmlview *[x-editable][x-open] { visibility: hidden; } -.htmlview *[x-editable] .context-menu { +.htmlview *[x-editable] > .context-menu { position: absolute; top: 0px; left: -50px; @@ -331,9 +379,8 @@ margin: 0px; padding: 0px; - - display: none; - visibility: visible; + visibility: inherit; + display: block; border-top: 1px solid black; border-left: 1px solid black; @@ -350,7 +397,7 @@ z-index: 3000; } -.htmlview *[x-editable] *.context-menu * { +.htmlview *[x-editable] > .context-menu * { margin: 0px; display: block; @@ -359,33 +406,37 @@ border-bottom: 1px solid black; } -.htmlview *[x-editable] *.context-menu *:last-child { +.htmlview *[x-editable] > .context-menu *:last-child { cursor: pointer; border-bottom: none; } -.htmlview *[x-editable] *.context-menu *:hover { +.htmlview *[x-editable] > .context-menu *:hover { background-color: orange; } /* * VISIBILITY RULES */ -.htmlview *[x-editable] *.default-menu { - display: block; +.htmlview *[x-editable] > .default-menu { + visibility: inherit; opacity: 0.4; } -.htmlview *[x-editable] *.default-menu:hover { +.htmlview *[x-editable] > .default-menu:hover { opacity: 1; } -.htmlview *[x-editable][x-open] *.default-menu { - display: none; +.htmlview *[x-editable][x-open] > .default-menu { + visibility: hidden; } -.htmlview *[x-editable][x-open] *.edit-menu { - display: block; +.htmlview *[x-editable] > .edit-menu { + visibility: hidden; +} + +.htmlview *[x-editable][x-open] > .edit-menu { + visibility: visible; } .html-editarea { diff --git a/platforma/static/js/button_scripts.js b/platforma/static/js/button_scripts.js old mode 100644 new mode 100755 index 40f45f6f..4af9d72d --- a/platforma/static/js/button_scripts.js +++ b/platforma/static/js/button_scripts.js @@ -6,6 +6,7 @@ function ScriptletCenter() { var text = this.XMLEditorSelectedText(context); var start_tag = '<'+params.tag; + var move_cursor = false; for (var attr in params.attrs) { start_tag += ' '+attr+'="' + params.attrs[attr] + '"'; @@ -39,14 +40,23 @@ function ScriptletCenter() output += token; } else { - output = start_tag + end_tag; + if(params.nocontent) { + output = "<"+params.tag +" />"; + } + else { + output = start_tag + end_tag; + move_cursor = true; + } } this.XMLEditorReplaceSelectedText(context, output); - if (text.length == 0) { - this.XMLEditorMoveCursorForward(context, -params.tag.length-3); - } + try { + if (move_cursor) { + this.XMLEditorMoveCursorForward(context, params.tag.length+2); + } + } catch(e) {} + }.bind(this); this.scriptlets['lineregexp'] = function(context, params) { diff --git a/platforma/static/js/models.js b/platforma/static/js/models.js index ba2f3ce3..40525946 100755 --- a/platforma/static/js/models.js +++ b/platforma/static/js/models.js @@ -522,7 +522,7 @@ Editor.DocumentModel = Editor.Model.extend({ revision: this.get('revision'), user: this.get('user') }, - complete: this.updateCompleted.bind(this), + complete: this.updateCompleted.bind(this) }); }, diff --git a/platforma/static/js/views/html.js b/platforma/static/js/views/html.js index 18ab0295..6481205c 100755 --- a/platforma/static/js/views/html.js +++ b/platforma/static/js/views/html.js @@ -21,6 +21,7 @@ var HTMLView = View.extend({ this.model.load(); this.currentOpen = null; + this.currentFocused = null; this.themeBoxes = []; }, @@ -118,6 +119,32 @@ var HTMLView = View.extend({ console.log('click:', event, event.ctrlKey, event.target); var $e = $(event.target); + if($e.hasClass('annotation')) + { + var $box = $e.parent(); + + if(this.currentFocused) + { + if($box[0] == this.currentFocused[0]) { + console.log('unfocus of current'); + this.unfocusAnnotation(); + return false; + } + + console.log('switch unfocus'); + this.unfocusAnnotation(); + } + + this.focusAnnotation($box); + return false; + } + + /* + * Clicking outside of focused area doesn't unfocus by default + * - this greatly simplifies the whole click check + */ + + /* other buttons */ if($e.hasClass('edit-button')) this.openForEdit( this.editableFor($e) ); @@ -125,7 +152,25 @@ var HTMLView = View.extend({ this.closeWithSave( this.editableFor($e) ); if($e.hasClass('reject-button')) - this.closeWithoutSave( this.editableFor($e) ); + this.closeWithoutSave( this.editableFor($e) ); + }, + + unfocusAnnotation: function() { + if(!this.currentFocused) + return false; + + if(this.currentOpen + && this.currentOpen.is("*[x-annotation-box]") + && this.currentOpen.parent()[0] == this.currentFocused[0]) + return false; + + this.currentFocused.removeAttr('x-focused'); + this.currentFocused = null; + }, + + focusAnnotation: function($e) { + this.currentFocused = $e; + $e.attr('x-focused', 'focused'); }, closeWithSave: function($e) { @@ -167,37 +212,52 @@ var HTMLView = View.extend({ if(!$e.attr('x-editable')) throw Exception("Click outside of editable") + console.log("Trigger", $button, " yields editable: ", $e); return $e; }, openForEdit: function($origin) { if(this.currentOpen && this.currentOpen != $origin) { - this.closeWithSave(this.currentOpen); - + this.closeWithSave(this.currentOpen); } - - // start edition on this node - var $overlay = $('
'); - + var x = $origin[0].offsetLeft; var y = $origin[0].offsetTop; var w = $origin.outerWidth(); var h = $origin.innerHeight(); - - $overlay.css({position: 'absolute', height: h, left: x, top: y, width: '95%'}); - - $origin.offsetParent().append($overlay); - $origin.data('edit-overlay', $overlay); - - this.model.getXMLPart($origin, function(path, data) { - $('textarea', $overlay).val(data); - }); - this.currentOpen = $origin; - $origin.attr('x-open', 'open'); - + console.log("Editable:", $origin, " offsetParent:", $origin[0].offsetParent); + console.log("Dimensions: ", x, y, w , h); + + // start edition on this node + var $overlay = $('
'); + $overlay.css({position: 'absolute', height: h, left: x, top: y, width: '95%'}); + $($origin[0].offsetParent).append($overlay); + $origin.data('edit-overlay', $overlay); + + this.model.getXMLPart($origin, function(path, data) { + $('textarea', $overlay).val(data); + }); + + this.currentOpen = $origin; + $origin.attr('x-open', 'open'); + + if($origin.is("*[x-annotation-box]")) + { + var $b = $origin.parent(); + if(this.currentFocused) { + if($b[0] != this.currentFocused[0]) + this.unfocusAnnotation(); + } + + this.focusAnnotation($origin); + } + else { + if(this.currentFocused) this.unfocusAnnotation(); + } + return false; } -- 2.20.1