add sass functionality, like whoa

This commit is contained in:
John Bintz 2012-08-23 09:43:15 -04:00
parent 0359d3bc7b
commit 8d2366b9f5
5 changed files with 26 additions and 3 deletions

View File

@ -1,13 +1,13 @@
# Bullseye! # Bullseye!
An *extremely quickly written* shoot-from-the-hip implementation of [so-called Garber-Irish DOM-ready execution](http://viget.com/inspire/extending-paul-irishs-comprehensive-dom-ready-execution) An *extremely quickly written* shoot-from-the-hip implementation of [so-called Garber-Irish DOM-ready execution](http://viget.com/inspire/extending-paul-irishs-comprehensive-dom-ready-execution)
for the Rails asset pipeline. Could work with other Sprockets stuff down the road, too. But for now, it's for the Rails asset pipeline. Even provides functionalty for Sass to target those pages! Could work with other Sprockets stuff down the road, too. But for now, it's
pretty married to Rails. Also, needs tests for the exactly four things that it does. Anyone wanna add exactly four Cucumber features? pretty married to Rails. Also, needs tests for the exactly four things that it does. Anyone wanna add exactly four Cucumber features?
## Why? ## Why?
I got sick of on-page JavaScript. Also I like using the Asset Pipeline for what it's actually intended for, I got sick of on-page JavaScript. Also I like using the Asset Pipeline for what it's actually intended for,
reducing the number of HTTP requests. reducing the number of HTTP requests. Finally, targeting pages in Sass should be easy.
## How? ## How?
@ -51,4 +51,12 @@ alert("I am showing a site");
alert "I am also showing a site" alert "I am also showing a site"
``` ```
Want to target that page in your Sass? Use a little string interpolation and a function that generates a selector:
``` sass
#{bullseye('sites/show')} {
background-color: green;
}
```
Piece of cake. Piece of cake.

View File

@ -17,4 +17,5 @@ Gem::Specification.new do |gem|
gem.add_dependency 'tilt' gem.add_dependency 'tilt'
gem.add_dependency 'sprockets' gem.add_dependency 'sprockets'
gem.add_dependency 'sass'
end end

View File

@ -1,3 +1,4 @@
require "bullseye/version" require "bullseye/version"
require 'bullseye/engine' if defined?(Rails::Engine) require 'bullseye/engine' if defined?(Rails::Engine)
require 'bullseye/tilt/bullseye_template' require 'bullseye/tilt/bullseye_template'
require 'bullseye/sass/bullseye_functions'

View File

@ -0,0 +1,13 @@
require 'sass'
module Sass::Script::Functions
def bullseye(target)
assert_type target, :String
parts = target.value.split('/')
action = parts.pop
controller = parts.join('/')
Sass::Script::String.new("body[data-action='#{action}'][data-controller='#{controller}']")
end
end

View File

@ -1,3 +1,3 @@
module Bullseye module Bullseye
VERSION = "0.0.1" VERSION = "0.0.2"
end end