pageflow 0.11.4 → 12.0.0.rc1

data/app/assets/javascripts/pageflow/slideshow/hidden_text_indicator_widget.js

@@ -5,10 +5,12 @@
           that = this;
 
       parent.on('pageactivate', function(event) {
+        var pageOrPageWrapper = $(event.target).add('.content_and_background', event.target);
+
         that.element.toggleClass('invert', $(event.target).hasClass('invert'));
         that.element.toggleClass('hidden',
-                                 $(event.target).hasClass('hide_content_with_text') ||
-                                 $(event.target).hasClass('no_hidden_text_indicator'));
+                                 pageOrPageWrapper.hasClass('hide_content_with_text') ||
+                                 pageOrPageWrapper.hasClass('no_hidden_text_indicator'));
       });
 
       parent.on('hidetextactivate', function() {

data/app/assets/javascripts/pageflow/slideshow/hide_text.js

@@ -32,13 +32,17 @@ pageflow.hideText = (function() {
     },
 
     activate: function() {
-      element().addClass('hideText');
-      element().trigger('hidetextactivate');
+      if (!this.isActive()) {
+        element().addClass('hideText');
+        element().trigger('hidetextactivate');
+      }
     },
 
     deactivate: function() {
-      element().removeClass('hideText');
-      element().trigger('hidetextdeactivate');
+      if (this.isActive()) {
+        element().removeClass('hideText');
+        element().trigger('hidetextdeactivate');
+      }
     },
 
     on: function(event, callback) {

data/app/assets/javascripts/pageflow/slideshow/lazy_page_widget.js

@@ -5,6 +5,11 @@
   var prototype = {
     _create: function() {
       this.configuration = this.element.data('configuration') || this.options.configuration;
+      this.index = this.options.index;
+    },
+
+    _destroy: function() {
+      this.isDestroyed = true;
     },
 
     _ensureCreated: function() {

data/app/assets/javascripts/pageflow/slideshow/scroller_widget.js

@@ -4,6 +4,7 @@
    * Wrapper widget around iScroll adding special bump events which
    * are triggered when scrolling to the very top or very bottom
    * (called boundary posititon below).
+   * @private
    */
   $.widget('pageflow.scroller', {
     dragThreshold: 50,
@@ -157,13 +158,11 @@
       }
     },
 
-    /**
-     * Whenever the a mousewheel event is triggered, we test whether
-     * the scroller is at the very top or at the very bottom. If so,
-     * we trigger a hintdown or hintup event the first time the mouse
-     * wheel turns and a bumpup or bumpdown event when the mouse wheel
-     * is turned to times in a short period of time.
-     */
+    // Whenever the a mousewheel event is triggered, we test whether
+    // the scroller is at the very top or at the very bottom. If so,
+    // we trigger a hintdown or hintup event the first time the mouse
+    // wheel turns and a bumpup or bumpdown event when the mouse wheel
+    // is turned to times in a short period of time.
     _initMousewheelBump: function(direction) {
       var firstBump = false;
 
@@ -189,10 +188,8 @@
       }, this));
     },
 
-    /**
-     * Trigger bumpup or bumpdown event when the a up/down key is
-     * pressed while the scroller in boundary position.
-     */
+    // Trigger bumpup or bumpdown event when the a up/down key is
+    // pressed while the scroller in boundary position.
     _initKeyboardBump: function(direction) {
       this.iscroll.on('keyboard' + direction, _.bind(function(event) {
         if (this._atBoundary(direction)) {
@@ -210,10 +207,8 @@
       }, this));
     },
 
-    /**
-     * Trigger bumpup or bumpdown when the user drags the page from a
-     * boundary position.
-     */
+    // Trigger bumpup or bumpdown when the user drags the page from a
+    // boundary position.
     _initDragGestureBump: function() {
       var allowUp = false,
           allowDown = false,
@@ -265,9 +260,7 @@
       }
     },
 
-    /**
-     * Checks whether the scroller is at the very top or very bottom.
-     */
+    // Checks whether the scroller is at the very top or very bottom.
     _atBoundary: function(direction, options) {
       options = options || {};
       var delta = options.delta || 0;

data/app/assets/javascripts/pageflow/ui.js

@@ -11,7 +11,13 @@
 //= require_tree ./ui/utils
 //= require_tree ./ui/views/mixins
 //= require ./ui/views/inputs/select_input_view
+//= require ./ui/views/table_cells/table_cell_view
 //= require_tree ./ui/views
 //= require_tree ./ui/templates
 
+/**
+ * Reusable Backbone views for the editor and admin interface.
+ * @module pageflow/ui
+ */
+
 window.pageflow = window.pageflow || {};

data/app/assets/javascripts/pageflow/ui/templates/inputs/url_display.jst.ejs

@@ -0,0 +1,7 @@
+<label>
+  <span class="name"></span>
+  <span class="inline_help"></span>
+</label>
+<a class="original" href="#" download target="_blank">
+  <%= I18n.t('pageflow.ui.templates.inputs.url_display.link_text') %>
+</a>

data/app/assets/javascripts/pageflow/ui/templates/table.jst.ejs

@@ -0,0 +1,7 @@
+<table>
+  <thead>
+    <tr></tr>
+  </thead>
+  <tbody>
+  </tbody>
+</table>

data/app/assets/javascripts/pageflow/ui/templates/table_blank_slate.jst.ejs

@@ -0,0 +1,3 @@
+<td colspan="<%= colSpan %>">
+  <%= blankSlateText %>
+</td>

data/app/assets/javascripts/pageflow/ui/utils/i18n_utils.js

@@ -1,12 +1,107 @@
+/**
+ * Helpers functions for handling translations.
+ *
+ * @memberof module:pageflow/ui
+ */
 pageflow.i18nUtils = {
+  /**
+   * Returns an array of translation keys based on the `prefixes`
+   * option and the given `keyName`.
+   *
+   * @param {string} keyName
+   *   Suffix to append to prefixes.
+   *
+   * @param {string[]} [options.prefixes]
+   *   Array of translation key prefixes.
+   *
+   * @param {string} [options.fallbackPrefix]
+   *   Optional additional prefix to form a model based translation
+   *   key of the form
+   *   `prefix.fallbackModelI18nKey.propertyName.keyName`.
+   *
+   * @param {string} [options.fallbackModelI18nKey]
+   *   Required if `fallbackPrefix` option is present.
+   *
+   * @return {string[]}
+   * @since 12.0
+   */
+  attributeTranslationKeys: function(attributeName, keyName, options) {
+    var result = [];
+
+    if (options.prefixes) {
+      result = result.concat(_(options.prefixes).map(function(prefix) {
+        return prefix + '.' + attributeName + '.' + keyName;
+      }, this));
+    }
+
+    if (options && options.fallbackPrefix) {
+      result.push(options.fallbackPrefix + '.' +
+                  options.fallbackModelI18nKey + '.' +
+                  attributeName);
+    }
+
+    return result;
+  },
+
+  /**
+   * Takes the same parameters as {@link
+   * module:pageflow/ui.pageflow.i18nUtils.attributeTranslationKeys
+   * i18nUtils.attributeTranslationKeys}, but returns the first
+   * existing translation.
+   *
+   * @return {string}
+   * @since 12.0
+   */
+  attributeTranslation: function(attributeName, keyName, options) {
+    return pageflow.i18nUtils.findTranslation(
+      this.attributeTranslationKeys(attributeName, keyName, options)
+    );
+  },
+
+  /**
+   * Find the first key for which a translation exists and return the
+   * translation.
+   *
+   * @param {string[]} keys
+   *   Translation key candidates.
+   *
+   * @param {string} [options.defaultValue]
+   *   Value to return if none of the keys has a translation. Is
+   *   treated like an HTML translation if html flag is set.
+   *
+   * @param {boolean} [options.html]
+   *   If true, also search for keys ending in '_html' and HTML-escape
+   *   keys that do not end in 'html'
+   *
+   * @return {string}
+   */
   findTranslation: function(keys, options) {
     options = options || {};
 
+    if (options.html) {
+      keys = this.translationKeysWithSuffix(keys, 'html');
+    }
+
     return _.chain(keys).reverse().reduce(function(result, key) {
-      return I18n.t(key, {defaultValue: result});
+      var unescapedTranslation = I18n.t(key, _.extend({}, options, {defaultValue: result}));
+      if (!options.html || key.match(/_html$/) || result == unescapedTranslation) {
+        return unescapedTranslation;
+      }
+      else {
+        return $('<div />').text(unescapedTranslation).html();
+      }
     }, options.defaultValue).value();
   },
 
+  /**
+   * Return the first key for which a translation exists. Returns the
+   * first if non of the keys has a translation.
+   *
+   * @param {string[]} keys
+   * Translation key candidates.
+   *
+   * @return {string}
+   */
   findKeyWithTranslation: function(keys) {
     var missing = '_not_translated';
 
@@ -20,4 +115,4 @@ pageflow.i18nUtils = {
       return [key + '_' + suffix, key];
     }).flatten().value();
   }
-};
+};

data/app/assets/javascripts/pageflow/ui/views/collection_view.js

@@ -80,7 +80,14 @@ pageflow.CollectionView = Backbone.Marionette.View.extend({
     var last = null;
 
     this.collection.each(function(item) {
-      var element = this.itemViews.findByModel(item).$el;
+      var itemView = this.itemViews.findByModel(item);
+      var element;
+
+      if (!itemView) {
+        return;
+      }
+
+      element = itemView.$el;
 
       if (last) {
         last.after(element);

data/app/assets/javascripts/pageflow/ui/views/inputs/check_box_input_view.js

@@ -1,3 +1,14 @@
+/**
+ * Input view for boolean values.
+ *
+ * @param {boolean} [options.displayUncheckedIfDisabled=false]
+ *   Ignore the attribute value if the input is disabled and display
+ *   an unchecked check box.
+ *
+ * @see {@link module:pageflow/ui.pageflow.inputView pageflow.inputView} for further options
+ * @class
+ * @memberof module:pageflow/ui
+ */
 pageflow.CheckBoxInputView = Backbone.Marionette.ItemView.extend({
   mixins: [pageflow.inputView],
 
@@ -41,4 +52,4 @@ pageflow.CheckBoxInputView = Backbone.Marionette.ItemView.extend({
       return this.model.get(this.options.propertyName);
     }
   }
-});
+});

data/app/assets/javascripts/pageflow/ui/views/inputs/proxy_url_input_view.js

@@ -1,7 +1,53 @@
 //= require ./url_input_view
 
-pageflow.ProxyUrlInputView = pageflow.UrlInputView.extend({
-  /** @override */
+/**
+ * Input view that verifies that a certain URL is reachable via a
+ * proxy. To conform with same origin restrictions, this input view
+ * lets the user enter some url and saves a rewritten url where the
+ * domain is replaced with some path segment.
+ *
+ * That way, when `/example` is setup to proxy requests to
+ * `http://example.com`, the user can enter an url of the form
+ * `http://example.com/some/path` but the string `/example/some/path`
+ * is persisited to the database.
+ *
+ * @param {string} options.displayPropertyName
+ *   Attribute name to store the url entered by the user.
+ *
+ * @param {Object[]} options.proxies
+ *   List of supported proxies.
+ *
+ * @param {string} options.proxies[].url
+ *   Supported prefix of an url that can be entered by the user.
+ *
+ * @param {string} options.proxies[].base_path
+ *   Path to replace the url prefix with.
+ *
+ * @param {boolean} [options.required=false]
+ *   Display an error if the url is blank.
+ *
+ * @param {boolean} [options.permitHttps=false]
+ *   Allow urls with https protocol.
+ *
+ * @example
+ *
+ * this.input('url, pageflow.ProxyUrlInputView, {
+ *   proxies: [
+ *     {
+ *       url: 'http://example.com',
+ *       base_path: '/example'
+ *     }
+ *   ]
+ * });
+ *
+ * @see {@link module:pageflow/ui.pageflow.inputView pageflow.inputView} for further options
+ * @class
+ * @memberof module:pageflow/ui
+ */
+pageflow.ProxyUrlInputView = pageflow.UrlInputView.extend(
+  /** @lends module:pageflow/ui.pageflow.ProxyUrlInputView# */{
+
+  // @override
   validateUrl: function(url) {
     var view = this;
 
@@ -19,12 +65,12 @@ pageflow.ProxyUrlInputView = pageflow.UrlInputView.extend({
     }).promise();
   },
 
-  /** @override */
+  // @override
   transformPropertyValue: function(url) {
     return this.rewriteUrl(url);
   },
 
-  /** @override */
+  // @override
   supportedHosts: function() {
     return _.pluck(this.options.proxies, 'url');
   },
@@ -36,4 +82,4 @@ pageflow.ProxyUrlInputView = pageflow.UrlInputView.extend({
 
     return url;
   }
-});
+});

data/app/assets/javascripts/pageflow/ui/views/inputs/select_input_view.js

@@ -1,3 +1,76 @@
+/**
+ * A drop down with support for grouped items.
+ *
+ * @param {string[]} [options.values]
+ *   List of possible values to persist in the attribute.
+ *
+ * @param {string[]} [options.texts]
+ *   List of display texts for drop down items.
+ *
+ * @param {string[]} [options.translationKeys]
+ *   Translation keys to obtain item texts from.
+ *
+ * @param {string[]} [options.translationKeyPrefix]
+ *   Obtain texts for items from translations by appending the item
+ *   value to this prefix separated by a dot. By default the
+ *   [`attributeTranslationKeyPrefixes` option]{@link module:pageflow/ui:pageflow.inputView}
+ *   is used by appending the suffix `.values` to each candidate.
+ *
+ * @param {string[]} [options.groups]
+ *   Array of same length as `values` array, containing the display
+ *   name of a group header each item shall be grouped under.
+ *
+ * @param {Backbone.Model[]} [options.collection]
+ *   Create items for each model in the collection. Use the
+ *   `*Property` options to extract values and texts for each items
+ *   from the models.
+ *
+ * @param {string} [options.valueProperty]
+ *   Attribute to use as item value.
+ *
+ * @param {string} [options.textProperty]
+ *   Attribute to use as item display text.
+ *
+ * @param {string} [options.groupProperty]
+ *   Attribute to use as item group name.
+ *
+ * @param {string} [options.translationKeyProperty]
+ *   Attribute to use as translation key to obtain display text.
+ *
+ * @param {string} [options.groupTranslationKeyProperty]
+ *   Attribute to use as translation key to obtain group name.
+ *
+ * @param {boolean} [options.ensureValueDefined]
+ *   Set the attribute to the first value on view creation.
+ *
+ * @param {boolean} [options.includeBlank]
+ *   Include an item that sets the value of the attribute to a blank
+ *   string.
+ *
+ * @param {string} [options.blankText]
+ *   Display text for the blank item.
+ *
+ * @param {string} [options.blankTranslationKey]
+ *   Translation key to obtain display text for blank item.
+ *
+ * @param {string} [options.placeholderValue]
+ *   Include an item that sets the value of the attribute to a blank
+ *   string and indicate that the attribute is set to a default
+ *   value. Include the display name of the given value, in the
+ *   text. This option can be used if a fallback to the
+ *   `placeholderValue` occurs whenever the attribute is blank.
+ *
+ * @param {Backbone.Model} [options.placeholderModel]
+ *   Behaves like `placeholderValue`, but obtains the value by looking
+ *   up the `propertyName` attribute inside the given model. This
+ *   option can be used if a fallback to the corresponding attribute
+ *   value of the `placeholderModel` occurs whenever the attribute is
+ *   blank.
+ *
+ * @see {@link module:pageflow/ui.pageflow.inputView pageflow.inputView} for further options
+ * @class
+ * @memberof module:pageflow/ui
+ */
 pageflow.SelectInputView = Backbone.Marionette.ItemView.extend({
   mixins: [pageflow.inputView],
 
@@ -139,7 +212,12 @@ pageflow.SelectInputView = Backbone.Marionette.ItemView.extend({
 
   load: function() {
     if (!this.isClosed) {
-      this.ui.select.val(this.model.get(this.options.propertyName));
+      if (this.model.has(this.options.propertyName)) {
+        this.ui.select.val(this.model.get(this.options.propertyName));
+      }
+      else {
+        this.ui.select.val(this.ui.select.find('option:first').val());
+      }
     }
   }
-});
+});