coolstrap-generator 0.1.0

data/lib/coolstrap-generator/templates/app/components/formelements.html.haml

@@ -0,0 +1,196 @@
+= content_for :title do
+  Form Elements Demo
+
+= content_for :application_styles do 
+  = stylesheet_link_tag "themes/coolstrap"
+  %link{:href => "assets/stylesheets/customtheme.css", :rel => "stylesheet", :type => "text/css"}
+  
+= content_for :principal do
+  %div.a{"role" => "main"}
+
+    %header
+      %a{:href => "listview.html"} Lists
+      %hgroup
+        %h1 COOLSTRAP
+        %h2 Form Elements Demo
+      %a Entrar
+    %footer
+      %a Button
+      %a Button
+      %a Button
+      %a Button
+      %a Button  
+
+    %section.current
+      %nav{"data-type" => "toolbar"}
+        %input{:type => "text"}
+        %a search
+
+
+      %article.scrollable
+          
+        %h1 Radio y checkbox
+        %form.inset
+          
+          .content.horizontal
+            %p 0:00
+            .slider
+              .progress
+                .circle.mini
+            %p -30:35  
+          .content.horizontal
+            .slider
+              .progress
+                .circle
+          .content
+            %label 
+              %input{:type => "checkbox"}  
+              Atun palta
+          .content
+            %label 
+              %input{:type => "checkbox"}  
+              Atun palta    
+        
+          .content
+            %label 
+              %input{:type => "radio", :name => "radio"}  
+              Atun palta
+          .content
+            %label 
+              %input{:type => "radio", :name => "radio"}  
+              Atun palta
+
+        %h1 horizontales      
+        %form.inset
+          .content.horizontal
+            %label 
+              %input{:type => "radio", :name => "radio"}  
+              Atun palta
+          .content.horizontal
+            %label 
+              %input{:type => "radio", :name => "radio"}  
+              Riquitiqui          
+
+          
+
+        %form.inset
+          .content.horizontal
+            %label 
+              %input{:type => "checkbox"}  
+              Prueba
+          .content.horizontal
+            %label 
+              %input{:type => "checkbox"}  
+              Atun palta
+          .content.horizontal
+            %label 
+              Marque si le gusta la gasolina          
+            .toggle-content
+              %input.toggle-switch{:type => "checkbox"}  
+              %label               
+            
+        
+
+        %h1 Con porcentajes    
+        %form.inset  
+          .content.horizontal
+            .aside 
+              %i.icon-phone-sign
+            %input{:type => "tel"}
+          .content.horizontal
+            .aside Name
+            %input{:type => "text"}  
+          .content.horizontal
+            .aside Phone
+            %input{:type => "text"}  
+          .content.horizontal
+            .aside Larger Adress
+            %input{:type => "text"}  
+          .content.horizontal.start
+            .aside Tomatican con pollo y mermelada de palta
+            %input{:type => "text"}
+          .content.horizontal.start
+            .aside Tomatican 
+            %textarea
+          .content.horizontal
+            .aside Phone
+            .slider
+              .progress
+                .circle    
+          .content.horizontal
+            .aside Tomatican 
+            %select
+              %option{:value => "option 1"}  option 1
+              %option{:value => "option 2"}  option 2
+              %option{:value => "option 3"}  option 3
+
+        %h1 Label encima
+        %form.inset
+          .content.stack
+            %label 
+              Name
+              %input{:type => "text"}  
+          .content.stack
+            %label 
+              Date
+              %input{:type => "date"}    
+          .content.stack
+            %label 
+              Datetime
+              %input{:type => "datetime"}
+          .content.stack
+            %label 
+              Datetime-local
+              %input{:type => "datetime-local"}      
+          .content.stack
+            %label 
+              Time
+              %input{:type => "time"}  
+          .content.stack
+            %label 
+              Month
+              %input{:type => "month"}
+          .content.stack
+            %label 
+              Number
+              %input{:type => "number"}
+          .content.stack
+            %label 
+              Tel
+              %input{:type => "tel"}
+          .content.stack
+            %label 
+              Url
+              %input{:type => "url"}
+          .content.stack
+            %label 
+              Week
+              %input{:type => "week"}            
+          .content.stack
+            %label 
+              Minicomponente
+              %textarea  
+          .content.stack
+            %label 
+              Tomatican 
+              %select
+                %option{:value => "option 1"}  option 1          
+                %option{:value => "option 2"}  option 2          
+                %option{:value => "option 3"}  option 3  
+
+        
+
+                          
+
+        
+
+  %aside{"data-type" => "onLeft"}
+
+  %aside{"data-type" => "onRight"}
+
+  %aside{"data-type" => "onTop"}
+
+  %aside{"data-type" => "onBottom"}
+= content_for :application_js do  
+  %script{:src => "app/app.js", :type=> "text/javascript"}
+  %script{:src => "app/events.js", :type=> "text/javascript"}  

data/lib/coolstrap-generator/templates/app/components/listview/_complexlistavatar.html.haml.erb

@@ -0,0 +1,77 @@
+-# more on lists in http://
+
+= section({:id=>"<%= name %>"}) do
+  = header do
+    = link_to "volver", "#", "data-target" => "back"
+    
+    = hgroup(:title=>"<%= name %>", :subtitle=>"subtitle")
+    
+  = footer do
+    -#= render_toolbar("some/toolbar")
+
+  = article(:class=>"scrollable") do
+  
+    = list_view(:class=>"inset") do 
+
+      = divider do
+        1. Title and description widht avatar
+      
+      = list_item do
+        .aside.up
+          .picture
+        .content
+          %h1 First Item
+          %p Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Sed posuere consectetur est at lobortis. 
+ 
+      = divider do
+        2. Title and description with arrow and avatar   
+      
+      = list_item(:arrow=>"right") do
+        .aside.up
+          .picture
+        .content
+          %h1 First Item
+          %p Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Sed posuere consectetur est at lobortis. 
+
+
+      = divider do
+        3. Title and description with meta and avatar   
+      
+      %li
+        .aside.up
+          .picture
+        .content
+          .nested
+            %h1 First Item
+            .aside 4 days ago
+          %p Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Sed posuere consectetur est at lobortis.
+  
+      = divider do
+        4. Title and description with meta, arrow and avatar 1
+      
+      = list_item(:arrow=>"right") do
+        .aside.up
+          .picture
+        .content
+          .nested
+            %h1 First Item
+            .aside 4 days ago
+          %p Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Sed posuere consectetur est at lobortis.
+      
+      = list_item(:arrow=>"right") do
+        .aside.up
+          .picture
+        .content
+          .nested
+            %h1
+              Jason Newsted
+            .aside
+              Facebook friend
+          .nested
+            %p
+              Bass Guitar
+            .aside
+              1st/June/2012
+        .aside.vertical
+          %span.badge 24
+          %span.badge 213

data/lib/coolstrap-generator/templates/app/components/listview/_simplelist.html.haml.erb

@@ -0,0 +1,31 @@
+-# more on lists in http://
+
+= section({:id=>"<%= name %>"}) do
+  = header do
+    = link_to "Volver", "#", {"data-target" => "back"}
+    
+    = hgroup({:title=>"<%= name %>", :subtitle=>"subtitle"})
+
+  = footer do
+    -#= render_toolbar("some/toolbar")
+  
+  = article({:class=>"scrollable"}) do
+
+    = list_view do 
+    
+      = divider do
+        divider
+
+      = list_item() do
+        normal item
+      
+      = divider(:id=>"divider1") do
+        2. Simple with id 
+               
+      = list_item(:arrow=>"left") do
+        .content
+          %p simple content with left arrow.
+
+      = list_item(:arrow=>"right") do
+        .content
+          %p simple content with right arrow.    

data/lib/coolstrap-generator/templates/app/components/tabbar.html.haml.erb

@@ -0,0 +1,16 @@
+
+-# more on navs at http://... 
+-# usage partial = partial "views/developers/toolbars/<%= name %>"
+
+-# example 1: simple tabbar         
+= tabbar do
+  = link_to "#" do
+    = icon(:facebook)
+  = link_to "#" do
+    = icon(:twitter)
+  = link_to "#" do
+    = icon(:comments)
+  = link_to "#" do
+    = icon(:linkedin)
+
+

data/lib/coolstrap-generator/templates/app/components/toolbar.html.haml.erb

@@ -0,0 +1,32 @@
+
+-# more on navs at http://... 
+-# usage partial = partial "views/developers/toolbars/<%= name %>"
+
+-# example 1: search input 
+= toolbar(:auto=>true) do
+  %input{:type => "search", :name => "txt"}
+  %a
+    %i.icon-search
+
+-# example 2: normal toolbar without control
+= toolbar do
+  %a boton 1
+  %a boton 2
+  %a boton 3
+  %a boton 4
+
+-# example 3: control toolbar with autoWidth
+= toolbar(:control=>true, :auto=>true) do
+  %a nombre 1
+  %a nombre 3
+  %a nombre 4
+
+-# example 4: control only, autoWidth false 
+= toolbar(:control=>true) do
+  %a
+    = icon(:facebook)
+  %a
+    = icon(:facebook)
+  %a
+    = icon(:comments)
+

data/lib/coolstrap-generator/templates/app/index.html.haml.erb

@@ -0,0 +1,21 @@
+= content_for :title do
+  <%= app_name %>
+  
+= content_for :application_styles do
+  = stylesheet_link_tag "coolstrap/themes/coolstrap"
+  = stylesheet_link_tag "customtheme.css"
+
+= content_for :principal do
+  %div{"role" => "main"}
+
+    = partial "views/home"
+    -# put collection partials here
+    -# = partial "views/users/repos"
+
+  = partial "views/shared/aside_onleft"
+  = partial "views/shared/aside_onright"
+  = partial "views/shared/aside_ontop"
+  = partial "views/shared/aside_onbottom"
+  
+= content_for :application_js do
+  = javascript_include_tag "app.js"

data/lib/coolstrap-generator/templates/app/layout.haml.erb

@@ -0,0 +1,79 @@
+!!! 5
+
+-# paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
+/[if lt IE 7]>      <html lang="en" class="no-js lt-ie9 lt-ie8 lt-ie7">
+/[if IE 7]>         <html lang="en" class="no-js lt-ie9 lt-ie8">
+/[if IE 8]>         <html lang="en" class="no-js lt-ie9">
+/[if IEMobile 7 ]>  <html lang="en" class="no-js iem7">
+
+-# Consider adding a manifest.appcache: h5bp.com/d/Offline
+-# Conditional comment for mobile ie7 blogs.msdn.com/b/iemobile/
+
+<!--[if (gt IEMobile 7)|!(IEMobile)|(gt IE 8)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->
+%head
+  %meta{:charset => "UTF-8"}
+  %meta{"http-equiv" => "X-UA-Compatible", :content => "IE=edge,chrome=1"}
+
+  %title= yield_content(:title)
+
+  %meta{:name => "description", :content => "<%= app_name %>"}
+  %meta{:name => "generator", :content => "Coolstrap Framework"}
+  
+  %meta{:name => "author", :content=> "<%= app_name %>"}
+
+  -# Mobile viewport optimization:
+  %meta{:name => "HandheldFriendly", :content => "true"}
+  %meta{:name => "MobileOptimized", :content => "320"}
+  %meta{:name => "format-detection", :content => "telephone=no"}
+  %meta{:name => "viewport", :content => "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"}
+  
+  -# iOS web app, delete if not needed:
+  %meta{:name => "apple-mobile-web-app-capable", :content => "yes"}
+  %meta{:name => "apple-mobile-web-app-status-bar-style", :content => "black"}
+  :javascript
+    (function () {
+      var p, l, r = window.devicePixelRatio;
+      if (navigator.platform === "iPad") {
+          p = r === 2 ? "startup/tablet-portrait@2x.png" : "startup/tablet-portrait.png";
+          l = r === 2 ? "startup/tablet-landscape@2x.png" : "startup/tablet-landscape.png";
+          document.write('');
+      } else {
+          p = r === 2 ? "startup/smatphone@2x.png" : "startup/smatphone.png";
+          document.write('');
+      }
+    })()
+
+    // The script prevents links from opening in mobile safari:
+    (function (a, b, c) {
+      if (c in b && b[c]) {
+        var d, e = a.location,
+            f = /^(a|html)$/i;
+        a.addEventListener("click", function (a) {
+            d = a.target;
+            while (!f.test(d.nodeName)) d = d.parentNode;
+            "href" in d && (d.href.indexOf("http") || ~d.href.indexOf(e.host)) && (a.preventDefault(), e.href = d.href)
+        }, !1)
+      }
+    })(document, window.navigator, "standalone")
+    
+  -# Mobile IE allows us to activate ClearType technology for smoothing fonts for easy reading:
+  %meta{"http-equiv" => "cleartype", :content => "on"}
+
+  -# StyleSheets
+  = stylesheet_link_tag "coolstrap/coolstrap"
+  = yield_content(:application_styles)
+  -# All JavaScript at the bottom, except this Modernizr build.
+  -# Modernizr enables HTML5 elements & feature detects for optimal performance.
+  = javascript_include_tag "coolstrap/lib/modernizr-2.5.3"
+
+%body
+
+  = yield_content(:principal)
+
+  / Third parties dependencies
+  = javascript_include_tag "coolstrap/lib/zepto-1.0rc1"
+  = javascript_include_tag "coolstrap/lib/iscroll"
+
+  / CoolStrapp Libraries (Development mode)
+  = javascript_include_tag "coolstrap/coolstrap-0.1"
+  = yield_content(:application_js)