atlas_assets 0.4.5 → 0.4.6

data/Gemfile.lock

@@ -9,7 +9,7 @@ GIT
 PATH
   remote: .
   specs:
-    atlas_assets (0.4.5)
+    atlas_assets (0.4.6)
       handlebars_assets (~> 0.12.2)
 
 GEM

data/docs/_layouts/default.html

@@ -5,6 +5,7 @@
     <title>{{ page.title }}</title>
     {% stylesheet atlas_assets %}
     {% javascript atlas_assets %}
+    <script>JST = HandlebarsTemplates</script>
     <style type="text/css">
       body {
         padding: 60px 0px;

data/docs/_plugins/jekyll_assets.rb

@@ -1,4 +1,3 @@
 require 'handlebars_assets'
-HandlebarsAssets::Config.template_namespace = 'JST'
 Sprockets.append_path HandlebarsAssets.path
 require "jekyll-assets"

data/docs/_posts/2013-10-28-dropdown.md

@@ -9,7 +9,13 @@ Dropdowns
 
 The Dropdown is a site wide BackboneView helper using the [Chosen](http://harvesthq.github.io/chosen/) Javascript library.
 
-<div id="dropdown-examples"></div>
+<div style="float:left;"><a href="#" class="btn">Build Settings</a></div>
+<div style="float:left;" id="dropdown-example-1"></div>
+
+<div style="clear:both;"></div>
+
+<div id="dropdown-example-2"></div>
+<div id="dropdown-example-3"></div>
 
 <script>
 $(function () {
@@ -19,15 +25,35 @@ $(function () {
   dropdown.add({model: new classes.Dropdown({'label':'second'})})
   dropdown.add({model: new classes.Dropdown({'label':'third'})})
 
-  $('#dropdown-examples').append(dropdown.render().el)
+  $('#dropdown-example-1').append(dropdown.render().el)
 
+  // Set the label from a different atribute, and choose a default value
   window.dropdown2 = new classes.DropdownView({'label':'title', 'default_to':'third'});
 
   dropdown2.add({model: new classes.Dropdown({'title':'first'})})
   dropdown2.add({model: new classes.Dropdown({'title':'second'})})
   dropdown2.add({model: new classes.Dropdown({'title':'third'})})
 
-  $('#dropdown-examples').append(dropdown2.render().el)
+  $('#dropdown-example-2').append(dropdown2.render().el)
+
+  // Add helper texts
+  dropdown3 = new classes.DropdownView({'helper': 'option1'})
+
+  dropdown3.add({model: new classes.Dropdown({'label': 'this'})})
+  dropdown3.add({model: new classes.Dropdown({'label': 'that'})})
+
+  $('#dropdown-example-3').append(dropdown3.render().el)
+
+  // Helper Text and Multiple Selection
+  dropdown4 = new classes.DropdownView({'helper':'option2', 'multiple':true})
+  dropdown4.add({model: new classes.Dropdown({'label': 'the other'})})
+  dropdown4.add({model: new classes.Dropdown({'label': 'that other'})})
+  dropdown4.add({model: new classes.Dropdown({'label': '1'})})
+  dropdown4.add({model: new classes.Dropdown({'label': '2'})})
+  dropdown4.add({model: new classes.Dropdown({'label': '3'})})
+  dropdown4.add({model: new classes.Dropdown({'label': '4'})})
+  dropdown4.add({model: new classes.Dropdown({'label': '5'})})
+  $('#dropdown-example-3').append(dropdown4.render().el)
 })
 </script>
 
@@ -38,13 +64,33 @@ $(function () {
   dropdown.add({model: new classes.Dropdown({'label':'second'})})
   dropdown.add({model: new classes.Dropdown({'label':'third'})})
 
-  $('#dropdown-examples').append(dropdown.render().el)
+  $('#dropdown-example-1').append(dropdown.render().el)
 
+  // Set the label from a different atribute, and choose a default value
   window.dropdown2 = new classes.DropdownView({'label':'title', 'default_to':'third'});
 
   dropdown2.add({model: new classes.Dropdown({'title':'first'})})
   dropdown2.add({model: new classes.Dropdown({'title':'second'})})
   dropdown2.add({model: new classes.Dropdown({'title':'third'})})
 
-  $('#dropdown-examples').append(dropdown2.render().el)
+  $('#dropdown-example-2').append(dropdown2.render().el)
+
+  // Add helper texts
+  dropdown3 = new classes.DropdownView({'helper': 'option1'})
+
+  dropdown3.add({model: new classes.Dropdown({'label': 'this'})})
+  dropdown3.add({model: new classes.Dropdown({'label': 'that'})})
+
+  $('#dropdown-example-3').append(dropdown3.render().el)
+
+  // Helper Text and Multiple Selection
+  dropdown4 = new classes.DropdownView({'helper':'option2', 'multiple':true})
+  dropdown4.add({model: new classes.Dropdown({'label': 'the other'})})
+  dropdown4.add({model: new classes.Dropdown({'label': 'that other'})})
+  dropdown4.add({model: new classes.Dropdown({'label': '1'})})
+  dropdown4.add({model: new classes.Dropdown({'label': '2'})})
+  dropdown4.add({model: new classes.Dropdown({'label': '3'})})
+  dropdown4.add({model: new classes.Dropdown({'label': '4'})})
+  dropdown4.add({model: new classes.Dropdown({'label': '5'})})
+  $('#dropdown-example-3').append(dropdown4.render().el)
 ~~~

data/lib/assets/javascripts/collections/dropdown_collection.coffee

@@ -1,2 +1,2 @@
-classes.DropDownCollection = Backbone.Collection.extend
-  model: classes.DropDown
+classes.DropdownCollection = Backbone.Collection.extend
+  model: classes.Dropdown

data/lib/assets/javascripts/models/dropdown.coffee

@@ -1,5 +1,6 @@
-classes.DropDown = Backbone.Model.extend
+classes.Dropdown = Backbone.Model.extend
   intialize: () ->
     @
+
   setLabel: (label) ->
     @set('label',@get(label))

data/lib/assets/javascripts/templates/dropdown.hbs

@@ -1,8 +1,12 @@
 {{#if helper}}
   <span class="helper">{{helper}}</span>
+  <div class="dropdown-with-helper-container">
 {{/if}}
-<select class="dropdown-list" {{#if placeholder}}data-placeholder='{{placeholder}}'{{/if}}>
+<select class="dropdown-list" {{#if multiple}}multiple{{/if}} {{#if placeholder}}data-placeholder='{{placeholder}}'{{/if}}>
   {{#each models}}
   <option {{#if selected}}selected{{/if}} {{#if disabled}}disabled{{/if}}>{{label}}</option>
   {{/each}}
-</select>
+</select>
+{{#if helper}}
+</div>
+{{/if}}

data/lib/assets/javascripts/views/dropdown_view.coffee

@@ -5,7 +5,7 @@ classes.DropdownView = Backbone.View.extend
 
   initialize: (opts) ->
     if !@collection?
-      @collection = new classes.DropDownCollection
+      @collection = new classes.DropdownCollection
     @opts = _.extend({width: "100%", disable_search_threshold: 2}, opts)
     @template = JST["dropdown"];
     @listenTo(@collection, 'add', @render)

data/lib/assets/stylesheets/atlas_assets/_chosen.scss

@@ -42,7 +42,8 @@
   display: block;
   overflow: hidden;
   padding: 0 0 0 8px;
-  height: 23px;
+  padding: 4px 12px;
+  height: 20px;
   border: 1px solid $defaultBorderColor;
   background-color: $defaultBackgroundColor;
   background-clip: padding-box;

data/lib/assets/stylesheets/atlas_assets/dropdown.scss

@@ -2,13 +2,29 @@
 
 .dropdown {
   display: inline-block;
-  padding: 10px 0;
+  padding: 0 0 10px;
   position: relative;
-  font-size: 14px;
+  font-size: 13px;
 
   .helper {
     color: $medium_gray;
   }
+
+  .dropdown-with-helper-container {
+    display: inline-block;
+  }
+
+  .chosen-container {
+    .chosen-single,
+    .chosen-choices {
+      @include border-radius($defaultBorderRadius);
+    }
+  }
+
+  .chosen-container-multi .chosen-results,
+  .chosen-container-multi .chosen-drop, {
+    @include border-radius($defaultBorderRadius);
+  }
 }
 
 .dropdown[class*="span"] {

data/lib/atlas_assets/version.rb

@@ -1,5 +1,5 @@
 module Atlas
 	module Assets
-		VERSION = "0.4.5"
+		VERSION = "0.4.6"
 	end
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: atlas_assets
 version: !ruby/object:Gem::Version
-  version: 0.4.5
+  version: 0.4.6
   prerelease: 
 platform: ruby
 authors:
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-10-29 00:00:00.000000000 Z
+date: 2013-10-30 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: handlebars_assets
@@ -63,8 +63,6 @@ files:
 - docs/_posts/2013-09-12-logo.md
 - docs/_posts/2013-10-28-dropdown.md
 - docs/glyphicons-license.txt
-- docs/ignore/atlas_assets.css
-- docs/ignore/atlas_assets/dropdown.css
 - docs/index.html
 - lib/assets/fonts/fontawesome-webfont.eot
 - lib/assets/fonts/fontawesome-webfont.svg

data/docs/ignore/atlas_assets/dropdown.css

@@ -1,24 +0,0 @@
-/* Colors
-------------------------------------------------------- */
-/* Fonts
-------------------------------------------------------- */
-/* Defaults
-------------------------------------------------------- */
-/* Forms
-------------------------------------------------------- */
-/* Z-Indexes
-------------------------------------------------------- */
-/* Grid
-------------------------------------------------------- */
-/* Fluid grid
-------------------------------------------------------- */
-.dropdown {
-  display: inline-block;
-  padding: 10px 0;
-  position: relative;
-  font-size: 14px; }
-  .dropdown .helper {
-    color: gray; }
-
-.dropdown[class*="span"] {
-  margin-left: 0; }