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 /** 9 @static 10 @constant 11 @type Number 12 @default 15 13 */ 14 SC.WELL_CONTAINER_PADDING = 15; 15 16 /** @class 17 18 A WellView is a ContainerView with a border. It's useful when you want to 19 group a set of views. It allows you to easily switch its contents too. 20 21 It has a default contentLayout that will replace the layout of the contentView. 22 23 @extends SC.ContainerView 24 @since SproutCore 1.0 25 @test in progress 26 */ 27 SC.WellView = SC.ContainerView.extend( 28 /** @scope SC.WellView.prototype */ { 29 30 /** 31 @type Array 32 @default ['sc-well-view'] 33 @see SC.View#classNames 34 */ 35 classNames: 'sc-well-view', 36 37 /** 38 Layout for the content of the container view. 39 @type Hash 40 */ 41 contentLayout: { 42 top: SC.WELL_CONTAINER_PADDING, 43 bottom: SC.WELL_CONTAINER_PADDING, 44 left: SC.WELL_CONTAINER_PADDING, 45 right: SC.WELL_CONTAINER_PADDING 46 }, 47 48 /** 49 @type String 50 @default 'wellRenderDelegate' 51 */ 52 renderDelegateName: 'wellRenderDelegate', 53 54 /** @private 55 Overrides createChildViews and replaces the layout of the contentView 56 with the one in contentLayout. 57 */ 58 createChildViews: function() { 59 // if contentView is defined, then create the content 60 var view = this.get('contentView') ; 61 if (view) { 62 view = this.contentView = this.createChildView(view) ; 63 view.set('layout', this.contentLayout); 64 this.childViews = [view] ; 65 } 66 }, 67 68 /** @private 69 Invoked whenever the content property changes. This method will simply 70 call replaceContent and set the contentLayout in the new contentView. 71 72 Override replaceContent to change how the view is 73 swapped out. 74 */ 75 contentViewDidChange: function() { 76 var view = this.get('contentView'); 77 view.set('layout', this.contentLayout); 78 this.replaceContent(view); 79 }.observes('contentView') 80 81 }) ; 82