1 # This file is part of NIT ( http://www.nitlanguage.org ).
3 # Licensed under the Apache License, Version 2.0 (the "License");
4 # you may not use this file except in compliance with the License.
5 # You may obtain a copy of the License at
7 # http://www.apache.org/licenses/LICENSE-2.0
9 # Unless required by applicable law or agreed to in writing, software
10 # distributed under the License is distributed on an "AS IS" BASIS,
11 # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 # See the License for the specific language governing permissions and
13 # limitations under the License.
15 # HTML templates for Bootstrap components.
17 # See http://getbootstrap.com/components/
22 # Bootstrap component abstraction.
24 # Mainly used to factoryze CSS treatments.
25 # Can be used in the future to handle generic stuff like attributes or escaping.
27 # TODO merge with html::HTMTag without init conflict?
28 # HTMLTag requires the main init to pass a tagname,
29 # this was so much verbose here.
30 abstract class BSComponent
33 # CSS classes to add on this element.
34 var css_classes
= new Array[String]
36 # Render `self` css clases as a `class` attribute.
37 fun render_css_classes
: String do
38 if css_classes
.is_empty
then return ""
39 return " class=\"{css_classes.join(" ")}\
""
45 # Not really a Bootstrap component but used in other components
46 # that it required its own abstraction.
50 # var lnk = new Link("http://nitlanguage.org", "Nit")
51 # assert lnk.write_to_string == "<a href=\"http://nitlanguage.org\">Nit</a>"
54 # Creates a link with a title attribute:
56 # lnk = new Link.with_title("http://nitlanguage.org", "Nit", "Nit homepage")
57 # assert lnk.write_to_string == "<a href=\"http://nitlanguage.org\" title=\"Nit homepage\">Nit</a>"
62 # URL pointed by this link.
63 var href
: String is writable
66 var text
: Writable is writable
69 var title
: nullable String is noinit
, writable
71 # Creates a link with a `title` attribute.
72 init with_title
(href
: String, text
: Writable, title
: nullable String) do
77 redef fun rendering
do
78 add
"<a{render_css_classes} href=\"{href}\
""
79 if title
!= null then add
" title=\"{title.write_to_string}\
""
84 # A `<h1>` to `<h6>` tag.
86 # Not really a Bootstrap component but used in other components
87 # that it required its own abstraction.
91 # var h1 = new Header(1, "Title")
92 # assert h1.write_to_string == "<h1>Title</h1>"
97 # var h6 = new Header.with_subtext(6, "Title", "with subtext")
98 # assert h6.write_to_string == "<h6>Title<small>with subtext</small></h6>"
103 # Header level between 1 and 6.
110 var subtext
: nullable Writable is noinit
, writable
112 # Creates a link with a `title` attribute.
113 init with_subtext
(level
: Int, text
: Writable, subtext
: String) do
115 self.subtext
= subtext
118 redef fun rendering
do
119 add
"<h{level}{render_css_classes}>{text.write_to_string}"
120 if subtext
!= null then add
"<small>{subtext.write_to_string}</small>"
125 # An abstract HTML list.
127 # Many Bootstrap components are built around a HTML list.
129 # Used to factorize behavior between OrderedList and UnorderedList.
130 abstract class HTMLList
133 # A list contains `<li>` tags as children.
136 var items
= new Array[ListItem]
138 # Adds a new ListItem to `self`.
139 fun add_li
(item
: ListItem) do items
.add item
141 # Does `self` contains no items?
142 fun is_empty
: Bool do return items
.is_empty
150 # var lst = new OrderedList
151 # lst.add_li(new ListItem("foo"))
152 # lst.add_li(new ListItem("bar"))
153 # lst.add_li(new ListItem("baz"))
155 # assert lst.write_to_string == """
166 redef fun rendering
do
167 addn
"<ol{render_css_classes}>"
168 for item
in items
do add item
178 # var lst = new UnorderedList
179 # lst.add_li(new ListItem("foo"))
180 # lst.add_li(new ListItem("bar"))
181 # lst.add_li(new ListItem("baz"))
183 # assert lst.write_to_string == """
194 redef fun rendering
do
195 addn
"<ul{render_css_classes}>"
196 for item
in items
do add item
205 # Content to display in this list item.
206 var text
: Writable is writable
208 redef fun rendering
do addn
"<li{render_css_classes}>{text.write_to_string}</li>"
213 # See http://getbootstrap.com/components/#glyphicons
218 # var icon = new BSIcon("star")
219 # assert icon.write_to_string == "<span class=\"glyphicon glyphicon-star\" aria-hidden=\"true\"></span>"
224 # Glyphicon name to display.
226 # See full list at http://getbootstrap.com/components/#glyphicons.
229 init do css_classes
.add
"glyphicon glyphicon-{icon}"
231 redef fun rendering
do
232 add
"<span{render_css_classes} aria-hidden=\"true\
"></span>"
236 # A Bootstrap breadcrumbs component.
238 # See http://getbootstrap.com/components/#breadcrumbs
243 # var bc = new BSBreadCrumbs
244 # bc.add_li(new ListItem("foo"))
245 # bc.add_li(new ListItem("bar"))
246 # bc.add_li(new ListItem("baz"))
248 # assert bc.write_to_string == """
249 # <ol class=\"breadcrumbs\">
252 # <li class=\"active\">baz</li>
259 init do css_classes
.add
"breadcrumbs"
261 redef fun rendering
do
262 items
.last
.css_classes
.add
"active"
267 # A Bootstrap label component.
269 # See http://getbootstrap.com/components/#labels
274 # var lbl = new BSLabel("danger", "Danger!")
275 # assert lbl.write_to_string == "<span class=\"label label-danger\">Danger!</span>"
280 # Class used to change the color of the label.
282 # Can be one of `default`, `primary`, `success`, `info`, `warning` or `danger`.
285 # Text to display in the label.
288 init do css_classes
.add
"label label-{color}"
290 redef fun rendering
do
291 add
"<span{render_css_classes}>{text.write_to_string}</span>"
295 # A Bootstrap badge component.
297 # See http://getbootstrap.com/components/#badges
302 # var b = new BSBadge("42 messages")
303 # assert b.write_to_string == "<span class=\"badge\">42 messages</span>"
308 # Text to display in the label.
311 init do css_classes
.add
"badge"
313 redef fun rendering
do
314 add
"<span{render_css_classes}>{text.write_to_string}</span>"
318 # A Bootstrap page header component.
320 # See http://getbootstrap.com/components/#page-header
325 # var h = new BSPageHeader("Welcome")
326 # assert h.write_to_string == """
327 # <div class=\"page-header\">
335 # Text to display as title.
338 init do css_classes
.add
"page-header"
340 redef fun rendering
do
341 addn
"<div{render_css_classes}>"
342 addn text
.write_to_string
347 # A Bootstrap alert component.
349 # See http://getbootstrap.com/components/#alerts
354 # var alert = new BSAlert("danger", "Danger!")
355 # assert alert.write_to_string == """
356 # <div class="alert alert-danger">
364 # Class used to change the color of the alert.
366 # Can be one of `primary`, `success`, `info`, `warning` or `danger`.
369 # Text to display in the alert.
372 # Can the alert be dismissed by clicking the close button?
374 # See http://getbootstrap.com/components/#alerts-dismissible
376 # Default is `false`.
377 var is_dismissible
= false
379 init do css_classes
.add
"alert alert-{color}"
381 redef fun rendering
do
382 addn
"<div{render_css_classes}>"
383 if is_dismissible
then
384 add
"<button type=\"button\
" class=\"close\
" data-dismiss=\"alert\
""
385 add
"aria-label=\"Close\
"><span aria-hidden=\"true\
">×</span>"
388 addn text
.write_to_string
393 # A Bootstrap panel component.
395 # See http://getbootstrap.com/components/#panels
400 # var p = new BSPanel("default", "Panel content")
402 # assert p.write_to_string == """
403 # <div class="panel panel-default">
404 # <div class="panel-body">
411 # Panel with heading:
414 # p = new BSPanel("danger", "Panel content")
415 # p.heading = "Panel heading"
417 # assert p.write_to_string == """
418 # <div class="panel panel-danger">
419 # <div class="panel-heading">
422 # <div class="panel-body">
433 # Can be one of `default`, `primary`, `success`, `info`, `warning` or `danger`.
436 # Panel header if any.
437 var heading
: nullable Writable is noinit
, writable
439 # Body to display in the panel.
442 # Panel footer is any.
443 var footer
: nullable Writable is noinit
, writable
445 init do css_classes
.add
"panel panel-{color}"
447 redef fun rendering
do
448 addn
"<div{render_css_classes}>"
449 if heading
!= null then
450 addn
"<div class=\"panel-heading\
">"
451 addn heading
.write_to_string
454 addn
"<div class=\"panel-body\
">"
455 addn body
.write_to_string
457 if footer
!= null then
458 addn
"<div class=\"panel-footer\
">"
459 addn footer
.write_to_string