Module: Fron::Sheet

Defined in:
opal/fron/core/sheet.rb

Overview

Module for handling component styles

Defined Under Namespace

Classes: Helpers

Class Attribute Summary collapse

Class Method Summary collapse

Class Attribute Details

.additional_styles ⇒ Object

Returns the value of attribute additional_styles.



5
6
7
 
# File 'opal/fron/core/sheet.rb', line 5

def additional_styles
  @additional_styles
end

Class Method Details

.add_animation(name, data) ⇒ Object

Adds an animation with the given data

Parameters:

  • name (String) —

    The name

  • data (Hash) —

    The data



124
125
126
127
128
 
# File 'opal/fron/core/sheet.rb', line 124

def add_animation(name, data)
  @rules ||= {}
  return if @rules["@keyframes #{name}"]
  @rules["@keyframes #{name}"] ||= data
end

.add_rule(tag, data, id) ⇒ Object

Adds a rule for the given tag with the given data

Parameters:

  • tag (String) —

    The selector for the tag

  • data (Hash) —

    The styles



26
27
28
29
30
31
32
33
34
35
36
 
# File 'opal/fron/core/sheet.rb', line 26

def add_rule(tag, data, id)
  @rules ||= {}
  @rules[tag] ||= {}
  @rules[tag][id] ||= data.each_with_object({}) do |(key, value), style|
    if value.is_a? Hash
      handle_rule_raw_hash tag, key, value
    else
      style[key] = value
    end
  end
end

.handle_rule_raw_hash(tag, key, value) ⇒ Object 



38
39
40
41
42
43
44
45
46
47
48
 
# File 'opal/fron/core/sheet.rb', line 38

def handle_rule_raw_hash(tag, key, value)
  value['_rule_id'] ||= SecureRandom.uuid
  id = value['_rule_id']
  if key =~ /&/
    add_rule key.gsub(/&/, tag), value, id
  else
    key.split(',').each do |part|
      add_rule "#{tag.strip} #{part.strip}", value, id
    end
  end
end

.helper ⇒ Helper

Returns the helper for the proc rendering.

Returns:

  • (Helper) —

    The helper



75
76
77
 
# File 'opal/fron/core/sheet.rb', line 75

def helper
  @helper ||= Helpers.new
end

.helpers(&block) ⇒ Object

Elavulates the given block in the helper scope.

Parameters:

  • block (Proc) —

    The block



82
83
84
 
# File 'opal/fron/core/sheet.rb', line 82

def helpers(&block)
  Helpers.class_eval(&block)
end

.render ⇒ Object

Renders the styles



51
52
53
54
55
 
# File 'opal/fron/core/sheet.rb', line 51

def render
  [render_stylesheets,
   additional_styles.to_s,
   render_rules].join("\n")
end

.render_at_block(data) ⇒ Object

Renders an at block

Parameters:

  • data (Hash) —

    The data



89
90
91
 
# File 'opal/fron/core/sheet.rb', line 89

def render_at_block(data)
  data.map { |key, block| "#{key} { #{render_block(block)} }" }.join('')
end

.render_block(block) ⇒ Object

Renders an block of single key, values

Parameters:

  • data (Hash) —

    The data



103
104
105
106
107
 
# File 'opal/fron/core/sheet.rb', line 103

def render_block(block)
  block.map do |prop, value|
    render_property prop, value
  end.join('')
end

.render_property(prop, value) ⇒ Object 



109
110
111
112
113
114
 
# File 'opal/fron/core/sheet.rb', line 109

def render_property(prop, value)
  return if prop == '_rule_id'
  val = value.is_a?(Proc) ? helper.instance_eval(&value) : value
  prop = prop.gsub(/(.)([A-Z])/, '\1-\2').downcase
  "#{prop}: #{val};"
end

.render_rule(data) ⇒ Object

Renders a rule with multiple “versions”

Parameters:

  • data (Hash) —

    The data



96
97
98
 
# File 'opal/fron/core/sheet.rb', line 96

def render_rule(data)
  render_block data.values.reduce(&:merge).to_h
end

.render_rules ⇒ Object 



57
58
59
60
61
62
 
# File 'opal/fron/core/sheet.rb', line 57

def render_rules
  @rules.map { |tag, data|
    body = tag.start_with?('@') ? render_at_block(data) : render_rule(data)
    "#{tag} { #{body} }"
  }.join("\n")
end

.render_style_tag ⇒ Object 



116
117
118
 
# File 'opal/fron/core/sheet.rb', line 116

def render_style_tag
  style.text = render
end

.render_stylesheets ⇒ Object 



64
65
66
67
68
69
70
 
# File 'opal/fron/core/sheet.rb', line 64

def render_stylesheets
  @stylesheets
    .to_h
    .keys
    .map { |url| "@import(#{url});" }
    .join("\n")
end

.style ⇒ DOM::Element

Creates style tag to store the styles

Returns:



14
15
16
17
18
19
 
# File 'opal/fron/core/sheet.rb', line 14

def style
  return @style if @style
  @style = DOM::Element.new 'style'
  @style >> DOM::Document.head
  @style
end

.stylesheet(url) ⇒ Object

Defines a stylesheet link tag

Parameters:

  • url (String) —

    The URL for the stylesheet



133
134
135
136
137
 
# File 'opal/fron/core/sheet.rb', line 133

def stylesheet(url)
  @stylesheets ||= {}
  return if @stylesheets[url]
  @stylesheets[url] = true
end