I want to use Sass color functions within a class, without the Sass Engine. I'm already using the sass gem in the project so i thought piggy-backing would be something as easy as:
class Rectangle
include Sass::Script::Functions
def color
Sass::Script::Color.new([0x82, 0x39, 0x06])
end
def render
#haml engine executed with context of self
#so that within temlate i could call
# %stop{offset: '0%', stop: {color: lighten(color)}}
end
end
UPDATE: see #render
above, i want to call lighten(color)
from within a haml template rendered within the context of a Rectangle
instance
But i get an undefined method assert_type
error. The assert_type
method is defined within the Sass::Script::Functions::EvaluationContext
class. (github file)
Playing around in irb
, just to get something close to what i want looks like this:
require 'sass'
eval_context = Sass::Script::Functions::EvaluationContext.new({})
#yes the Sass::Script::Number.new(10) is requried, a simple 10 will not work
color = eval_context.rgb(Sass::Script::Number.new(10), Sass::Script::Number.new(10), Sass::Script::Number.new(10))
eval_context.lighten(color, Sass::Script::Number.new(10))
which is crazy - am i missing something?
Sass Set Color Functions An RGB color value is specified with: rgb(red, green, blue). Each parameter defines the intensity of that color and can be an integer between 0 and 255, or a percentage value (from 0% to 100%). Sets a color using the Red-Green-Blue-Alpha (RGBA) model.
Using lighten() and darken() in SASS As the names suggest, given a colour and percentage, these functions will return a colour lighter or darker respectively.
With Sass, just wrap your color with rgba() and the opacity value as you would with normal CSS. Sass will take care of breaking down the color value into the correct RGB values.
Sass::Script::Parser.parse('lighten(#333, 10)', 0, 0).perform(Sass::Environment.new)
Update
Now that I understand your problem better, why not just rewrite the functionality.
require 'sass'
class Rectangle
include Sass::Script
def color
@color ||= Sass::Script::Color.new([0x82, 0x39, 0x06])
end
def lighten(ammount)
hsl = color.hsl.dup
hsl[2] += ammount
@color = Sass::Script::Color.new(hue: hsl[0], saturation: hsl[1], lightness: [2])
end
end
rec = Rectangle.new
rec.lighten(20)
Old Answer
You aren't crazy, you've just included the wrong piece.
This code runs as you expect it. Notice that I removed the ::Functions
from the include.
require 'sass'
class Rectangle
include Sass::Script
def color
color = Sass::Script::Color.new([0x82, 0x39, 0x06])
puts color.class
end
end
rec = Rectangle.new
rec.color
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With