Merge branch 'release-1.5.1'

README.md

@@ -130,6 +130,7 @@ The configuration dictionary must be defined inside your settings:
         'POWERED_BY': '<a href="https://www.otto.to.it">Otto srl</a>',
         'CONFIRM_UNSAVED_CHANGES': True,
         'SHOW_MULTIPART_UPLOADING': True,
+        'ENABLE_IMAGES_PREVIEW': True,
         'MENU': (
             { 'type': 'title', 'label': 'main', 'apps': ('auth', ) },
             {
@@ -168,6 +169,7 @@ The configuration dictionary must be defined inside your settings:
 The check of a dirty form relies on the jQuery serialize method, so it's not 100% safe. Disabled inputs, particular widgets (ckeditor) can not be detected.
 Default value is `True`.
 - `SHOW_MULTIPART_UPLOADING`: if set to `True` an overlay with a spinner appears when submitting a `multipart/form-data` form.
+- `ENABLE_IMAGES_PREVIEW`: if set to `True` a preview is displayed above all input file fields which contain images. You can control how the preview is displayed overriding the class `.baton-image-preview`. By default previews are 100px height and with a box shadow on over event.
 
 Let's see the `MENU` and `ANALYTICS` configurations in detail.
 
@@ -177,7 +179,6 @@ Currently four kind of voices are supported: _title_, _app_, _model_ and _free_.
 
 Title and free voices can have children, children follow the following rules:
 
-- children voices icons are ignored
 - children voices children are ignored (do not place an app voice as child)
 
 First of all, if you don't define a MENU key in the configuration dictionary, the default MENU is shown.
@@ -214,6 +215,8 @@ It requires two keys:
 - `CREDENTIALS`: it is the path to the credentials json file
 - `VIEW_ID`: id of the view from which display data
 
+You can add contents before and after the analytics dashboard by extending the `baton/analytics.html` template and filling the `baton_before_analytics` and `baton_after_analytics` blocks.
+
 #### How to generate a credentials json file
 
 Follow the steps in the Google Identity Platform documentation to [create a service account](https://developers.google.com/identity/protocols/OAuth2ServiceAccount#creatinganaccount) from the [Google Developer Console](https://console.developers.google.com/).
@@ -229,6 +232,7 @@ At this moment Baton emits four types of events:
 
 - `onNavbarReady`: dispatched when the navbar is fully rendered
 - `onMenuReady`: dispatched when the menu is fully rendered (probably the last event fired, since the menu contents are retrieves async)
+- `onTabsReady`: dispatched when the changeform tabs are fully rendered
 - `onMenuError`: dispatched if the request sent to retrieve menu contents fails
 - `onReady`: dispatched when Baton js has finished its sync job
 

baton/config.py

@@ -12,6 +12,7 @@
     'POWERED_BY': '<a href="https://www.otto.to.it">Otto srl</a>',
     'CONFIRM_UNSAVED_CHANGES': True,
     'SHOW_MULTIPART_UPLOADING': True,
+    'ENABLE_IMAGES_PREVIEW': True,
 }
 
 

baton/static/baton/app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "baton",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "Django Baton App",
   "main": "index.js",
   "scripts": {

baton/static/baton/app/src/core/ChangeForm.js

@@ -24,7 +24,9 @@ let ChangeForm = {
       this.spinner()
     }
     this.fixWrappedFields()
-    this.lazyLoadImages()
+    if (opts.enableImagesPreview) {
+      this.lazyLoadImages()
+    }
   },
   activate: function () {
     this.form.on('submit', () => (this.formSubmitting = true))
@@ -95,6 +97,9 @@ let ChangeForm = {
           image.onload = function () {
             spinner.replaceWith($(image).addClass('baton-image-preview'))
           }
+          image.onerror = function () {
+            preview.remove()
+          }
           image.src = url
         }
       }

baton/static/baton/app/src/core/Menu.js

@@ -83,9 +83,13 @@ let Menu = {
             subLi.addClass('active')
             li.addClass('with-active')
           }
-          $('<a />', {
+          let a = $('<a />', {
             href: model.url
           }).text(model.label).appendTo(subLi)
+          // icon
+          if (model.icon) {
+            $('<i />', { 'class': model.icon }).prependTo(a)
+          }
           subLi.appendTo(subUl)
         })
       }

baton/static/baton/app/src/core/Tabs.js

@@ -4,14 +4,16 @@ let Tabs = {
   /**
    * Tabs component
    */
-  init: function () {
+  init: function (Dispatcher) {
+    this.Dispatcher = Dispatcher
     if (this.shouldRun()) {
       console.info('Baton:', 'generating tabs')
       this.main.attr('data-baton-tab', 'main')
       this.createNav()
       this.createPanes()
       this.checkHash()
       this.showErrors()
+      this.Dispatcher.emit('onTabsReady')
     }
   },
   shouldRun: function () {

baton/static/baton/app/src/index.js

@@ -33,10 +33,7 @@ window.Baton = {
     } else if (page === 'changelist') {
       ChangeList.init()
     } else if (page === 'add_form' || page === 'change_form') {
-      ChangeForm.init({
-        confirmUnsavedChanges: config.confirmUnsavedChanges,
-        showMultipartUploading: config.showMultipartUploading
-      })
+      ChangeForm.init(config)
     } else if (page === 'filer') {
       Filer.init()
     }
@@ -46,7 +43,7 @@ window.Baton = {
 
     // tabs
     if (page === 'add_form' || page === 'change_form') {
-      Tabs.init()
+      Tabs.init(Dispatcher)
     }
     console.info('Baton:', 'ready')
     document.body.className += ' baton-ready'

baton/static/baton/app/src/styles/_menu.scss

@@ -143,6 +143,12 @@
     }
   }
 
+  .title > .depth-1 li {
+    @include media-breakpoint-up(lg) {
+      padding-left: 0;
+    }
+  }
+
 
   .open {
     @include media-breakpoint-up(lg) {

baton/static/baton/app/src/styles/_placeholders.scss

@@ -294,12 +294,24 @@
     display: inline-block;
   }
 
-  select:not([multiple]) {
+  select:not([multiple]):not(.admin-autocomplete) {
     @extend .custom-select;
-    -moz-appearance: none;
     text-indent: .01px;
     text-overflow: '';
-    width: auto !important;
+    width: auto;
+  }
+
+  // automcomplete
+  .select2-container--admin-autocomplete .select2-selection--single .select2-selection__arrow {
+    height: 34px;
+  }
+
+  .select2-container--admin-autocomplete .select2-selection--single .select2-selection__rendered {
+    line-height: 36px;
+  }
+
+  .select2-container .select2-selection--single {
+    height: 36px;
   }
 
   .radiolist {

baton/templates/admin/base_site.html

@@ -11,14 +11,16 @@
     <script>
         {% baton_config 'CONFIRM_UNSAVED_CHANGES' as confirm_unsaved_changes %}
         {% baton_config 'SHOW_MULTIPART_UPLOADING' as show_multipart_uploading %}
+        {% baton_config 'ENABLE_IMAGES_PREVIEW' as enable_images_preview %}
         (function ($, undefined) {
             $(window).on('load', function () {
                 Baton.init({
                     api: {
                         app_list: '{% url 'baton-app-list-json' %}'
                     },
                     confirmUnsavedChanges: {% if confirm_unsaved_changes %}true{% else%}false{% endif %},
-                    showMultipartUploading: {% if show_multipart_uploading %}true{% else%}false{% endif %}
+                    showMultipartUploading: {% if show_multipart_uploading %}true{% else%}false{% endif %},
+                    enableImagesPreview: {% if enable_images_preview %}true{% else%}false{% endif %}
                 });
             })
         })(jQuery, undefined)

baton/templates/baton/analytics.html

@@ -12,7 +12,11 @@
 <script src="https://ga-dev-tools.appspot.com/public/javascript/embed-api/components/view-selector2.js"></script>
 
 <div class="container-fluid container-analytics">
-    <h4>Google Analytics <span class="btn btn-default" id="active-users-container"></span></h4>
+    {% block baton_before_analytics %}{% endblock baton_before_analytics %}
+    <h4 class="d-flex justify-content-between">
+      Google Analytics
+      <span class="btn btn-info" id="active-users-container"></span>
+    </h4>
     <!-- this is just to make the view selector work, no need to display it -->
     <div id="view-selector-container" style="display: none"></div>
 
@@ -25,7 +29,7 @@ <h4>Google Analytics <span class="btn btn-default" id="active-users-container"><
         </select>
     </p>
 
-    <div class="row" style="margin: 20px 0;">
+    <div class="row my-4">
         <div class="col-lg-6">
             <section class="panel">
                 <h1>{% trans 'Traffic' %}</h1>
@@ -41,7 +45,7 @@ <h2>{% trans 'Page views' %}</h2>
             </section>
         </div>
     </div>
-    <div class="row" style="margin: 20px 0;">
+    <div class="row my-4">
         <div class="col-lg-6">
             <section class="panel">
                 <h1>{% trans 'Browsers' %}</h1>
@@ -57,7 +61,7 @@ <h2>{% trans 'Referral Traffic' %}</h2>
             </section>
         </div>
     </div>
-    <div class="row" style="margin: 20px 0;">
+    <div class="row my-4">
         <div class="col-lg-6">
             <section class="panel">
                 <h1>{% trans 'Audience' %}</h1>
@@ -73,6 +77,7 @@ <h2>{% trans 'Interactions' %}</h2>
             </section>
         </div>
     </div>
+    {% block baton_after_analytics %}{% endblock baton_after_analytics %}
 
 
     <script>

docs/conf.py

@@ -54,9 +54,9 @@
 # built documents.
 #
 # The short X.Y version.
-version = u'1.5.0'
+version = u'1.5.1'
 # The full version, including alpha/beta/rc tags.
-release = u'1.5.0'
+release = u'1.5.1'
 
 # The language for content autogenerated by Sphinx. Refer to documentation
 # for a list of supported languages.

docs/configuration.rst

@@ -17,6 +17,7 @@ This is an example of configuration::
         'POWERED_BY': '<a href="https://www.otto.to.it">Otto srl</a>',
         'CONFIRM_UNSAVED_CHANGES': True,
         'SHOW_MULTIPART_UPLOADING': True,
+        'ENABLE_IMAGES_PREVIEW': True,
         'MENU': (
             { 'type': 'title', 'label': 'main', 'apps': ('auth', ) },
             {
@@ -39,7 +40,7 @@ This is an example of configuration::
             { 'type': 'model', 'label': 'Pages', 'name': 'flatpage', 'app': 'flatpages' },
             { 'type': 'free', 'label': 'Custom Link', 'url': 'http://www.google.it', 'perms': ('flatpages.add_flatpage', 'auth.change_user') },
             { 'type': 'free', 'label': 'My parent voice', 'children': [
-                { 'type': 'model', 'label': 'A Model', 'name': 'mymodelname', 'app': 'myapp' },
+                { 'type': 'model', 'label': 'A Model', 'name': 'mymodelname', 'app': 'myapp', 'icon': 'fa fa-gavel' },
                 { 'type': 'free', 'label': 'Another custom link', 'url': 'http://www.google.it' },
             ] },
         ),
@@ -114,6 +115,13 @@ Show an overlay with a spinner when a ``multipart/form-data`` form is submitted
 
 **Default**: True
 
+Enable images preview
+-----------------------
+
+Displays a preview above all input file fields which contain images. You can control how the preview is displayed overriding the class ``.baton-image-preview``. By default previews are 100px height and with a box shadow on over event
+
+**Default**: True
+
 Menu
 ----
 
@@ -132,7 +140,6 @@ When defining a custom menu you can use 4 different kinds of voices:
 
 Title and free voices can have children. Children follow these rules:
 
-- children icons are ignored
 - children children are ignored (do not place an app voice as child)
 
 Title
@@ -221,6 +228,8 @@ In order to activate it you need to create a service account and link it to your
 - ``CREDENTIALS``: path to the credentials json file
 - ``VIEW_ID``: id of the analytics view which serves the data
 
+You can add contents before and after the analytics dashboard by extending the ``baton/analytics.html`` template and filling the ``baton_before_analytics`` and ``baton_after_analytics`` blocks.
+
 How to generate a credentials json file
 ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
 

docs/signals.rst

@@ -6,6 +6,7 @@ At this moment Baton emits four types of events:
 
 - ``onNavbarReady``: dispatched when the navbar is fully rendered
 - ``onMenuReady``: dispatched when the menu is fully rendered (probably the last event fired, since the menu contents are retrieves async)
+- ``onTabsReady``: dispatched when the changeform tabs are fully
 - ``onMenuError``: dispatched if the request sent to retrieve menu contents fails
 - ``onReady``: dispatched when Baton js has finished its sync job
 

setup.py

@@ -9,7 +9,7 @@
 
 setup(
     name='django-baton',
-    version='1.5.0',
+    version='1.5.1',
     packages=['baton', 'baton.autodiscover', 'baton.templatetags'],
     include_package_data=True,
     license='MIT License',