hobo_bootstrap 2.0.0.pre1

data/taglibs/hobo_bootstrap.dryml

@@ -0,0 +1 @@
+<include src="*"/>

data/taglibs/index_page.dryml

@@ -0,0 +1,38 @@
+<%# displays the pencil and trash can icons used by the bootstrap index page. %>
+<def tag="bootstrap-table-actions">
+  <a with="&this_parent" action="edit">
+    <i class="icon icon-edit"></i>
+  </a>
+  <%= link_to '<i class=\'icon-trash\'></i>'.html_safe, this_parent, :confirm => t('hobo.messages.confirm', :default=>'Are you sure?'), method: :delete %>
+</def>
+
+<extend tag="index-page">
+  <old-index-page: merge>
+
+    <new-link: class="btn pull-right"/>
+
+    <collection: replace>
+      <%
+        if this.first
+          klass = this.first.class
+          columns = standard_fields(klass)
+          field_names = columns.select {|f| can_view?(this.first, f)}
+          if can_edit?(this.first, field_names[0])
+            field_names << "actions"
+          end
+          field_names[0] = "this"
+          field_names = field_names.join(', ')
+        end
+      %>
+      <table class="table table-striped" without-header
+        fields="&field_names" param="collection">
+        <actions-label:>
+          <t key="hobo.messages.actions">Actions</t>
+        </actions-label:>
+        <actions-view:>
+          <bootstrap-table-actions/>
+        </actions-view:>
+      </table>
+    </collection>
+  </old-index-page:>
+</extend>

data/taglibs/login.dryml

@@ -0,0 +1,88 @@
+<!-- Simple log-in form.
+
+### Attributes
+
+ - `user-model`: The User class
+ - all other attributes are passed on to `<form>`.   You will probably need to set the action attribute:  `action="&user_login_path"`.
+ -->
+<def tag="login-form" attrs="user-model">
+  <% user_model ||= self.try.model -%>
+  <form action="&request.fullpath" class="login" merge>
+  
+    <div param="field-list">
+      <div class="control-group login-field">      
+        <label param="login-label" class="control-label" for="login">
+          <t key="hobo.login.#{user_model.login_attribute}"><%= user_model.login_attribute.to_s.titleize %></t>
+        </label>
+        <div class="controls">
+          <input type="text" name="login" id="login" class="string" 
+                param="login-input" />
+        </div>
+      </div>
+      
+      <div class="control-group password-field">      
+        <label param="password-label" class="control-label" for="password">
+          <t key="hobo.login.password">Password</t>
+        </label>
+        <div class="controls">
+          <input type="password" name="password" id="password" class="string" 
+                param="password-input"/>
+        </div>
+      </div>
+      
+      <div class="control-group remember-me-field">      
+        <label param="remember-me-label" class="control-label" 
+               for="remember-me">
+          <t key="hobo.login.remember_me">Remember me</t>
+        </label>
+        <div class="controls">
+          <label class="checkbox">
+              <input type="checkbox" name="remember_me" id="remember-me"
+                 param="remember-me-input"/>
+          </label>
+        </div>
+      </div>
+    </div>
+
+    
+    <div class="actions form-actions" style="padding-left:110px;">
+      <input class="btn btn-primary button submit-button" type="submit"
+             value="#{t 'hobo.actions.login', :default=>['Log in'] }"/>  
+      <if test="&signup_url" class='nav-item'>
+        <t key="hobo.support.or">or</t> <a param="signup" href="&signup_url"><t key="hobo.login.signup">Sign up</t></a>
+      </if>
+      or <a href="&forgot_password_url" param="forgot-password" if="&forgot_password_url"><t key="hobo.login.forgot_password">Forgot your password?</t></a>
+    </div>
+
+  </form>
+</def>
+
+
+
+
+
+
+
+
+
+<!-- Simple log-in page  -->
+<def tag="login-page">
+  <% remember_me = true if remember_me.nil? %>
+  <simple-page title="#{t 'hobo.login.title', :default=>['Log in'] }" without-subnav merge>
+
+    <body: class="login-page" param/>
+
+    <content: param>
+      <div class="row">
+        <div class="span3">&nbsp;</div>
+        <div class="span6">
+          <section param="content-body" class="well" style="padding:50px 50px 10px 50px;">
+            <h2 param="heading"><t key="hobo.login.heading">Log In</t></h2>
+            <login-form param="form" user-model="&model"/>
+          </section>
+        </div>
+        <div class="span3">&nbsp;</div>
+      </div>
+    </content:>
+  </simple-page>
+</def>

data/taglibs/nav.dryml

@@ -0,0 +1,124 @@
+
+<!-- Development mode only - a menu to change the `current_user` -->
+<def tag="dev-user-changer">
+  <set user="&Hobo::Model::UserBase.default_user_model"/>
+  <select-menu if="&user && Rails.env.development?"
+               first-option="#{t('hobo.dev_user_changer.guest', {:default=>'Guest'})}" options="&user.all(:limit => 30).*.login"
+               onchange="location.href = '#{dev_support_path :action=>:set_current_user}?login=' + encodeURIComponent(this.options[this.selectedIndex].value)"
+               selected="#{current_user.login}"
+               class="dev-user-changer"
+               merge-attrs/>
+</def>
+
+
+<!-- General purpose navigation bar. Renders a `<ul class="navigation">`. This tag is intended to be used in conunction with `<nav-item>`. The main feature of this pair of tags (over, say, just using a plain `<ul>` list), is that it's easy to have a 'current' CSS class added to the appropriate nav item (so you can highlight the page/section the user is)
+
+The main navigation in the default hobo app is implemented with `<navigation>` but this tag is also appropriate for any sub-navigation.
+
+### Attributes
+
+ - `current` - the textual content of the nav item that should have the 'current' CSS class added (see example)
+
+### Example
+
+The normal usage is to define your own navigation tag that calls `<navigation>`.
+
+    <def tag="sub-nav">
+      <navigation merge>
+        <nav-item>Red</nav-item>
+        <nav-item>Green</nav-item>
+        <nav-item>Blue</nav-item>
+      </navigation>
+    </def>
+
+Then in your pages you can call the tag like this
+
+ - On the 'red' page: `<sub-nav current="red"/>`
+ - On the 'green' page:  `<sub-nav current="green"/>`
+ - and so on.
+
+   -->
+<def tag="navigation" attrs="current,include-search">
+  <ul class="navigation" merge-attrs>
+    <set-scoped current-navigation="&current">
+      <do param="default"/>
+      <if test="&include_search">
+        <li class="pull-right">
+          <live-search param if="&defined_route? :site_search"/>
+        </li>
+      </if>
+    </set-scoped>
+  </ul>
+</def>
+
+
+<!-- Renders a single item in a [`<navigation>`](/api_tag_defs/navigation).
+
+`<nav-item>` is basically an [`<a>`](/api_tag_defs/a) tag wrapped in an `<li>` tag.  The attributes for [`<a>`](/api_tag_defs/a) may all be used on this tag, and work the same way.
+
+Example 1: explicit links.  Note that we're using explicit routes for clarity.  Named routes are better.
+
+    <navigation current="home">
+      <nav-item href="/">Home</nav-item>
+      <nav-item href="/logout">Logout</nav-item>
+    </navigation>
+
+Example 2: navigation based on a collection of items.  Each item will be transformed into a link as described in [`<a>`](/api_tag_defs/a).
+
+    <navigation with="&links">
+      <repeat>
+        <nav-item/>
+      </repeat>
+    </navigation>
+
+-->
+<def tag="nav-item" attrs="name">
+  <% body = parameters.default
+     body = h(this.to_s) if body.blank?
+     name ||= body.gsub(/<.*?>/, '').strip
+     -%>
+  <li class="#{'active' if (c = scope.current_navigation) && c.downcase == name.downcase}"
+      merge-attrs="&attributes - (attrs_for(:a)+['target'])">
+    <a merge-attrs="&attributes & (attrs_for(:a)+['target'])"><%= body %></a>
+  </li>
+</def>
+
+
+<!-- Account Navigation (log in / out / signup)
+
+When logged in, this renders:
+
+ - "Logged in as ..."
+ - Link to account page
+ - Log out link
+
+When not logged in, renders:
+
+ - Log in link
+ - Sign up link
+
+This is a simple tag - just look at the source if you need to know more detail.
+
+  -->
+<def tag="account-nav">
+  <div class="nav-collapse collapse">
+  <do with="&current_user">
+    <ul class="navigation account-nav nav pull-right" param>
+    
+      <li if="&Rails.env.development?" param="dev-user-changer"><dev-user-changer/></li>
+      <if test="&logged_in?">
+        <li class='nav-item' param="logged-in-as"><a to="&current_user"><t key="hobo.actions.logged_in_as" name="&name">Logged in as <name/></t></a></li>
+        <li class='nav-item' param="account"><a action="account"><t key="hobo.actions.account">Account</t></a></li>
+        <li class='nav-item' param="log-out"><a href="&logout_url"><t key="hobo.actions.logout">Log out</t></a></li>
+      </if>
+      <else>
+        <li class='nav-item' param="log-in"><a href="&login_url"><t key="hobo.actions.login">Log in</t></a></li>
+        <li if="&signup_url" class="nav-item" param="sign-up"><a href="&signup_url"><t key="hobo.actions.signup">Sign up</t></a></li>
+      </else>
+      
+      
+
+    </ul>
+  </do>
+  </div>
+</def>

data/taglibs/page.dryml

@@ -0,0 +1,93 @@
+<!-- This file is necessary, it was mostly cloned from the default Hobo theme -->
+<def tag="ajax-progress">
+  <div id="ajax-progress-wrapper">
+    <div id="ajax-progress" class="ajax-progress" merge-attrs>
+      <div>
+        <span id="ajax-progress-text"></span>
+      </div>
+    </div>
+  </div>
+</def>
+
+<!-- Add bootstrap classes to the default page layout
+
+Attributes:
+
+- nav-location: `top`, `sub`.   Where do you want your main-nav located.   `top` merges it into the top bar, `sub` gives it its own bar. `top` is the default option.
+
+Make your choice global with:
+
+    <extend tag="page">
+      <old-page merge nav-location="sub">
+    </extend>
+
+-->
+<def tag="page" attrs="title, full-title, nav-location">
+  <% full_title ||= "#{title} : #{app_name}" %>
+  <html lang="en" merge-attrs>
+    <head param>
+      <title param><%= strip_tags full_title %></title>
+      <do param="stylesheets"><%# in Hobo <= 1.3, we had other stylesheets here.   Now the asset pipeline is preferred. %>
+        <stylesheet name="#{subsite || 'front'}" param="app-stylesheet"/>
+      </do>
+
+      <do param="scripts"><%# in Hobo <= 1.3, we had other javascripts here.   Now the asset pipeline is preferred. %>
+        <javascript param="application-javascript" name="#{subsite || 'front'}"/>
+        <do param="custom-scripts"/>
+      </do>
+      <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+      <%= csrf_meta_tag %>
+    </head>
+
+    <body param>
+      <set-scoped flash-rendered="&false">
+        <ajax-progress param/>
+        <div class="navbar">
+          <div class="navbar-inner">
+            <header class="container" param>
+              <button data-target=".nav-collapse" data-toggle="collapse" class="btn btn-navbar" type="button">
+                <span class="icon-bar"></span>
+                <span class="icon-bar"></span>
+                <span class="icon-bar"></span>
+              </button>
+              <h1 param="app-name">
+                <a class="brand" href="#{base_url}/"><app-name/></a>
+              </h1>
+              <main-nav class="nav" current="&title" include-search param if="&nav_location.blank? || nav_location=='top'" />
+              <account-nav if="&login_url(Hobo::Model::UserBase.default_user_model)" param/>
+            </header>
+          </div>
+        </div>
+        <div class="container" param="nav-container" if="&nav_location=='sub'">
+          <div class="subnav" param="subnav">
+            <main-nav class="nav nav-pills" current="&title" include-search param/>
+          </div>
+        </div>
+        <% attributes[:content_size] = "12" unless attributes[:content_size] 
+        aside_span = "span" + (12 - attributes[:content_size].to_i).to_s
+        %>
+        <div class="container bootstrap-content">
+          <div class="row">
+            <div class="span#{attributes[:content_size]}">
+              <section with-flash-messages param="content"/>
+            </div>
+            <div class="#{aside_span}" if="&attributes[:content_size].to_i < 12">
+              <div class="well">
+                <section param="aside"/>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <footer class="page-footer" param/>
+        <page-scripts param/>
+      </set-scoped>
+    </body>
+  </html>
+</def>
+
+<def tag="simple-page">
+  <page without-live-search without-main-nav merge>
+    <account-nav: replace />
+  </page>
+</def>

data/taglibs/page_nav.dryml

@@ -0,0 +1,4 @@
+<extend tag="page-nav">
+  <% add_classes!(attributes, "pagination") %>
+  <old-page-nav merge renderer="&BootstrapPagination::Rails"/>
+</extend>

data/taglibs/search.dryml

@@ -0,0 +1,13 @@
+<!--
+Adds bootstrap styling to `<live-search>`
+-->
+<extend tag="live-search">
+  <old-live-search>
+    <label: replace/>
+    <form: class="form-search"/>
+    <input: placeholder="Search" class="search-query"/>
+    <after-input:>
+      <i class="icon-search"></i>
+    </after-input:>
+  </old-live-search>
+</extend>

data/taglibs/show_page.dryml

@@ -0,0 +1,7 @@
+<extend tag="show-page">
+  <old-show-page: merge>
+    <field-list: class="form-horizontal"/>
+    <edit-link: class="btn pull-right"/>
+    <after-edit-link:><div style="clear: right;"/></after-edit-link:>
+  </old-show-page:>
+</extend>

data/taglibs/table-plus.dryml

@@ -0,0 +1,14 @@
+<!--
+Adds bootstrap styling to `<table-plus>`
+-->
+<extend tag="table-plus">
+  <old-table-plus merge>
+    <table: class="table table-striped table-bordered" style="clear: both;"/>
+    <header: style="float: right;"/>
+    <search-filter:>
+      <search-form: class="form-search" style="display: inline;" />
+      <input: class="search-query"/>
+      <clear-form: class="form-search" style="display: inline;"/>
+    </search-filter:>
+  </old-table-plus>
+</extend>

data/taglibs/tabs.dryml

@@ -0,0 +1,35 @@
+<%#
+
+Given a list, renders a bootstrap tab collection.
+
+### Example
+
+    <bootstrap-tab-list:fragments class="tabs-left" active="&this.fragments.first" >
+      <a:>Page <view:page/></a:>
+      <body:><view:body/></body:>
+    </bootstrap-tab-list:fragments>
+
+### Attributes
+
+- active: the element you wish to be initially visible
+
+- id-prefix: (default: tab)  if you have more than one set of tabs on a page, set this to a unique string.
+
+%>
+<def tag="bootstrap-tab-list" attrs="active, id-prefix">
+  <% id_prefix ||= "tab" %>
+  <div class="tabbable" merge param>
+    <ul class="nav nav-tabs" param>
+      <repeat>
+        <li class="#{'active' if this==active}" param>
+          <a href="##{id_prefix}#{this_field}" data-toggle="tab" param/>
+        </li>
+      </repeat>
+    </ul>
+    <div class="tab-content" param="content-container">
+      <repeat>
+        <div id="#{id_prefix}#{this_field}" class="tab-pane  #{'active' if this==active}" param="body"/>
+      </repeat>
+    </div>
+  </div>
+</def>

data/vendor/assets/javascripts/hobo_bootstrap.js

@@ -0,0 +1 @@
+//=require bootstrap-all

data/vendor/assets/stylesheets/hobo_bootstrap.scss

@@ -0,0 +1,83 @@
+@import "compass_twitter_bootstrap";
+
+/* Top menu bar (app name, login...): 
+   It's full width so border-radius is unnecessary */
+.navbar-inner{
+  border-radius:0px;
+}
+/* Top menu tweaks */
+.dev-user-changer{
+  margin-top:3px;
+  opacity:0.8;
+  border-radius:4px;
+}
+.dev-user-changer select{
+  margin-bottom:5px;
+}
+
+
+
+
+
+/* Main menu bar (model links): search box*/
+.form-search{
+  margin:4px 4px 0 0;
+}
+.form-search i {
+  margin: -20px 0 0 162px;
+  display: block;
+  position:absolute;
+}
+#search-results-part{
+  display:none;
+}
+
+
+
+
+/* Page heading */
+.bootstrap-content{
+  margin-top:16px;
+}
+h2.heading{
+  margin-bottom:10px;
+  line-height:24px;
+}
+
+/*  hidden-fields */
+div.hidden-fields {
+  display:none;
+}
+
+/* spinner */
+.ajax-progress{
+  padding: 0 20px 10px;
+  background: url(ajax-loader.gif) no-repeat 0px 1px;
+  display: none;
+}
+
+/* wrap with a position:absolute so the relatively positioned stuff inside doesn't leave a blank space */
+#ajax-progress-wrapper {
+  position: absolute;
+}
+
+/* input-many */
+ul.input-many {list-style-type: none;}
+ul.input-all  {list-style-type: none;}
+
+ul.input-many > li { overflow:hidden; zoom:1;}
+ul.input-many .input-many-item {float:left;}
+ul.input-many div.buttons {float:left; margin-left:10px;}
+li.input-many-template { display:none; }
+
+
+
+
+/* Index page fix */
+.index-page .content-body .table{
+  clear:both;
+}
+
+
+/* collection */
+ul.collection > li { margin-left: 0; list-style: none;}