1 // ==========================================================================
  2 // Project:   SproutCore - JavaScript Application Framework
  3 // Copyright: ©2006-2011 Strobe Inc. and contributors.
  4 //            Portions ©2008-2011 Apple Inc. All rights reserved.
  5 // License:   Licensed under MIT license (see license.js)
  6 // ==========================================================================
  7 /**
  8   @class
  9 
 10   SegmentViews are the views used and arranged by SC.SegmentedView and are very similar to a SC.ButtonView
 11   without any event handling.  The event handling is done by the parent view.
 12 
 13   @extends SC.View
 14   @since SproutCore 1.5
 15 */
 16 SC.SegmentView = SC.View.extend(SC.Control,
 17 /** @scope SC.SegmentView.prototype */{
 18 
 19   /**
 20     @type String
 21     @default 'tab'
 22     @readOnly
 23   */
 24   //ariaRole: 'tab',
 25   ariaRole: 'button', // workaround for <rdar://problem/10444670>; switch back to 'tab' later with <rdar://problem/10463928> (also see segmented.js)
 26 
 27   /**
 28     @type Boolean
 29     @default YES
 30     @readOnly
 31   */
 32   isSegment: YES,
 33 
 34   /**
 35     @type Array
 36     @default ['sc-segment-view']
 37     @see SC.View#classNames
 38   */
 39   classNames: ['sc-segment-view'],
 40 
 41   /**
 42     @type String
 43     @default null
 44     @see SC.View#toolTip
 45   */
 46   toolTip: null,
 47 
 48   /**
 49     @type Boolean
 50     @default NO
 51     @see SC.Control#isActive
 52   */
 53   isActive: NO,
 54 
 55   /**
 56     @type Boolean
 57     @default NO
 58     @see SC.Control#isSelected
 59   */
 60   isSelected: NO,
 61 
 62   /**
 63     Change the layout direction to make this a vertical segment instead of horizontal ones.
 64     Possible values:
 65 
 66       - SC.LAYOUT_HORIZONTAL
 67       - SC.LAYOUT_VERTICAL
 68 
 69     @type String
 70     @default SC.LAYOUT_HORIZONTAL
 71   */
 72   layoutDirection: SC.LAYOUT_HORIZONTAL,
 73 
 74   /**
 75     @type String
 76     @default null
 77     @see SC.Control#controlSize
 78   */
 79   controlSize: null,
 80 
 81   /**
 82     @type Boolean
 83     @default NO
 84     @see SC.ButtonView#supportFocusRing
 85   */
 86   supportFocusRing: NO,
 87 
 88   // TODO: isDefault, isCancel, value not really used by render delegate
 89   displayProperties: ['icon', 'displayTitle', 'value', 'displayToolTip', 'isDefault', 'isCancel', 'width', 'isSegment','isFirstSegment', 'isMiddleSegment', 'isLastSegment', 'isOverflowSegment', 'index', 'layoutDirection'],
 90 
 91   /**
 92     @type String
 93     @default 'segmentRenderDelegate'
 94   */
 95   renderDelegateName: 'segmentRenderDelegate',
 96 
 97   /**
 98     @type Boolean
 99     @default YES
100   */
101   useStaticLayout: YES,
102 
103 
104   // ..........................................................
105   // Properties
106   //
107 
108   /**
109     @type String
110     @default ""
111   */
112   title: "",
113 
114   /**
115     @type Object
116     @default null
117   */
118   value: null,
119 
120   /**
121     @type String
122     @default null
123   */
124   icon: null,
125 
126   /**
127     @type Boolean
128     @default null
129   */
130   localize: NO,
131 
132   /**
133     @type String
134     @default null
135   */
136   keyEquivalent: null,
137 
138   // TODO: Modification currently unsupported in SegmentedView
139   /**
140     @type Boolean
141     @default YES
142   */
143   escapeHTML: YES,
144 
145   // TODO: Modification currently unsupported in SegmentedView
146   /**
147     @type Boolean
148     @default YES
149   */
150   needsEllipsis: YES,
151 
152   /**
153     Localized title.
154 
155     @field
156     @type String
157     @default ""
158   */
159   displayTitle: function() {
160     var ret = this.get('title');
161     if (this.get('localize')) ret = SC.String.loc(ret);
162     return ret;
163   }.property('title', 'localize').cacheable(),
164 
165   /**
166     @type Number
167     @default null
168   */
169   width: null,
170 
171   /**
172     The item represented by this view.
173 
174     @type Object
175     @default null
176   */
177   localItem: null,
178 
179   /** @private
180     Whenever the width property changes, adjust our layout accordingly.
181   */
182   widthDidChange: function() {
183     this.adjust('width', this.get('width'));
184   }.observes('width'),
185 
186   /** @private
187     Update our properties according to our matching item.
188   */
189   updateItem: function(parentView, item) {
190     var itemKeys = parentView.get('itemKeys'),
191         itemKey,
192         viewKeys = parentView.get('viewKeys'),
193         viewKey,
194         i;
195 
196     for (i = itemKeys.get('length') - 1; i >= 0; i--) {
197       itemKey = parentView.get(itemKeys.objectAt(i));
198       viewKey = viewKeys.objectAt(i);
199 
200       // Don't overwrite the default value if none exists in the item
201       if (!SC.none(item.get(itemKey))) this.set(viewKey, item.get(itemKey));
202     }
203 
204     this.set('localItem', item);
205   }
206 });
207