sass-twitter-bootstrap-rails 0.1 → 1.0.0

data/README.md

@@ -1,19 +1,21 @@
-# sass-twitter-bootstrap-rails
+# Twitter Bootstrap for Rails 3.1 with Sass
 
-Twitter CSS Toolkit, Bootstrap, for Rails with Sass !
+Bootstrap is a toolkit from Twitter designed to kickstart development of webapps and sites. 
+It includes base CSS and javascripts for typography, forms, buttons, tables, grids, navigation, and more.
 
-This gem provides :
+sass-twitter-bootstrap-rails project integrates Bootstrap for Rails 3.1+ applications with asset pipeline enabled
 
-* stylesheets converted to Sass [sass-twitter-bootstrap](http://github.com/jlong/sass-twitter-bootstrap)
-* javascripts from Bootstrap also
-
-The gem uses Twitter Bootstrap _1.4.0_
+The `master` branch uses new __Twitter Bootstrap 2__. Version 1.4 of Bootstrap is kept in a branch now.
 
 ## Installation
 
 Include Boostrap in your `Gemfile`
 
-    gem 'sass-twitter-bootstrap-rails'
+    gem 'sass-twitter-bootstrap-rails', '~> 1.0'
+
+or, if you want to use the old version of Bootstrap
+
+    gem 'sass-twitter-bootstrap-rails', '~> 0.1'
 
 and run from command line
 
@@ -29,6 +31,11 @@ For Rails 3.1+, the files will be added to the assets pipeline and available for
 `app/assets/stylesheets/application.scss`
 
     @import "twitter/bootstrap";
+    
+You can also import additionnal files, like the responsive grid or only files you need
+
+    @import "twitter/bootstrap/responsiveness"
+    @import "twitter/bootstrap/forms"
 
 To use complementary javascripts files, you can use the `manifest` present in the gem by adding this line to the file
 `app/assets/javascripts/application.js`
@@ -37,8 +44,8 @@ To use complementary javascripts files, you can use the `manifest` present in th
 
 or if you do not wish to use all javascripts included, you can require them separalety
 
-    /= require twitter/bootstrap-buttons
-    /= require twitter/bootstrap-tabs
+    /= require twitter/bootstrap/bootstrap-button
+    /= require twitter/bootstrap/bootstrap-tab
 
 ### Rails 3.0
 
@@ -46,9 +53,14 @@ Not yet available
 
 ## Generators
 
-Not yet available
+If you're the kind of developers that prefer action over explanation, there is a generator that will install all of
+this, so you can start immediatly. Just run in the command line
+
+    rails g bootstrap:install
+    
+and start enjoying !
 
 ## Thanks
 
-Twitter Bootstrap http://twitter.github.com/bootstrap and http://github.com/jlong/sass-twitter-bootstrap for the Sass conversion
+Twitter Bootstrap http://twitter.github.com/bootstrap
 

data/lib/generators/bootstrap/install/install_generator.rb

@@ -0,0 +1,26 @@
+require 'rails/generators'
+
+module Bootstrap
+  module Generators
+    class InstallGenerator < ::Rails::Generators::Base
+      source_root File.expand_path('../templates', __FILE__)
+      desc "This generator installs Twitter Bootstrap to be used with assets pipeline"
+
+      def add_stylesheets
+        if File.exist?('app/assets/stylesheets/application.css.scss')
+          insert_into_file 'app/assets/stylesheets/application.css.scss', %Q{@import "twitter/bootstrap"\n}, :before => "@import"
+        else
+          copy_file 'application.css.scss', 'app/assets/stylesheets/application.css.scss'
+        end
+      end
+
+      def add_javascripts
+        if File.exist?('app/assets/javascripts/application.js')
+          insert_into_file 'app/assets/javascripts/application.js', "//= require twitter/bootstrap\n", :after => "jquery_ujs\n"
+        else
+          copy_file 'application.js', 'app/assets/javascripts/application.js'
+        end
+      end
+    end
+  end
+end

data/lib/generators/bootstrap/install/templates/application.css.scss

@@ -0,0 +1 @@
+@import "twitter/bootstrap"

data/lib/generators/bootstrap/install/templates/application.js

@@ -0,0 +1,9 @@
+// This is a manifest file that'll be compiled into including all the files listed below.
+// Add new JavaScript/Coffee code in separate files in this directory and they'll automatically
+// be included in the compiled file accessible from http://example.com/assets/application.js
+// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
+// the compiled file.
+//
+//= require jquery
+//= require_tree bootstrap
+//= require_tree .

data/lib/sass-twitter-bootstrap/rails/version.rb

@@ -1,7 +1,6 @@
 module SassTwitterBootstrap
   module Rails
-    VERSION = '0.1'
-    BOOTSTRAP_VERSION = '1.4'
-    SASS_BOOTSTRAP_VERSION = '1.1'
+    VERSION = '1.0.0'
+    BOOTSTRAP_VERSION = '2.0.0'
   end
 end

data/sass-twitter-bootstrap-rails.gemspec

@@ -13,7 +13,7 @@ Gem::Specification.new do |s|
 
   s.required_rubygems_version = ">= 1.3.6"
 
-  s.add_dependency "railties", "~> 3.2"
+  s.add_dependency "railties", ">= 3.1"
 
   s.executables   = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
   s.files         = `git ls-files`.split("\n")

data/vendor/assets/javascripts/twitter/bootstrap.js

@@ -1 +1 @@
-//= require_tree .
+//= require_tree bootstrap

data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-alert.js

@@ -0,0 +1,91 @@
+/* ==========================================================
+ * bootstrap-alert.js v2.0.0
+ * http://twitter.github.com/bootstrap/javascript.html#alerts
+ * ==========================================================
+ * Copyright 2012 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ========================================================== */
+
+
+!function( $ ){
+
+  "use strict"
+
+ /* ALERT CLASS DEFINITION
+  * ====================== */
+
+  var dismiss = '[data-dismiss="alert"]'
+    , Alert = function ( el ) {
+        $(el).on('click', dismiss, this.close)
+      }
+
+  Alert.prototype = {
+
+    constructor: Alert
+
+  , close: function ( e ) {
+      var $this = $(this)
+        , selector = $this.attr('data-target')
+        , $parent
+
+      if (!selector) {
+        selector = $this.attr('href')
+        selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7
+      }
+
+      $parent = $(selector)
+      $parent.trigger('close')
+
+      e && e.preventDefault()
+
+      $parent.length || ($parent = $this.hasClass('alert') ? $this : $this.parent())
+
+      $parent.removeClass('in')
+
+      function removeElement() {
+        $parent.remove()
+        $parent.trigger('closed')
+      }
+
+      $.support.transition && $parent.hasClass('fade') ?
+        $parent.on($.support.transition.end, removeElement) :
+        removeElement()
+    }
+
+  }
+
+
+ /* ALERT PLUGIN DEFINITION
+  * ======================= */
+
+  $.fn.alert = function ( option ) {
+    return this.each(function () {
+      var $this = $(this)
+        , data = $this.data('alert')
+      if (!data) $this.data('alert', (data = new Alert(this)))
+      if (typeof option == 'string') data[option].call($this)
+    })
+  }
+
+  $.fn.alert.Constructor = Alert
+
+
+ /* ALERT DATA-API
+  * ============== */
+
+  $(function () {
+    $('body').on('click.alert.data-api', dismiss, Alert.prototype.close)
+  })
+
+}( window.jQuery )

data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-button.js

@@ -0,0 +1,98 @@
+/* ============================================================
+ * bootstrap-button.js v2.0.0
+ * http://twitter.github.com/bootstrap/javascript.html#buttons
+ * ============================================================
+ * Copyright 2012 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============================================================ */
+
+!function( $ ){
+
+  "use strict"
+
+ /* BUTTON PUBLIC CLASS DEFINITION
+  * ============================== */
+
+  var Button = function ( element, options ) {
+    this.$element = $(element)
+    this.options = $.extend({}, $.fn.button.defaults, options)
+  }
+
+  Button.prototype = {
+
+      constructor: Button
+
+    , setState: function ( state ) {
+        var d = 'disabled'
+          , $el = this.$element
+          , data = $el.data()
+          , val = $el.is('input') ? 'val' : 'html'
+
+        state = state + 'Text'
+        data.resetText || $el.data('resetText', $el[val]())
+
+        $el[val](data[state] || this.options[state])
+
+        // push to event loop to allow forms to submit
+        setTimeout(function () {
+          state == 'loadingText' ?
+            $el.addClass(d).attr(d, d) :
+            $el.removeClass(d).removeAttr(d)
+        }, 0)
+      }
+
+    , toggle: function () {
+        var $parent = this.$element.parent('[data-toggle="buttons-radio"]')
+
+        $parent && $parent
+          .find('.active')
+          .removeClass('active')
+
+        this.$element.toggleClass('active')
+      }
+
+  }
+
+
+ /* BUTTON PLUGIN DEFINITION
+  * ======================== */
+
+  $.fn.button = function ( option ) {
+    return this.each(function () {
+      var $this = $(this)
+        , data = $this.data('button')
+        , options = typeof option == 'object' && option
+      if (!data) $this.data('button', (data = new Button(this, options)))
+      if (option == 'toggle') data.toggle()
+      else if (option) data.setState(option)
+    })
+  }
+
+  $.fn.button.defaults = {
+    loadingText: 'loading...'
+  }
+
+  $.fn.button.Constructor = Button
+
+
+ /* BUTTON DATA-API
+  * =============== */
+
+  $(function () {
+    $('body').on('click.button.data-api', '[data-toggle^=button]', function ( e ) {
+      $(e.target).button('toggle')
+    })
+  })
+
+}( window.jQuery )

data/vendor/assets/javascripts/twitter/bootstrap/bootstrap-carousel.js

@@ -0,0 +1,154 @@
+/* ==========================================================
+ * bootstrap-carousel.js v2.0.0
+ * http://twitter.github.com/bootstrap/javascript.html#carousel
+ * ==========================================================
+ * Copyright 2012 Twitter, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ========================================================== */
+
+
+!function( $ ){
+
+  "use strict"
+
+ /* CAROUSEL CLASS DEFINITION
+  * ========================= */
+
+  var Carousel = function (element, options) {
+    this.$element = $(element)
+    this.options = $.extend({}, $.fn.carousel.defaults, options)
+    this.options.slide && this.slide(this.options.slide)
+  }
+
+  Carousel.prototype = {
+
+    cycle: function () {
+      this.interval = setInterval($.proxy(this.next, this), this.options.interval)
+      return this
+    }
+
+  , to: function (pos) {
+      var $active = this.$element.find('.active')
+        , children = $active.parent().children()
+        , activePos = children.index($active)
+        , that = this
+
+      if (pos > (children.length - 1) || pos < 0) return
+
+      if (this.sliding) {
+        return this.$element.one('slid', function () {
+          that.to(pos)
+        })
+      }
+
+      if (activePos == pos) {
+        return this.pause().cycle()
+      }
+
+      return this.slide(pos > activePos ? 'next' : 'prev', $(children[pos]))
+    }
+
+  , pause: function () {
+      clearInterval(this.interval)
+      return this
+    }
+
+  , next: function () {
+      if (this.sliding) return
+      return this.slide('next')
+    }
+
+  , prev: function () {
+      if (this.sliding) return
+      return this.slide('prev')
+    }
+
+  , slide: function (type, next) {
+      var $active = this.$element.find('.active')
+        , $next = next || $active[type]()
+        , isCycling = this.interval
+        , direction = type == 'next' ? 'left' : 'right'
+        , fallback  = type == 'next' ? 'first' : 'last'
+        , that = this
+
+      this.sliding = true
+
+      isCycling && this.pause()
+
+      $next = $next.length ? $next : this.$element.find('.item')[fallback]()
+
+      if (!$.support.transition && this.$element.hasClass('slide')) {
+        this.$element.trigger('slide')
+        $active.removeClass('active')
+        $next.addClass('active')
+        this.sliding = false
+        this.$element.trigger('slid')
+      } else {
+        $next.addClass(type)
+        $next[0].offsetWidth // force reflow
+        $active.addClass(direction)
+        $next.addClass(direction)
+        this.$element.trigger('slide')
+        this.$element.one($.support.transition.end, function () {
+          $next.removeClass([type, direction].join(' ')).addClass('active')
+          $active.removeClass(['active', direction].join(' '))
+          that.sliding = false
+          setTimeout(function () { that.$element.trigger('slid') }, 0)
+        })
+      }
+
+      isCycling && this.cycle()
+
+      return this
+    }
+
+  }
+
+
+ /* CAROUSEL PLUGIN DEFINITION
+  * ========================== */
+
+  $.fn.carousel = function ( option ) {
+    return this.each(function () {
+      var $this = $(this)
+        , data = $this.data('carousel')
+        , options = typeof option == 'object' && option
+      if (!data) $this.data('carousel', (data = new Carousel(this, options)))
+      if (typeof option == 'number') data.to(option)
+      else if (typeof option == 'string' || (option = options.slide)) data[option]()
+      else data.cycle()
+    })
+  }
+
+  $.fn.carousel.defaults = {
+    interval: 5000
+  }
+
+  $.fn.carousel.Constructor = Carousel
+
+
+ /* CAROUSEL DATA-API
+  * ================= */
+
+  $(function () {
+    $('body').on('click.carousel.data-api', '[data-slide]', function ( e ) {
+      var $this = $(this), href
+        , $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '')) //strip for ie7
+        , options = !$target.data('modal') && $.extend({}, $target.data(), $this.data())
+      $target.carousel(options)
+      e.preventDefault()
+    })
+  })
+
+}( window.jQuery )