samples/web/Sample/Tizen/Web App/Modello_SDL/project/app/controlls/Indicator.js

   1 /*
   2  * Copyright (c) 2013, Ford Motor Company All rights reserved.
   3  *
   4  * Redistribution and use in source and binary forms, with or without
   5  * modification, are permitted provided that the following conditions are met:
   6  *  · Redistributions of source code must retain the above copyright notice,
   7  * this list of conditions and the following disclaimer.
   8  *  · Redistributions in binary form must reproduce the above copyright notice,
   9  * this list of conditions and the following disclaimer in the documentation
  10  * and/or other materials provided with the distribution.
  11  *  · Neither the name of the Ford Motor Company nor the names of its
  12  * contributors may be used to endorse or promote products derived from this
  13  * software without specific prior written permission.
  14  *
  15  * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
  16  * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
  17  * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
  18  * ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE
  19  * LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
  20  * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
  21  * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
  22  * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
  23  * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
  24  * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
  25  * POSSIBILITY OF SUCH DAMAGE.
  26  */
  27 /**
  28  * @name SDL.Indicator
  29  * @desc Universal button component with value indicator for SDL application
  30  * @category Controlls
  31  * @filesource app/controlls/Indicator.js
  32  * @version 1.0
  33  */
  34
  35 SDL.Indicator = Em.View.extend( Ember.TargetActionSupport, {
  36
  37     /** Content binding */
  38     content: null,
  39
  40     /** internal indicators array */
  41     indicators: null,
  42
  43     /** indicator active class */
  44     indActiveClass: null,
  45
  46     /** indicator default class */
  47     indDefaultClass: null,
  48
  49     /** Set active indicator from the start */
  50     startFrom: null,
  51
  52     /** binding property to enable/disable indicators */
  53     enabledBinding: 'content.enabled',
  54
  55     /**
  56      * Before rendering view handeler need to generate indicators array based on
  57      * indicator range value
  58      */
  59     beforeRender: function() {
  60         // define variables
  61         var length = this.content.range, view = this, i;
  62
  63         // generate indicators
  64         this.indicators = [];
  65
  66         for( i = 0; i < length; i++ ){
  67             this.indicators.push( Em.Object.create( {
  68                 index: i,
  69                 className: this.indDefaultClass
  70             } ) );
  71         }
  72         // apply indicator visualization rule
  73         view.setRecord();
  74
  75         if( this.startFrom ){
  76             this.indicators[this.startFrom].set( 'className', this.indActiveClass );
  77         }
  78
  79         // add observer to content record
  80         this.addObserver( 'content', function() {
  81             view.setRecord();
  82         } );
  83
  84         // view internal call
  85         this.applyAttributesToBuffer( this.buffer );
  86     },
  87
  88     actionDown: function() {
  89         this.triggerAction();
  90     },
  91
  92     // change record binding
  93     setRecord: function() {
  94
  95         var view = this;
  96
  97         if( this.content.observersForKey( 'value' ).length == 0 ){
  98
  99             this.content.addObserver( 'value', function() {
 100                 view.toggleIndicators();
 101             } );
 102
 103         }
 104
 105         this.toggleIndicators();
 106     },
 107
 108     // Toggle indicator handeler
 109     toggleIndicators: function() {
 110
 111         var length = this.indicators.length, i;
 112
 113         for( i = 0; i < length; i++ ){
 114             if( i >= this.content.value ){
 115                 this.indicators[i].set( 'className', 'SDL_indicator ' + this.indDefaultClass );
 116             }else{
 117                 this.indicators[i].set( 'className', 'SDL_indicator ' + this.indActiveClass );
 118             }
 119         }
 120     },
 121
 122     /** Define indicator template */
 123     template: Ember.Handlebars.compile( '{{#with view}}' + '{{#each indicators}}' + '<div {{bindAttr class="className view.enabled:show"}}></div>' + '{{/each}}' + '{{/with}}' )
 124
 125 } );