sproutcore 0.9.0

data/lib/sproutcore/merb/router.rb

@@ -0,0 +1,43 @@
+require 'sproutcore/merb/bundle_controller'
+
+module SproutCore
+  module Merb
+    module RouterMethods
+      
+      # Connect a BundleController to the specified location.  All requests matching
+      # this path root will by default be handled by this new controller.
+      #
+      # ==== Params
+      # path<String>:: The root path or other matcher to use for the matcher.  This
+      #  will be passed through to the router, so you can use anything you like.
+      #
+      # === Options
+      # library:: Optional path to the library that should be hosted 
+      # You can also include any other options that are known to Merb::Bundle
+      #
+      def connect_clients(match_path, opts ={}, &block)
+        
+        # Create library 
+        library_root = opts.delete(:library) || opts.delete(:library_root) || ::Merb.root
+        library = Library.library_for(library_root, opts)
+        
+        # Define new subclass of bundle controller
+        cnt = 0
+        while Object.const_defined?(class_name = "SproutCoreBundleController#{cnt}".to_sym)
+          cnt += 1
+        end
+        klass = eval("class ::#{class_name} < SproutCore::Merb::BundleController; end; #{class_name}")
+        
+        # Register library for class in BundleController
+        ::SproutCore::Merb::BundleController.register_library_for_class(library, klass)
+        
+        # Finally, register match
+        return self.match(%r[^#{match_path}\/?.*]).to(:controller => "sprout_core_bundle_controller_#{cnt}", :action => 'main')
+        
+      end
+    end
+  end
+end
+
+# Install in router.
+Merb::Router::Behavior.send(:include, SproutCore::Merb::RouterMethods)

data/lib/sproutcore/merb.rb

@@ -0,0 +1,27 @@
+# This module defines the SproutCore support for Merb applications.  To host a SproutCore
+# app in your Merb application, simply add the following line to your router:
+#
+#  Merb::Router.prepare do |r|
+#    r.connect_clients('/', LIBRARY_ROOT)
+#  end
+#
+# The first parameter you pass is the URL you want SproutCore apps to be served from.  Anything
+# URL beginning with this root will be automatically directed to the SproutCore build tools.
+# 
+# The second parameter is an optional root path to the Library that you want hosted at that
+# location.  If you do not pass this parameter then Merb.root will be used (which is what you
+# usually want anyway.)
+#
+
+# Load Merb if it is available
+begin
+  require('merb-core')
+rescue LoadError
+end
+
+# Load SproutCore Merb support if Merb meets minimum criteria
+if defined?(Merb) && defined?(Merb::VERSION) && (Merb::VERSION.to_f >= 0.9)
+  Dir.glob(File.join(File.dirname(__FILE__),'merb','**','*.rb')).each { |x| require(x) }
+else
+  puts "WARNING: sproutcore/merb required Merb 0.9.1 or later.  Module was not loaded."
+end

data/lib/sproutcore/version.rb

@@ -0,0 +1,9 @@
+module SproutCore #:nodoc:
+  module VERSION #:nodoc:
+    MAJOR = 0
+    MINOR = 9
+    TINY  = 0
+
+    STRING = [MAJOR, MINOR, TINY].join('.')
+  end
+end

data/lib/sproutcore/view_helpers/button_views.rb

@@ -0,0 +1,302 @@
+############################################################
+# BUTTON VIEW HELPERS
+#
+# You can do a lot of different things with buttons: push buttons, switches,
+# checkboxes, radio buttons and more.  This file contains the helpers you can
+# use to help you build these.
+#
+
+require 'sproutcore/view_helpers/core_views'
+
+module SproutCore
+  module ViewHelpers    
+
+    # This is the core button_view helper.  Most other helpers in this file
+    # descend from this helper.  If a helper is not provided that already
+    # builds the button you want, you can probably use this helper to
+    # construct it yourself.
+    #
+    # :enabled (bindable) =>
+    #   If set to true, the button will be enabled.
+    #
+    # :selected (bindable) =>
+    #   Set to true, false or :mixed.  This will determine if the button
+    #   appears selected.  You can bind to this option but more often you will
+    #   want to bind to :value.
+    #
+    # :default (bindable) =>
+    #   Set to true to make this button the default button triggered when 
+    #   you press return while focused in a panel or form.
+    # 
+    # :cancel (bindable) =>
+    #   Set to true to make this button the one triggered when you press
+    #   return while focused on a panel or form.
+    # 
+    # :theme => :regular | :back | :checkbox | :radio | :square | 
+    #           (your own theme)
+    #   Use this to set the theme appearance of the button.  The SC theme
+    #   comes with built-in support for the ones listed above or you can
+    #   name your own.  a CSS class name will be assigned to the button with
+    #   this theme name.
+    #
+    # :behavior => :push, :toggle, :on, :off
+    #   Specify the behavior of the button when pressed.  The default is
+    #   :push.
+    #
+    # :tag =>
+    #   The tag name to use for the button.  Defaults to 'a'.  If the tag is
+    #   'a', an href="javascript:;" will be added automatically unless you
+    #   specify an alternate.
+    #
+    # :href =>
+    #   optional href to pass.  Generall you don't want to pass this.
+    # 
+    # :label => 
+    #   The value of the label placed inside the button.  You can alternately
+    #   specify inner_html which will be used a the label.  Note that the
+    #   button_view generator automatically wraps your inner_html with a
+    #   standard button structure unless you pass :label => false
+    #
+    # :image =>
+    #   Renders an image tag on the outside of the label span.  If this is
+    #   set, then the wrapping tag will also have 'image' css class applied.
+    # 
+    # :sprite => [resource_url, x-ofset, y-offset]
+    #   Render an image sprite!  The expected size of the sprite depends on
+    #   the class name of the view.   If the x-offset or y-offset are numbers
+    #   they will be converted to "px".  If this is set, then the wrapping
+    #   tag will also have 'sprite' css class applied.
+    #
+    #   Alternatively, name the CSS class you want assigned to the img for 
+    #  the sprite.
+    #
+    view_helper :button_view do
+      # JavaScript
+      property :enabled, :key => 'isEnabled'
+
+      property :action
+      property :target
+      
+      #property(:action) { |v| "function(ev) { return #{v}(this, ev); }" }
+      property :default, :key => 'isDefault'
+      property :cancel, :key => 'isCancel'
+      property :value
+      property :theme
+      property :size
+      property :behavior, :key => 'buttonBehavior'
+      property :toggle_on_value
+      property :toggle_off_value
+
+      property :key_equivalent, :key => :keyEquivalent
+
+
+      property(:selected, :key => 'isSelected') do |x|
+        (x == :mixed) ? 'SC.MIXED_STATE' : x
+      end
+
+      view 'SC.ButtonView'
+
+      # HTML
+      var :label, @inner_html || 'Submit'
+      var :tag, 'a'
+      var :theme, :regular
+      var :size, :normal
+
+      attribute(:href) { |x| (x.nil? && (@tag.downcase.to_s == 'a')) ? 'javascript:;' : nil } 
+
+      # Add the theme to the CSS class.
+      css_class_names << 'button'
+      css_class_names << @theme unless @theme.nil? || @theme == false
+      css_class_names << @size unless @size.nil? || @size == false
+
+      var :image
+      var :sprite
+      
+      if @image
+        @image = %(<img src="#{@image}" />)
+        css_class_names << 'image'
+    
+      elsif @sprite
+        img_url = self.blank_url
+        
+        if @sprite.instance_of?(Array)
+          xoff = @sprite[1] 
+          xoff = "#{xoff}px" if xoff.kind_of?(Numeric)
+
+          yoff = @sprite[2]
+          yoff = "#{yoff}px" if yoff.kind_of?(Numeric)
+        
+          # render image part
+          @image = %(<img class="sprite" style="background: url(#{@sprite[0]}) no-repeat #{xoff} #{yoff};" src="#{img_url}" />)
+        
+        else
+          @image = %(<img class="#{@sprite} sprite" src="#{img_url}" />)
+        end
+        
+      end
+      
+      # Generate some standard HTML for unless :label => false.
+      unless @label == false
+        # Button Width properties must be set on the inner label.  To deal 
+        # with this remove any width style properties from the parent element 
+        # and append them to the inner label.
+        @label_style = []
+        css_styles.flatten!
+        css_styles.reject! do | part |
+          if part =~ /width:/
+            @label_style << part
+            true
+          else
+            false
+          end
+        end
+        if @label_style.size > 0
+          @label_style = %(style="#{@label_style * ' '}" )
+        else
+          @label_style = ''
+        end
+
+        # Avoid doing the normal thing for anchor tags.
+        @inner_html = %(<span class="button-inner">#{@image}<span #{@label_style}class="label">#{@label}</span></span>)
+
+      else
+        @inner_html = [@image,@inner_html] * ''
+      end
+      
+    end
+    
+    
+
+    view_helper :popup_button_view, :wraps => :button_view do
+      parent_helper
+      property :menu, :key => :menuName
+      view 'SC.PopupButtonView'
+    end
+    
+    
+    
+    # Renders a back button
+    view_helper :back_button_view, :wraps => :button_view do
+      parent_helper :theme => :back
+    end
+
+    # Renders a checkbox.  If you pass a label this will render the label
+    # text next to the checkbox. Unlike button_view, passing no :label is
+    # the same as passing :label => false.
+    view_helper :checkbox_view, :wraps => :button_view do
+      opts = { :theme => :checkbox }
+      opts[:label] = false if options[:label].nil?
+      parent_helper(opts)
+      
+      # provide some defaults to the JavaScript.
+      property :behavior, :toggle, :key => 'buttonBehavior'
+      
+      # render checkbox HTML.
+
+      img_url = self.blank_url
+      @inner_html = [%(<img class="button" src="#{img_url}" />)]
+      @inner_html << %(<span #{@label_style}class="label">#{@label}</span>) if @label
+      @inner_html = @inner_html.join ''
+    end
+
+    # Renders a radio buton.  If you pass a label this will render the label
+    # text next to the checkbox. Unlike button_view, passing no :label is
+    # the same as passing :label => false.
+    view_helper :radio_view, :wraps => :button_view do
+      opts = { :theme => :radio }
+      opts[:label] = false if options[:label].nil?
+      parent_helper(opts)
+      
+      # provide some defaults to the JavaScript.
+      property :behavior, :on, :key => 'buttonBehavior'
+      
+      # render checkbox HTML.
+      img_url = self.blank_url
+      @inner_html = [%(<img class="button" src="#{img_url}" />)]
+      @inner_html << %(<span #{@label_style}class="label">#{@label}</span>) if @label
+      @inner_html = @inner_html.join ''
+    end
+   
+   
+    # This renders a group of radio buttons.  The buttons are controlled by
+    # a RadioGroupView that will map the value to a set of selection states.
+    #
+    # :values => [REQ]
+    #   Set this to the values you want displayed in the radio buttons. You
+    #   can pass an array here of strings or symbols, in which case these will
+    #   be used as the values for the buttons and the names will be created
+    #   from them.  Or you can pass an array of arrays.  The first items is
+    #   the key value, the second item is the human readable value. 
+    #   Alternatively, you can set the inner_html of your view to include
+    #   radio buttons as outlets.  In this case, you must name the outlets
+    #   :key_button.
+    #
+    # :layout => :horizontal | :vertical 
+    #   This will write out horizontal or vertical to the CSS class names so
+    #   you can control the layout of your radio buttons.
+    #
+    # :width  =>
+    #   This will set the width of each item in the view.
+    #
+    # BINDABLE OPTIONS
+    #
+    # :value =>
+    #   The current value of the radio buttons.
+    #
+    view_helper :radio_group_view do
+      
+      #JavaScript
+      property :value
+      view 'SC.RadioGroupView'
+      
+      # HTML
+
+      # get the layout mode.
+      var :layout, :vertical
+      css_class_names << 'radio' # default class
+      css_class_names << @layout if @layout
+      
+      var :tag, 'span'
+
+      # If a set of values was passed, build the button views automatically.
+      var :values
+      if @values
+        # Get the width styles out of the main style to put into the 
+        # individual radio items.
+        css_styles.flatten!
+        @label_styles = css_styles.reject { |p| !(p =~ /width:/) }
+        css_styles.reject! { |p| @label_styles.include?(p) }
+
+        if @label_styles.size > 0
+          @label_styles = %( style="#{@label_styles * ' '}" )
+        else
+          @label_styles = ''
+        end
+        
+        # save off client_builder.  The context this is run in later will 
+        # not retain the client_builder
+        current_client_builder = self.client_builder
+        html = @values.map do | v |
+          v = [v].flatten
+          key = v.first
+          label = (v.size > 1) ? v[1] : key.to_s.humanize
+          ViewHelpers::radio_view(:outlet => true, :label => label, :style => @label_styles, :toggle_on_value => key, :toggle_off_value => nil, :client => self.client_builder)
+        end
+        
+        @inner_html = html * "\n"
+      end
+    end
+
+    # def self.blank_url
+    #   cb = SproutCore::ClientBuilder.builder_for(:sproutcore)
+    #   if cb
+    #     img_url = cb.url_for('blank.gif') 
+    #   else
+    #     # if the sproutcore client cannot be found, give it a shot anyway...
+    #     img_url = '/static/sproutcore/en/blank.gif'
+    #   end
+    #   img_url
+    # end
+
+  end
+end

data/lib/sproutcore/view_helpers/core_views.rb

@@ -0,0 +1,284 @@
+############################################################
+# CORE VIEW HELPERS
+# These view helpers create simple views based on the options
+# you pass in.  More complex components can be found in the 
+# view_kit.
+
+module SproutCore
+  module ViewHelpers    
+
+    # Render an SC.View.  This is also the base for all other view helpers.
+    #
+    # :tag      the wrapper tag. default: 'div'
+    # :class    css class names. maybe a string or array.
+    # :panel    if true, view will display as a panel. default: false
+    # :visible  (bindable) if false, view will be hidden on page load. 
+    #           default: true
+    # :resize   resize option.  hash like this:
+    #           { :left => :flexible, :right => :fixed, :width => :fixed }
+    #
+    view_helper :view do
+      var :inner_html
+      var :tag, 'div'
+      var :panel, false
+      var :animate
+      var :resize
+      
+      # passing in :field is like passing in :outlet but it also adds a 
+      # property called fieldType
+      var :field
+      if @field
+        @outlet = "#{@field.to_s}_field"
+        property :field_key, @field.to_s.camelize(:lower), :constant => true
+      end
+      
+      attribute :title
+      
+      # these are some standard CSS attributes you might want to support
+      bind :visible, :key => 'isVisible'
+      property :modal,   :key => 'isModal'
+      property :custom_panel, :key => 'hasCustomPanelWrapper'
+      property :localize 
+      property :validator    
+      property :field_label 
+
+      # set panel type
+      var :panel
+      var :dialog
+      var :picker
+      pane_def = (@panel) ? 'panel' : (@dialog ? 'dialog' : (@picker ? 'picker' : nil))
+      if pane_def.nil?
+        property :pane, :key => 'paneType'
+      else
+        property :pane, pane_def, :key => 'paneType'
+      end
+    
+      # pass in a hash of properties and they will be added to the JS:
+      # :properties => { :prop_a => '1', :prop_b => '2' }
+      var :properties
+      if @properties
+        @properties.each { | k, v | property(k,v) { |b| b } }
+      end
+      
+      if @animate
+        property :visible_animation, '', :constant => true do
+          key_map = { 'complete' => 'onComplete' }
+          animation_values = @animate.map do | k,v |
+            normalized_key = k.to_s.downcase
+            unless ['complete'].include?(normalized_key)
+              v = prepare_for_javascript(v)
+            end
+            k = key_map[normalized_key] || k
+            "#{k}: #{v}"
+          end 
+          %({ #{ animation_values * ',' } })
+        end
+      end
+      
+      # autoresize options.
+      if @resize
+        property :resize_options, '', :constant => true do
+          resize_values = []
+          @resize.each do |k,v|
+            case v
+            when :fixed
+              v = 'SC.FIXED'
+            when :flexible
+              v = 'SC.FLEXIBLE'
+            else
+              v = nil
+            end
+            resize_values << %(#{k}: #{v}) unless v.nil?
+          end
+          %({ #{resize_values * ',' } })
+        end
+      end
+      
+      view('SC.View') { properties }
+  
+      # deal with css classnames and styles.
+      # Note that you can append either arrays or single strings or symbols 
+      # here.  When the class names and styles are combined the ary will be
+      # flattened
+      var :class, :key => :class_names
+      css_class_names << @class_names if @class_names
+      
+      var :style
+      css_styles << @style unless @style.nil?
+      
+      # Standard CSS attributes you can pass as attributes to standard view helpers.
+      common_css_keys = [:width, :height, :min_height, :max_height, :min_width, :max_width]
+      
+      common_css_keys.each do | key |
+        value = var key
+        if value
+          value = "#{value.to_i}px" if value.kind_of?(Numeric)
+          key = key.to_s.gsub('_','-')
+          css_styles << "#{key}: #{value};"
+        end
+      end
+
+      # render the basic content
+      content { (@tag == 'img') ? ot : %(#{ot}#{@inner_html}#{ct}) }
+      
+    end
+
+    # Render an SC.LabelView.  Inherits from SC.View
+    #
+    # :formatter    Name of a formatter.
+    # :localize     (bindable) localize string
+    # :escape_html  (bindable) escapeHTML property
+    view_helper :label_view do
+      property(:formatter) { |v| v }
+      property :localize,   false
+      property :escape_html, true, :key => 'escapeHTML'
+      
+      var      :label, nil
+      view     'SC.LabelView'
+      
+      @inner_html = @label unless @label.nil?
+    end
+
+    # Render an SC.SpinnerView. Inherits from SC.View. You should bind 
+    # :visible usually.
+    #
+    # :src        Set the src of the spinner img. Defaults to 
+    #             "/images/spinner.gif"
+    view_helper :spinner_view do
+      var :form, false
+      var :src, '/images/spinner.gif'
+
+      view 'SC.SpinnerView'
+      if @form
+        bind(:visible, ".owner.isCommitting", :key => 'isVisible') 
+        self.outlet = 'commitSpinner'
+      end
+      
+      unless @inner_html
+        @inner_html = %(<img src="#{@src}" />)
+      end
+      attribute :class, 'spinner'
+      
+    end
+    
+    # Renders an SC.ProgressView.  Includes the default HTML structure.
+    #
+    # :enabled        (bindable) isEnabled property
+    # :indeterminate  (bindable) isIndeterminate property
+    # :value          (bindable) default value - float
+    # :maximum        (bindable) maximum value - float
+    # :minimum        (bindable) minimum value - float
+    view_helper :progress_view do
+      property :enabled, :key => 'isEnabled'
+      property :indeterminate, :key => 'isIndeterminate'
+      property :value
+      property :maximum
+      property :minimum
+      view 'SC.ProgressView'
+      
+      attribute :class, 'progress outer'
+      unless @inner_html
+        @inner_html = <<EOF
+<div class="outer-head"></div>
+<div class="inner">
+  <div class="inner-head"></div>
+  <div class="inner-tail"></div>
+</div>
+<div class="outer-tail"></div>
+EOF
+      end
+    end
+      
+    view_helper :image_view do
+      view 'SC.ImageView'
+      property :content
+      
+      var :tag, 'img'
+    end
+    
+    view_helper :container_view do
+      view 'SC.ContainerView'
+      property :content
+    end
+    
+    view_helper :segmented_view do
+      property :value
+      property :selection, :key => 'value'
+      property :enabled, :key => 'isEnabled'
+      property :allows_empty_selection
+
+      # :segments should contains an array of symbols or a hash of
+      # key => name pairs to be used to render the segment. Or you can
+      # just create your own button views.
+      var :segments
+      var :theme, 'regular'
+      if @segments
+        @segments = [@segments].flatten unless @segments.instance_of?(Array)
+        result = []
+        first = true
+        while seg = @segments.shift
+          class_names = [@theme,'segment']
+          class_names << ((first) ? 'segment-left' : ((@segments.size == 0) ? 'segment-right' : 'segment-inner'))
+          first = false
+
+          seg = [seg].flatten
+          key = seg.first || ''
+          label = seg.size > 1 ? seg.last : key.to_s.humanize.split.map { |x| x.capitalize }.join(' ')
+          
+          result << ViewHelpers::button_view(:outlet => "#{key}_button", :label => label, :tag => 'a', :class => class_names )
+        end
+        @inner_html = result * ''
+      end
+      
+      view 'SC.SegmentedView'
+      css_class_names << 'segments'
+      
+    end
+    
+    # Renders an SC.TabView.  Name outlets you want flipped *_tab
+    # If you want, you can also pass a set of segments to be displayed
+    # above the tab view 
+    view_helper :tab_view do
+      var :segments
+      
+      property :now_showing
+      property :lazy_tabs
+      
+      view 'SC.TabView'
+      css_class_names << "tab"
+      
+      if @segments
+        # if this tab view has segments automatically  attached, add class
+        # name.
+        css_class_names << 'segmented' 
+        result = []
+        result << ViewHelpers::segmented_view(:outlet => :segmented_view, :segments => @segments, :bind => { :value => '*owner.nowShowing' })
+        result << ViewHelpers::view({:outlet => :root_view, :class => 'root'})
+        @inner_html = [(result * ""), %(<div style="display:none;">), (@inner_html || ''), %(</div>)] * ""
+      end
+        
+    end
+    
+    
+    # inside the collection view you should do
+    # <%= view :prototype => :example_view %>
+    view_helper :collection_view do
+      property :content
+      property :selection
+      property :toggle, :key => 'useToggleSelection'
+      property :selectable, :key => 'isSelectable'
+      property :enabled, :key => 'isEnabled'
+      property :act_on_select
+      property(:example_view) { |v| v }
+      property(:example_group_view) { |v| v }
+      
+      property(:group, :key => 'groupBy') do |v|
+        "['#{Array(v) * "','" }']"
+      end
+      
+      property(:action) { |v| "function(ev) { return #{v}(this, ev); }" }
+      view 'SC.CollectionView'
+    end
+    
+  end
+end