web-ui-fw/0.0.2/0.0.2_Common/original/css/car/components/boxCaption/boxCaption.js

   1 /**
   2  * @module CarTheme
   3  **/
   4 (function ($) {
   5     "use strict";
   6     /**
   7      * Represents static UI element composed of rectangle and caption that can be used as a section title.
   8      * This component is required by {{#crossLink "Library"}}{{/crossLink}} class.
   9      *
  10      * Use following snippet to include component in your `index.html` file:
  11      *
  12      *     <script type='text/javascript' src='./css/car/components/boxCaption/boxCaption.js'></script>
  13      *     <link rel="stylesheet" href="./css/car/components/boxCaption/boxCaption.css" />
  14      *
  15      * Box caption provides following options for UI representations:
  16      *
  17      * * {{#crossLink "BoxCaption/init:method"}}{{/crossLink}} - Standard size of rectangle and light text color
  18      * (e.g. Exterior brightness in {{#crossLinkModule "DashboardApplication"}}{{/crossLinkModule}})
  19      * * {{#crossLink "BoxCaption/initSmall:method"}}{{/crossLink}} - Small size of rectangle and light text color
  20      * (e.g. Category title in {{#crossLink "Library"}}{{/crossLink}})
  21      *
  22      * Use following code to initialize:
  23      *
  24      *     $('#box').boxCaptionPlugin('init', "Caption");        // OR
  25      *     $('#box').boxCaptionPlugin('initSmall', "Caption");
  26      *
  27      * @class BoxCaption
  28      * @constructor
  29      */
  30     var BoxCaption = {
  31             /**
  32              * Generates and shows default box caption element on the screen.
  33              *
  34              * @method init
  35              * @param caption {String} Caption text.
  36              */
  37             init: function (caption) {
  38                 this.empty();
  39                 var appendText = '<div class="boxIconRectangle bgColorTheme"></div>';
  40                 appendText += '<div class="boxIconCaption fontSizeXSmall fontWeightBold fontColorLight">';
  41                 appendText += caption.toUpperCase();
  42                 appendText += '</div>';
  43                 this.append(appendText);
  44             },
  45             /**
  46              * Generates and shows small box caption element on the screen.
  47              *
  48              * @method initSmall
  49              * @param caption {String} Caption text.
  50              */
  51             initSmall: function (caption) {
  52                 this.empty();
  53                 var appendText = '<div class="boxIconRectangleSmall bgColorTheme"></div>';
  54                 appendText += '<div class="boxIconCaptionSmall fontSizeXXSmall fontWeightBold fontColorLight">';
  55                 appendText += caption.toUpperCase();
  56                 appendText += '</div>';
  57                 this.append(appendText);
  58             }
  59         };
  60     /**
  61      * jQuery extension method for {{#crossLink "BoxCaption"}}{{/crossLink}} plugin.
  62      * @param method {Object|jQuery selector} Identificator (name) of method or jQuery selector.
  63      * @method boxCaptionPlugin
  64      * @for jQuery
  65      * @return Result of called method.
  66      */
  67     $.fn.boxCaptionPlugin = function (method) {
  68         // Method calling logic
  69         if (BoxCaption[method]) {
  70             return BoxCaption[method].apply(this, Array.prototype.slice.call(arguments, 1));
  71         } else if (typeof method === 'object' || !method) {
  72             return BoxCaption.init.apply(this, arguments);
  73         } else {
  74             $.error('Method ' + method + ' does not exist on jQuery.boxCaptionPlugin');
  75         }
  76     };
  77 }(jQuery));