src/doc/html_templates/html_components.nit

   1 # This file is part of NIT ( http://www.nitlanguage.org ).
   2 #
   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
   6 #
   7 # http://www.apache.org/licenses/LICENSE-2.0
   8 #
   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.
  14
  15 # HTML templates used by Nitdoc to generate API documentation
  16 # Pages are assembled using `Template`
  17 module html_components
  18
  19 import doc_base
  20 import html::bootstrap
  21 import json
  22
  23 # A label with a text content.
  24 class DocHTMLLabel
  25         super BSLabel
  26
  27         redef init do
  28                 css_classes.clear
  29                 css_classes.add "label"
  30         end
  31
  32         # Init this label from css classes.
  33         init with_classes(classes: Array[String]) do
  34                 init("label", "")
  35                 css_classes.add_all classes
  36         end
  37 end
  38
  39 # A component that display tabbed data.
  40 class DocTabs
  41         super BSComponent
  42         autoinit(html_id, drop_text, css_classes)
  43
  44         # HTML id of this component.
  45         var html_id: String
  46
  47         # Text displayed on the tabs dropdown button.
  48         var drop_text: String
  49
  50         # Panels to display in this tab group.
  51         var panels = new Array[DocTabPanel]
  52
  53         # Droplist containing links to panels.
  54         #
  55         # Can also be used to add external links.
  56         var drop_list: DocTabsDrop is lazy do return new DocTabsDrop(html_id, drop_text)
  57
  58         # Adds a new `panel` to that tab.
  59         #
  60         # You should always use this instead of `panels.add` because it also set the
  61         # `drop_list` entry.
  62         fun add_panel(panel: DocTabPanel) do
  63                 drop_list.add_li panel.render_tab
  64                 panels.add panel
  65         end
  66
  67         redef fun rendering do
  68                 if panels.is_empty then return
  69                 panels.first.is_active = true
  70                 add "<div role=\"tabpanel\">"
  71                 if drop_list.items.length > 1 then add drop_list
  72                 add " <div class=\"tab-content\">"
  73                 for panel in panels do
  74                         add panel
  75                 end
  76                 add " </div>"
  77                 add "</div>"
  78         end
  79 end
  80
  81 # A list of tab regrouped in a dropdown
  82 class DocTabsDrop
  83         super UnorderedList
  84         autoinit(html_id, html_title, items, css_classes)
  85
  86         # HTML id used by the tabs group.
  87         var html_id: String
  88
  89         # Title to display in the tab item.
  90         var html_title: String
  91
  92         redef fun rendering do
  93                 add """<ul id="{{{html_id}}}-tabs" class="nav pull-right" role="tablist">"""
  94                 add """ <li role="presentation" class="dropdown pull-right">"""
  95                 add """  <a href="#" id="{{{html_id}}}-drop" class="dropdown-toggle"
  96                           data-toggle="dropdown" aria-controls="{{{html_id}}}-contents"
  97                           aria-expanded="false">"""
  98         add html_title
  99                 add """ <span class="glyphicon glyphicon-menu-hamburger"></span>"""
 100                 add """ </a>"""
 101                 add """ <ul class="dropdown-menu" role="menu"
 102                          aria-labelledby="{{{html_id}}}-drop" id="{{{html_id}}}-contents">"""
 103                 for item in items do add item
 104                 add "  </ul>"
 105         add " </li>"
 106         add "</ul>"
 107         end
 108 end
 109
 110 # A panel that goes in a DocTabs.
 111 class DocTabPanel
 112         super BSComponent
 113         autoinit(html_id, tab_title, html_content, is_active, css_classes)
 114
 115         # HTML id of this panel.
 116         var html_id: String
 117
 118         # Title of this panel as displayed in the tab label.
 119         var tab_title: String
 120
 121         # HTML content of this panel.
 122         var html_content: Writable is writable
 123
 124         # Is this panel visible by default?
 125         var is_active = false is optional
 126
 127         redef fun rendering do
 128                 var active = ""
 129                 if is_active then active = "active in"
 130                 add "<div role=\"tabpanel\" class=\"tab-pane fade {active}\""
 131                 add "  id=\"{html_id}\" aria-labelledby=\"{html_id}-tab\">"
 132                 add html_content
 133                 add "</div>"
 134         end
 135
 136         private fun render_tab: DocTabItem do return new DocTabItem(tab_title, html_id)
 137 end
 138
 139 # A ListItem that goes in a DocTabsDrop.
 140 private class DocTabItem
 141         super ListItem
 142         autoinit(text, target_id, css_classes)
 143
 144         # Panel id to trigger when the link is clicked.
 145         var target_id: String
 146
 147         redef fun rendering do
 148                 add "<li{render_css_classes}>"
 149                 add " <a role=\"tab\" data-toggle=\"tab\" aria-expanded=\"false\" tabindex=\"-1\""
 150                 add "   id=\"{target_id}-tab\" href=\"#{target_id}\" aria-controls=\"{target_id}\">"
 151                 add text
 152                 add " </a>"
 153                 add "</li>"
 154         end
 155 end
 156
 157 # A HTML tag attribute
 158 #  `<tag attr="value">`
 159 #
 160 # ~~~nit
 161 # var attr: TagAttribute
 162 #
 163 # attr = new TagAttribute("foo", null)
 164 # assert attr.write_to_string == " foo=\"\""
 165 #
 166 # attr = new TagAttribute("foo", "bar<>")
 167 # assert attr.write_to_string == " foo=\"bar&lt;&gt;\""
 168 # ~~~
 169 class TagAttribute
 170         super Template
 171
 172         var name: String
 173         var value: nullable String
 174
 175         redef fun rendering do
 176                 var value = self.value
 177                 if value == null then
 178                         # SEE: http://www.w3.org/TR/html5/infrastructure.html#boolean-attributes
 179                         add " {name.html_escape}=\"\""
 180                 else
 181                         add " {name.html_escape}=\"{value.html_escape}\""
 182                 end
 183         end
 184 end
 185
 186 # Javacript template that can be added into a DocPage.
 187 class TplScript
 188         super Template
 189
 190         # HTML attributes to add in this tag.
 191         var attrs = new Array[TagAttribute]
 192
 193         # Text content of this script tag.
 194         var content: nullable Writable = null is writable
 195
 196         init do
 197                 attrs.add(new TagAttribute("type", "text/javascript"))
 198         end
 199
 200         # Render the content of this script.
 201         protected fun render_content do
 202                 if content != null then add content.as(not null)
 203         end
 204
 205         redef fun rendering do
 206                 add "<script"
 207                 for attr in attrs do add attr
 208                 addn ">"
 209                 render_content
 210                 addn "</script>"
 211         end
 212 end
 213
 214 # JS script for Piwik Tracker
 215 class TplPiwikScript
 216         super TplScript
 217
 218         # Piwik URL to use for this tracker.
 219         var tracker_url: String
 220
 221         # Site ID used on Piwik system.
 222         var site_id: String
 223
 224         redef fun render_content do
 225                 var site_id = self.site_id.to_json
 226                 var tracker_url = self.tracker_url.trim
 227                 if tracker_url.chars.last != '/' then tracker_url += "/"
 228                 tracker_url = "://{tracker_url}".to_json
 229
 230                 addn "<!-- Piwik -->"
 231                 addn "var _paq = _paq || [];"
 232                 addn " _paq.push([\"trackPageView\"]);"
 233                 addn " _paq.push([\"enableLinkTracking\"]);"
 234                 addn "(function() \{"
 235                 addn " var u=((\"https:\" == document.location.protocol) ? \"https\" : \"http\") + {tracker_url};"
 236                 addn " _paq.push([\"setTrackerUrl\", u+\"piwik.php\"]);"
 237                 addn " _paq.push([\"setSiteId\", {site_id}]);"
 238                 addn " var d=document, g=d.createElement(\"script\"), s=d.getElementsByTagName(\"script\")[0]; g.type=\"text/javascript\";"
 239                 addn " g.defer=true; g.async=true; g.src=u+\"piwik.js\"; s.parentNode.insertBefore(g,s);"
 240                 addn "\})();"
 241         end
 242 end