Annotations.

diff --git a/apps/explorer/views.py b/apps/explorer/views.py
index 76670f5..fde7aeb 100755 (executable)
--- a/apps/explorer/views.py
+++ b/apps/explorer/views.py
@@ -130,5 +130,5 @@ def pull_requests(request):
 # Testing
 #
 def renderer_test(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 = {} )
         extra_context = {} )

diff --git a/platforma/static/css/master.css b/platforma/static/css/master.css
index 8200037..874d9e1 100755 (executable)
--- a/platforma/static/css/master.css
+++ b/platforma/static/css/master.css
@@ -6,19 +6,6 @@ body {
     background: #AAA;
 }
 
     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;
 #body-wrap {
     margin: 0px;
     padding: 0px;


@@ -60,10 +47,6 @@ select {
     right: 1em;
 }
 
     right: 1em;
 }
 

-#header button {
-    vertical-align: middle;
-}
-

 /* Commit dialog */
 #commit-dialog-error-empty-message {
     color: red;
 /* Commit dialog */
 #commit-dialog-error-empty-message {
     color: red;


@@ -260,20 +243,6 @@ input.image-gallery-current-page {
     margin: 0px;
 }
 
     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 = */
 
 /* ================= */
 /* = Message boxes = */


@@ -294,3 +263,71 @@ body#base button:hover {
     background-color: red;
 }
 
     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/templates/explorer/editor.html b/platforma/templates/explorer/editor.html
index 08f7d41..7eca642 100755 (executable)
--- 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>
        <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">
                 </div>
                 
                <div class="htmlview">

diff --git a/platforma/templates/renderer.html b/platforma/templates/renderer.html
index 84de36d..d251842 100755 (executable)
--- a/platforma/templates/renderer.html
+++ b/platforma/templates/renderer.html
@@ -2,39 +2,74 @@
 \r
 {% block extrahead %}\r
 <link rel="stylesheet" href="{{STATIC_URL}}css/html.css" type="text/css" charset="utf-8" />\r
 \r
 {% block extrahead %}\r
 <link rel="stylesheet" href="{{STATIC_URL}}css/html.css" type="text/css" charset="utf-8" />\r

-<script src="{{STATIC_URL}}js/lib/codemirror/codemirror.js" type="text/javascript" charset="utf-8"></script>\r
+<style type="text/css">\r
+    #target {\r
+        border: 2px solid red;              \r
+        background-color: aqua;\r
+        padding: 10px;\r
+        \r
+    }\r
+\r
+    #cursor {\r
+        background: black;\r
+        color: white;        \r
+        margin: 0em;\r
+        margin-right: -1px;\r
+        padding: 0em;\r
+        border-right: 1px solid black;\r
+    }\r
+</style>\r

 {% endblock %}\r
 \r
 {% block maincontent %}\r
 {% endblock %}\r
 \r
 {% block maincontent %}\r

-\r
-<!-- <button type="button" id="render">Render</button>\r
-\r
-<table width="100%" align="center">\r
-    <tr>\r
-        <td width="50%">\r
-                <textarea id="source" cols="70" rows="30" ></textarea>\r
-        </td>\r
-        <td width="50%">\r
-                <textarea id="dest" cols="70" rows="30" ></textarea>\r
-        </td>\r
-    </tr>\r
-</table>\r
-<iframe>\r
-    \r
-</iframe> -->\r
-<div id="target"> </div>\r
+<div>\r
+    <p>\r
+        Przykładowy tekst, bo ala ma\r
+        <a href="#" class="button"><span class="button-text">Przycisk</span>\r
+            <span class="upper-bg"></span><span class="lower-bg"></span></a>\r
+        ślicznego kotka i burego psa.\r
+    </p>\r
+    <p style="border: 1px solid fuchsia; line-height: 20pt; font-size: 12pt;">\r
+        Ta linijka ma 2pt wysokości, oraz czcionkę 12pt. <button type="button" ><span>Przycisk 2</span></button>  jest super.\r
+    </p>\r
+</div>\r

 {% endblock %}\r
 \r
 {% block extrabody %}\r
 \r
 <script type="text/javascript">\r
 {% endblock %}\r
 \r
 {% block extrabody %}\r
 \r
 <script type="text/javascript">\r

-<![CDATA[\r
-    var editor = new CodeMirror(CodeMirror.replace("target"), {\r
-  parserfile: ["tokenizejavascript.js", "parsejavascript.js"],\r
-  path: "{{STATIC_URL}}js/lib/codemirror",\r
-  stylesheet: "{{STATIC_URL}}css/xmlcolors.css",\r
-  content: "Hello world!"\r
-});\r
+<![CDATA[    \r
+    $('#target').bind('keydown', function(event) {\r
+        console.log("Keydown:", String.fromCharCode(event.keyCode), event);\r
+        console.log("Selection:", window.getSelection() );\r
+        if(event.keyCode == 37 \r
+         || event.keyCode == 38 || event.keyCode == 39 || event.keyCode == 40)\r
+            return true;\r
+\r
+        if(event.keyCode == 8)\r
+        {\r
+            var selection = window.getSelection();\r
+            if(selection.anchorOffset == 0)\r
+            {\r
+                var r = selection.getRangeAt(0);\r
+                r.setStartBefore( $("#elem")[0] );                \r
+\r
+                return true;\r
+            }\r
+            return true;\r
+        }\r
+        \r
+        return true;\r
+    }).\r
+        bind('dragstart', function() { console.log('dragstart'); }).\r
+        bind('dragenter', function() { console.log('dragenter'); }).\r
+        bind('dragover', function() { console.log('dragover'); }).\r
+        bind('dragover', function() { console.log('dragend'); }).\r
+        bind('drag', function() { console.log('drag'); });\r
+\r
+    $('*').bind('drop', function(event) { console.log('drop on:', event.target, 'received on', this); });\r
+        \r
+\r

 ]]>\r
 </script>\r
 \r
 ]]>\r
 </script>\r
 \r

diff --git a/platforma/urls.py b/platforma/urls.py
index 318d97c..ccb9fcf 100755 (executable)
--- 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'),        
 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'),
   
 
     url(r'^management/pull-requests$', 'explorer.views.pull_requests'),
   


@@ -50,11 +48,15 @@ else:
     )
 
 # Static files
     )
 
 # Static files

-if settings.DEBUG and not hasattr(settings, 'DONT_SERVE_STATIC'):
+if settings.DEBUG:

     urlpatterns += patterns('',
     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