motion-pixate 1.0 → 1.2

data/README.md

@@ -11,7 +11,7 @@ Pixate gem for RubyMotion.
 
 ## Setup
 
-1. Download the Pixate Framework package from http://www.pixate.com/ and copy the `PXEngine.framework` folder into `vendor` directory. Create the `vendor` directory if it does not exist. You should have something like this.
+1. Download the Pixate Framework package from http://www.pixate.com/ and copy the `PXEngine.framework` folder into `vendor` directory (or alternatively just create a symbolic link). Create the `vendor` directory if it does not exist. You should have something like this.
 ```
 $ ls vendor/PXEngine.framework
 /Headers/   PXEngine   Resources/ Versions/
@@ -23,7 +23,7 @@ require 'rubygems'
 require 'motion-pixate'
 ```
 
-3. Still in the `Rakefile`, set up the `user`, `key` and `framework` variables in your application configuration block.
+3. Still in the `Rakefile`, set up the `user`, `key` and `framework` variables in your application configuration block. For the **free** version of the Pixate Engine, `user` and `key` are **not** required.
 ```ruby
 Motion::Project::App.setup do |app|
   # ...
@@ -35,8 +35,69 @@ end
 
 4. Create the `default.css` in `resources` directory.
 
+Note: To install the motion-pixate gem, see the [RubyGems site](https://rubygems.org/gems/motion-pixate).
 
-## Usage
+## Example
+
+We'll take the Timer example that comes with RubyMotion and add Pixate and quickly style the application. Start by following the Setup steps above to add Pixate to the Timer project.
+
+Type `rake` to make sure everything is good so far. You should see the Timer app running.
+
+![Timer](https://raw.github.com/Pixate/RubyMotion-Pixate/master/Screenshots/timer_run.png)
+
+## Add the CSS File
+
+In the `default.css` file you added prior, let's add a simple entry:
+
+```css
+	button {
+		background-color: red;
+	}
+```
+
+`Rake` again and you should see this:
+
+![Red Button](https://raw.github.com/Pixate/RubyMotion-Pixate/master/Screenshots/red_button.png)
+
+Let's pretty this button up with the following CSS:
+
+```css
+	button {
+		color            : #446620;
+		background-color : linear-gradient(#87c44a, #b4da77);
+		border-width     : 1px;
+		border-color     : #84a254;
+		border-radius    : 10px;
+		font-size        : 15px;
+		font-weight      : bold;
+	}
+```	
+
+`Rake` again and you should see this:
+
+![Green Button](https://raw.github.com/Pixate/RubyMotion-Pixate/master/Screenshots/green_button.png)
+
+## Add a Styling ID
+
+Lastly, let's change the background color. Let's add an ID to our background view. In the `timer_controller.rb` file, add the following line before the `end` of `viewDidLoad`:
+
+```css
+	view.styleId = 'myView'
+```
+
+What's we've done here is add a `styleId` to the view so we can style it by name. Now add the following CSS after your button CSS that was already added:
+
+```css
+	#myView {
+		background-color: linear-gradient(#000000, #f2f4f6);
+	}
+```
+
+Now you have a beautiful interface with just a few lines of CSS!
+
+![Final App](https://raw.github.com/Pixate/RubyMotion-Pixate/master/Screenshots/background_view.png)
+
+## SASS
 
 Pixate gem supports [Sass](http://sass-lang.com/) to generate the stylesheet. Create the `sass` directory and `default.scss` with the `rake pixate:init` command. Then, `rake pixate:sass` command generates the stylesheet from `default.scss`.
 
@@ -47,6 +108,8 @@ $ rake pixate:sass style=compressed
 
 You could use `nested`, `expanded`, `compact` and `compressed` as output style.
 
+## REPL
+
 Pixate gem provides "style" method in REPL. You could change the stylesheet at the moment in REPL. For example,
 ```
 (main)> style "button { color : blue; }"

data/lib/motion/project/pixate.rb

@@ -21,18 +21,18 @@ class PixateConfig
   private
 
   def create_code
-    unless @user && @key
-      raise "Need to configure `app.pixate.user' and `app.pixate.key' variables"
+    license = ""
+    if @user && @key
+      license = "PXEngine.licenseKey('#{@key}', forUser:'#{@user}')\n"
     end
 
     code = <<EOF
 # This file is automatically generated. Do not edit.
 
-PXEngine.licenseKey('#{@key}', forUser:'#{@user}')
-
+#{license}
 def style(str)
-  PXStylesheet.styleSheetFromSource(str, withOrigin:0)
-  PXStylesheet.applyStylesheets
+  PXEngine.styleSheetFromSource(str, withOrigin:0)
+  PXEngine.applyStylesheets
 end
 EOF
     pixate_file = './app/pixate_code.rb'

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: motion-pixate
 version: !ruby/object:Gem::Version
-  version: '1.0'
+  version: '1.2'
   prerelease: 
 platform: ruby
 authors:
@@ -10,7 +10,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-01-03 00:00:00.000000000 Z
+date: 2013-02-09 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass
@@ -36,12 +36,9 @@ executables: []
 extensions: []
 extra_rdoc_files: []
 files:
-- .gitignore
 - README.md
-- Rakefile
-- lib/motion-pixate.rb
 - lib/motion/project/pixate.rb
-- motion-pixate.gemspec
+- lib/motion-pixate.rb
 homepage: https://github.com/Pixate/RubyMotion-Pixate
 licenses: []
 post_install_message: 

data/.gitignore

@@ -1,18 +0,0 @@
-*.gem
-*.rbc
-.bundle
-.config
-coverage
-InstalledFiles
-lib/bundler/man
-pkg
-rdoc
-spec/reports
-test/tmp
-test/version_tmp
-tmp
-
-# YARD artifacts
-.yardoc
-_yardoc
-doc/

data/Rakefile

@@ -1 +0,0 @@
-require "bundler/gem_tasks"

data/motion-pixate.gemspec

@@ -1,19 +0,0 @@
-# -*- encoding: utf-8 -*-
-Version = "1.0"
-
-Gem::Specification.new do |gem|
-  gem.name          = "motion-pixate"
-  gem.version       = Version
-  gem.authors       = ['Paul Colton', 'Shizuo Fujita']
-  gem.email         = ['paul@pixate.com', 'watson1978@gmail.com']
-  gem.description   = 'Pixate integration for RubyMotion projects'
-  gem.summary       = 'motion-pixate allows RubyMotion projects to easily embed the Pixate Framework.'
-  gem.homepage      = 'https://github.com/Pixate/RubyMotion-Pixate'
-
-  gem.files         = `git ls-files`.split($/)
-  gem.executables   = gem.files.grep(%r{^bin/}).map{ |f| File.basename(f) }
-  gem.test_files    = gem.files.grep(%r{^(test|spec|features)/})
-  gem.require_paths = ["lib"]
-
-  gem.add_dependency 'sass'
-end