@oat-sa/tao-core-ui 1.60.2 → 1.62.0

package/dist/component/alignable.js

@@ -3,22 +3,22 @@ define(['lodash', 'ui/component/placeable'], function (_, makePlaceable) { 'use
     _ = _ && Object.prototype.hasOwnProperty.call(_, 'default') ? _['default'] : _;
     makePlaceable = makePlaceable && Object.prototype.hasOwnProperty.call(makePlaceable, 'default') ? makePlaceable['default'] : makePlaceable;
 
-    /**
-     * This program is free software; you can redistribute it and/or
-     * modify it under the terms of the GNU General Public License
-     * as published by the Free Software Foundation; under version 2
-     * of the License (non-upgradable).
-     *
-     * This program is distributed in the hope that it will be useful,
-     * but WITHOUT ANY WARRANTY; without even the implied warranty of
-     * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-     * GNU General Public License for more details.
-     *
-     * You should have received a copy of the GNU General Public License
-     * along with this program; if not, write to the Free Software
-     * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
-     *
-     * Copyright (c) 2017 (original work) Open Assessment Technologies SA;
+    /**
+     * This program is free software; you can redistribute it and/or
+     * modify it under the terms of the GNU General Public License
+     * as published by the Free Software Foundation; under version 2
+     * of the License (non-upgradable).
+     *
+     * This program is distributed in the hope that it will be useful,
+     * but WITHOUT ANY WARRANTY; without even the implied warranty of
+     * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+     * GNU General Public License for more details.
+     *
+     * You should have received a copy of the GNU General Public License
+     * along with this program; if not, write to the Free Software
+     * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+     *
+     * Copyright (c) 2017 (original work) Open Assessment Technologies SA;
      */
     var defaultConfig = {};
     var alignDefaults = {
@@ -26,31 +26,29 @@ define(['lodash', 'ui/component/placeable'], function (_, makePlaceable) { 'use
       vPos: 'center'
     };
     var alignableComponent = {
-      /**
-       * Place the component using another element as a reference position
-       * @param {jQuery} $element - the reference element
-       * @param {Object} [options]
-       * @param {('left'|'center'|'right')} [options.hPos] - horizontal position relative to the reference element
-       * @param {('left'|'center'|'right')} [options.hOrigin] - the origin of the transformation
-       * @param {Number} [options.hOffset] - horizontal offset
-       * @param {('top'|'center'|'bottom')} [options.vPos] - vertical position relative to the reference element
-       * @param {('top'|'center'|'bottom')} [options.vOrigin] - the origin of the transformation
-       * @param {Number} [options.vOffset] - vertical offset
-       * @returns {Component} chains
+      /**
+       * Place the component using another element as a reference position
+       * @param {jQuery} $element - the reference element
+       * @param {Object} [options]
+       * @param {('left'|'center'|'right')} [options.hPos] - horizontal position relative to the reference element
+       * @param {('left'|'center'|'right')} [options.hOrigin] - the origin of the transformation
+       * @param {Number} [options.hOffset] - horizontal offset
+       * @param {('top'|'center'|'bottom')} [options.vPos] - vertical position relative to the reference element
+       * @param {('top'|'center'|'bottom')} [options.vOrigin] - the origin of the transformation
+       * @param {Number} [options.vOffset] - vertical offset
+       * @returns {Component} chains
        */
       alignWith: function alignWith($element, options) {
         var alignedCoords = this._getAlignedCoords($element, options);
-
         return this.moveTo(alignedCoords.x, alignedCoords.y);
       },
-
-      /**
-       * Place the component so it is horizontally aligned with a reference element
-       * @param {jQuery} $element - the reference element
-       * @param {('left'|'center'|'right')} [hPos] - horizontal position relative to the reference element
-       * @param {('left'|'center'|'right')} [hOrigin] - the origin of the transformation
-       * @param {Number} [hOffset] - horizontal offset
-       * @returns {Component} chains
+      /**
+       * Place the component so it is horizontally aligned with a reference element
+       * @param {jQuery} $element - the reference element
+       * @param {('left'|'center'|'right')} [hPos] - horizontal position relative to the reference element
+       * @param {('left'|'center'|'right')} [hOrigin] - the origin of the transformation
+       * @param {Number} [hOffset] - horizontal offset
+       * @returns {Component} chains
        */
       hAlignWith: function hAlignWith($element, hPos, hOrigin, hOffset) {
         var alignedCoords = this._getAlignedCoords($element, {
@@ -58,17 +56,15 @@ define(['lodash', 'ui/component/placeable'], function (_, makePlaceable) { 'use
           hOrigin: hOrigin,
           hOffset: hOffset
         });
-
         return this.moveToX(alignedCoords.x);
       },
-
-      /**
-       * Place the component so it is vertically aligned with a reference element
-       * @param {jQuery} $element - the reference element
-       * @param {('top'|'center'|'bottom')} [vPos] - vertical position relative to the reference element
-       * @param {('top'|'center'|'bottom')} [vOrigin] - the origin of the transformation
-       * @param {Number} [vOffset] - vertical offset
-       * @returns {Component} chains
+      /**
+       * Place the component so it is vertically aligned with a reference element
+       * @param {jQuery} $element - the reference element
+       * @param {('top'|'center'|'bottom')} [vPos] - vertical position relative to the reference element
+       * @param {('top'|'center'|'bottom')} [vOrigin] - the origin of the transformation
+       * @param {Number} [vOffset] - vertical offset
+       * @returns {Component} chains
        */
       vAlignWith: function vAlignWith($element, vPos, vOrigin, vOffset) {
         var alignedCoords = this._getAlignedCoords($element, {
@@ -76,36 +72,34 @@ define(['lodash', 'ui/component/placeable'], function (_, makePlaceable) { 'use
           vOrigin: vOrigin,
           vOffset: vOffset
         });
-
         return this.moveToY(alignedCoords.y);
       },
-
-      /**
-       * Get the coordinates of the component so it is aligned with a reference element
-       * @param {jQuery} $element - the reference element
-       * @param {Object} [options]
-       * @param {('left'|'center'|'right')} [options.hPos] - horizontal position relative to the reference element
-       * @param {('left'|'center'|'right')} [options.hOrigin] - the origin of the transformation
-       * @param {Number} [options.hOffset] - horizontal offset
-       * @param {('top'|'center'|'bottom')} [options.vPos] - vertical position relative to the reference element
-       * @param {('top'|'center'|'bottom')} [options.vOrigin] - the origin of the transformation
-       * @param {Number} [options.vOffset] - vertical offset
-       * @returns {x,y} - the aligned coordinates
-       * @private
+      /**
+       * Get the coordinates of the component so it is aligned with a reference element
+       * @param {jQuery} $element - the reference element
+       * @param {Object} [options]
+       * @param {('left'|'center'|'right')} [options.hPos] - horizontal position relative to the reference element
+       * @param {('left'|'center'|'right')} [options.hOrigin] - the origin of the transformation
+       * @param {Number} [options.hOffset] - horizontal offset
+       * @param {('top'|'center'|'bottom')} [options.vPos] - vertical position relative to the reference element
+       * @param {('top'|'center'|'bottom')} [options.vOrigin] - the origin of the transformation
+       * @param {Number} [options.vOffset] - vertical offset
+       * @returns {x,y} - the aligned coordinates
+       * @private
        */
       _getAlignedCoords: function _getAlignedCoords($element, options) {
         var $container = this.getContainer(),
-            componentOuterSize,
-            containerOffset,
-            elementOffset,
-            elementWidth,
-            elementHeight,
-            x,
-            y,
-            hPos,
-            vPos,
-            hOrigin,
-            vOrigin;
+          componentOuterSize,
+          containerOffset,
+          elementOffset,
+          elementWidth,
+          elementHeight,
+          x,
+          y,
+          hPos,
+          vPos,
+          hOrigin,
+          vOrigin;
         options = options || {};
         componentOuterSize = this.getOuterSize();
         containerOffset = $container.offset();
@@ -117,90 +111,82 @@ define(['lodash', 'ui/component/placeable'], function (_, makePlaceable) { 'use
         hOrigin = options.hOrigin || this._getDefaultHOrigin(options.hPos);
         vOrigin = options.vOrigin || this._getDefaultVOrigin(options.vPos);
         x = elementOffset.left - containerOffset.left;
-        y = elementOffset.top - containerOffset.top; // compute X
+        y = elementOffset.top - containerOffset.top;
 
+        // compute X
         switch (hPos) {
           case 'center':
             {
               x += elementWidth / 2;
               break;
             }
-
           case 'right':
             {
               x += elementWidth;
               break;
             }
         }
-
         switch (hOrigin) {
           case 'center':
             {
               x -= componentOuterSize.width / 2;
               break;
             }
-
           case 'right':
             {
               x -= componentOuterSize.width;
               break;
             }
         }
+        x += options.hOffset || 0;
 
-        x += options.hOffset || 0; // compute Y
-
+        // compute Y
         switch (vPos) {
           case 'center':
             {
               y += elementHeight / 2;
               break;
             }
-
           case 'bottom':
             {
               y += elementHeight;
               break;
             }
         }
-
         switch (vOrigin) {
           case 'center':
             {
               y -= componentOuterSize.height / 2;
               break;
             }
-
           case 'bottom':
             {
               y -= componentOuterSize.height;
               break;
             }
         }
-
         y += options.vOffset || 0;
         return {
           x: x,
           y: y
         };
       },
-
-      /**
-       * The default hOrigin changes according to the hPos value
-       * - left => right
-       *              REFERENCE_ELEMENT
-       *     COMPONENT
-       * - center => center
-       *              REFERENCE_ELEMENT
-       *                  COMPONENT
-       * - right => left
-       *              REFERENCE_ELEMENT
-       *                               COMPONENT
-       * @returns {('left'|'center'|'right')}
-       * @private
+      /**
+       * The default hOrigin changes according to the hPos value
+       * - left => right
+       *              REFERENCE_ELEMENT
+       *     COMPONENT
+       * - center => center
+       *              REFERENCE_ELEMENT
+       *                  COMPONENT
+       * - right => left
+       *              REFERENCE_ELEMENT
+       *                               COMPONENT
+       * @returns {('left'|'center'|'right')}
+       * @private
        */
       _getDefaultHOrigin: function _getDefaultHOrigin(hPos) {
         var hOrigin;
-
         switch (hPos) {
           default:
           case 'center':
@@ -208,39 +194,34 @@ define(['lodash', 'ui/component/placeable'], function (_, makePlaceable) { 'use
               hOrigin = 'center';
               break;
             }
-
           case 'left':
             {
               hOrigin = 'right';
               break;
             }
-
           case 'right':
             {
               hOrigin = 'left';
               break;
             }
         }
-
         return hOrigin;
       },
-
-      /**
-       * The default vOrigin changes according to the vPos value
-       * - top => bottom
-       *                               COMPONENT
-       *              REFERENCE_ELEMENT
-       * - center => center
-       *              REFERENCE_ELEMENT COMPONENT
-       * - bottom => top
-       *              REFERENCE_ELEMENT
-       *                               COMPONENT
-       * @returns {('top'|'center'|'bottom')}
-       * @private
+      /**
+       * The default vOrigin changes according to the vPos value
+       * - top => bottom
+       *                               COMPONENT
+       *              REFERENCE_ELEMENT
+       * - center => center
+       *              REFERENCE_ELEMENT COMPONENT
+       * - bottom => top
+       *              REFERENCE_ELEMENT
+       *                               COMPONENT
+       * @returns {('top'|'center'|'bottom')}
+       * @private
        */
       _getDefaultVOrigin: function _getDefaultVOrigin(vPos) {
         var vOrigin;
-
         switch (vPos) {
           default:
           case 'center':
@@ -248,35 +229,30 @@ define(['lodash', 'ui/component/placeable'], function (_, makePlaceable) { 'use
               vOrigin = 'center';
               break;
             }
-
           case 'top':
             {
               vOrigin = 'bottom';
               break;
             }
-
           case 'bottom':
             {
               vOrigin = 'top';
               break;
             }
         }
-
         return vOrigin;
       }
     };
-    /**
-     * @param {Component} component - an instance of ui/component
-     * @param {Object} config
-     */
 
+    /**
+     * @param {Component} component - an instance of ui/component
+     * @param {Object} config
+     */
     function makeAlignable(component, config) {
       _.assign(component, alignableComponent);
-
       if (!makePlaceable.isPlaceable(component)) {
         makePlaceable(component);
       }
-
       return component.off('.makeAlignable').on('init.makeAlignable', function () {
         _.defaults(this.config, config || {}, defaultConfig);
       });

package/dist/component/containable.js

@@ -3,107 +3,102 @@ define(['lodash', 'ui/component/placeable'], function (_, makePlaceable) { 'use
     _ = _ && Object.prototype.hasOwnProperty.call(_, 'default') ? _['default'] : _;
     makePlaceable = makePlaceable && Object.prototype.hasOwnProperty.call(makePlaceable, 'default') ? makePlaceable['default'] : makePlaceable;
 
-    /**
-     * This program is free software; you can redistribute it and/or
-     * modify it under the terms of the GNU General Public License
-     * as published by the Free Software Foundation; under version 2
-     * of the License (non-upgradable).
-     *
-     * This program is distributed in the hope that it will be useful,
-     * but WITHOUT ANY WARRANTY; without even the implied warranty of
-     * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
-     * GNU General Public License for more details.
-     *
-     * You should have received a copy of the GNU General Public License
-     * along with this program; if not, write to the Free Software
-     * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
-     *
-     * Copyright (c) 2017 (original work) Open Assessment Technologies SA;
+    /**
+     * This program is free software; you can redistribute it and/or
+     * modify it under the terms of the GNU General Public License
+     * as published by the Free Software Foundation; under version 2
+     * of the License (non-upgradable).
+     *
+     * This program is distributed in the hope that it will be useful,
+     * but WITHOUT ANY WARRANTY; without even the implied warranty of
+     * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+     * GNU General Public License for more details.
+     *
+     * You should have received a copy of the GNU General Public License
+     * along with this program; if not, write to the Free Software
+     * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+     *
+     * Copyright (c) 2017 (original work) Open Assessment Technologies SA;
      */
     var ns = '.makeContainable';
     var defaultConfig = {};
     var containableComponent = {
-      /**
-       * @param {jQuery} $container
-       * @param {Object} [options]
-       * @param {Number} [options.padding] - global padding or...
-       * @param {Number} [options.paddingTop]
-       * @param {Number} [options.paddingRight]
-       * @param {Number} [options.paddingBottom]
-       * @param {Number} [options.paddingLeft]
-       * @returns {containableComponent}
+      /**
+       * @param {jQuery} $container
+       * @param {Object} [options]
+       * @param {Number} [options.padding] - global padding or...
+       * @param {Number} [options.paddingTop]
+       * @param {Number} [options.paddingRight]
+       * @param {Number} [options.paddingBottom]
+       * @param {Number} [options.paddingLeft]
+       * @returns {containableComponent}
        */
       containIn: function containIn($container, options) {
         var self = this;
         self.off('move' + ns).on('move' + ns, function () {
           // unbind the present listener to avoid infinite loop
-          self.off('move' + ns); // position component
-
-          self._containComponent($container, options); // re-bind listener
+          self.off('move' + ns);
 
+          // position component
+          self._containComponent($container, options);
 
+          // re-bind listener
           self.containIn($container, options);
         });
         return self;
       },
-
-      /**
-       * Actual containment algorithm. Interface is the same as .containIn()
-       * @fires component#contained
-       * @private
+      /**
+       * Actual containment algorithm. Interface is the same as .containIn()
+       * @fires component#contained
+       * @private
        */
       _containComponent: function _containComponent($container, optionsParam) {
         var options = optionsParam || {};
         var position = this.getPosition(),
-            size = this.getOuterSize(),
-            containerSize = {
-          width: $container.innerWidth(),
-          height: $container.innerHeight()
-        };
+          size = this.getOuterSize(),
+          containerSize = {
+            width: $container.innerWidth(),
+            height: $container.innerHeight()
+          };
         var newX = position.x,
-            newY = position.y,
-            paddingTop = options.paddingTop || options.padding || 0,
-            paddingRight = options.paddingRight || options.padding || 0,
-            paddingBottom = options.paddingBottom || options.padding || 0,
-            paddingLeft = options.paddingLeft || options.padding || 0;
-
+          newY = position.y,
+          paddingTop = options.paddingTop || options.padding || 0,
+          paddingRight = options.paddingRight || options.padding || 0,
+          paddingBottom = options.paddingBottom || options.padding || 0,
+          paddingLeft = options.paddingLeft || options.padding || 0;
         if (position.x < paddingLeft) {
           newX = 0 + paddingLeft;
         } else if (position.x + size.width > containerSize.width - paddingRight) {
           newX = containerSize.width - size.width - paddingRight;
         }
-
         if (position.y < paddingTop) {
           newY = 0 + paddingTop;
         } else if (position.y + size.height > containerSize.height - paddingBottom) {
           newY = containerSize.height - size.height - paddingBottom;
         }
-
         if (newX !== position.x || newY !== position.y) {
           this.moveTo(newX, newY);
-          /**
-           * Executes extra contained tasks
-           * @event component#contained
-           * @param {Number} newX
-           * @param {Number} newY
-           */
 
+          /**
+           * Executes extra contained tasks
+           * @event component#contained
+           * @param {Number} newX
+           * @param {Number} newY
+           */
           this.trigger('contained', newX, newY);
         }
       }
     };
-    /**
-     * @param {Component} component - an instance of ui/component
-     * @param {Object} [config]
-     */
 
+    /**
+     * @param {Component} component - an instance of ui/component
+     * @param {Object} [config]
+     */
     function makeContainable(component, config) {
       _.assign(component, containableComponent);
-
       if (!makePlaceable.isPlaceable(component)) {
         makePlaceable(component);
       }
-
       return component.off(ns).on('init' + ns, function () {
         _.defaults(this.config, config || {}, defaultConfig);
       });

package/dist/component/css/components.css

@@ -1,9 +1,9 @@
-/*
-Usage:
-- linear-gradient((color1, color2, color3)) - returns linear-gradient with evenly distributed colors,
-   if 3 colors used then the position of each will be 33,33%
-- linear-gradient((color1 0%, color2 30%, color3 80%)) - returns linear-gradient with manually distributed colors,
-   first param - color, second - position. Also you can use px or other valid units for set position.
+/*
+Usage:
+- linear-gradient((color1, color2, color3)) - returns linear-gradient with evenly distributed colors,
+   if 3 colors used then the position of each will be 33,33%
+- linear-gradient((color1 0%, color2 30%, color3 80%)) - returns linear-gradient with manually distributed colors,
+   first param - color, second - position. Also you can use px or other valid units for set position.
 */
 /* based on "visually-hidden" mixin in LDS for accessibility goals */
 /* Do not edit */
@@ -565,5 +565,5 @@ ul[data-button-group] > li[class^="icon-"], ul[data-button-group] > li[class*="
 .progressbar.error > span {
     background-color: #ba122b;
 }
-
+
 /*# sourceMappingURL=components.css.map */