# 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 = {} )
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;
right: 1em;
}
-#header button {
- vertical-align: middle;
-}
-
/* Commit dialog */
#commit-dialog-error-empty-message {
color: red;
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 = */
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;
+}
+
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) );
},
try {
var editable = this.editableFor($e);
+ if(!editable)
+ return false;
+
if($e.hasClass('delete-button'))
this.deleteElement(editable);
}
if(!$e.attr('x-editable'))
- throw Exception("Click outside of editable")
+ return null;
console.log("Trigger", $button, " yields editable: ", $e);
return $e;
}
},
+ //
+ // Special stuff for themes
+ //
+
// Theme related stuff
verifyThemeInsertPoint: function(node) {
this.themeEditor.show(_editThemeFinish);
},
- //
- // Special stuff for themes
- //
+
addTheme: function()
{
var selection = window.getSelection();
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;
}
});
<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">
\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
-\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
-<![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
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'),
)
# 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
fnp / redakcja.git / commitdiff