sproutcore 1.6.0.beta.3-java → 1.6.0-java

data/lib/frameworks/sproutcore/frameworks/foundation/mixins/inline_editable.js

@@ -6,7 +6,7 @@
 // ==========================================================================
 
 /**
-  @mixin
+  @namespace
 
   This mixin is used for views that show a seperate editor view to edit.
   For example, the default behavior of SC.LabelView if isEditable is set

data/lib/frameworks/sproutcore/frameworks/foundation/mixins/inline_editor.js

@@ -6,7 +6,7 @@
 // ==========================================================================
 
 /**
-  @mixin
+  @namespace
 
   This mixin is for a view that is editable but is acting as a proxy to
   edit another view. For example, a calendar picker that pops up over

data/lib/frameworks/sproutcore/frameworks/foundation/mixins/inline_editor_delegate.js

@@ -6,7 +6,7 @@
 // ==========================================================================
 
 /**
-  @mixin
+  @namespace
   
   This delegate is consulted by view implementing SC.InlineEditable and
   SC.InlineEditor and controls the lifecycle of the editor as well as begin

data/lib/frameworks/sproutcore/frameworks/foundation/mixins/inner_frame.js

@@ -49,7 +49,7 @@ SC.BEST_FIT = "fitBest";
 SC.BEST_FIT_DOWN_ONLY = "fitBestDown";
 
 /**
-  @mixin
+  @namespace
 
   InnerFrame provides the innerFrameForSize function, which will return a frame for the given size adjusted
   to fit within the given outer size, according to the align and scale properties.

data/lib/frameworks/sproutcore/frameworks/foundation/render_delegates/canvas_image.js

@@ -51,7 +51,7 @@ sc_require('render_delegates/render_delegate');
 */
 
 SC.BaseTheme.canvasImageRenderDelegate = SC.RenderDelegate.create({
-  name: 'canvasImage',
+  className: 'canvasImage',
 
   /** @private
     We don't have an element yet, so we do the minimal necessary setup
@@ -78,10 +78,11 @@ SC.BaseTheme.canvasImageRenderDelegate = SC.RenderDelegate.create({
 
     // We only care about specific values, check specifically for what matters
     var innerFrameDidChange = ![innerFrame.x, innerFrame.y, innerFrame.width, innerFrame.height].isEqual(renderState._lastInnerFrameValues),
+        elemSizeDidChange = ![elem.width, elem.height].isEqual(renderState._lastElemSizeValues),
         backgroundDidChange = dataSource.didChangeFor('canvasImageRenderDelegate', 'backgroundColor'),
         imageDidChange = dataSource.didChangeFor('canvasImageRenderDelegate', 'image') || (image && image.complete) !== renderState._lastImageComplete;
 
-    if (innerFrameDidChange || backgroundDidChange || imageDidChange) {
+    if (elemSizeDidChange || innerFrameDidChange || backgroundDidChange || imageDidChange) {
 
       if (elem && elem.getContext) {
         elem.height = frameHeight;
@@ -103,6 +104,7 @@ SC.BaseTheme.canvasImageRenderDelegate = SC.RenderDelegate.create({
 
       // Update caches
       renderState._lastInnerFrameValues = [innerFrame.x, innerFrame.y, innerFrame.width, innerFrame.height];
+      renderState._lastElemSizeValues = [elem.width, elem.height];
       renderState._lastImageComplete = image && image.complete;
     }
   }

data/lib/frameworks/sproutcore/frameworks/foundation/render_delegates/helpers/sizing.js

@@ -5,6 +5,8 @@
 // License:   Licensed under MIT license (see license.js)
 // ==========================================================================
 
+sc_require('render_delegates/render_delegate');
+
 SC.RenderDelegate.reopen({
   /**
     A list of size names to look for when automatically determining

data/lib/frameworks/sproutcore/frameworks/foundation/render_delegates/image.js

@@ -34,7 +34,7 @@ sc_require('render_delegates/render_delegate');
 */
 
 SC.BaseTheme.imageRenderDelegate = SC.RenderDelegate.create({
-  name: 'image',
+  className: 'image',
 
   render: function(dataSource, context) {
     var image = dataSource.get('image'),

data/lib/frameworks/sproutcore/frameworks/foundation/render_delegates/label.js

@@ -35,7 +35,7 @@ sc_require('render_delegates/render_delegate');
 */
 
 SC.BaseTheme.labelRenderDelegate = SC.RenderDelegate.create({
-  name: 'label',
+  className: 'label',
   
   render: function(dataSource, context) {
     this.addSizeClassName(dataSource, context);

data/lib/frameworks/sproutcore/frameworks/foundation/render_delegates/render_delegate.js

@@ -14,7 +14,7 @@
   and can be simpler to subclass between themes than `SC.Object`.
 
   Creating & Subclassing
-  ============================
+  ===
   You create render delegates just like you create SC.Objects:
 
       MyTheme.someRenderDelegate = SC.RenderDelegate.create({ ... });
@@ -40,7 +40,7 @@
   that you expect to be instances.
 
   Rendering and Updating
-  =========================
+  ===
   Render delegates are most commonly used for two things: rendering and updating
   DOM representations of controls.
 
@@ -61,7 +61,7 @@
       }
 
   Variables
-  ==========================
+  ===
   The data source provides your render delegate with all of the information
   needed to render. However, the render delegate's consumer--usually a view--
   may need to get information back.
@@ -111,7 +111,7 @@
   helper discussion below.
 
   Helpers
-  =====================
+  ===
   SC.RenderDelegate have "helper methods" to assist the rendering process.
   There are a few built-in helpers, and you can add your own.
 
@@ -126,7 +126,7 @@
   directive. For example:
 
       MyTheme.buttonRenderDelegate = SC.RenderDelegate.create({
-        name: 'button',
+        className: 'button',
         render: function(dataSource, context) {
           this.includeSlices(dataSource, context, SC.THREE_SLICE);
         }
@@ -199,7 +199,7 @@
   You can then use the helpers from your render delegates:
 
       MyTheme.someRenderDelegate = SC.RenderDelegate.create({
-        name: 'some-thingy',
+        className: 'some-thingy',
         render: function(dataSource, context) {
           this.myHelperMethod(dataSource);
         }
@@ -242,7 +242,7 @@
       });
 
   Data Sources
-  ====================
+  ===
   Render delegates get the content to be rendered from their data sources.
 
   A data source can be any object, so long as the object implements
@@ -260,17 +260,17 @@
     While render delegates are _usually_ completely stateless, there are
     cases where they may need to save some sort of state.
 */
-SC.RenderDelegate = {
+SC.RenderDelegate = /** @scope SC.RenderDelegate.prototype */{
+  
   // docs will look more natural if these are all considered instance
   // methods/properties.
-  /*@scope SC.RenderDelegate.prototype*/
 
   /**
     Creates a new render delegate based on this one. When you want to
     create a render delegate, you call this:
    
         MyTheme.myRenderDelegate = SC.RenderDelegate.create({
-          name: 'my-render-delegate',
+          className: 'my-render-delegate',
           render: function(dataSource, context) {
             // your code here...
           }
@@ -310,7 +310,7 @@ SC.RenderDelegate = {
       }
 
       if (v && v.isEnhancement && v !== this[i]) {
-        v = SC._enhance(this[i] || K, v);
+        v = SC._enhance(this[i] || SC.K, v);
       }
 
       this[i] = v;
@@ -343,11 +343,11 @@ SC.RenderDelegate = {
   },
 
   /**
-    All render delegates should have a name. Any time a render delegate is
+    All render delegates should have a class name. Any time a render delegate is
     used, this name should be added as a class name (`SC.View`s do this
     automatically).
   */
-  name: undefined,
+  className: undefined,
 
   /**
     Writes the DOM representation of this render delegate to the

data/lib/frameworks/sproutcore/frameworks/foundation/resources/button_view.css

@@ -0,0 +1,36 @@
+/* SC.ButtonView */
+.sc-button-view {
+  display: inline-block ;
+  vertical-align: middle;
+  text-decoration: none ;
+  border: 1px #555 solid;
+  border-radius: 3px;
+  -moz-border-radius: 3px;
+  
+  &.sc-static-layout {
+    margin: 0 4px;
+  }
+  .sc-button-inner {
+    position: relative;
+    display:  block;
+    height: 100%;
+    text-align: center ;
+  }
+  label {
+    position: relative;
+    display: block;
+    line-height: 21px;
+    text-align: center;
+  }
+  img {
+    vertical-align: middle ;
+    margin-right: 2px;
+    position: relative ;
+    top: -2px;
+    left: -2px;
+  }
+  
+  .ie7 &{
+    display: inline;
+  }
+}

data/lib/frameworks/sproutcore/frameworks/foundation/resources/label.css

@@ -0,0 +1,47 @@
+/* SC.LabelView */
+
+.sc-label-view {
+  font-weight: normal;
+  text-align: left;
+  
+  &.icon {
+  	position: relative;
+  	vertical-align: middle;
+  }
+  
+  &.sc-hint {
+  	position: absolute;
+  	top: 3px;
+  	left: 1px;
+  	right: 1px;
+  	bottom: 3px;
+  	padding: 0px;
+  	color: #aaa ;
+  	font-size: 12px;
+  }
+  
+  &.disabled {
+  	color: #999;
+  	color: rgba(50,50,50,0.5);
+  }
+  
+  &.sc-large-size {
+  	font-size: 18px;
+  	line-height: 24px;
+  }
+  
+  &.sc-regular-size {
+  	font-size: 12px;
+  	line-height: 19px;
+  }
+  
+  &.sc-small-size {
+  	font-size: 11px;
+  	line-height: 14px;
+  }
+  
+  &.sc-tiny-size {
+  	font-size: 9px;
+  	line-height: 12px;
+  }
+}

data/lib/frameworks/sproutcore/frameworks/foundation/{english.lproj → resources}/static_layout.css

@@ -1,5 +1,5 @@
 /* SC.StaticLayout Support */
 
-.sc-static-layout, .sc-view.sc-static-layout {
+.sc-view.sc-static-layout {
   position: relative;
 }

data/lib/frameworks/sproutcore/frameworks/foundation/resources/text_field.css

@@ -0,0 +1,125 @@
+/* Common SC.TextFieldView styles - needed to work properly */
+
+.sc-text-field-view {
+  border:none;
+  z-index:100;
+  overflow: visible;
+  background :white;
+  .border {
+    position: absolute;
+    top: 0px;
+    left: 0px;
+    bottom: 0px;
+    right: 0px;
+  }
+  .padding {
+    top: 0px;
+    left: 3px;
+    bottom: 0px;
+    right: 3px;
+    position: absolute;
+  }
+  &.sc-text-field-accessory-view {
+  	z-index: 2;
+  }
+  input {
+  	position: absolute;
+  	top: 0px;
+  	left: 0px;
+  	width: 100%;
+    bottom: 0px;
+  	right: 0px;
+  	display: block;
+  	background: transparent;
+  	vertical-align: middle;
+  	border: none;
+  	outline: none;
+  	-webkit-appearance:none;
+  }
+  
+  textarea {
+    position: absolute;
+  	top: 0px;
+  	left: 0px;
+  	width:100%;
+    bottom: 0px;
+  	right: 0px;
+  	display: block;
+  	background: transparent;
+  	vertical-align: middle;
+  	resize: none;
+  	overflow: auto;
+  	border: none;
+    outline: none;
+    -webkit-appearance:none;
+  }
+  
+  
+  .sc-hint {
+  	z-index: 1;
+  	position: absolute;
+  	top: 3px;
+  	left: 1px;
+  	right: 1px;
+  	bottom: 3px;
+  	padding: 0px;
+  	color: #aaa ;
+  	font-size: 12px;
+  }
+
+  &.text-area .sc-hint {
+  	top: 2px;
+  	left: 3px;
+  	right: 3px;
+  	bottom: 2px;
+  }
+
+  &.focus .sc-hint,
+  &.not-empty .sc-hint {
+    display: none ;
+  }
+
+  &.sc-hint .field{
+    color: #B3B3B3 !important;
+  }
+
+  .safari &{
+    &.focus {
+      outline: auto 7px -webkit-focus-ring-color; 
+      outline-offset: -2px;
+    } 
+    .border {
+      -webkit-appearance: textfield;
+    }
+  }
+
+  .mozilla &{
+    &.focus {
+      outline-color:-moz-mac-focusring;
+      outline-offset:-5px;
+      outline-style:solid;
+      outline-width:3px;
+    } 
+    .border {
+      -moz-appearance: textfield;
+    }
+    textarea.field {
+    	height: 100%;
+    }
+  }
+
+  .msie &{
+    &.focus {
+      outline: 1px dotted;
+    }
+    .border {
+      border:1px inset;
+    }
+    input.field {
+      padding-bottom: 1px;
+    }
+    textarea.field {
+    	height: 100%;
+    }
+  } 
+}