From: Lukasz Rekucki <lrekucki@gmail.com>
Date: Fri, 13 Nov 2009 17:55:39 +0000 (+0100)
Subject: Merge branch 'lqc-trunk' of git@stigma:platforma into lqc-trunk
X-Git-Url: https://git.mdrn.pl/redakcja.git/commitdiff_plain/b02d71628de3e39c79abd257096281bf7fa1291d?hp=3dce3af2370f6609df6f2d555e6be22017645300

Merge branch 'lqc-trunk' of git@stigma:platforma into lqc-trunk
---

diff --git a/apps/explorer/views.py b/apps/explorer/views.py
index 76670f50..fde7aeb9 100755
--- a/apps/explorer/views.py
+++ b/apps/explorer/views.py
@@ -130,5 +130,5 @@ def pull_requests(request):
 # Testing
 #
 def renderer_test(request):
-    return direct_to_template(request, 'renderer.html', mimetype="application/xhtml+xml",
+    return direct_to_template(request, 'renderer.html', mimetype="text/html",
         extra_context = {} )
diff --git a/platforma/static/css/master.css b/platforma/static/css/master.css
index 8200037c..874d9e12 100755
--- a/platforma/static/css/master.css
+++ b/platforma/static/css/master.css
@@ -6,19 +6,6 @@ body {
     background: #AAA;
 }
 
-/*  fix icon buttons */
-
-button img {
-    vertical-align: middle;
-    margin: 0px;
-}
-
-/* default form style hacks */
-select {
-    border: none;
-    margin-left: 0.1em;f
-}
-
 #body-wrap {
     margin: 0px;
     padding: 0px;
@@ -60,10 +47,6 @@ select {
     right: 1em;
 }
 
-#header button {
-    vertical-align: middle;
-}
-
 /* Commit dialog */
 #commit-dialog-error-empty-message {
     color: red;
@@ -260,20 +243,6 @@ input.image-gallery-current-page {
     margin: 0px;
 }
 
-body#base button {
-    background-color: #DDD;
-    border-width: 1px;
-    padding: 0px 0.5em;    
-    font-family: Sans-Serif;
-    /* color: #000; */
-    margin: 2px 4px;
-}
-
-body#base button:hover {
-    background-color: #EEE;
-}
-
-
 
 /* ================= */
 /* = Message boxes = */
@@ -294,3 +263,71 @@ body#base button:hover {
     background-color: red;
 }
 
+
+
+/*
+ *
+ * Buttons
+ *
+ */
+*.button {
+    /* reset margin and padding and see what happens */
+    padding: 0;
+    margin: 0;
+    border: 2px solid blue;
+
+    /*
+     * Borders and padding:
+    */
+    
+    /* observation 1: Firefox doesn't apply top/bottom borders to spans in button */
+    /* observation 2: Webkit leaves out some padding to left/right 
+        also: it cuts the top/bottom margin to 1px max */
+
+    /* observation 3: Opera does the oposite then WK and FF ->
+        span has all borders, button has only left/right 
+    */
+
+    /* Line Height */
+
+    /* 1. Wszystkie przeglądarki, domyślnie ustawiają vertical-align: baseline */
+    vertical-align: baseline;
+
+    /* 2. Opera ustawia rozmiar przycisku, na rozmiar line-height obiektu, który go zawiera */
+    
+    display: inline-block;
+    position: relative;
+    background: yellow;
+    padding: 2px 4px;
+
+    font-size: 16pt;
+    text-decoration: none;
+}
+
+*.button:active {
+    background: aqua;
+}
+
+*.button > span.upper-bg {
+    position: absolute;
+    top: 0px; 
+    left: 2px;
+    right: 0px;
+    bottom: 5px;
+
+    margin: 0px;
+    
+    background-color: white;
+    z-index: 0;
+    display: block;
+}
+
+*.button > span.button-text {
+    position: relative;
+    margin: 0px;
+    display: inline-block;
+    z-index: 2;
+    background: blue;
+    opacity: 0.5;
+}
+
diff --git a/platforma/static/js/views/html.js b/platforma/static/js/views/html.js
index d2677d42..2dba1c12 100755
--- a/platforma/static/js/views/html.js
+++ b/platforma/static/js/views/html.js
@@ -102,16 +102,21 @@ var HTMLView = View.extend({
         if(this.$addThemeButton)
             this.$addThemeButton.unbind();
 
+        if(this.$addAnnotation)
+            this.$addAnnotation.unbind();
+
         this._super();
 
         this.$printLink = $('.htmlview-toolbar .html-print-link', this.element);
         this.$docbase = $('.htmlview', this.element);
-        this.$addThemeButton = $('.htmlview-toolbar .html-add-motive', this.element);
+        this.$addThemeButton = $('.htmlview-toolbar .html-add-theme', this.element);
+        this.$addAnnotation = $('.htmlview-toolbar .html-add-annotation', this.element);
         // this.$debugButton = $('.htmlview-toolbar .html-serialize', this.element);
 
         this.updatePrintLink();
         this.$docbase.bind('click', this.itemClicked.bind(this));
         this.$addThemeButton.click( this.addTheme.bind(this) );
+        this.$addAnnotation.click( this.addAnnotation.bind(this) );
         // this.$debugButton.click( this.serialized.bind(this) );
     },
 
@@ -179,6 +184,9 @@ var HTMLView = View.extend({
         try {
             var editable = this.editableFor($e);
 
+            if(!editable)
+                return false;
+
             if($e.hasClass('delete-button'))
                 this.deleteElement(editable);
 
@@ -273,7 +281,7 @@ var HTMLView = View.extend({
         }
 
         if(!$e.attr('x-editable'))
-            throw Exception("Click outside of editable")
+            return null;
 
         console.log("Trigger", $button, " yields editable: ", $e);
         return $e;
@@ -376,6 +384,10 @@ var HTMLView = View.extend({
         }
     },
 
+    //
+    // Special stuff for themes
+    //
+    
     // Theme related stuff
     verifyThemeInsertPoint: function(node) {
 
@@ -418,9 +430,7 @@ var HTMLView = View.extend({
         this.themeEditor.show(_editThemeFinish);
     },
 
-    //
-    // Special stuff for themes
-    //
+
     addTheme: function()
     {
         var selection = window.getSelection();
@@ -526,6 +536,46 @@ var HTMLView = View.extend({
             range.setEndBefore(e);
             selection.addRange(range);
         }
+    },
+
+    addAnnotation: function()
+    {
+        var selection = window.getSelection();
+        var n = selection.rangeCount;
+
+        console.log("Range count:", n);
+        if(n == 0) {
+            window.alert("Nie zaznaczono żadnego obszaru");
+            return false;
+        }
+
+        // for now allow only 1 range
+        if(n > 1) {
+            window.alert("Zaznacz jeden obszar");
+            return false;
+        }
+
+        // remember the selected range
+        var range = selection.getRangeAt(0);
+
+        if(! this.verifyThemeInsertPoint(range.endContainer) ) {
+            window.alert("Nie można wstawić w to miejsce przypisu.");
+            return false;
+        }
+
+        var text = range.toString();        
+        var tag = $('<span></span>');
+        range.collapse(false);
+        range.insertNode(tag[0]);
+        var errors = this.model.updateWithWLML(tag, '<pr><slowo_obce>'+text+"</slowo_obce> </pr>");
+
+        if(errors) {
+                tag.remove();
+                messageCenter.addMessage('error', null, 'Błąd przy dodawaniu przypisu:' + errors);
+                return false;
+        }
+
+        return true;
     }
 });
 
diff --git a/platforma/templates/explorer/editor.html b/platforma/templates/explorer/editor.html
index 08f7d41e..7eca642d 100755
--- a/platforma/templates/explorer/editor.html
+++ b/platforma/templates/explorer/editor.html
@@ -64,7 +64,8 @@
 	<script type="text/html" charset="utf-8" id="html-view-template">
                 <div class="htmlview-toolbar">
                     <a class="html-print-link" href="print" ui:baseref="{% url file_print fileid %}" target="_new">{% trans "Print version"  %}</a>
-                    <button class="html-add-motive" type="button">Dodaj motyw</button>                    
+                    <button class="html-add-theme" type="button">Oznacz fragment motywem</button>
+                    <button class="html-add-annotation" type="button">Dodaj przypis</button>
                 </div>
                 
 		<div class="htmlview">
diff --git a/platforma/templates/renderer.html b/platforma/templates/renderer.html
index 84de36d6..d2518427 100755
--- a/platforma/templates/renderer.html
+++ b/platforma/templates/renderer.html
@@ -2,39 +2,74 @@
 
 {% block extrahead %}
 <link rel="stylesheet" href="{{STATIC_URL}}css/html.css" type="text/css" charset="utf-8" />
-<script src="{{STATIC_URL}}js/lib/codemirror/codemirror.js" type="text/javascript" charset="utf-8"></script>
+<style type="text/css">
+    #target {
+        border: 2px solid red;              
+        background-color: aqua;
+        padding: 10px;
+        
+    }
+
+    #cursor {
+        background: black;
+        color: white;        
+        margin: 0em;
+        margin-right: -1px;
+        padding: 0em;
+        border-right: 1px solid black;
+    }
+</style>
 {% endblock %}
 
 {% block maincontent %}
-
-<!-- <button type="button" id="render">Render</button>
-
-<table width="100%" align="center">
-    <tr>
-        <td width="50%">
-                <textarea id="source" cols="70" rows="30" ></textarea>
-        </td>
-        <td width="50%">
-                <textarea id="dest" cols="70" rows="30" ></textarea>
-        </td>
-    </tr>
-</table>
-<iframe>
-    
-</iframe> -->
-<div id="target"> </div>
+<div>
+    <p>
+        Przykładowy tekst, bo ala ma
+        <a href="#" class="button"><span class="button-text">Przycisk</span>
+            <span class="upper-bg"></span><span class="lower-bg"></span></a>
+        ślicznego kotka i burego psa.
+    </p>
+    <p style="border: 1px solid fuchsia; line-height: 20pt; font-size: 12pt;">
+        Ta linijka ma 2pt wysokości, oraz czcionkę 12pt. <button type="button" ><span>Przycisk 2</span></button>  jest super.
+    </p>
+</div>
 {% endblock %}
 
 {% block extrabody %}
 
 <script type="text/javascript">
-<![CDATA[
-    var editor = new CodeMirror(CodeMirror.replace("target"), {
-  parserfile: ["tokenizejavascript.js", "parsejavascript.js"],
-  path: "{{STATIC_URL}}js/lib/codemirror",
-  stylesheet: "{{STATIC_URL}}css/xmlcolors.css",
-  content: "Hello world!"
-});
+<![CDATA[    
+    $('#target').bind('keydown', function(event) {
+        console.log("Keydown:", String.fromCharCode(event.keyCode), event);
+        console.log("Selection:", window.getSelection() );
+        if(event.keyCode == 37 
+         || event.keyCode == 38 || event.keyCode == 39 || event.keyCode == 40)
+            return true;
+
+        if(event.keyCode == 8)
+        {
+            var selection = window.getSelection();
+            if(selection.anchorOffset == 0)
+            {
+                var r = selection.getRangeAt(0);
+                r.setStartBefore( $("#elem")[0] );                
+
+                return true;
+            }
+            return true;
+        }
+        
+        return true;
+    }).
+        bind('dragstart', function() { console.log('dragstart'); }).
+        bind('dragenter', function() { console.log('dragenter'); }).
+        bind('dragover', function() { console.log('dragover'); }).
+        bind('dragover', function() { console.log('dragend'); }).
+        bind('drag', function() { console.log('drag'); });
+
+    $('*').bind('drop', function(event) { console.log('drop on:', event.target, 'received on', this); });
+        
+
 ]]>
 </script>
 
diff --git a/platforma/urls.py b/platforma/urls.py
index 318d97cc..ccb9fcf7 100755
--- a/platforma/urls.py
+++ b/platforma/urls.py
@@ -11,9 +11,7 @@ PATH_END = PATH_SEC + "/$"
 urlpatterns = patterns('',
     # Explorer:
     url(r'^$', 'explorer.views.file_list', name='file_list'),        
-    url(r'^file/upload', 'explorer.views.file_upload', name='file_upload'),
-
-    url(r'^renderer$', 'explorer.views.renderer_test'),
+    url(r'^file/upload', 'explorer.views.file_upload', name='file_upload'),    
 
     url(r'^management/pull-requests$', 'explorer.views.pull_requests'),
   
@@ -50,11 +48,15 @@ else:
     )
 
 # Static files
-if settings.DEBUG and not hasattr(settings, 'DONT_SERVE_STATIC'):
+if settings.DEBUG:
     urlpatterns += patterns('',
-        url(r'^%s(?P<path>.+)$' % settings.MEDIA_URL[1:], 'django.views.static.serve',
-            {'document_root': settings.MEDIA_ROOT, 'show_indexes': True}),
-        url(r'^%s(?P<path>.+)$' % settings.STATIC_URL[1:], 'django.views.static.serve',
-            {'document_root': settings.STATIC_ROOT, 'show_indexes': True}),
+        url(r'^renderer$', 'explorer.views.renderer_test'),
     )
-# 
\ No newline at end of file
+
+    if not hasattr(settings, 'DONT_SERVE_STATIC'):
+        urlpatterns += patterns('',
+            url(r'^%s(?P<path>.+)$' % settings.MEDIA_URL[1:], 'django.views.static.serve',
+                {'document_root': settings.MEDIA_ROOT, 'show_indexes': True}),
+            url(r'^%s(?P<path>.+)$' % settings.STATIC_URL[1:], 'django.views.static.serve',
+                {'document_root': settings.STATIC_ROOT, 'show_indexes': True}),
+        )
\ No newline at end of file