text-decoration: none;
}
+.htmlview a:hover {
+ text-decoration: none;
+}
+
.htmlview h1 {
font-size: 3em;
margin: 1.5em 0;
margin: 1em;
}
+ .parse-warning .message {
+ color: purple;
+ font-weight: bold;
+}
+
/* Motywy */
/* ======================== */
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;
}
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;
margin: 0px;
padding: 0px;
-
- display: none;
- visibility: visible;
+ visibility: inherit;
+ display: block;
border-top: 1px solid black;
border-left: 1px solid black;
z-index: 3000;
}
-.htmlview *[x-editable] *.context-menu * {
+.htmlview *[x-editable] > .context-menu * {
margin: 0px;
display: block;
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 {
this.model.load();
this.currentOpen = null;
+ this.currentFocused = null;
this.themeBoxes = [];
},
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) );
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) {
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 = $('<div class="html-editarea"><textarea></textarea></div>');
-
+
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 = $('<div class="html-editarea"><textarea></textarea></div>');
+ $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;
}