Add examples and update README

README.md

@@ -1,37 +1,41 @@
 # Sinatra Simple Assets
 
-    # Gemfile
-    gem 'sinatra-simple-assets', :require => 'sinatra/simple_assets'
-
-    # Sinatra app
-    register Sinatra::SimpleAssets
-
-    assets do
-      css :application, [
-        '/stylesheets/bootstrap.css',
-        '/stylesheets/application.css'
-      ]
-      js :application, [
-        '/javascripts/bootstrap-modal.js',
-        '/javascripts/bootstrap-dropdown.js',
-        '/javascripts/bootstrap-scrollspy.js',
-        '/javascripts/bootstrap-buttons.js',
-        '/javascripts/bootstrap-tabs.js',
-        '/javascripts/bootstrap-twipsy.js',
-        '/javascripts/bootstrap-popover.js',
-        '/javascripts/bootstrap-alerts.js',
-        '/javascripts/application.js'
-      ]
-    end
-
-    # Views
-    <%= javascript :application %>
+* Concatinates and minifies JavaScript and CSS
+* Provides view helpers
+
+[See examples folder for sample apps](https://github.com/peteog/sinatra-simple-assets/tree/master/examples)
+
+## View helper output
+
+### CSS
+
     <%= stylesheet :application %>
 
-    # Rakefile
-    namespace :assets do
-      desc 'Precompile assets'
-      task :precompile do
-        App.assets.precompile
-      end
-    end
+development:
+
+    <link rel="stylesheet" href="http://localhost:9292/stylesheets/bootstrap.css">
+    <link rel="stylesheet" href="http://localhost:9292/stylesheets/application.css">
+
+production:
+
+    <link rel="stylesheet" href="http://localhost:9292/stylesheets/application-1d512aa30517f9c05c6fc81258c586caeafc1136.css">
+
+### JavaScript
+
+    <%= javascript :application %>
+
+development:
+
+    <script src="http://localhost:9292/javascripts/bootstrap-modal.js"></script>
+    <script src="http://localhost:9292/javascripts/bootstrap-dropdown.js"></script>
+    <script src="http://localhost:9292/javascripts/bootstrap-scrollspy.js"></script>
+    <script src="http://localhost:9292/javascripts/bootstrap-buttons.js"></script>
+    <script src="http://localhost:9292/javascripts/bootstrap-tabs.js"></script>
+    <script src="http://localhost:9292/javascripts/bootstrap-twipsy.js"></script>
+    <script src="http://localhost:9292/javascripts/bootstrap-popover.js"></script>
+    <script src="http://localhost:9292/javascripts/bootstrap-alerts.js"></script>
+    <script src="http://localhost:9292/javascripts/application.js"></script>
+
+production:
+
+    <script src="http://localhost:9292/javascripts/application-2e4cd283a08121a850c0117a1ca64648e34cce98.js"></script>

examples/basic/Gemfile

@@ -0,0 +1,5 @@
+source :rubygems
+
+gem 'rake'
+gem 'sinatra'
+gem 'sinatra-simple-assets', :require => 'sinatra/simple_assets'

examples/basic/Rakefile

@@ -0,0 +1,11 @@
+task :environment do
+  Bundler.require(:default)
+  require "#{File.dirname(__FILE__)}/app"
+end
+
+namespace :assets do
+  desc 'Precompile assets'
+  task :precompile => :environment do
+    App.assets.precompile
+  end
+end

examples/basic/app.rb

@@ -0,0 +1,28 @@
+class App < Sinatra::Base
+  configure do
+    set :app_name, 'Sinatra Simple Assets'
+
+    register Sinatra::SimpleAssets
+    assets do
+      css :application, [
+        '/stylesheets/bootstrap.css',
+        '/stylesheets/application.css'
+      ]
+      js :application, [
+        '/javascripts/bootstrap-modal.js',
+        '/javascripts/bootstrap-dropdown.js',
+        '/javascripts/bootstrap-scrollspy.js',
+        '/javascripts/bootstrap-buttons.js',
+        '/javascripts/bootstrap-tabs.js',
+        '/javascripts/bootstrap-twipsy.js',
+        '/javascripts/bootstrap-popover.js',
+        '/javascripts/bootstrap-alerts.js',
+        '/javascripts/application.js'
+      ]
+    end
+  end
+
+  get '/' do
+    erb :index
+  end
+end

examples/basic/config.ru

@@ -0,0 +1,7 @@
+require 'bundler'
+
+Bundler.require(:default)
+
+require "#{File.dirname(__FILE__)}/app"
+
+run App

examples/basic/public/javascripts/application.js

@@ -0,0 +1,2 @@
+$(function () {
+});

examples/basic/public/javascripts/bootstrap-alerts.js

@@ -0,0 +1,113 @@
+/* ==========================================================
+ * bootstrap-alerts.js v1.4.0
+ * http://twitter.github.com/bootstrap/javascript.html#alerts
+ * ==========================================================
+ * Copyright 2011 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"
+
+  /* CSS TRANSITION SUPPORT (https://gist.github.com/373874)
+   * ======================================================= */
+
+   var transitionEnd
+
+   $(document).ready(function () {
+
+     $.support.transition = (function () {
+       var thisBody = document.body || document.documentElement
+         , thisStyle = thisBody.style
+         , support = thisStyle.transition !== undefined || thisStyle.WebkitTransition !== undefined || thisStyle.MozTransition !== undefined || thisStyle.MsTransition !== undefined || thisStyle.OTransition !== undefined
+       return support
+     })()
+
+     // set CSS transition event type
+     if ( $.support.transition ) {
+       transitionEnd = "TransitionEnd"
+       if ( $.browser.webkit ) {
+        transitionEnd = "webkitTransitionEnd"
+       } else if ( $.browser.mozilla ) {
+        transitionEnd = "transitionend"
+       } else if ( $.browser.opera ) {
+        transitionEnd = "oTransitionEnd"
+       }
+     }
+
+   })
+
+ /* ALERT CLASS DEFINITION
+  * ====================== */
+
+  var Alert = function ( content, options ) {
+    this.settings = $.extend({}, $.fn.alert.defaults, options)
+    this.$element = $(content)
+      .delegate(this.settings.selector, 'click', this.close)
+  }
+
+  Alert.prototype = {
+
+    close: function (e) {
+      var $element = $(this).parent('.alert-message')
+
+      e && e.preventDefault()
+      $element.removeClass('in')
+
+      function removeElement () {
+        $element.remove()
+      }
+
+      $.support.transition && $element.hasClass('fade') ?
+        $element.bind(transitionEnd, removeElement) :
+        removeElement()
+    }
+
+  }
+
+
+ /* ALERT PLUGIN DEFINITION
+  * ======================= */
+
+  $.fn.alert = function ( options ) {
+
+    if ( options === true ) {
+      return this.data('alert')
+    }
+
+    return this.each(function () {
+      var $this = $(this)
+
+      if ( typeof options == 'string' ) {
+        return $this.data('alert')[options]()
+      }
+
+      $(this).data('alert', new Alert( this, options ))
+
+    })
+  }
+
+  $.fn.alert.defaults = {
+    selector: '.close'
+  }
+
+  $(document).ready(function () {
+    new Alert($('body'), {
+      selector: '.alert-message[data-alert] .close'
+    })
+  })
+
+}( window.jQuery || window.ender );

examples/basic/public/javascripts/bootstrap-buttons.js

@@ -0,0 +1,62 @@
+/* ============================================================
+ * bootstrap-buttons.js v1.4.0
+ * http://twitter.github.com/bootstrap/javascript.html#buttons
+ * ============================================================
+ * Copyright 2011 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"
+
+  function setState(el, state) {
+    var d = 'disabled'
+      , $el = $(el)
+      , data = $el.data()
+
+    state = state + 'Text'
+    data.resetText || $el.data('resetText', $el.html())
+
+    $el.html( data[state] || $.fn.button.defaults[state] )
+
+    state == 'loadingText' ?
+      $el.addClass(d).attr(d, d) :
+      $el.removeClass(d).removeAttr(d)
+  }
+
+  function toggle(el) {
+    $(el).toggleClass('active')
+  }
+
+  $.fn.button = function(options) {
+    return this.each(function () {
+      if (options == 'toggle') {
+        return toggle(this)
+      }
+      options && setState(this, options)
+    })
+  }
+
+  $.fn.button.defaults = {
+    loadingText: 'loading...'
+  }
+
+  $(function () {
+    $('body').delegate('.btn[data-toggle]', 'click', function () {
+      $(this).button('toggle')
+    })
+  })
+
+}( window.jQuery || window.ender );

examples/basic/public/javascripts/bootstrap-dropdown.js

@@ -0,0 +1,55 @@
+/* ============================================================
+ * bootstrap-dropdown.js v1.4.0
+ * http://twitter.github.com/bootstrap/javascript.html#dropdown
+ * ============================================================
+ * Copyright 2011 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"
+
+  /* DROPDOWN PLUGIN DEFINITION
+   * ========================== */
+
+  $.fn.dropdown = function ( selector ) {
+    return this.each(function () {
+      $(this).delegate(selector || d, 'click', function (e) {
+        var li = $(this).parent('li')
+          , isActive = li.hasClass('open')
+
+        clearMenus()
+        !isActive && li.toggleClass('open')
+        return false
+      })
+    })
+  }
+
+  /* APPLY TO STANDARD DROPDOWN ELEMENTS
+   * =================================== */
+
+  var d = 'a.menu, .dropdown-toggle'
+
+  function clearMenus() {
+    $(d).parent('li').removeClass('open')
+  }
+
+  $(function () {
+    $('html').bind("click", clearMenus)
+    $('body').dropdown( '[data-dropdown] a.menu, [data-dropdown] .dropdown-toggle' )
+  })
+
+}( window.jQuery || window.ender );