this.model
.addObserver(this, 'data', this.modelDataChanged.bind(this))
.addObserver(this, 'state', this.modelStateChanged.bind(this));
-
- $('.htmlview', this.element).html(this.model.get('data'));
this.$menuTemplate = $(render_template('html-view-frag-menu-template', this));
-
this.modelStateChanged('state', this.model.get('state'));
+ this.modelDataChanged('data', this.model.get('data'));
+
this.model.load();
this.currentOpen = null;
var self = this;
/* upgrade editable elements */
- $("*[x-editable]").each(function() {
+ $("*[x-editable]", this.$docbase).each(function() {
$(this).append( self.$menuTemplate.clone() );
});
-
- var n = 5001;
-
- var doc_base = $('.htmlview .utwor', this.element);
-
+
/* mark themes */
- $(".theme-ref").each(function() {
+ /* $(".theme-ref", this.$docbase).each(function() {
var id = $(this).attr('x-theme-class');
var end = $("span.theme-end[x-theme-class = " + id+"]");
h = Math.max(h, end.offset().top - begin.offset().top);
$(this).css('height', h);
- });
+ }); */
},
updatePrintLink: function() {
},
render: function() {
- this.element.unbind('click');
+ if(this.$docbase)
+ this.$docbase.unbind('click');
+
+ if(this.$printLink)
+ this.$printLink.unbind();
+
+ if(this.$addThemeButton)
+ this.$addThemeButton.unbind();
- if(this.$printLink) this.$printLink.unbind();
this._super();
- this.$printLink = $('.html-print-link', this.element);
+
+ this.$printLink = $('.htmlview-toolbar .html-print-link', this.element);
+ this.$docbase = $('.htmlview', this.element);
+ this.$addThemeButton = $('.htmlview-toolbar .html-add-motive', this.element);
+
this.updatePrintLink();
+ this.$docbase.bind('click', this.itemClicked.bind(this));
+ this.$addThemeButton.click( this.addTheme.bind(this) );
+ },
+
+ renderPart: function($e, html) {
+ // exceptions aren't good, but I don't have a better idea right now
+ if($e.attr('x-annotation-box')) {
+ // replace the whole annotation
+ var $p = $e.parent();
+ $p.html(html);
+ var $box = $('*[x-annotation-box]', $p);
+ $box.append( this.$menuTemplate.clone() );
+
+ if(this.currentFocused && $p[0] == this.currentFocused[0])
+ {
+ this.currentFocused = $p;
+ $box.css({'display': 'block'});
+ }
- this.element.bind('click', this.itemClicked.bind(this));
- // this.element.bind('mouseover', this.itemHover.bind(this));
+ return;
+ }
+
+ $e.html(html);
+ $e.append( this.$menuTemplate.clone() );
},
reload: function() {
if($e.hasClass('annotation'))
{
- var $box = $e.parent();
-
+ if(this.currentOpen) return false;
+
+ var $p = $e.parent();
if(this.currentFocused)
{
- if($box[0] == this.currentFocused[0]) {
+ console.log(this.currentFocused, $p);
+ if($p[0] == this.currentFocused[0]) {
console.log('unfocus of current');
this.unfocusAnnotation();
return false;
this.unfocusAnnotation();
}
- this.focusAnnotation($box);
+ this.focusAnnotation($p);
return false;
}
* - this greatly simplifies the whole click check
*/
+ if( $e.hasClass('theme-ref') )
+ {
+ console.log($e);
+ this.selectTheme($e.attr('x-theme-class'));
+ }
+
/* other buttons */
if($e.hasClass('edit-button'))
this.openForEdit( this.editableFor($e) );
this.closeWithoutSave( this.editableFor($e) );
},
- unfocusAnnotation: function() {
+ unfocusAnnotation: function()
+ {
if(!this.currentFocused)
+ {
+ console.log('Redundant unfocus');
return false;
+ }
if(this.currentOpen
&& this.currentOpen.is("*[x-annotation-box]")
&& this.currentOpen.parent()[0] == this.currentFocused[0])
+ {
+ console.log("Can't unfocus open box");
return false;
-
- this.currentFocused.removeAttr('x-focused');
+ }
+
+ var $box = $("*[x-annotation-box]", this.currentFocused);
+ $box.css({'display': 'none'});
+ // this.currentFocused.removeAttr('x-focused');
+ // this.currentFocused.hide();
this.currentFocused = null;
},
focusAnnotation: function($e) {
this.currentFocused = $e;
- $e.attr('x-focused', 'focused');
+ var $box = $("*[x-annotation-box]", $e);
+ $box.css({'display': 'block'});
+
+ // $e.attr('x-focused', 'focused');
},
closeWithSave: function($e) {
this.currentOpen = null;
},
- renderPart: function($e, html) {
- $e.html(html);
- $e.append( this.$menuTemplate.clone() );
- },
-
editableFor: function($button)
{
var $e = $button;
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])
+ // if some other is focused
+ if($b[0] != this.currentFocused[0]) {
this.unfocusAnnotation();
+ this.focusAnnotation($b);
+ }
+ // already focues
+ }
+ else { // nothing was focused
+ this.focusAnnotation($b);
}
-
- this.focusAnnotation($origin);
}
- else {
+ else { // this item is not focusable
if(this.currentFocused) this.unfocusAnnotation();
}
+
+ this.currentOpen = $origin;
+ $origin.attr('x-open', 'open');
return false;
+ },
+
+ addTheme: function()
+ {
+ var selection = document.getSelection();
+ var n = selection.rangeCount;
+
+ if(n == 0)
+ window.alert("Nie zaznaczono żadnego obszaru");
+
+ // for now allow only 1 range
+ if(n > 1)
+ window.alert("Zaznacz jeden obszar");
+
+ // from this point, we will assume that the ranges are disjoint
+ for(var i=0; i < n; i++) {
+ var range = selection.getRangeAt(i);
+ console.log(i, range.startContainer, range.endContainer);
+ var date = Date.now();
+ var random = Math.floor(4000000000*Math.random());
+ var id = (''+date) + '-' + (''+random);
+
+ var ipoint = document.createRange();
+
+
+
+ // Firefox alters the later node when inserting, so
+ // insert from end
+ ipoint.setStart(range.endContainer, range.endOffset);
+ elem = $('<span class="theme-end" x-theme-class="'+id+'" id="e'+id+'"></span>')[0];
+ ipoint.insertNode(elem);
+
+ // insert theme-ref
+ ipoint.setStart(range.startContainer, range.startOffset);
+ var elem = $('<span class="theme-ref" x-theme-class="'+id+'" id="m'+id+'">Nowy motyw</span>')[0];
+ ipoint.insertNode(elem);
+ ipoint.setStartBefore(elem);
+
+ // insert theme-begin
+ elem = $('<span class="theme-begin" x-theme-class="'+id+'" id="b'+id+'"></span>')[0];
+ ipoint.insertNode(elem);
+ }
+
+ selection.removeAllRanges();
+ },
+
+ selectTheme: function(themeId)
+ {
+ var selection = document.getSelection();
+
+ // remove current selection
+ selection.removeAllRanges();
+
+ var range = document.createRange();
+ var s = $('#m'+themeId)[0];
+ var e = $('#e'+themeId)[0];
+ console.log('Selecting range:', themeId, range, s, e);
+
+ if(s && e) {
+ range.setStartAfter(s);
+ range.setEndBefore(e);
+ selection.addRange(range);
+ }
}
-
});
// Register view