sinatra-assetpack 0.0.5

data/lib/sinatra/assetpack/package.rb

@@ -0,0 +1,111 @@
+module Sinatra
+  module AssetPack
+    # A package.
+    #
+    # == Common usage
+    #
+    #     package = assets.packages['application.css']
+    #
+    #     package.files   # List of local files
+    #     package.paths   # List of URI paths
+    #
+    #     package.type    # :css or :js
+    #     package.css?
+    #     package.js?
+    #
+    #     package.path    # '/css/application.css' => where to serve the compressed file
+    #
+    #     package.to_development_html
+    #     package.to_production_html
+    #
+    class Package
+      include HtmlHelpers
+      include BusterHelpers
+
+      def initialize(assets, name, type, path, filespecs)
+        @assets      = assets     # Options instance
+        @name        = name       # "application"
+        @type        = type       # :js or :css
+        @path        = path       # '/js/app.js' -- where to served the compressed file
+        @filespecs   = filespecs  # [ '/js/*.js' ]
+      end
+
+      attr_reader :type
+      attr_reader :path
+      attr_reader :filespecs
+      attr_reader :name
+
+      # Returns a list of URIs
+      def paths_and_files
+        @assets.glob *@filespecs
+      end
+
+      def files
+        paths_and_files.values
+      end
+
+      def paths
+        paths_and_files.keys
+      end
+
+      def mtime
+        files.map { |f| File.mtime(f).to_i }.max
+      end
+
+      # Returns the regex for the route, including cache buster crap.
+      def route_regex
+        re = @path.gsub(/(.[^.]+)$/) { |ext| "(?:\.[0-9]+)?#{ext}" }
+        /#{re}/
+      end
+
+      def to_development_html(options={})
+        paths_and_files.map { |path, file|
+          path = add_cache_buster(path, file)  # app.css => app.829378.css
+          link_tag(path, options)
+        }.join("\n")
+      end
+
+      # The URI path of the minified file (with cache buster)
+      def production_path
+        add_cache_buster @path, *files
+      end
+
+      def to_production_html(options={})
+        link_tag production_path, options
+      end
+
+      def minify
+        engine  = @assets.send(:"#{@type}_compression")
+        options = @assets.send(:"#{@type}_compression_options")
+
+        Compressor.compress combined, @type, engine, options
+      end
+
+      # The cache hash.
+      def hash
+        if @assets.app.development?
+          "#{name}.#{type}/#{mtime}"
+        else
+          "#{name}.#{type}"
+        end
+      end
+
+      def combined
+        session = Rack::Test::Session.new(@assets.app)
+        paths.map { |path| session.get(path).body }.join("\n")
+      end
+
+      def js?()  @type == :js; end
+      def css?() @type == :css; end
+
+    private
+      def link_tag(file, options={})
+        if js?
+          "<script type='text/javascript' src='#{e file}'#{kv options}></script>"
+        elsif css?
+          "<link rel='stylesheet' type='text/css' href='#{e file}'#{kv options} />"
+        end
+      end
+    end
+  end
+end

data/lib/sinatra/assetpack/rake.rb

@@ -0,0 +1,23 @@
+unless defined?(APP_FILE) && defined?(APP_CLASS)
+  $stderr.write "Error: Please set APP_FILE and APP_CLASS before setting up AssetPack rake tasks.\n"
+  $stderr.write "Example:\n"
+  $stderr.write "    APP_FILE  = 'init.rb'\n"
+  $stderr.write "    APP_CLASS = 'Application'\n"
+  $stderr.write "    require 'sinatra/assetpack/rake'\n"
+  $stderr.write "\n"
+  exit
+end
+
+def app
+  require File.expand_path(APP_FILE, Dir.pwd)
+  Object.const_get(APP_CLASS.to_sym)
+end
+
+namespace :assetpack do
+  desc "Build assets"
+  task :build do
+    app.assets.build! { |file|
+      puts "+ #{file.gsub(Dir.pwd, '')}"
+    }
+  end
+end

data/lib/sinatra/assetpack/version.rb

@@ -0,0 +1,7 @@
+module Sinatra
+  module AssetPack
+    def self.version
+      "0.0.5"
+    end
+  end
+end

data/sinatra-assetpack.gemspec

@@ -0,0 +1,23 @@
+require './lib/sinatra/assetpack/version'
+
+Gem::Specification.new do |s|
+  s.name = "sinatra-assetpack"
+  s.version = Sinatra::AssetPack.version
+  s.summary = %{Asset packager for Sinatra.}
+  s.description = %Q{Package your assets for Sinatra.}
+  s.authors = ["Rico Sta. Cruz"]
+  s.email = ["rico@sinefunc.com"]
+  s.homepage = "http://github.com/rstacruz/sinatra-assetpack"
+  s.files = `git ls-files`.strip.split("\n")
+  s.executables = Dir["bin/*"].map { |f| File.basename(f) }
+
+  s.add_dependency "sinatra"
+  s.add_dependency "jsmin"
+  s.add_dependency "rack-test"
+  s.add_development_dependency "yui-compressor"
+  s.add_development_dependency "sass"
+  s.add_development_dependency "haml"
+  s.add_development_dependency "coffee-script"
+  s.add_development_dependency "contest"
+  s.add_development_dependency "mocha"
+end

data/test/app/.gitignore

@@ -0,0 +1 @@
+public

data/test/app/Rakefile

@@ -0,0 +1,7 @@
+$:.unshift File.expand_path('../../../lib', __FILE__)
+
+APP_FILE  = 'app.rb'
+APP_CLASS = 'Main'
+
+require 'sinatra/assetpack/rake'
+

data/test/app/app.rb

@@ -0,0 +1,51 @@
+$:.unshift File.expand_path('../../../lib', __FILE__)
+
+require 'sinatra/base'
+require 'sinatra/assetpack'
+require 'coffee-script'
+
+class Main < Sinatra::Base
+  set :root, File.dirname(__FILE__)
+  set :views, "#{root}/app/views"
+
+  register Sinatra::AssetPack
+
+  enable  :raise_errors
+  disable :show_exceptions
+
+  assets {
+    #serve '/js',     :from => 'app/js'
+    serve '/css',    :from => 'app/css'
+    serve '/images', :from => 'app/images'
+
+    js :app, '/js/app.js', [
+      '/js/vendor/**/*.js',
+      '/js/assets/**/*.js',
+      '/js/hi.js',
+      '/js/hell*.js'
+    ]
+
+    css :application, '/css/application.css', [
+      '/css/screen.css'
+    ]
+
+    css :js2, '/css/js2.css', [
+      '/css/js2c.css'
+    ]
+
+    css :sq, '/css/sq.css', [
+      '/css/sqwishable.css'
+    ]
+  }
+
+  get '/index.html' do
+    haml :index
+  end
+
+  get '/helpers/css' do
+    haml %{
+      != css :application, :media => 'screen'
+    }.strip
+  end
+end
+

data/test/app/app/css/js2c.css

@@ -0,0 +1,494 @@
+html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  font-size: 100%;
+  font: inherit;
+  vertical-align: baseline;
+}
+
+body {
+  line-height: 1;
+}
+
+ol,ul {
+  list-style: none;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+caption,th,td {
+  text-align: left;
+  font-weight: normal;
+  vertical-align: middle;
+}
+
+q,blockquote {
+  quotes: none;
+}
+
+q:before,q:after,blockquote:before,blockquote:after {
+  content: "";
+  content: none;
+}
+
+a img {
+  border: none;
+}
+
+article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary {
+  display: block;
+}
+
+div,dl,dt,dd,ul,ol,li,form,fieldset,input,blockquote,th,td,legend {
+  margin: 0;
+  padding: 0;
+}
+
+pre,p,blockquote,h1,h2,h3,h4,h5,h6 {
+  margin: 1em 0 1em 0;
+}
+
+h1 {
+  font-size: 1.4em;
+}
+
+h2 {
+  font-size: 1.3em;
+}
+
+h3 {
+  font-size: 1.2em;
+}
+
+h4 {
+  font-size: 1.1em;
+}
+
+h5 {
+  font-size: 0.9em;
+}
+
+h6 {
+  font-size: 0.9em;
+}
+
+ol,ul {
+  margin-left: 2em;
+}
+
+blockquote {
+  border-left: solid 2px #ccc;
+  padding: 0 1em;
+  margin-left: 0.2em;
+  color: #888;
+}
+
+html,body {
+  margin: 0;
+  padding: 0;
+}
+
+button,body,td,input,textarea {
+  font-family: arial, helvetica, sans-serif;
+  font-size: 1em;
+}
+
+body {
+  font-size: 0.75em;
+  line-height: 1.5;
+  background: #fff;
+  color: #333;
+}
+
+#all {
+  margin: 0 auto;
+  width: auto;
+  position: relative;
+}
+
+h1,h2,h3,h4,h5,h6 {
+  font-family: arial, helvetica, sans-serif;
+}
+
+input,textarea {
+  line-height: 1.4;
+}
+
+textarea {
+  resize: vertical;
+}
+
+a {
+  color: #379;
+  text-decoration: none;
+}
+
+a:visited {
+  color: #3882a8;
+}
+
+a:hover {
+  color: #2d6b89;
+  text-decoration: underline;
+}
+
+a img {
+  border: 0;
+}
+
+button {
+  cursor: pointer;
+}
+
+article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary {
+  display: block;
+}
+
+.ace_scroller::-webkit-scrollbar,.ace_sb::-webkit-scrollbar {
+  height: 15px;
+  width: 15px;
+}
+
+.ace_scroller::-webkit-scrollbar-thumb,.ace_sb::-webkit-scrollbar-thumb {
+  border-width: 7px 7px 7px 7px;
+  -webkit-border-image: url(/images/scroll-dark.png) 7 7 7 7 round round;
+}
+
+html,body {
+  min-height: 100%;
+}
+
+a:hover {
+  text-decoration: none;
+}
+
+.hide {
+  display: none;
+}
+
+body {
+  background: #4d362d url(/images/bg-brown.jpg);
+  font-size: 11pt;
+  line-height: 1.6;
+}
+
+body,h1,h2,h3,h4,h5,h6,td {
+  font-family: palatino,serif;
+}
+
+#tabs {
+  overflow: hidden;
+  margin-top: 20px;
+  margin-left: 40px;
+}
+
+#tabs ul {
+  zoom: 1;
+}
+
+#tabs ul,#tabs ul li {
+  margin: 0;
+  padding: 0;
+  list-style-type: none;
+  display: block;
+}
+
+#tabs ul li {
+  background-image: none;
+}
+
+#tabs ul:after {
+  content: '';
+  clear: both;
+  display: block;
+  line-height: 0;
+  height: 0;
+  visibility: hidden;
+  zoom: 1;
+}
+
+#tabs ul li {
+  float: left;
+}
+
+#tabs a {
+  margin: 0 2px;
+  display: inline-block;
+  background: rgba(230,228,224,0.5);
+  -moz-border-radius-topleft: 4px;
+  -webkit-border-top-left-radius: 4px;
+  -o-border-top-left-radius: 4px;
+  -ms-border-top-left-radius: 4px;
+  -khtml-border-top-left-radius: 4px;
+  border-top-left-radius: 4px;
+  -moz-border-radius-topright: 4px;
+  -webkit-border-top-right-radius: 4px;
+  -o-border-top-right-radius: 4px;
+  -ms-border-top-right-radius: 4px;
+  -khtml-border-top-right-radius: 4px;
+  border-top-right-radius: 4px;
+  padding: 5px 25px;
+  color: rgba(238,238,238,0.7);
+  text-shadow: 1px 1px 0 rgba(0,0,0,0.3);
+  font-family: lato;
+  font-weight: 800;
+  font-size: 8pt;
+}
+
+#tabs a:hover {
+  background: rgba(230,228,224,0.7);
+  color: rgba(238,238,238,0.9);
+}
+
+#tabs a.active {
+  opacity: 1;
+  color: #333;
+  text-shadow: 0 0 1px rgba(255,255,255,0.6);
+}
+
+#tabs a.active.js2coffee {
+  background: #e6e4e0;
+}
+
+#tabs a.active.coffee2js {
+  background: #d3e9ed;
+}
+
+#editors {
+  overflow: hidden;
+  height: 640px;
+}
+
+#editors form {
+  position: relative;
+  height: 640px;
+  margin: 0 30px 10px 30px;
+  -moz-box-shadow: 1px 1px 0 rgba(0,0,0,0.1),0 2px 8px rgba(0,0,0,0.2);
+  -webkit-box-shadow: 1px 1px 0 rgba(0,0,0,0.1),0 2px 8px rgba(0,0,0,0.2);
+  -o-box-shadow: 1px 1px 0 rgba(0,0,0,0.1),0 2px 8px rgba(0,0,0,0.2);
+  box-shadow: 1px 1px 0 rgba(0,0,0,0.1),0 2px 8px rgba(0,0,0,0.2);
+  -moz-border-radius: 2px;
+  -webkit-border-radius: 2px;
+  -o-border-radius: 2px;
+  -ms-border-radius: 2px;
+  -khtml-border-radius: 2px;
+  border-radius: 2px;
+}
+
+#editors form#js2coffee {
+  background: #e6e4e0;
+  background-color: #e6e4e0;
+  background-image: -moz-linear-gradient(top, #e6e4e0, #faf9f8);
+  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #e6e4e0), color-stop(1, #faf9f8));
+  background-color: #e6e4e0;
+  background-image: -moz-linear-gradient(top, #e6e4e0, #e9e7e3);
+  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #e6e4e0), color-stop(1, #e9e7e3));
+  border-bottom: solid 2px #cfcdc9;
+}
+
+#editors form#coffee2js {
+  background: #d3e9ed;
+  background-color: #d3e9ed;
+  background-image: -moz-linear-gradient(top, #d3e9ed, #f6fafb);
+  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #d3e9ed), color-stop(1, #f6fafb));
+  background-color: #d3e9ed;
+  background-image: -moz-linear-gradient(top, #d3e9ed, #e9e7e3);
+  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #d3e9ed), color-stop(1, #e9e7e3));
+  border-bottom: solid 2px #bdd1d5;
+}
+
+#editors .editor,#editors .output {
+  opacity: 0.9;
+  position: absolute;
+  left: 10px;
+  top: 0;
+  right: 50%;
+  bottom: 0;
+  border: solid 15px #fff;
+  border-right-width: 5px;
+  background-color: #fff;
+}
+
+#editors .editor {
+  -moz-box-shadow: 3px 0 2px rgba(0,0,0,0.2),1px 0 0 rgba(0,0,0,0.2);
+  -webkit-box-shadow: 3px 0 2px rgba(0,0,0,0.2),1px 0 0 rgba(0,0,0,0.2);
+  -o-box-shadow: 3px 0 2px rgba(0,0,0,0.2),1px 0 0 rgba(0,0,0,0.2);
+  box-shadow: 3px 0 2px rgba(0,0,0,0.2),1px 0 0 rgba(0,0,0,0.2);
+}
+
+#editors .output {
+  -moz-box-shadow: 0 0 2px rgba(0,0,0,0.2);
+  -webkit-box-shadow: 0 0 2px rgba(0,0,0,0.2);
+  -o-box-shadow: 0 0 2px rgba(0,0,0,0.2);
+  box-shadow: 0 0 2px rgba(0,0,0,0.2);
+  opacity: 0.8;
+  right: 10px;
+  left: 50%;
+}
+
+#editors .error {
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  -ms-box-sizing: border-box;
+  box-sizing: border-box;
+  position: absolute;
+  top: 20px;
+  left: 50%;
+  max-width: 40%;
+  padding: 5px 10px;
+  background: rgba(153,51,51,0.9);
+  color: #eee;
+  text-shadow: 1px 1px 0 rgba(0,0,0,0.3);
+  z-index: 100;
+}
+
+p.more-info {
+  margin: 0 0 20px 0;
+  padding: 0;
+  text-align: center;
+}
+
+p.more-info a {
+  display: inline-block;
+  background: rgba(0,0,0,0.5);
+  -moz-border-radius-bottomleft: 4px;
+  -webkit-border-bottom-left-radius: 4px;
+  -o-border-bottom-left-radius: 4px;
+  -ms-border-bottom-left-radius: 4px;
+  -khtml-border-bottom-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+  -moz-border-radius-bottomright: 4px;
+  -webkit-border-bottom-right-radius: 4px;
+  -o-border-bottom-right-radius: 4px;
+  -ms-border-bottom-right-radius: 4px;
+  -khtml-border-bottom-right-radius: 4px;
+  border-bottom-right-radius: 4px;
+  font-family: lato,sans-serif;
+  text-transform: uppercase;
+  letter-spacing: 3px;
+  font-size: 7pt;
+  font-weight: normal;
+  color: #aaa;
+  text-shadow: 1px 1px 0 rgba(0,0,0,0.3);
+  padding: 5px 30px;
+}
+
+p.more-info a:hover {
+  background: rgba(215,125,45,0.7);
+  color: #fff;
+}
+
+#info {
+  background: #4d362d url(/images/bg-brown.jpg);
+  margin: 0 0 0 0;
+  overflow: hidden;
+  position: relative;
+  color: #eee;
+  text-shadow: 1px 1px 0 rgba(0,0,0,0.15);
+}
+
+#info a,#info a:visited {
+  color: #f7e5d5;
+  border-bottom: dotted 1px rgba(247,229,213,0.4);
+}
+
+#info a:hover,#info a:visited:hover {
+  background: rgba(0,0,0,0.2);
+  -moz-border-radius: 2px;
+  -webkit-border-radius: 2px;
+  -o-border-radius: 2px;
+  -ms-border-radius: 2px;
+  -khtml-border-radius: 2px;
+  border-radius: 2px;
+}
+
+#info h2 {
+  height: 66px;
+  text-indent: -9999px;
+  background: url(/images/h1.png) center 0 no-repeat;
+  margin: 50px 0;
+  padding: 0;
+}
+
+#info .logo {
+  margin: 90px 0 0 0;
+  height: 70px;
+  background: #eceae6;
+  border-top: solid 2px #253a3a;
+  border-bottom: solid 2px #253a3a;
+  text-align: center;
+}
+
+#info .logo img {
+  position: relative;
+  top: -63px;
+}
+
+#info article {
+  background: url(/images/bg-blue.jpg);
+  padding: 20px;
+  padding-top: 80px;
+}
+
+#info article > .c {
+  width: 400px;
+  padding-left: 200px;
+  margin: 0 auto;
+}
+
+#info h3 {
+  margin: 0;
+  padding: 0;
+  margin-left: -200px;
+  margin-top: 28px;
+  width: 170px;
+  float: left;
+  color: #d77d2d;
+  text-transform: uppercase;
+  font-family: lato;
+  text-align: right;
+  letter-spacing: 1px;
+  font-size: 9pt;
+}
+
+#info h3:first-child {
+  margin-top: 0;
+}
+
+#info h3 + p {
+  margin-top: 40px;
+}
+
+#info h4 {
+  color: #999;
+  border-top: solid 1px #ddd;
+  padding-top: 20px;
+  margin-top: 20px;
+  font-size: 1em;
+}
+
+#info code {
+  background: rgba(250,250,250,0.2);
+  border: solid 1px rgba(221,221,221,0.2);
+  ptopadding: 1px 4px;
+}
+
+a.github {
+  background-image: url(https://a248.e.akamai.net/assets.github.com/img/e6bef7a091f5f3138b8cd40bc3e114258dd68ddf/687474703a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f7265645f6161303030302e706e67);
+  background-position: 0 0;
+  background-repeat: no-repeat;
+  display: block;
+  width: 150px;
+  height: 150px;
+  overflow: hidden;
+  position: absolute;
+  text-indent: -9999px;
+  right: 0;
+  top: -20px;
+}
+
+