speedo 0.0.2 → 0.0.3

data/{README.rdoc → README.md}

@@ -1,4 +1,4 @@
-= Speedo
+# Speedo
 
 This is a layout gem intended as a backdrop for developing rails applications quickly. Its intention is to speed initial development, removing the need for (hopefully) any intensive front-end development until the app is functional (i.e. near completion). It provides the common tools CrankApps typically uses for front-end development.
 
@@ -8,19 +8,33 @@ There is a link in the footer ("How") to a page that contains many examples of t
 
 This project uses MIT-LICENSE.
 
-== Usage
+## Usage
 
 In your Gemfile:
 
-<tt>gem 'speedo'</tt>
+  gem 'speedo'
 
-== Inventory of plugins and gems:
-=== Gems
+Then run:
+
+  bundle install
+  rails generate speedo:install
+
+This will generate:
+* app/views/layouts/application.html.haml
+* app/assets/stylesheets/speedo.css.scss
+* app/assets/javascripts/swim.js.coffee
+* config/locales/speedo.en.yml
+
+It will also add Speedo to your application.css and application.js files.
+
+## Inventory of plugins and gems:
+
+### Gems
 * Haml
 * Haml-rails
 * Bourbon
 
-=== jQuery Plugins
+### jQuery Plugins
 * jQuery-UI
 * jQuery.autogrow
 * jQuery.autoSuggest
@@ -32,7 +46,7 @@ In your Gemfile:
 * jQuery.placeholder
 * jQuery.uniform
 
-=== Other Plugins
+### Other Plugins
 * Modernizr
 * Chosen
 * Respond

data/app/assets/javascripts/speedo.js

@@ -1,17 +1,3 @@
-// This is a manifest file that'll be compiled into application.js, which will include all the files
-// listed below.
-//
-// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
-// or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path.
-//
-// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
-// the compiled file.
-//
-// WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
-// GO AFTER THE REQUIRES BELOW.
-//
-//= require jquery
-//= require jquery_ujs
 //= require jquery-ui
 //= require chosen.jquery
 //= require jquery.autoSuggest
@@ -22,4 +8,4 @@
 //= require jquery.mousewheel-3.0.4.pack
 //= require jquery.placeholder.min
 //= require jquery.uniform
-//= require_tree .
+//= require swim

data/app/assets/stylesheets/{_style.scss → speedo.css.scss}

@@ -1,19 +1,53 @@
-#wrapper {
-  max-width: 964px;      /* Set the width of the page here, +4px for colmask box-shadow */
-  margin: 0 auto;
-  padding:0 2px 4px;     /* for colmask box-shadow */
-}
+/*
+ *= require normalize
+ *= require autoSuggest
+ *= require chosen
+ *= require gh-buttons
+ *= require jquery.dataTables
+ *= require jquery.fancybox-1.3.4
+ *= require jquery-ui-1.8.18.custom
+ *= require uniform.default
+*/
+
+@import "bourbon";
+
+
+/* Set colors here */
+$bg:      #ddd;     /* Background color (if not in web-app mode) */
+$text:    #333;     /* Standard text color */
+$link:    #0090d5;
+$visited: #17639b;
+/* Pastels */
+$bggreen: #e3fde4;
+$bgblue:  #bcf;
+$bgyellow:#ffc;
+$bgred:   #f99;
+/* Column background colors */
+$maincolbg: #fff;
+$leftcolbg: #f6f6f6;
+$rightcolbg: #fafafa;
+
+
+
+/* See the bottom half of this file for layout options */
+
+
 
 /* Base Styles - Set HTML element styles here */
 body {
-  background: #ddd; 
+  color: $text;
+  background: $bg;
+  font-size:12px;
+  line-height:1.231;
 }
 a, a:visited, .link  { 
-  color: #0090d5; 
+  color: $link; 
   text-decoration: none;
   cursor:pointer;
 }
-a:hover, .link:hover { color: #17639b; }
+a:hover, .link:hover {
+  color: $visited;
+}
 ul, ol {
   margin: 0;
   padding: 0;
@@ -21,23 +55,14 @@ ul, ol {
     list-style: none;
   }
 }
-h1,h2,h3,h4,h5,h6 {
-  margin:10px 0 0.5em;
+h1,h3,h5 {
   font-weight:normal;
   font-weight:200;
 }
-h1    {font-size:2em;}
-h2,h3 {font-size:1.5em;}
-h4,h5 {font-size:1.2em;}
-h6    {font-size:1em;}
-h2,h4,h6{font-weight:normal;}
-footer {
-  position:relative;
-  margin:-1.8em 10px 0 0; // So it appears at the bottom of the right column
-  float: right;
-  font-size: 0.8em;
-  opacity:0.5;
+h2,h4,h6{
+  font-weight:normal;
 }
+
 input:not(.button), textarea {
   border:1px solid #999;
   @include border-radius(3px);
@@ -51,6 +76,7 @@ input:not(.button), textarea {
 
 
 
+
 /* Basic styles */
 .no-js body {
   margin-top:30px;
@@ -134,6 +160,37 @@ input:not(.button), textarea {
     color:#900;
   }
 }
+footer {
+  position:relative;
+  margin:-1.8em 10px 0 0;   /* So it appears at the bottom of the right column and is not lost in web-app mode */
+  float: right;
+  font-size: 0.8em;
+  opacity:0.5;
+}
+
+
+
+/* Plugin fixes */
+.dataTables_wrapper {
+  @include clearfix;
+}
+div.selector, div.uploader {
+  margin-left:-2px;         /* Left aligns the uniform masks, but be careful if they're inline */
+}
+ul.as-selections {
+  border:1px solid #999;
+  @include border-radius(3px);
+  padding:5px;
+  @include box-shadow(inset 0 1px 1px rgba(0,0,0,0.2));
+  li.as-original input {
+    @include box-shadow(none);
+    color:#999; /* For the placeholder colour */
+    &:focus {color:inherit;}
+  }
+}
+.button-group, .button {
+  vertical-align:top;
+}
 /* Fancybox Popups */
 .popups {
   display:none;
@@ -161,27 +218,6 @@ input:not(.button), textarea {
   }
 }
 
-/* Plugin fixes */
-.dataTables_wrapper {
-  @include clearfix;
-}
-div.selector, div.uploader {
-  margin-left:-2px;
-}
-ul.as-selections {
-  border:1px solid #999;
-  @include border-radius(3px);
-  padding:5px;
-  @include box-shadow(inset 0 1px 1px rgba(0,0,0,0.2));
-  li.as-original input {
-    @include box-shadow(none);
-    color:#999; /* For the placeholder colour */
-    &:focus {color:inherit;}
-  }
-}
-.button-group, .button {
-  vertical-align:top;
-}
 
 
 /* =============================================================================
@@ -209,7 +245,7 @@ ul.as-selections {
 /* Contain floats: nicolasgallagher.com/micro-clearfix-hack/ */ 
 .clearfix:before, .clearfix:after { content: ""; display: table; }
 .clearfix:after { clear: both; }
-.clearfix { zoom: 1; }
+.clearfix { *zoom: 1; }
 
 /* Float and clear */
 .left { float: left; }
@@ -217,7 +253,7 @@ ul.as-selections {
 .clear { clear: both; }
 
 /* Inline-block */
-.ib { display:inline-block; zoom:1; *display:inline; }
+.ib { display:inline-block; *zoom:1; *display:inline; }
 
 
 
@@ -260,20 +296,24 @@ ul.as-selections {
 
 
 
-/* Column Layout */
 /* 
+  Column Layout
+  =============
   This layout is designed for mobile-first, so that the 'side' columns go below the main 
   content on narrower screen-widths.
-  Most of the styles that will be seen by the typical browser (i.e. the 960 design) are 
-  in the @media queries below.
-  Set the column background colours using the variables for consistent column colouration.
+  
+  IMPORTANT: Most of the styles that will be seen by the typical browser (i.e. the 960 design) 
+  are in the @media queries below.
+  
+  Set the column background colours using the variables (top of file) for consistent 
+  column colouration.
 */
 
-
-/* Column background colors */
-$maincolbg: #fff;
-$leftcolbg: #f6f6f6;
-$rightcolbg: #fafafa;
+#wrapper {
+  max-width: 964px;      /* Set the width of the page here, +4px for colmask box-shadow */
+  padding:0 2px 4px;     /* (for colmask box-shadow) */
+  margin: 0 auto;
+}
 
 /* Layout for mobile < 480px width screens (see below for media queries) */
 .colmask {
@@ -472,4 +512,4 @@ $rightcolbg: #fafafa;
     width:100%;
   }
   /* */
-}
+}

data/app/controllers/speedo/home_controller.rb

@@ -1,6 +1,4 @@
 module Speedo
   class HomeController < ApplicationController
-    def index; end
-    def how; end
   end
 end

data/app/views/layouts/speedo/application.html.haml

@@ -0,0 +1,66 @@
+!!!
+!= cc_html(:class => "no-js", :lang => 'en') do
+  %head
+    %meta{:charset => "utf-8"}
+    %meta{:content => "", :name => "author"}
+    %meta{:content => "", :name => "description"}
+    %meta{:content => "IE=edge,chrome=1", "http-equiv" => "X-UA-Compatible"}
+    %meta{:content => "width=device-width, initial-scale=1.0", :name => "viewport"}
+    -#%link{:href => '#insert-web-fonts-here', :rel => 'stylesheet', :type => 'text/css'}
+    = csrf_meta_tags
+
+    %title
+      = t "app_name"
+      = yield :page_title
+    
+    = javascript_include_tag 'modernizr.min.js'
+    = javascript_include_tag 'respond.js'
+    = stylesheet_link_tag :application
+    = javascript_include_tag :application
+    = yield :head
+
+  %body
+    %noscript#noscript_warning This site works best with JavaScript enabled. Some features may not be available
+    #wrapper
+      %header.branding.clearfix
+        = link_to image_tag('speedo/logo.png'), root_url, :class => 'logo'
+
+        .user
+          = link_to "current_user.name", "account_url", class: "user_name"
+          |
+          = link_to 'Logout', "destroy_user_session_url", class: "user_logout"
+
+      %nav.main_nav.clearfix
+        %form.right.search
+          %input{:type => "search", :name => "search[name]", :placeholder => "Search", :results => 5, :autosave => "site_search"}
+
+        = link_to "Home", root_url, {:class => "active home"}
+        = link_to "Section1", root_url
+        = link_to "Section2", root_url
+        = link_to "Section3", root_url
+        = link_to "Section4", root_url
+
+
+      - if flash[:success]
+        .flash.success= flash[:success]
+      - if flash[:notice]
+        .flash.notice= flash[:notice]
+      - if flash[:alert]
+        .flash.alert= flash[:alert]
+      - if flash[:error]
+        .flash.error= flash[:error]
+      .colmask{:class => @col_layout || @col_layout = "leftcol"} 
+        -# options: leftcol, rightcol, threecol, onecol
+        .colmid
+          .colleft
+            .col1
+              = yield
+            .col2
+              = yield :left_col
+            .col3
+              = yield :right_col
+      %footer
+        Copyright © 
+        = Time.now.year 
+        = link_to "CrankApps", "http://www.crankapps.com", :target => "_blank"
+

data/config/routes.rb

@@ -1,4 +1,4 @@
 Speedo::Engine.routes.draw do
-  get '/how', :to => 'home#how'
-  root :to => 'home#index'
+  get '/examples', :to => 'home#examples'
+  root :to => 'home#examples'
 end

data/lib/generators/speedo/install_generator.rb

@@ -0,0 +1,71 @@
+module Speedo
+  module Generators
+    class InstallGenerator < Rails::Generators::Base
+      source_root File.expand_path("../../../../", __FILE__)
+
+      desc "Installs Speedo files to get you going fast."
+      
+      # app/views/layouts/application.html.haml
+      def layout
+        if yes? "Do you want to replace the application layout? [yN]"
+          template 'app/views/layouts/speedo/application.html.haml', 
+                   'app/views/layouts/application.html.haml'
+          remove_file 'app/views/layouts/application.html.erb'
+        end
+      end
+
+      # app/assets/stylesheets/speedo.css.scss
+      def copy_stylesheet
+        template 'app/assets/stylesheets/speedo.css.scss', 
+                 'app/assets/stylesheets/speedo.css.scss'
+      end
+
+      def alter_application_css
+        if_file 'app/assets/stylesheets/application.css' do |path|
+          unless File.read(path).match /require speedo/
+            inject_into_file path, after: '*= require_self' do
+              "\n *= require speedo"
+            end
+          end
+        end
+      end
+
+      # app/assets/javascripts/swim.js.coffee
+      def javascript
+        template 'app/assets/javascripts/swim.js.coffee', 
+                 'app/assets/javascripts/swim.js.coffee'
+      end
+
+      def alter_application_js
+        if_file 'app/assets/javascripts/application.js' do |path|
+          unless File.read(path).match /require speedo/
+            inject_into_file path, before: '//= require_tree .' do
+              "//= require speedo\n"
+            end
+          end
+        end
+      end
+      
+      # config/locales/speedo.en.yml
+      def locales
+        template 'config/locales/speedo.en.yml', 
+                 'config/locales/speedo.en.yml'
+      end
+
+      def routes
+        route 'mount Speedo::Engine => "/speedo"'
+      end
+
+      private
+
+      def if_file path
+        if File.exist? path
+          yield path
+        else
+          say "#{path} not found. Please manually require speedo."
+        end
+      end
+
+    end
+  end
+end

data/{app/helpers → lib}/speedo/layout_helper.rb

@@ -16,3 +16,5 @@ module Speedo
     end
   end
 end
+
+ActionView::Base.send :include, Speedo::LayoutHelper

data/lib/speedo/version.rb

@@ -1,3 +1,3 @@
 module Speedo
-  VERSION = "0.0.2"
+  VERSION = "0.0.3"
 end

data/lib/speedo.rb

@@ -1,5 +1,6 @@
 require "speedo/engine"
 require 'speedo/sass'
+require 'speedo/layout_helper'
 require 'haml'
 require 'coffee-script'
 

data/test/dummy/app/views/layouts/application.haml

@@ -5,7 +5,6 @@
     %noscript#noscript_warning This site works best with JavaScript enabled. Some features may not be available
     #wrapper
       = render 'shared/header'
-      = render 'shared/nav_flash'
       .colmask{:class => @col_layout || @col_layout = "leftcol"} 
         -# options: leftcol, rightcol, threecol, onecol
         .colmid