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
78 redef fun rendering
do
79 add
"<a{render_css_classes} href=\"{href}\
""
80 if title
!= null then add
" title=\"{title.write_to_string}\
""
85 # A `<h1>` to `<h6>` tag.
87 # Not really a Bootstrap component but used in other components
88 # that it required its own abstraction.
92 # var h1 = new Header(1, "Title")
93 # assert h1.write_to_string == "<h1>Title</h1>"
98 # var h6 = new Header.with_subtext(6, "Title", "with subtext")
99 # assert h6.write_to_string == "<h6>Title<small>with subtext</small></h6>"
104 # Header level between 1 and 6.
111 var subtext
: nullable Writable is noinit
, writable
113 # Creates a link with a `title` attribute.
114 init with_subtext
(level
: Int, text
: Writable, subtext
: String) do
117 self.subtext
= subtext
120 redef fun rendering
do
121 add
"<h{level}{render_css_classes}>{text.write_to_string}"
122 if subtext
!= null then add
"<small>{subtext.write_to_string}</small>"
127 # An abstract HTML list.
129 # Many Bootstrap components are built around a HTML list.
131 # Used to factorize behavior between OrderedList and UnorderedList.
132 abstract class HTMLList
135 # A list contains `<li>` tags as children.
138 var items
= new Array[ListItem]
140 # Adds a new ListItem to `self`.
141 fun add_li
(item
: ListItem) do items
.add item
143 # Does `self` contains no items?
144 fun is_empty
: Bool do return items
.is_empty
152 # var lst = new OrderedList
153 # lst.add_li(new ListItem("foo"))
154 # lst.add_li(new ListItem("bar"))
155 # lst.add_li(new ListItem("baz"))
157 # assert lst.write_to_string == """
168 redef fun rendering
do
169 addn
"<ol{render_css_classes}>"
170 for item
in items
do add item
180 # var lst = new UnorderedList
181 # lst.add_li(new ListItem("foo"))
182 # lst.add_li(new ListItem("bar"))
183 # lst.add_li(new ListItem("baz"))
185 # assert lst.write_to_string == """
196 redef fun rendering
do
197 addn
"<ul{render_css_classes}>"
198 for item
in items
do add item
207 # Content to display in this list item.
208 var text
: Writable is writable
210 redef fun rendering
do addn
"<li{render_css_classes}>{text.write_to_string}</li>"
215 # See http://getbootstrap.com/components/#glyphicons
220 # var icon = new BSIcon("star")
221 # assert icon.write_to_string == "<span class=\"glyphicon glyphicon-star\" aria-hidden=\"true\"></span>"
226 # Glyphicon name to display.
228 # See full list at http://getbootstrap.com/components/#glyphicons.
231 init do css_classes
.add
"glyphicon glyphicon-{icon}"
233 redef fun rendering
do
234 add
"<span{render_css_classes} aria-hidden=\"true\
"></span>"
238 # A Bootstrap breadcrumbs component.
240 # See http://getbootstrap.com/components/#breadcrumbs
245 # var bc = new BSBreadCrumbs
246 # bc.add_li(new ListItem("foo"))
247 # bc.add_li(new ListItem("bar"))
248 # bc.add_li(new ListItem("baz"))
250 # assert bc.write_to_string == """
251 # <ol class=\"breadcrumbs\">
254 # <li class=\"active\">baz</li>
261 init do css_classes
.add
"breadcrumbs"
263 redef fun rendering
do
264 items
.last
.css_classes
.add
"active"
269 # A Bootstrap label component.
271 # See http://getbootstrap.com/components/#labels
276 # var lbl = new BSLabel("danger", "Danger!")
277 # assert lbl.write_to_string == "<span class=\"label label-danger\">Danger!</span>"
282 # Class used to change the color of the label.
284 # Can be one of `default`, `primary`, `success`, `info`, `warning` or `danger`.
287 # Text to display in the label.
290 init do css_classes
.add
"label label-{color}"
292 redef fun rendering
do
293 add
"<span{render_css_classes}>{text.write_to_string}</span>"
297 # A Bootstrap badge component.
299 # See http://getbootstrap.com/components/#badges
304 # var b = new BSBadge("42 messages")
305 # assert b.write_to_string == "<span class=\"badge\">42 messages</span>"
310 # Text to display in the label.
313 init do css_classes
.add
"badge"
315 redef fun rendering
do
316 add
"<span{render_css_classes}>{text.write_to_string}</span>"
320 # A Bootstrap page header component.
322 # See http://getbootstrap.com/components/#page-header
327 # var h = new BSPageHeader("Welcome")
328 # assert h.write_to_string == """
329 # <div class=\"page-header\">
337 # Text to display as title.
340 init do css_classes
.add
"page-header"
342 redef fun rendering
do
343 addn
"<div{render_css_classes}>"
344 addn text
.write_to_string
349 # A Bootstrap alert component.
351 # See http://getbootstrap.com/components/#alerts
356 # var alert = new BSAlert("danger", "Danger!")
357 # assert alert.write_to_string == """
358 # <div class="alert alert-danger">
366 # Class used to change the color of the alert.
368 # Can be one of `primary`, `success`, `info`, `warning` or `danger`.
371 # Text to display in the alert.
374 # Can the alert be dismissed by clicking the close button?
376 # See http://getbootstrap.com/components/#alerts-dismissible
378 # Default is `false`.
379 var is_dismissible
= false
381 init do css_classes
.add
"alert alert-{color}"
383 redef fun rendering
do
384 addn
"<div{render_css_classes}>"
385 if is_dismissible
then
386 add
"<button type=\"button\
" class=\"close\
" data-dismiss=\"alert\
""
387 add
"aria-label=\"Close\
"><span aria-hidden=\"true\
">×</span>"
390 addn text
.write_to_string
395 # A Bootstrap panel component.
397 # See http://getbootstrap.com/components/#panels
402 # var p = new BSPanel("default", "Panel content")
404 # assert p.write_to_string == """
405 # <div class="panel panel-default">
406 # <div class="panel-body">
413 # Panel with heading:
416 # p = new BSPanel("danger", "Panel content")
417 # p.heading = "Panel heading"
419 # assert p.write_to_string == """
420 # <div class="panel panel-danger">
421 # <div class="panel-heading">
424 # <div class="panel-body">
435 # Can be one of `default`, `primary`, `success`, `info`, `warning` or `danger`.
438 # Panel header if any.
439 var heading
: nullable Writable is noinit
, writable
441 # Body to display in the panel.
444 # Panel footer is any.
445 var footer
: nullable Writable is noinit
, writable
447 init do css_classes
.add
"panel panel-{color}"
449 redef fun rendering
do
450 addn
"<div{render_css_classes}>"
451 if heading
!= null then
452 addn
"<div class=\"panel-heading\
">"
453 addn heading
.write_to_string
456 addn
"<div class=\"panel-body\
">"
457 addn body
.write_to_string
459 if footer
!= null then
460 addn
"<div class=\"panel-footer\
">"
461 addn footer
.write_to_string