Class: JsMenuBuilder

Inherits:
Object
  • Object
show all
Defined in:
lib/jsmenubuilder.rb

Constant Summary collapse

TABS_CSS =
<<EOF
/* Style the tab */
.tab {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
}
EOF
TABS_JS =
<<EOF
function openTab(evt, tabName) {
  // Declare all variables
  var i, tabcontent, tablinks;

  // Get all elements with class="tabcontent" and hide them
  tabcontent = document.getElementsByClassName("tabcontent");
  for (i = 0; i < tabcontent.length; i++) {
    tabcontent[i].style.display = "none";
  }

  // Get all elements with class="tablinks" and remove the class "active"
  tablinks = document.getElementsByClassName("tablinks");
  for (i = 0; i < tablinks.length; i++) {
    tablinks[i].className = tablinks[i].className.replace(" active", "");
  }

  // Show the current tab, and add an "active" class to the button that opened the tab
  document.getElementById(tabName).style.display = "block";
  evt.currentTarget.className += " active";
}

// Get the element with id="defaultOpen" and click on it
document.getElementById("defaultOpen").click();
EOF
FULL_PAGE_TABS_CSS =
<<EOF
/* Set height of body and the document to 100% to enable "full page tabs" */
body, html {
  height: 100%;
  margin: 0;
  font-family: Arial;
}

/* Style tab links */
.tablink {
  background-color: #555;
  color: white;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  font-size: 17px;
  width: 25%;
}

button.active {
  background-color: #c55;
}

.tablink:hover {
  background-color: #777;
}



/* Style the tab content (and add height:100% for full page content) */
.tabcontent {
  color: #000;
  display: none;
  padding: 100px 20px;
  height: 100%;
}

EOF
FULL_PAGE_TABS_JS =
<<EOF
function openPage(pageName,elmnt) {
  var i, tabcontent;
  tabcontent = document.getElementsByClassName("tabcontent");
  for (i = 0; i < tabcontent.length; i++) {
    tabcontent[i].style.display = "none";
  }

  // Get all elements with class="tablink" and remove the class "active"
  tablink = document.getElementsByClassName("tablink");
  for (i = 0; i < tablink.length; i++) {
    tablink[i].className = tablink[i].className.replace(" active", "");
  }


  document.getElementById(pageName).style.display = "block";
  elmnt.className += " active";
}

// Get the element with id="defaultOpen" and click on it
document.getElementById("defaultOpen").click();
EOF

Instance Attribute Summary collapse

Instance Method Summary collapse

Constructor Details

#initialize(unknown = nil, options = {}) ⇒ JsMenuBuilder

Returns a new instance of JsMenuBuilder.



143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
# File 'lib/jsmenubuilder.rb', line 143

def initialize(unknown=nil, options={})
  
  if unknown.is_a? String or unknown.is_a? Symbol then
    type = unknown.to_sym
  elsif unknown.is_a? Hash
    options = unknown
  end
  
  @debug = options[:debug]

  @types = %i(tabs full_page_tabs)
  
  build(type, options) if type

end

Instance Attribute Details

#cssObject (readonly)

Returns the value of attribute css.



141
142
143
# File 'lib/jsmenubuilder.rb', line 141

def css
  @css
end

#htmlObject (readonly)

Returns the value of attribute html.



141
142
143
# File 'lib/jsmenubuilder.rb', line 141

def html
  @html
end

#jsObject (readonly)

Returns the value of attribute js.



141
142
143
# File 'lib/jsmenubuilder.rb', line 141

def js
  @js
end

Instance Method Details

#import(xml) ⇒ Object



159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
# File 'lib/jsmenubuilder.rb', line 159

def import(xml)
  
  puts 'inside import'.info if @debug
  doc = Rexle.new(xml)
  type = doc.root.attributes[:mode]
  
  type = if type == 'fullpage' then
  'full_page_tabs'
  elsif type.nil?
    doc.root.name unless type
  end
  
  tabs = doc.root.xpath('tab').inject({}) do |r, tab|
    r.merge(tab.attributes[:title] => tab.children.join.strip)
  end
  
  e = doc.root.element('tab[@mode="active"]')
  
  default_tab = if e then
    title = e.attributes[:title]
    (tabs.keys.index(title) + 1).to_s
  else
    '1'
  end

  h = { active: default_tab, tabs: tabs}
  build(type, h)
  self
  
end

#to_cssObject



190
191
192
# File 'lib/jsmenubuilder.rb', line 190

def to_css()
  @css
end

#to_htmlObject



194
195
196
# File 'lib/jsmenubuilder.rb', line 194

def to_html()
  @html
end

#to_jsObject



198
199
200
# File 'lib/jsmenubuilder.rb', line 198

def to_js()
  @js
end

#to_webpageObject



202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
# File 'lib/jsmenubuilder.rb', line 202

def to_webpage()

  a = RexleBuilder.build do |xml|
    xml.html do 
      xml.head do
        xml.meta name: "viewport", content: \
            "width=device-width, initial-scale=1"
        xml.style "\nbody {font-family: Arial;}\n\n" + @css
      end
      xml.body
    end
  end

  doc = Rexle.new(a)
  e = Rexle.new("<html>%s</html>" % @html).root
  
  e.children.each {|child| doc.root.element('body').add child }
  
  doc.root.element('body').add \
      Rexle::Element.new('script').add_text "\n" + 
      @js.gsub(/^ +\/\/[^\n]+\n/,'')
  
  "<!DOCTYPE html>\n" + doc.xml(pretty: true, declaration: false)\
      .gsub(/<\/div>/,'\0' + "\n").gsub(/\n *<!--[^>]+>/,'')
  
end

#to_xmlObject



229
230
231
# File 'lib/jsmenubuilder.rb', line 229

def to_xml()
  @xml
end