Initial commit

app/app_delegate.rb

@@ -0,0 +1,11 @@
+class AppDelegate
+  def application(application, didFinishLaunchingWithOptions:launchOptions)
+    @window = UIWindow.alloc.initWithFrame(UIScreen.mainScreen.bounds)
+
+    main_controller = MainController.alloc.initWithNibName(nil, bundle: nil)
+    @window.rootViewController = main_controller
+
+    @window.makeKeyAndVisible
+    true
+  end
+end

app/controllers/main_controller.rb

@@ -0,0 +1,175 @@
+class MainController < UIViewController
+
+  def viewDidLoad
+    super
+
+    rmq.stylesheet = MainStylesheet
+    rmq(self.view).apply_style :root_view
+
+    @title_label = rmq.append(UILabel, :title_label).get
+
+    rmq.append UIImageView, :logo
+
+    rmq.append(UIButton, :make_labels_blink).on(:tap) do |sender|
+      rmq(UILabel).animations.blink
+    end
+
+    rmq.append(UIButton.buttonWithType(UIButtonTypeRoundedRect), :make_buttons_throb).on(:tap) do |sender|
+      rmq(UIButton).not(sender).animations.throb
+    end
+
+    init_animation_button
+    init_section
+    init_benchmark_section
+  end
+
+  # This is if you are supporting multiple orientations
+  def supportedInterfaceOrientations
+    UIInterfaceOrientationMaskAll
+  end
+
+  # This is if you are supporting multiple orientations
+  def willAnimateRotationToInterfaceOrientation(orientation, duration: duration)
+    rmq.all.reapply_styles
+
+    # You don't have to reapply styles to all UIViews, if you want to optimize, 
+    # another way to do it is tag the views you need to restyle in your stylesheet, 
+    # then only reapply the tagged views, like so:
+    #
+    # def logo(st)
+    #    st.frame = {t: 10, w: 200, h: 96}
+    #    st.centered = :horizontal
+    #    st.image = image.resource('logo')
+    #    st.tag(:reapply_style)
+    #  end
+    #
+    # Then here in willAnimateRotationToInterfaceOrientation
+    #  rmq(:reapply_style).reapply_styles
+  end
+
+  def init_animation_button
+
+    rmq.append(UIButton, :animate_move).on(:tap) do |sender|
+      rmq(sender).animate( duration: 0.5, animations: -> (rmq) {
+        # You really should create a new style in the stylesheet, 
+        # but you can do it inline too, like so
+        rmq.style do |sv|
+          sv.top = rand(rmq.device.height) 
+          sv.scale = 10.0
+        end
+      },
+      completion: -> (did_finish, rmq) {
+        rmq.animate( duration: 0.2, animations: -> (rmq) {
+            rmq.style do |sv|
+              sv.scale = 1.0
+              sv.top = 180 
+            end
+          })
+      })
+    end
+    
+  end
+
+  def init_section
+
+    rmq.append(UIView, :section).tap do |section|
+      section.append(UILabel, :section_title)
+
+      section.append(UILabel, :section_enabled_title)
+
+      section.append(UISwitch, :section_enabled).on(:change) do |sender|
+        style = sender.isOn ? :section_button_enabled : :section_button_disabled
+        buttons = rmq(sender).parent.find(UIButton).apply_style(style)
+      end
+
+      section.append(UIButton, :start_spinner).on(:tap) do |sender|
+        rmq.animations.start_spinner
+      end
+
+      section.append(UIButton, :stop_spinner).on(:tap) do |sender|
+        rmq.animations.stop_spinner
+      end
+    end
+    
+  end
+
+  def init_benchmark_section
+    
+    rmq.append(UIButton, :run_benchmarks).on(:touch_down) do |sender|
+
+      rmq(sender).apply_style(:run_benchmarks_disabled)
+      rmq.animations.start_spinner
+
+      rmq.append(UIView, :overlay).animations.fade_in.on(:tap) do |sender|
+        rmq.find(:benchmarks_results_label, :benchmarks_results_wrapper, sender).hide.remove
+      end
+
+    end.on(:touch_up) do |sender|
+
+      rmq.append(UILabel, :benchmarks_results_wrapper).tap do |o|
+        o.animations.fade_in
+        o.append(UILabel, :benchmarks_results_label).get.text = self.benchmark
+      end
+
+      rmq(sender).apply_style(:run_benchmarks)
+      rmq.animations.stop_spinner
+
+    end
+
+  end
+
+  def benchmark
+    # This compares setting attributes directly, or using
+    # rmq's stylesheets
+    #
+    # (A)
+    # o.hidden = false
+    # o.text = 'foo'
+    # o.color = UIColor.whiteColor
+    # o.frame.origin.x = 10
+    #
+    # (B)
+    # def benchmark(sv)
+    #   sv.hidden = false
+    #   sv.text = 'foo'
+    #   sv.color = color.white
+    #   sv.left = 10
+    # end
+
+    o = @title_label
+    num_runs = 5000
+
+    out = ''
+
+    start = (Time.now.to_f * 1000.0)
+    0.upto(num_runs) do |i|
+      o.hidden = false
+      o.text = 'foo'
+      o.color = UIColor.whiteColor
+      o.frame.origin.x = 10
+    end
+    now = (Time.now.to_f * 1000.0)
+    a_delta = now - start
+    out << "A #{start} - #{now}\ntime: #{a_delta}ms  #{(a_delta / 1000)}s\n\n"
+    
+    start = (Time.now.to_f * 1000.0)
+    0.upto(num_runs) do |i|
+      rmq(o).apply_style(:benchmark)
+    end
+
+    now = (Time.now.to_f * 1000.0)
+    b_delta = now - start
+    out << "B #{start} - #{now}\ntime: #{b_delta}ms  #{(b_delta / 1000)}s\n\n"
+
+    out << if b_delta < a_delta
+      "B is #{((a_delta / b_delta) * 100) - 100}% faster than A"
+    else
+      "A is #{((b_delta / a_delta) * 100) - 100}% faster than B"
+    end
+
+    rmq(o).apply_style(:title_label)
+
+    out
+  end
+end
+

app/stylers/ui_button_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UIButtonStyler < UIControlStyler 
+
+      # Your custom styler methods here
+
+    end
+  end
+end

app/stylers/ui_control_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UIControlStyler < UIViewStyler 
+
+      # Your custom styler methods here
+
+    end
+  end
+end

app/stylers/ui_date_picker_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UIDatePickerStyler < UIControlStyler 
+
+      # Your custom styler methods here
+
+    end
+  end
+end

app/stylers/ui_image_view_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UIImageViewStyler < UIViewStyler 
+
+      # Your custom styler methods here
+
+    end
+  end
+end

app/stylers/ui_label_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UILabelStyler < UIViewStyler 
+
+      # Your custom styler methods here
+
+    end
+  end
+end

app/stylers/ui_navigation_bar_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UINavigationBarStyler < UIViewStyler 
+
+      # Your custom styler methods here
+
+    end
+  end
+end

app/stylers/ui_page_control_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UIPageControlStyler < UIControlStyler 
+
+      # Your custom styler methods here
+
+    end
+  end
+end

app/stylers/ui_refresh_control_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UIRefreshControlStyler < UIControlStyler 
+
+      # Your custom styler methods here
+
+    end
+  end
+end

app/stylers/ui_scroll_view_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UIScrollViewStyler < UIViewStyler 
+
+      # Your custom styler methods here
+
+    end
+  end
+end

app/stylers/ui_segmented_control_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UISegmentedControlStyler < UIControlStyler 
+
+      # Your custom styler methods here
+
+    end
+  end
+end

app/stylers/ui_slider_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UISliderStyler < UIControlStyler 
+
+      # Your custom styler methods here
+
+    end
+  end
+end

app/stylers/ui_stepper_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UIStepperStyler < UIControlStyler 
+
+      # Your custom styler methods here
+
+    end
+  end
+end

app/stylers/ui_switch_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UISwitchStyler < UIControlStyler 
+
+      # Your custom styler methods here
+
+    end
+  end
+end

app/stylers/ui_tab_bar_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UITabBarStyler < UIViewStyler 
+
+      # Your custom styler methods here
+ 
+    end
+  end
+end

app/stylers/ui_table_view_cell_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UITableViewCellStyler < UIViewStyler 
+
+      # Your custom styler methods here
+ 
+    end
+  end
+end

app/stylers/ui_table_view_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UITableViewStyler < UIScrollViewStyler 
+
+      # Your custom styler methods here
+ 
+    end
+  end
+end

app/stylers/ui_text_field_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UITextFieldStyler < UIControlStyler 
+
+      # Your custom styler methods here
+ 
+    end
+  end
+end

app/stylers/ui_text_view_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UITextViewStyler < UIViewStyler 
+
+      # Your custom styler methods here
+ 
+    end
+  end
+end

app/stylers/ui_view_styler.rb

@@ -0,0 +1,9 @@
+module RubyMotionQuery
+  module Stylers
+    class UIViewStyler 
+
+      # Your custom styler methods here
+ 
+    end
+  end
+end

app/stylesheets/application_stylesheet.rb

@@ -0,0 +1,18 @@
+class ApplicationStylesheet < RubyMotionQuery::Stylesheet
+  PADDING = 10
+
+  def application_setup
+    font_family = 'Helvetica Neue'
+    font.add_named :large,    font_family, 36
+    font.add_named :medium,   font_family, 24
+    font.add_named :small,    font_family, 18 
+
+    color.add_named :translucent_black, color.from_rgba(0, 0, 0, 0.4) 
+    color.add_named :battleship_gray,   '#7F7F7F' 
+  end
+
+  def label(st)
+    st.background_color = color.clear
+  end
+
+end

app/stylesheets/main_stylesheet.rb

@@ -0,0 +1,192 @@
+class MainStylesheet < ApplicationStylesheet
+  def setup
+    # Add sytlesheet specific setup stuff here.
+    # Add application specific setup stuff in application_stylesheet.rb
+  end
+
+  def root_view(st)
+    st.background_color = color.white
+  end
+
+  def logo(st)
+    st.frame = {t: 10, w: 200, h: 96}
+    st.centered = :horizontal
+    st.image = image.resource('logo')
+  end
+
+  def title_label(st)
+    label st # stack styles
+    st.frame = {l: PADDING, t: 120, w: 200, h: 20}
+    st.text = 'Test label'
+    st.color = color.from_rgba(34, 132, 198, 1.0)
+    st.font = font.medium
+  end
+
+  def make_labels_blink(st)
+    st.frame = {t: 120, w: 150, h: 20}
+    st.from_right = PADDING
+
+    # ipad? (and landscape?, etc) is just a convenience methods for
+    # rmq.device.ipad?
+
+    # Here is a complete example of different formatting for orientatinos
+    # and devices
+    #  if ipad?
+    #    if landscape?
+    #      st.frame = {l: 20, t: 120, w: 150, h: four_inch? ? 20 : 30}
+    #    else
+    #      st.frame = {l: 90, t: 120, w: 150, h: four_inch? ? 25 : 35}
+    #    end
+    #  else
+    #    if landscape?
+    #      st.frame = {l: 20, t: 20, w: 150, h: four_inch? ? 22 : 32}
+    #    else
+    #      st.frame = {l: 90, t: 20, w: 150, h: four_inch? ? 30 : 40}
+    #    end
+    #  end
+
+    # If you don't want something to be reapplied during orientation
+    # changes (assuming you're reapplying durring orientation changes
+    # in your controller, it's not automatic)
+    unless st.view_has_been_styled?
+      st.text = 'Blink labels'
+      st.font = font.system(10)
+      st.color = color.white
+      st.background_color = color.from_hex('ed1160')
+    end
+  end
+
+  def make_buttons_throb(st)
+    st.frame = {t: 150, w: 150, h: 20}
+    st.from_right = PADDING
+    st.text = 'Throb buttons'
+    st.color = color.black
+  end
+
+  def section(st)
+    st.frame = {w: 270, h: 110}
+
+    if landscape? && iphone?
+      st.left = PADDING
+    else
+      st.centered = :horizontal
+    end
+
+    st.from_bottom = PADDING
+
+    st.z_position = 1
+    st.background_color = color.battleship_gray
+  end
+
+  def section_label(st)
+    label st
+    st.color = color.white
+  end
+
+  def section_title(st)
+    section_label st
+    st.frame = {l: PADDING, t: PADDING, w: 150, h: 20}
+    st.text = 'Section title'
+  end
+
+  def section_enabled(st)
+    label st
+    st.frame = {l: PADDING, t: 30}
+    st.on = true
+  end
+
+  def section_enabled_title(st)
+    section_label st
+    st.frame = {l: 93, t: 34, w: 150, h: 20}
+    st.text = 'Enabled'
+  end
+
+  def section_buttons(st)
+    st.frame = {l: PADDING, t: 64, w: 120, h: 40}
+    st.background_color = color.black
+    section_button_enabled st
+  end
+
+  def start_spinner(st)
+    section_buttons st
+    st.text = 'Start spinner'
+  end
+
+  def stop_spinner(st)
+    section_buttons st
+    st.from_right = PADDING
+    st.text = 'Stop spinner'
+  end
+
+  def section_button_disabled(st)
+    st.enabled = false
+    st.color = color.dark_gray
+  end
+
+  def section_button_enabled(st)
+    st.enabled = true
+    st.color = color.white
+  end
+
+  def animate_move(st)
+    st.scale = 1.0
+    st.frame = {t: 180, w: 150, h: 20}
+    st.from_right = PADDING
+    st.text = 'Animate move and scale'
+    st.font = font.system(10)
+    st.color = color.white
+    st.background_color = color.from_hex('ed1160')
+    st.z_position = 99
+    st.color = color.white
+  end
+
+  def overlay(st)
+    st.frame = :full 
+    st.background_color = color.translucent_black
+    st.hidden = true
+    st.z_position = 99
+  end
+
+  def benchmarks_results_wrapper(st)
+    st.hidden = true
+    st.frame = {w: app_width - 20, h: 120}
+    st.centered = :both
+    st.background_color = color.white
+    st.z_position = 100
+  end
+
+  def benchmarks_results_label(st)
+    label st
+    st.padded = {l: 10, t: 10, b:10, r: 10}
+    st.text_alignment = :left
+    st.color = color.black
+    st.font = font.system(10)
+
+    # If the styler doesn't have the method, you can add it or
+    # just use st.view to get the actual object
+    st.view.numberOfLines = 0
+    st.view.lineBreakMode = NSLineBreakByWordWrapping
+  end
+
+  def run_benchmarks(st)
+    st.frame = {l: PADDING, t: 150, w: 130, h: 20}
+    st.text = 'Run benchmarks'
+    st.font = font.system(11)
+    st.color = color.white
+    st.enabled = true
+    st.background_color = color.from_hex('faa619')
+  end
+
+  def run_benchmarks_disabled(st)
+    st.enabled = false
+    st.color = color.from_hex('de8714')
+  end
+
+  def benchmark(st)
+    st.hidden = false
+    st.text = 'foo'
+    st.color = color.white
+    st.left = 10
+  end
+
+end