samples/web/Sample/Tizen/Web App/ModelloSmartDeviceLink/project/app/controlls/List.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.List
  29  * @desc General list component for SDL application
  30  * @category Controlls
  31  * @filesource app/controlls/List.js
  32  * @version 1.0
  33  */
  34
  35 SDL.List = Em.ContainerView.extend( {
  36
  37     classNames: 'list',
  38
  39     /** flag for scrollbar */
  40     disableScrollbar: true,
  41
  42     /** Set count of items at one time */
  43     itemsOnPage: 0,
  44
  45     /** Speed of scrolling in milliseconds */
  46     scrollBarSpeed: 200,
  47
  48     /** Number of columns on page */
  49     columnsNumber: 1,
  50
  51     itemheight: 50,
  52
  53     /** Current scroll page */
  54     currentPage: 0,
  55
  56     /** Css style of list */
  57     listScrollingAttributes: '',
  58
  59     /** Count of items in menu */
  60     /*
  61      * listCount: function(){ if( this.items ) { return this.items.length; }
  62      * }.property('items.@each.type'),
  63      */
  64     listCount: function() {
  65         // console.log(this.get('this.list.childViews.length'));
  66         return this.get( 'this.list.childViews.length' );
  67     }.property( 'this.list.childViews.length' ),
  68
  69     /** Pages count */
  70     pageCount: function() {
  71         return Math.ceil( this.get( 'listCount' ) / this.get( 'columnsNumber' ) / this.get( 'itemsOnPage' ) );
  72     }.property( 'listCount', 'itemsOnPage' ),
  73
  74     listHeight: function() {
  75         return this.itemsOnPage * this.itemheight;
  76     }.property( 'itemsOnPage' ),
  77
  78     /** Action of element "sb-top" which show previous list page */
  79     sbUp: function() {
  80         if( this.get( 'currentPage' ) > 0 ){
  81             this.set( 'currentPage', this.get( 'currentPage' ) - 1 );
  82         }
  83     },
  84
  85     /** Action of element "sb-bottom" which show previous list page */
  86     sbDown: function() {
  87         if( this.get( 'currentPage' ) < this.get( 'pageCount' ) - 1 ){
  88             this.set( 'currentPage', this.get( 'currentPage' ) + 1 );
  89         }
  90     },
  91
  92     /** Scroll content according to current page */
  93     onCurrentPageChange: function() {
  94         this.set( 'listScrollingAttributes', 'margin-top: ' + ( this.get( 'currentPage' ) * this.itemsOnPage * ( -50 ) ) + 'px' );
  95     }.observes( 'currentPage' ),
  96
  97     /** Method for delete certain item from list */
  98     deleteItem: function( id ) {
  99         this.items.splice( id, 1 );
 100         this.list.refresh();
 101     },
 102
 103     /** List components */
 104     childViews:
 105         [
 106             'list',
 107             'scrollbar'
 108         ],
 109
 110     /** List view */
 111     list: Em.ContainerView.extend( {
 112
 113         classNames: 'list-content',
 114
 115         listStyleBinding: 'parentView.listScrollingAttributes',
 116
 117         attributeBindings:
 118             [
 119                 'listStyle:style'
 120             ],
 121
 122         refresh: function() {
 123             this.rerender();
 124         }.observes( '_parentView.items.@each.type' ),
 125
 126         afterRender: function() {
 127             var items = this._parentView.items, element, i, key, binding;
 128
 129             for( i = 0; i < items.length; i++ ){
 130
 131                 element = items[i].type.create( {
 132                     // element id
 133                     elementId: this._parentView.elementId + '_item' + i,
 134
 135                     // list item css class
 136                     classNames: 'list-item',
 137
 138                     classNameBindings:
 139                         [
 140                             'this.voiceOver'
 141                         ],
 142
 143                     // Dynamic property set
 144                     init: function() {
 145                         for( key in items[i].params ){
 146                             if( key.match( 'Binding' ) != null ){
 147                                 binding = Ember.Binding.from( items[i].params[key] ).to( key.replace( 'Binding', '' ) );
 148                                 binding.connect( this );
 149                                 // Set one way binding
 150                                 binding.oneWay();
 151                             }else{
 152                                 this.set( key, items[i].params[key] );
 153                             }
 154                         }
 155                         this._super();
 156                         // synchronize bindings
 157                         Ember.run.sync();
 158                     }
 159                 } )
 160
 161                 // Push element to list
 162                 this.get( 'childViews' ).pushObject( element );
 163             }
 164         }
 165     } ),
 166
 167     /** Scrollbar view */
 168     scrollbar: SDL.ScrollBar.extend( {
 169         currentPageBinding: 'parentView.currentPage',
 170         pageCountBinding: 'parentView.pageCount',
 171         listHeightBinding: 'parentView.listHeight',
 172         scrollBarIsDisabledBinding: 'parentView.disableScrollbar'
 173     } )
 174 } );