From 0f069f101a3e978c0f785dffe06ba873422c1137 Mon Sep 17 00:00:00 2001 From: Lukasz Rekucki Date: Sat, 31 Oct 2009 00:23:57 +0100 Subject: [PATCH 1/1] Podstawowe dodawanie motywow dla Gecko i Webkit. --- platforma/static/css/html.css | 3 + platforma/static/js/views/html.js | 146 +++++++++++++++++------ platforma/templates/explorer/editor.html | 1 + 3 files changed, 114 insertions(+), 36 deletions(-) diff --git a/platforma/static/css/html.css b/platforma/static/css/html.css index d8010def..88560687 100755 --- a/platforma/static/css/html.css +++ b/platforma/static/css/html.css @@ -248,6 +248,9 @@ border-right: none; z-index: 1; + -moz-user-select: -moz-none; + -webkit-user-select: none; + user-select: none; } /* diff --git a/platforma/static/js/views/html.js b/platforma/static/js/views/html.js index 97db6f07..e1c7b15e 100755 --- a/platforma/static/js/views/html.js +++ b/platforma/static/js/views/html.js @@ -13,7 +13,6 @@ var HTMLView = View.extend({ .addObserver(this, 'data', this.modelDataChanged.bind(this)) .addObserver(this, 'state', this.modelStateChanged.bind(this)); - this.$menuTemplate = $(render_template('html-view-frag-menu-template', this)); this.modelStateChanged('state', this.model.get('state')); this.modelDataChanged('data', this.model.get('data')); @@ -31,14 +30,12 @@ var HTMLView = View.extend({ var self = this; /* upgrade editable elements */ - $("*[x-editable]").each(function() { + $("*[x-editable]", this.$docbase).each(function() { $(this).append( self.$menuTemplate.clone() ); - }); - - 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+"]"); @@ -48,7 +45,7 @@ var HTMLView = View.extend({ h = Math.max(h, end.offset().top - begin.offset().top); $(this).css('height', h); - }); + }); */ }, updatePrintLink: function() { @@ -90,15 +87,46 @@ var HTMLView = View.extend({ }, 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() ); - this.element.bind('click', this.itemClicked.bind(this)); - // this.element.bind('mouseover', this.itemHover.bind(this)); + if(this.currentFocused && $p[0] == this.currentFocused[0]) + { + this.currentFocused = $p; + $box.css({'display': 'block'}); + } + + return; + } + + $e.html(html); + $e.append( this.$menuTemplate.clone() ); }, reload: function() { @@ -144,6 +172,12 @@ var HTMLView = View.extend({ * - 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) ); @@ -205,28 +239,6 @@ var HTMLView = View.extend({ this.currentOpen = null; }, - 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'}); - } - - return; - } - - $e.html(html); - $e.append( this.$menuTemplate.clone() ); - }, - editableFor: function($button) { var $e = $button; @@ -294,8 +306,70 @@ var HTMLView = View.extend({ $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 = $('')[0]; + ipoint.insertNode(elem); + + // insert theme-ref + ipoint.setStart(range.startContainer, range.startOffset); + var elem = $('Nowy motyw')[0]; + ipoint.insertNode(elem); + ipoint.setStartBefore(elem); + + // insert theme-begin + elem = $('')[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 diff --git a/platforma/templates/explorer/editor.html b/platforma/templates/explorer/editor.html index 2458e8e0..7db4f44a 100755 --- a/platforma/templates/explorer/editor.html +++ b/platforma/templates/explorer/editor.html @@ -65,6 +65,7 @@