polymer-core-rails 0.2.5 → 0.2.6

data/app/assets/components/core-scroll-threshold/core-scroll-threshold.html

@@ -0,0 +1,222 @@
+<!--
+Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+
+<!--
+`core-scroll-threshold` is a utility element that listens for `scroll` events from a
+scrollable region and fires events to indicate when the scroller has reached a pre-defined
+limit, specified in pixels from the upper and lower bounds of the scrollable region.
+
+This element may wrap a scrollable region and will listen for `scroll` events bubbling
+through it from its children.  In this case, care should be taken that only one scrollable
+region with the same orientation as this element is contained within.  Alternatively,
+the `scrollTarget` property can be set/bound to a non-child scrollable region, from which
+it will listen for events.
+
+Once a threshold has been reached, a `lower-trigger` or `upper-trigger` event will
+be fired, at which point the user may perform actions such as lazily-loading more data
+to be displayed.  After any work is done, the user must then clear the threshold by
+calling the `clearUpper` or `clearLower` methods on this element, after which it will
+begin listening again for the scroll position to reach the threshold again assuming
+the content in the scrollable region has grown.  If the user no longer wishes to receive
+events (e.g. all data has been exhausted), the threshold property in question (e.g.
+`lowerThreshold`) may be set to a falsy value to disable events and clear the associated
+triggered property.
+
+Example:
+
+    <core-scroll-threshold id="threshold" lowerThreshold="500" 
+      on-lower-trigger="{{loadMore}}" lowerTriggered="{{spinnerShouldShow}}">
+    </core-scroll-threshold>
+
+    ...
+
+    loadMore: function() {
+      this.asyncLoadStuffThen(function() {
+        this.$.threshold.clearLower();
+      }.bind(this));
+    }
+    
+@group Polymer Core Elements
+@element core-scroll-threshold
+@homepage github.io
+-->
+
+<link rel="import" href="../polymer/polymer.html">
+
+<polymer-element name="core-scroll-threshold">
+
+<script>
+
+  Polymer({
+    
+    publish: {
+
+      /**
+       * When set, the given element is observed for scroll position.  When undefined,
+       * children can be placed inside and element itself can be used as the scrollable
+       * element.
+       *
+       * @attribute scrollTarget
+       * @type Element
+       * @default null
+       */
+      scrollTarget: null,
+
+      /**
+       * Orientation of the scroller to be observed (`v` for vertical, `h` for horizontal)
+       *
+       * @attribute orient
+       * @type boolean
+       * @default 'v'
+       */
+      orient: 'v',
+
+      /**
+       * Distance from the top (or left, for horizontal) bound of the scroller
+       * where the "upper trigger" will fire.
+       *
+       * @attribute upperThreshold
+       * @type integer
+       * @default null
+       */
+      upperThreshold: null,
+
+      /**
+       * Distance from the bottom (or right, for horizontal) bound of the scroller
+       * where the "lower trigger" will fire.
+       *
+       * @attribute lowerThreshold
+       * @type integer
+       * @default null
+       */
+      lowerThreshold: null,
+
+      /**
+       * Read-only value that tracks the triggered state of the upper threshold
+       *
+       * @attribute upperTriggered
+       * @type boolean
+       * @default false
+       */
+      upperTriggered: false,
+
+      /**
+       * Read-only value that tracks the triggered state of the lower threshold
+       *
+       * @attribute lowerTriggered
+       * @type boolean
+       * @default false
+       */
+      lowerTriggered: false
+
+    },
+
+    observe: {
+      'upperThreshold lowerThreshold scrollTarget orient': 'setup'
+    },
+
+    ready: function() {
+      this._boundScrollHandler = this.checkThreshold.bind(this);
+    },
+
+    setup: function() {
+      // Remove listener for any previous scroll target
+      if (this._scrollTarget && (this._scrollTarget != this.target)) {
+        this._scrollTarget.removeEventListener(this._boundScrollHandler);
+      }
+
+      // Add listener for new scroll target
+      var target = this.scrollTarget || this;
+      if (target) {
+        this._scrollTarget = target;
+        this._scrollTarget.addEventListener('scroll', this._boundScrollHandler);
+      }
+
+      // If we're listening on ourself, make us auto in case someone put
+      // content inside
+      this.style.overflow = (target == this) ? 'auto' : null;
+
+      // Setup extents based on orientation
+      this.scrollPosition = (this.orient == 'v') ? 'scrollTop' : 'scrollLeft';
+      this.sizeExtent = (this.orient == 'v') ? 'offsetHeight' : 'offsetWidth';
+      this.scrollExtent = (this.orient == 'v') ? 'scrollHeight' : 'scrollWidth';
+
+      // Clear trigger state if user has cleared the threshold
+      if (!this.upperThreshold) {
+        this.upperTriggered = false;
+      }
+      if (!this.lowerThreshold) {
+        this.lowerTriggered = false;
+      }      
+    },
+
+    checkThreshold: function(e) {
+      var top = this._scrollTarget[this.scrollPosition];
+      if (!this.upperTriggered && this.upperThreshold != null) {
+        if (top < this.upperThreshold) {
+          this.upperTriggered = true;
+          this.fire('upper-trigger');
+        }
+      }
+      if (this.lowerThreshold != null) {
+        var bottom = top + this._scrollTarget[this.sizeExtent];
+        var size = this._scrollTarget[this.scrollExtent];
+        if (!this.lowerTriggered && (size - bottom) < this.lowerThreshold) {
+          this.lowerTriggered = true;
+          this.fire('lower-trigger');
+        }
+      }
+    },
+
+    /**
+     * Clear the upper threshold, following an `upper-trigger` event.
+     *
+     * @method clearUpper
+     */
+    clearUpper: function(waitForMutation) {
+      if (waitForMutation) {
+        this._waitForMutation(function() {
+          this.clearUpper();
+        }.bind(this));
+      } else {
+        requestAnimationFrame(function() {
+          this.upperTriggered = false;
+        }.bind(this));
+      }
+    },
+
+    /**
+     * Clear the lower threshold, following a `lower-trigger` event.
+     *
+     * @method clearLower
+     */
+    clearLower: function(waitForMutation) {
+      if (waitForMutation) {
+        this._waitForMutation(function() {
+          this.clearLower();
+        }.bind(this));
+      } else {
+        requestAnimationFrame(function() {
+          this.lowerTriggered = false;
+        }.bind(this));
+      }
+    },
+
+    _waitForMutation: function(listener) {
+      var observer = new MutationObserver(function(mutations) {
+        listener.call(this, observer, mutations);
+        observer.disconnect();
+      }.bind(this));
+      observer.observe(this._scrollTarget, {attributes:true, childList: true, subtree: true});
+    }
+
+  });
+
+</script>
+</polymer-element>

data/app/assets/components/core-scroll-threshold/metadata.html

@@ -0,0 +1,24 @@
+<!--
+    @license
+    Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+    This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+    The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+    The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+    Code distributed by Google as part of the polymer project is also
+    subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<x-meta id="core-scroll-threshold" label="Scroll Threshold" group="Core">
+
+  <template>
+  
+    <core-item icon="settings" label="Scroll Threshold"></core-item>
+    
+  </template>
+  
+  <template id="imports">
+  
+    <link rel="import" href="core-scroll-threshold.html">
+    
+  </template>
+  
+</x-meta>

data/app/assets/components/core-selection/core-selection.html

@@ -12,7 +12,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
 The `<core-selection>` element is used to manage selection state. It has no
 visual appearance and is typically used in conjunction with another element.
 For example, [core-selector](#core-selector)
-use a `<core-selection>` to manage selection.
+uses a `<core-selection>` to manage selection.
 
 To mark an item as selected, call the `select(item)` method on 
 `<core-selection>`. The item itself is an argument to this method.

data/app/assets/components/core-selector/core-selector.html

@@ -130,7 +130,7 @@ Fired when an item element is tapped.
 
       /**
        * Specifies the CSS class to be used to add to the selected element.
-       * 
+       *
        * @attribute selectedClass
        * @type string
        * @default 'core-selected'
@@ -162,7 +162,7 @@ Fired when an item element is tapped.
        * an array of selected elements.
        * Note that you should not use this to set the selection. Instead use
        * `selected`.
-       * 
+       *
        * @attribute selectedItem
        * @type Object
        * @default null
@@ -172,9 +172,9 @@ Fired when an item element is tapped.
       /**
        * In single selection, this returns the model associated with the
        * selected element.
-       * Note that you should not use this to set the selection. Instead use 
+       * Note that you should not use this to set the selection. Instead use
        * `selected`.
-       * 
+       *
        * @attribute selectedModel
        * @type Object
        * @default null
@@ -193,7 +193,7 @@ Fired when an item element is tapped.
       selectedIndex: -1,
 
       /**
-       * Nodes with local name that are in the list will not be included 
+       * Nodes with local name that are in the list will not be included
        * in the selection items.  In the following example, `items` returns four
        * `core-item`'s and doesn't include `h3` and `hr`.
        *
@@ -213,9 +213,9 @@ Fired when an item element is tapped.
       excludedLocalNames: '',
 
       /**
-       * The target element that contains items.  If this is not set 
+       * The target element that contains items.  If this is not set
        * core-selector is the container.
-       * 
+       *
        * @attribute target
        * @type Object
        * @default null
@@ -223,7 +223,7 @@ Fired when an item element is tapped.
       target: null,
 
       /**
-       * This can be used to query nodes from the target node to be used for 
+       * This can be used to query nodes from the target node to be used for
        * selection items.  Note this only works if `target` is set
        * and is not `core-selector` itself.
        *
@@ -236,7 +236,7 @@ Fired when an item element is tapped.
        *       <label><input type="radio" name="color" value="blue"> Blue</label> <br>
        *       <p>color = {{color}}</p>
        *     </form>
-       * 
+       *
        * @attribute itemsSelector
        * @type string
        * @default ''
@@ -264,7 +264,7 @@ Fired when an item element is tapped.
       notap: false,
 
       defaultExcludedLocalNames: 'template',
-      
+
       observe: {
         'selected multi': 'selectedChanged'
       },
@@ -288,8 +288,8 @@ Fired when an item element is tapped.
         if (!this.target) {
           return [];
         }
-        var nodes = this.target !== this ? (this.itemsSelector ? 
-            this.target.querySelectorAll(this.itemsSelector) : 
+        var nodes = this.target !== this ? (this.itemsSelector ?
+            this.target.querySelectorAll(this.itemsSelector) :
                 this.target.children) : this.$.items.getDistributedNodes();
         return Array.prototype.filter.call(nodes, this.itemFilter);
       },
@@ -332,7 +332,7 @@ Fired when an item element is tapped.
 
       /**
        * Returns the selected item(s). If the `multi` property is true,
-       * this will return an array, otherwise it will return 
+       * this will return an array, otherwise it will return
        * the selected item or undefined if there is no selection.
        */
       get selection() {
@@ -348,7 +348,7 @@ Fired when an item element is tapped.
           this.updateSelected();
         }
       },
-      
+
       updateSelected: function() {
         this.validateSelected();
         if (this.multi) {
@@ -363,7 +363,7 @@ Fired when an item element is tapped.
 
       validateSelected: function() {
         // convert to an array for multi-selection
-        if (this.multi && !Array.isArray(this.selected) && 
+        if (this.multi && !Array.isArray(this.selected) &&
             this.selected != null) {
           this.selected = [this.selected];
         // use the first selected in the array for single-selection
@@ -373,7 +373,7 @@ Fired when an item element is tapped.
           this.selected = s;
         }
       },
-      
+
       processSplices: function(splices) {
         for (var i = 0, splice; splice = splices[i]; i++) {
           for (var j = 0; j < splice.removed.length; j++) {
@@ -398,7 +398,7 @@ Fired when an item element is tapped.
         var item = this.valueToItem(value);
         this.$.selection.select(item);
       },
-      
+
       setValueSelected: function(value, isSelected) {
         var item = this.valueToItem(value);
         if (isSelected ^ this.$.selection.isSelected(item)) {
@@ -417,12 +417,12 @@ Fired when an item element is tapped.
         } else {
           this.selectedModel = null;
         }
-        this.selectedIndex = this.selectedItem ? 
+        this.selectedIndex = this.selectedItem ?
             parseInt(this.valueToIndex(this.selected)) : -1;
       },
-      
+
       valueToItem: function(value) {
-        return (value === null || value === undefined) ? 
+        return (value === null || value === undefined) ?
             null : this.items[this.valueToIndex(value)];
       },
 
@@ -506,7 +506,7 @@ Fired when an item element is tapped.
           target = target.parentNode;
         }
       },
-      
+
       selectIndex: function(index) {
         var item = this.items[index];
         if (item) {
@@ -514,7 +514,7 @@ Fired when an item element is tapped.
           return item;
         }
       },
-      
+
       /**
        * Selects the previous item. This should be used in single selection only.
        *
@@ -524,11 +524,11 @@ Fired when an item element is tapped.
        * @returns the previous item or undefined if there is none
        */
       selectPrevious: function(wrapped) {
-        var i = wrapped && !this.selectedIndex ? 
+        var i = wrapped && !this.selectedIndex ?
             this.items.length - 1 : this.selectedIndex - 1;
         return this.selectIndex(i);
       },
-      
+
       /**
        * Selects the next item.  This should be used in single selection only.
        *
@@ -538,11 +538,11 @@ Fired when an item element is tapped.
        * @returns the next item or undefined if there is none
        */
       selectNext: function(wrapped) {
-        var i = wrapped && this.selectedIndex >= this.items.length - 1 ? 
+        var i = wrapped && this.selectedIndex >= this.items.length - 1 ?
             0 : this.selectedIndex + 1;
         return this.selectIndex(i);
       }
-      
+
     });
   </script>
 </polymer-element>

data/app/assets/components/core-splitter/core-splitter.html

@@ -38,10 +38,12 @@ Example:
 
 @group Polymer Core Elements
 @element core-splitter
+@mixins Polymer.CoreResizer https://github.com/polymer/core-resizable
 @homepage github.io
 -->
 
 <link rel="import" href="../polymer/polymer.html">
+<link rel="import" href="../core-resizable/core-resizable.html">
 
 <polymer-element name="core-splitter" attributes="direction locked minSize allowOverflow"
     on-trackstart="{{trackStart}}" on-track="{{track}}" on-down="{{preventSelection}}">
@@ -53,7 +55,7 @@ Example:
 </template>
 <script>
 
-  Polymer('core-splitter', {
+  Polymer(Polymer.mixin({
 
     /**
      * Possible values are `left`, `right`, `up` and `down`.
@@ -94,10 +96,21 @@ Example:
      */
     allowOverflow: false,
 
+    // Listen for resize requests on parent, since splitter is peer to resizables
+    resizerIsPeer: true,
+
     ready: function() {
       this.directionChanged();
     },
 
+    attached: function() {
+      this.resizerAttachedHandler();
+    },
+
+    detached: function() {
+      this.resizerDetachedHandler();
+    },
+
     domReady: function() {
       if (!this.allowOverflow) {
         this.parentNode.style.overflow = this.nextElementSibling.style.overflow =
@@ -137,12 +150,14 @@ Example:
       var d = e[this.horizontal ? 'dy' : 'dx'];
       this.target.style[this.dimension] =
           this.size + (this.isNext ? -d : d) + 'px';
+      this.notifyResize();
     },
 
     preventSelection: function(e) {
       e.preventDefault();
     }
-  });
+
+  }, Polymer.CoreResizer));
 
 </script>
 </polymer-element>

data/app/assets/components/core-style/core-style.html

@@ -143,7 +143,7 @@ Polymer('core-style', {
    * inside another.
    *
    * @attribute list
-   * @type object (readonly)
+   * @type object
    * @default {map of all `core-style` producers}
    */
   list: CoreStyle.list,

data/app/assets/components/core-toolbar/core-toolbar.html

@@ -138,7 +138,7 @@ on itself or any of its ancestors.
       if (old) {
         bar.removeAttribute(this.toLayoutAttrName(old));
       }
-      if (this.justify) {
+      if (justify) {
         bar.setAttribute(this.toLayoutAttrName(justify), '');
       }
     },

data/app/assets/components/core-tooltip/core-tooltip.css

@@ -27,10 +27,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
 .core-tooltip {
   position: absolute;
   font-size: 10px;
-  font-family: sans-serif;
+  font-weight: 500;
   padding: 8px;
   color: white;
-  background-color: rgba(0,0,0,0.8);
+  background-color: rgba(0, 0, 0, 0.9);
   box-sizing: border-box;
   border-radius: 3px; /* TODO: not in spec. */
   white-space: nowrap;

data/app/assets/components/core-tooltip/core-tooltip.html

@@ -1,5 +1,5 @@
 <!--
-Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
 This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
 The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
@@ -60,13 +60,14 @@ You can customize this attribute with the `tipAttribute` attribute:
 
 @group Polymer Core Elements
 @element core-tooltip
-@extends core-focusable
-@mixins Polymer.CoreFocusable
+@mixins Polymer.CoreFocusable https://github.com/polymer/core-focusable
+@mixins Polymer.CoreResizable https://github.com/polymer/core-resizable
 @homepage http://www.polymer-project.org/components/core-tooltip/index.html
 -->
 
 <link rel="import" href="../polymer/polymer.html">
 <link rel="import" href="../core-focusable/core-focusable.html">
+<link rel="import" href="../core-resizable/core-resizable.html">
 
 <!-- TODO: would be nice to inherit from label to get .htmlFor, and .control,
            but the latter is readonly. -->
@@ -76,8 +77,8 @@ You can customize this attribute with the `tipAttribute` attribute:
 <!-- TODO: possibly reuse core-overlay. -->
 <polymer-element name="core-tooltip" attributes="noarrow position label show tipAttribute" role="tooltip" tabindex="0">
 <template>
-
   <link rel="stylesheet" href="core-tooltip.css">
+
   <div id="tooltip" hidden?="{{!hasTooltipContent}}"
        class="core-tooltip {{position}} {{ {noarrow: noarrow, show: show && !disabled} | tokenList}}">
     <content id="c" select="[{{tipAttribute}}]">{{label}}</content>
@@ -102,6 +103,10 @@ You can customize this attribute with the `tipAttribute` attribute:
        */
       label: null,
 
+      eventDelegates: {
+        'core-resize': 'positionChanged'
+      },
+
       computed: {
         // Indicates whether the tooltip has a set label propety or
         // an element with the `tip` attribute.
@@ -149,13 +154,18 @@ You can customize this attribute with the `tipAttribute` attribute:
 
       attached: function() {
         this.updatedChildren();
+        this.resizableAttachedHandler();
+      },
+
+      detached: function() {
+        this.resizableDetachedHandler();
       },
 
       updatedChildren: function () {
         this.tipElement = null;
 
         for (var i = 0, el; el = this.$.c.getDistributedNodes()[i]; ++i) {
-          if (el.hasAttribute && el.hasAttribute('tip')) {
+          if (el.hasAttribute && el.hasAttribute(this.tipAttribute)) {
             this.tipElement = el;
             break;
           }
@@ -199,6 +209,7 @@ You can customize this attribute with the `tipAttribute` attribute:
     };
 
     Polymer.mixin2(proto, Polymer.CoreFocusable);
+    Polymer.mixin(proto, Polymer.CoreResizable);
     Polymer(proto);
   })();
 

data/app/assets/components/core-tooltip/metadata.html

@@ -1,6 +1,6 @@
 <!--
     @license
-    Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
+    Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
     This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
     The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
     The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt

data/app/assets/components/google-code-prettify/styles/doxy.css

@@ -51,7 +51,7 @@ li.L1,li.L3,li.L5,li.L7,li.L9 { }
   pre.prettyprint, code.prettyprint { background-color: #fff;  }
   pre .str, code .str { color: #088; }
   pre .kwd, code .kwd { color: #006; font-weight: bold; }
-  pre .com, code .com { color: #oc3; font-style: italic; }
+  pre .com, code .com { color: #0C3; font-style: italic; }
   pre .typ, code .typ { color: #404; font-weight: bold; }
   pre .lit, code .lit { color: #044; }
   pre .pun, code .pun { color: #440; }

data/app/assets/components/marked/lib/marked.js

@@ -20,7 +20,7 @@ var block = {
   lheading: /^([^\n]+)\n *(=|-){2,} *(?:\n+|$)/,
   blockquote: /^( *>[^\n]+(\n(?!def)[^\n]+)*\n*)+/,
   list: /^( *)(bull) [\s\S]+?(?:hr|def|\n{2,}(?! )(?!\1bull )\n*|\s*$)/,
-  html: /^ *(?:comment|closed|closing) *(?:\n{2,}|\s*$)/,
+  html: /^ *(?:comment *(?:\n|\s*$)|closed *(?:\n{2,}|\s*$)|closing *(?:\n{2,}|\s*$))/,
   def: /^ *\[([^\]]+)\]: *<?([^\s>]+)>?(?: +["(]([^\n]+)[")])? *(?:\n+|$)/,
   table: noop,
   paragraph: /^((?:[^\n]+\n?(?!hr|heading|lheading|blockquote|tag|def))+)\n*/,
@@ -868,7 +868,7 @@ Renderer.prototype.link = function(href, title, text) {
     } catch (e) {
       return '';
     }
-    if (prot.indexOf('javascript:') === 0) {
+    if (prot.indexOf('javascript:') === 0 || prot.indexOf('vbscript:') === 0) {
       return '';
     }
   }
@@ -1154,8 +1154,13 @@ function marked(src, opt, callback) {
 
     pending = tokens.length;
 
-    var done = function() {
-      var out, err;
+    var done = function(err) {
+      if (err) {
+        opt.highlight = highlight;
+        return callback(err);
+      }
+
+      var out;
 
       try {
         out = Parser.parse(tokens, opt);
@@ -1184,6 +1189,7 @@ function marked(src, opt, callback) {
           return --pending || done();
         }
         return highlight(token.text, token.lang, function(err, code) {
+          if (err) return done(err);
           if (code == null || code === token.text) {
             return --pending || done();
           }
@@ -1253,7 +1259,7 @@ marked.inlineLexer = InlineLexer.output;
 
 marked.parse = marked;
 
-if (typeof exports === 'object') {
+if (typeof module !== 'undefined' && typeof exports === 'object') {
   module.exports = marked;
 } else if (typeof define === 'function' && define.amd) {
   define(function() { return marked; });