From 3cff6e4a3f7e7acceacbc621f9196204b508121e Mon Sep 17 00:00:00 2001 From: =?utf8?q?=C5=81ukasz=20Rekucki?= Date: Tue, 25 May 2010 13:09:50 +0200 Subject: [PATCH] Added buttons to scroll toolbar buttons. Fixes #606. --- apps/toolbar/templates/toolbar/button.html | 2 +- apps/toolbar/templates/toolbar/toolbar.html | 13 +-- redakcja/compress_settings.py | 14 +-- redakcja/settings/__init__.py | 4 +- redakcja/static/css/master.css | 58 ------------- redakcja/static/css/toolbar.css | 87 +++++++++++++++++++ .../static/js/{ => lib}/jquery-1.4.2.min.js | 0 .../{ => lib/jquery}/jquery.autocomplete.js | 0 .../js/{ => lib/jquery}/jquery.blockui.js | 0 .../js/{ => lib/jquery}/jquery.elastic.js | 0 redakcja/static/js/wiki/loader.js | 2 +- redakcja/static/js/wiki/toolbar.js | 60 +++++++++++++ redakcja/static/js/wiki/view_editor_source.js | 20 +---- 13 files changed, 168 insertions(+), 92 deletions(-) create mode 100644 redakcja/static/css/toolbar.css rename redakcja/static/js/{ => lib}/jquery-1.4.2.min.js (100%) rename redakcja/static/js/{ => lib/jquery}/jquery.autocomplete.js (100%) rename redakcja/static/js/{ => lib/jquery}/jquery.blockui.js (100%) rename redakcja/static/js/{ => lib/jquery}/jquery.elastic.js (100%) create mode 100644 redakcja/static/js/wiki/toolbar.js diff --git a/apps/toolbar/templates/toolbar/button.html b/apps/toolbar/templates/toolbar/button.html index a43cb936..cdffcaf1 100644 --- a/apps/toolbar/templates/toolbar/button.html +++ b/apps/toolbar/templates/toolbar/button.html @@ -1,5 +1,5 @@ {% if button.link %} - + {% endif %} +
{% for group in toolbar_groups %} -
+
    {# buttons for this group #} {% for button in group.button_set.all %} - {% toolbar_button button %} +
  • {% toolbar_button button %}
    • {% endfor %} -
+ {% endfor %}
-
+ diff --git a/redakcja/compress_settings.py b/redakcja/compress_settings.py index fa416c41..7207f1b9 100644 --- a/redakcja/compress_settings.py +++ b/redakcja/compress_settings.py @@ -3,6 +3,7 @@ COMPRESS_CSS = { 'detail': { 'source_filenames': ( 'css/master.css', + 'css/toolbar.css', 'css/gallery.css', 'css/history.css', 'css/summary.css', @@ -25,10 +26,10 @@ COMPRESS_JS = { 'detail': { 'source_filenames': ( # libraries - 'js/jquery-1.4.2.min.js', - 'js/jquery.autocomplete.js', - 'js/jquery.blockui.js', - 'js/jquery.elastic.js', + 'js/lib/jquery-1.4.2.min.js', + 'js/lib/jquery/jquery.autocomplete.js', + 'js/lib/jquery/jquery.blockui.js', + 'js/lib/jquery/jquery.elastic.js', 'js/button_scripts.js', 'js/slugify.js', @@ -38,6 +39,7 @@ COMPRESS_JS = { # base UI 'js/wiki/base.js', + 'js/wiki/toolbar.js', # dialogs 'js/wiki/dialog_save.js', @@ -55,7 +57,7 @@ COMPRESS_JS = { }, 'listing': { 'source_filenames': ( - 'js/jquery-1.4.2.min.js', + 'js/lib/jquery-1.4.2.min.js', 'js/slugify.js', ), 'output_filename': 'compressed/listing_scripts_?.js', @@ -65,6 +67,6 @@ COMPRESS_JS = { COMPRESS = True COMPRESS_CSS_FILTERS = None COMPRESS_JS_FILTERS = None -COMPRESS_AUTO = False +COMPRESS_AUTO = True COMPRESS_VERSION = True COMPRESS_VERSIONING = 'compress.versioning.hash.MD5Versioning' diff --git a/redakcja/settings/__init__.py b/redakcja/settings/__init__.py index e6ee2038..8be901ad 100644 --- a/redakcja/settings/__init__.py +++ b/redakcja/settings/__init__.py @@ -1,5 +1,5 @@ from __future__ import absolute_import -from .common import * +from settings.common import * DATABASE_ENGINE = 'sqlite3' # 'postgresql_psycopg2', 'postgresql', 'mysql', 'sqlite3' or 'oracle'. DATABASE_NAME = PROJECT_ROOT + '/dev.sqlite' # Or path to database file if using sqlite3. @@ -27,6 +27,6 @@ try: else: import sys logging.basicConfig(stream=sys.stderr) -except ImportError as exc: +except (ImportError,), exc: raise diff --git a/redakcja/static/css/master.css b/redakcja/static/css/master.css index ae742667..ac564140 100644 --- a/redakcja/static/css/master.css +++ b/redakcja/static/css/master.css @@ -160,64 +160,6 @@ body { vertical-align: middle; } - -/* - * Toolbars - */ - -.toolbar { - width: 100%; - border-bottom: 1px solid #777; - background-color: #C1C1C1; - margin: 0; - padding: 2px; - z-index: 100; - height: 28px; -} - -.toolbar button { - display: block; - float: left; - margin: 4px 0 2px 0; - padding: 2px 5px; - border: none; - background: none; -} - -.toolbar button img { - margin: 0; - padding: 0; - margin-bottom: -3px; -} - - -.toolbar select { - float: left; - margin: 1px 5px 1px 0; - background: none; - border: 1px solid #999; - padding: 1px; -} - -.toolbar input { - float: left; - font-size: 11px; - padding: 0; - margin: 4px 5px 0px 5px; - vertical-align:baseline; -} - -.toolbar-end { - clear: both; -} - -.toolbar button:hover, .toolbar button:active { - background: #777; - color: #FFF; - -webkit-border-radius: 10px; - -moz-border-radius: 10px; -} - /* Remove extra padding in Firefox */ button::-moz-focus-inner { border: 0; diff --git a/redakcja/static/css/toolbar.css b/redakcja/static/css/toolbar.css new file mode 100644 index 00000000..c07c57fd --- /dev/null +++ b/redakcja/static/css/toolbar.css @@ -0,0 +1,87 @@ +/* + * Toolbars + */ + +.toolbar { + border-bottom: 1px solid #777; + background-color: #C1C1C1; + margin: 0px; + padding: 0px; + z-index: 100; + height: 28px; + position: relative; +} + +.toolbar > .group_selector { + position: absolute; + + margin: 1px 5px 1px 0; + border: 1px solid #999; + padding: 1px; + + top: 0px; + left: 0px; + bottom: 0px; + width: 180px; +} + +.toolbar > .group_selector + button { + position: absolute; + width: 20px; + top: 0px; + left: 180px; + bottom: 0px; +} + +.toolbar > .button_group_container { + position: absolute; + top: 0px; + left: 200px; + right: 20px; + bottom: 0px; + + overflow: hidden; +} + +.toolbar > .button_group_container + button { + position: absolute; + width: 20px; + top: 0px; + right: 0px; + bottom: 0px; +} + +.toolbar ul.button_group { + margin: 0; + padding: 0; + width: 10000%; +} + +.toolbar ul.button_group li { + display: inline-block; + margin: 0; + padding: 0; +} + + +.toolbar .button_group button { + display: block; + margin: 4px 0 2px 0; + padding: 2px 5px; + border: none; + background: none; +} + +.toolbar .button_group button img { + margin: 0; + padding: 0; + margin-bottom: -3px; +} + +.toolbar .button_group button:hover, +.toolbar .button_group button:active { + background: #777; + color: #FFF; + -webkit-border-radius: 10px; + -moz-border-radius: 10px; +} \ No newline at end of file diff --git a/redakcja/static/js/jquery-1.4.2.min.js b/redakcja/static/js/lib/jquery-1.4.2.min.js similarity index 100% rename from redakcja/static/js/jquery-1.4.2.min.js rename to redakcja/static/js/lib/jquery-1.4.2.min.js diff --git a/redakcja/static/js/jquery.autocomplete.js b/redakcja/static/js/lib/jquery/jquery.autocomplete.js similarity index 100% rename from redakcja/static/js/jquery.autocomplete.js rename to redakcja/static/js/lib/jquery/jquery.autocomplete.js diff --git a/redakcja/static/js/jquery.blockui.js b/redakcja/static/js/lib/jquery/jquery.blockui.js similarity index 100% rename from redakcja/static/js/jquery.blockui.js rename to redakcja/static/js/lib/jquery/jquery.blockui.js diff --git a/redakcja/static/js/jquery.elastic.js b/redakcja/static/js/lib/jquery/jquery.elastic.js similarity index 100% rename from redakcja/static/js/jquery.elastic.js rename to redakcja/static/js/lib/jquery/jquery.elastic.js diff --git a/redakcja/static/js/wiki/loader.js b/redakcja/static/js/wiki/loader.js index a4414027..c611fa18 100644 --- a/redakcja/static/js/wiki/loader.js +++ b/redakcja/static/js/wiki/loader.js @@ -91,7 +91,7 @@ $(function() return "Na stronie mogą być nie zapisane zmiany."; }; }; - + console.log("Fetching document's text"); $(document).bind('wlapi_document_changed', function(event, doc) { diff --git a/redakcja/static/js/wiki/toolbar.js b/redakcja/static/js/wiki/toolbar.js new file mode 100644 index 00000000..8a35aa5b --- /dev/null +++ b/redakcja/static/js/wiki/toolbar.js @@ -0,0 +1,60 @@ +/* + * Toolbar plugin. + */ +(function($) { + + $.fn.toolbarize = function(options) { + var $toolbar = $(this); + var $container = $('.button_group_container', $toolbar); + + $('.button_group button', $toolbar).click(function(event){ + event.preventDefault(); + + var params = eval("(" + $(this).attr('data-ui-action-params') + ")"); + + scriptletCenter.callInteractive({ + action: $(this).attr('data-ui-action'), + context: options.actionContext, + extra: params + }); + }); + + $toolbar.children().filter('select').change(function(event){ + var slug = $(this).val(); + $container.scrollLeft(0); + $('*[data-group]').hide().filter('[data-group=' + slug + ']').show(); + }).change(); + + $('button.next', $toolbar).click(function() { + var $current_group = $('.button_group:visible', $toolbar); + var scroll = $container.scrollLeft(); + + var $hidden = $("li", $current_group).filter(function() { + return ($(this).position().left + $(this).outerWidth()) > $container.width(); + }).first(); + + if($hidden.length > 0) { + scroll = $hidden.position().left + scroll + $hidden.outerWidth() - $container.width() + 1; + $container.scrollLeft(scroll); + }; + }); + + $('button.prev', $toolbar).click(function() { + var $current_group = $('.button_group:visible', $toolbar); + var scroll = $container.scrollLeft(); + + /* first not visible element is: */ + var $hidden = $("li", $current_group).filter(function() { + return $(this).position().left < 0; + }).last(); + + if( $hidden.length > 0) + { + scroll = scroll + $hidden.position().left; + $container.scrollLeft(scroll); + }; + }); + + }; + +})(jQuery); \ No newline at end of file diff --git a/redakcja/static/js/wiki/view_editor_source.js b/redakcja/static/js/wiki/view_editor_source.js index a0a2e69a..9fc99227 100644 --- a/redakcja/static/js/wiki/view_editor_source.js +++ b/redakcja/static/js/wiki/view_editor_source.js @@ -46,26 +46,10 @@ return true; }); - $('#source-editor .toolbar button').click(function(event){ - event.preventDefault(); - var params = eval("(" + $(this).attr('data-ui-action-params') + ")"); - scriptletCenter.callInteractive({ - action: $(this).attr('data-ui-action'), - context: self.codemirror, - extra: params - }); + $('#source-editor .toolbar').toolbarize({ + actionContext: self.codemirror }); - $('.toolbar select').change(function(event){ - var slug = $(this).val(); - - $('.toolbar-buttons-container').hide().filter('[data-group=' + slug + ']').show(); - $(window).resize(); - }); - - $('.toolbar-buttons-container').hide(); - $('.toolbar select').change(); - console.log("Initialized CodeMirror"); // textarea is no longer needed -- 2.20.1