nitdoc: Escape page title.
[nit.git] / src / doc / doc_templates.nit
index e30298f..497c4cd 100644 (file)
 module doc_templates
 
 import template
+import json::static
 
 # A documentation page
 class TplPage
        super Template
 
-       # Page title in HTML header
+       # The unescaped page title to put in the HTML header.
        var title: String is writable, noinit
 
        # Page url
@@ -49,8 +50,6 @@ class TplPage
        # JS scripts to append at the end of the body
        var scripts = new Array[TplScript]
 
-       init do end
-
        # Add a section to this page
        fun add_section(section: TplSection) do
                sections.add section
@@ -58,28 +57,31 @@ class TplPage
 
        # Render the html header
        private fun render_head do
-               add "<!DOCTYPE html>"
-               add "<head>"
-               add " <meta charset='utf-8'/>"
-               add " <!--link rel='stylesheet' href='{shareurl}/css/Nitdoc.UI.css' type='text/css'/-->"
-               add " <link rel='stylesheet' href='{shareurl}/vendors/bootstrap/css/bootstrap.min.css'/>"
-               add " <link rel='stylesheet' href='{shareurl}/css/nitdoc.bootstrap.css'/>"
-               add " <link rel='stylesheet' href='{shareurl}/css/nitdoc.css'/>"
-               add " <link rel='stylesheet' href='{shareurl}/css/Nitdoc.QuickSearch.css'/>"
-               add " <link rel='stylesheet' href='{shareurl}/css/Nitdoc.ModalBox.css'/>"
-               add " <link rel='stylesheet' href='{shareurl}/css/Nitdoc.GitHub.css'/>"
-               add " <title>{title}</title>"
-               add "</head>"
+               var css = (self.shareurl / "css").html_escape
+               var vendors = (self.shareurl / "vendors").html_escape
+
+               addn "<!DOCTYPE html>"
+               addn "<head>"
+               addn " <meta charset='utf-8'/>"
+               addn " <!--link rel='stylesheet' href='{css}/Nitdoc.UI.css' type='text/css'/-->"
+               addn " <link rel='stylesheet' href='{vendors}/bootstrap/css/bootstrap.min.css'/>"
+               addn " <link rel='stylesheet' href='{css}/nitdoc.bootstrap.css'/>"
+               addn " <link rel='stylesheet' href='{css}/nitdoc.css'/>"
+               addn " <link rel='stylesheet' href='{css}/Nitdoc.QuickSearch.css'/>"
+               addn " <link rel='stylesheet' href='{css}/Nitdoc.ModalBox.css'/>"
+               addn " <link rel='stylesheet' href='{css}/Nitdoc.GitHub.css'/>"
+               addn " <title>{title.html_escape}</title>"
+               addn "</head>"
                add "<body"
                for attr in body_attrs do add attr
-               add ">"
+               addn ">"
        end
 
        # Render the topmenu template
        private fun render_topmenu do
-               add " <div class='row'>"
+               addn " <div class='row'>"
                add topmenu
-               add " </div>"
+               addn " </div>"
        end
 
        # Render the sidebar
@@ -97,49 +99,52 @@ class TplPage
        private fun render_content do
                for section in sections do add section
                if footer != null then
-                       add "<div class='well footer'>"
+                       addn "<div class='well footer'>"
                        add footer.as(not null)
-                       add "</div>"
+                       addn "</div>"
                end
        end
 
        # Render JS scripts
        private fun render_footer do
-               add "<script src='{shareurl}/vendors/jquery/jquery-1.11.1.min.js'></script>"
-               add "<script src='{shareurl}/vendors/jquery/jquery-ui-1.10.4.custom.min.js'></script>"
-               add "<script src='{shareurl}/vendors/bootstrap/js/bootstrap.min.js'></script>"
-               add "<script data-main='{shareurl}/js/nitdoc' src='{shareurl}/js/lib/require.js'</script>"
+               var vendors = (self.shareurl / "vendors").html_escape
+               var js = (self.shareurl / "js").html_escape
+
+               addn "<script src='{vendors}/jquery/jquery-1.11.1.min.js'></script>"
+               addn "<script src='{vendors}/jquery/jquery-ui-1.10.4.custom.min.js'></script>"
+               addn "<script src='{vendors}/bootstrap/js/bootstrap.min.js'></script>"
+               addn "<script data-main='{js}/nitdoc' src='{js}/lib/require.js'></script>"
                for script in scripts do add script
-               add """<script>
+               addn """<script>
                        $(function () {
                                $("[data-toggle='tooltip']").tooltip();
                                $("[data-toggle='popover']").popover();
                        });
                </script>"""
-               add "</body>"
-               add "</html>"
+               addn "</body>"
+               addn "</html>"
        end
 
        # Render the whole page
        redef fun rendering do
                render_head
-               add "<div class='container-fluid'>"
+               addn "<div class='container-fluid'>"
                render_topmenu
-               add " <div class='row' id='content'>"
+               addn " <div class='row' id='content'>"
                if sidebar != null then
-                       add "<div class='col col-xs-3 col-lg-2'>"
+                       addn "<div class='col col-xs-3 col-lg-2'>"
                        render_sidebar
-                       add "</div>"
-                       add "<div class='col col-xs-9 col-lg-10' data-spy='scroll' data-target='.summary'>"
+                       addn "</div>"
+                       addn "<div class='col col-xs-9 col-lg-10' data-spy='scroll' data-target='.summary'>"
                        render_content
-                       add "</div>"
+                       addn "</div>"
                else
-                       add "<div class='col col-xs-12'>"
+                       addn "<div class='col col-xs-12'>"
                        render_content
-                       add "</div>"
+                       addn "</div>"
                end
-               add " </div>"
-               add "</div>"
+               addn " </div>"
+               addn "</div>"
                render_footer
        end
 end
@@ -162,10 +167,6 @@ class TplTopMenu
        # Used to select the active link.
        private var current_url: String
 
-       init(current_url: String) do
-               self.current_url = current_url
-       end
-
        # Add a new link to the menu.
        fun add_link(content: TplLink) do
                var is_active = content.href == current_url
@@ -181,7 +182,7 @@ class TplTopMenu
                end
                tpl.add ">"
                tpl.add content
-               tpl.add "</li>"
+               tpl.addn "</li>"
                add_raw(tpl)
        end
 
@@ -192,27 +193,27 @@ class TplTopMenu
 
        redef fun rendering do
                if brand == null and elts.is_empty then return
-               add "<nav id='topmenu' class='navbar navbar-default navbar-fixed-top' role='navigation'>"
-               add " <div class='container-fluid'>"
-               add "  <div class='navbar-header'>"
+               addn "<nav id='topmenu' class='navbar navbar-default navbar-fixed-top' role='navigation'>"
+               addn " <div class='container-fluid'>"
+               addn "  <div class='navbar-header'>"
                add "   <button type='button' class='navbar-toggle' "
-               add "       data-toggle='collapse' data-target='#topmenu-collapse'>"
-               add "    <span class='sr-only'>Toggle menu</span>"
-               add "    <span class='icon-bar'></span>"
-               add "    <span class='icon-bar'></span>"
-               add "    <span class='icon-bar'></span>"
-               add "   </button>"
+               addn "       data-toggle='collapse' data-target='#topmenu-collapse'>"
+               addn "    <span class='sr-only'>Toggle menu</span>"
+               addn "    <span class='icon-bar'></span>"
+               addn "    <span class='icon-bar'></span>"
+               addn "    <span class='icon-bar'></span>"
+               addn "   </button>"
                if brand != null then add brand.as(not null)
-               add "  </div>"
-               add "  <div class='collapse navbar-collapse' id='topmenu-collapse'>"
+               addn "  </div>"
+               addn "  <div class='collapse navbar-collapse' id='topmenu-collapse'>"
                if not elts.is_empty then
-                       add "<ul class='nav navbar-nav'>"
+                       addn "<ul class='nav navbar-nav'>"
                        for elt in elts do add elt
-                       add "</ul>"
+                       addn "</ul>"
                end
-               add "  </div>"
-               add " </div>"
-               add "</nav>"
+               addn "  </div>"
+               addn " </div>"
+               addn "</nav>"
        end
 end
 
@@ -232,15 +233,17 @@ class TplSidebar
        redef fun rendering do
                if boxes.is_empty then return
                order_boxes
-               add "<div id='sidebar'>"
+               addn "<div id='sidebar'>"
                for box in boxes do add box
-               add "</div>"
+               addn "</div>"
        end
 end
 
 # Comparator used to sort boxes by order
 private class OrderComparator
-       super Comparator[TplSidebarElt]
+       super Comparator
+
+       redef type COMPARED: TplSidebarElt
 
        redef fun compare(a, b) do
                if a.order < b.order then return -1
@@ -270,18 +273,17 @@ class TplSideBox
        # Box HTML id
        # equals to `title.to_cmangle` by default
        # Used for collapsing
-       var id: String
+       var id: String is noinit
 
        # Content to display in the box
        # box will not be rendered if the content is null
-       var content: nullable Streamable writable
+       var content: nullable Streamable = null is writable
 
        # Is the box opened by default
        # otherwise, the user will have to clic on the title to display the content
-       var is_open writable = false
+       var is_open = false is writable
 
-       init(title: String) do
-               self.title = title
+       init do
                self.id = title.to_cmangle
        end
 
@@ -294,16 +296,16 @@ class TplSideBox
                if content == null then return
                var open = ""
                if is_open then open = "in"
-               add "<div class='panel'>"
-               add " <div class='panel-heading'>"
+               addn "<div class='panel'>"
+               addn " <div class='panel-heading'>"
                add "  <a data-toggle='collapse' data-parent='#sidebar' data-target='#box_{id}' href='#'>"
                add title
-               add "  </a>"
-               add " </div>"
-               add " <div id='box_{id}' class='panel-body collapse {open}'>"
+               addn "  </a>"
+               addn " </div>"
+               addn " <div id='box_{id}' class='panel-body collapse {open}'>"
                add content.as(not null)
-               add " </div>"
-               add "</div>"
+               addn " </div>"
+               addn "</div>"
        end
 end
 
@@ -330,18 +332,18 @@ class TplSummary
 
        redef fun rendering do
                if children.is_empty then return
-               add "<div class='panel'>"
-               add " <div class='panel-heading'>"
+               addn "<div class='panel'>"
+               addn " <div class='panel-heading'>"
                add "  <a data-toggle='collapse' data-parent='#sidebar' data-target='#box-sum' href='#'>"
                add "Summary"
-               add "  </a>"
-               add " </div>"
-               add " <div id='box-sum' class='summary collapse in'>"
-               add " <ul class='nav'>"
+               addn "  </a>"
+               addn " </div>"
+               addn " <div id='box-sum' class='summary collapse in'>"
+               addn " <ul class='nav'>"
                for entry in children do add entry
-               add " </ul>"
-               add " </div>"
-               add "</div>"
+               addn " </ul>"
+               addn " </div>"
+               addn "</div>"
        end
 end
 
@@ -356,19 +358,17 @@ class TplSummaryEntry
        # Will be displayed as a tree
        var children = new Array[TplSummaryElt]
 
-       init(text: Streamable) do self.text = text
-
        redef fun add_child(child) do children.add child
 
        redef fun rendering do
                add "<li>"
                add text
                if not children.is_empty then
-                       add "<ul class='nav'>"
+                       addn "\n<ul class='nav'>"
                        for entry in children do add entry
-                       add "</ul>"
+                       addn "</ul>"
                end
-               add "</li>"
+               addn  "</li>"
        end
 end
 
@@ -383,14 +383,14 @@ class TplSectionElt
        # Title to display if any
        # if both `title` and `summary_title` are null then
        # the section will not appear in the summary
-       var title: nullable Streamable writable
+       var title: nullable Streamable = null is writable
 
        # Subtitle to display if any
-       var subtitle: nullable Streamable writable
+       var subtitle: nullable Streamable = null is writable
 
        # Title that appear in the summary
        # if null use `title` instead
-       var summary_title: nullable String writable
+       var summary_title: nullable String = null is writable
 
        # CSS classes to apply on the section element
        var css_classes = new Array[String]
@@ -399,9 +399,7 @@ class TplSectionElt
        var title_classes = new Array[String]
 
        # Parent article/section if any
-       var parent: nullable TplSectionElt
-
-       init(id: String) do self.id = id
+       var parent: nullable TplSectionElt = null
 
        init with_title(id: String, title: Streamable) do
                init(id)
@@ -446,23 +444,23 @@ class TplSection
        super TplSectionElt
 
        redef fun rendering do
-               add "<section id='{id}' class='{css_classes.join(" ")}'>"
+               addn "<section id='{id}' class='{css_classes.join(" ")}'>"
                if title != null then
                        var lvl = hlvl
                        if lvl == 2 then title_classes.add "well well-sm"
-                       add "<h{lvl} class='{title_classes.join(" ")}'>"
-                       add title.as(not null)
-                       add "</h{lvl}>"
+                       addn "<h{lvl} class='{title_classes.join(" ")}'>"
+                       addn title.as(not null)
+                       addn "</h{lvl}>"
                end
                if subtitle != null then
-                       add "<div class='info subtitle'>"
-                       add subtitle.as(not null)
-                       add "</div>"
+                       addn "<div class='info subtitle'>"
+                       addn subtitle.as(not null)
+                       addn "</div>"
                end
                for child in children do
                        add child
                end
-               add "</section>"
+               addn "</section>"
        end
 end
 
@@ -471,8 +469,8 @@ class TplArticle
        super TplSectionElt
 
        # Content for this article
-       var content: nullable Streamable writable = null
-       var source_link: nullable Streamable writable = null
+       var content: nullable Streamable = null is writable
+       var source_link: nullable Streamable = null is writable
 
        init with_content(id: String, title: Streamable, content: Streamable) do
                with_title(id, title)
@@ -490,23 +488,23 @@ class TplArticle
 
        redef fun rendering do
                if is_empty then return
-               add "<article id='{id}' class='{css_classes.join(" ")}'>"
+               addn "<article id='{id}' class='{css_classes.join(" ")}'>"
                if source_link != null then
                        add "<div class='source-link'>"
                        add source_link.as(not null)
-                       add "</div>"
+                       addn "</div>"
                end
                if title != null then
                        var lvl = hlvl
                        if lvl == 2 then title_classes.add "well well-sm"
                        add "<h{lvl} class='{title_classes.join(" ")}'>"
                        add title.as(not null)
-                       add "</h{lvl}>"
+                       addn "</h{lvl}>"
                end
                if subtitle != null then
                        add "<div class='info subtitle'>"
                        add subtitle.as(not null)
-                       add "</div>"
+                       addn "</div>"
                end
                if content != null then
                        add content.as(not null)
@@ -514,7 +512,7 @@ class TplArticle
                for child in children do
                        add child
                end
-               add """</article>"""
+               addn """</article>"""
        end
 
        redef fun is_empty: Bool do
@@ -536,7 +534,7 @@ class TplDefinition
        var location: nullable Streamable = null is writable
 
        private fun render_info do
-               add "<div class='info text-right'>"
+               addn "<div class='info text-right'>"
                if namespace != null then
                        if comment == null then
                                add "<span class=\"noComment\">no comment for </span>"
@@ -547,7 +545,7 @@ class TplDefinition
                        add " "
                        add location.as(not null)
                end
-               add "</div>"
+               addn "</div>"
        end
 
        private fun render_comment do
@@ -555,10 +553,10 @@ class TplDefinition
        end
 
        redef fun rendering do
-               add "<div class='definition'>"
+               addn "<div class='definition'>"
                render_comment
                render_info
-               add "</div>"
+               addn "</div>"
        end
 end
 
@@ -569,23 +567,21 @@ class TplClassDefinition
        var intros = new Array[TplListElt]
        var redefs = new Array[TplListElt]
 
-       init do end
-
        redef fun rendering do
-               add "<div class='definition'>"
+               addn "<div class='definition'>"
                render_comment
                render_info
                render_list("Introduces", intros)
                render_list("Redefines", redefs)
-               add "</div>"
+               addn "</div>"
        end
 
        private fun render_list(name: String, elts: Array[TplListElt]) do
                if elts.is_empty then return
-               add "<h5>{name}</h5>"
-               add "<ul class='list-unstyled list-definition'>"
+               addn "<h5>{name.html_escape}</h5>"
+               addn "<ul class='list-unstyled list-definition'>"
                for elt in elts do add elt
-               add "</ul>"
+               addn "</ul>"
        end
 end
 
@@ -599,47 +595,47 @@ class TplSearchPage
 
        redef fun rendering do
                var title = self.title
-               if title != null then add "<h1>{title}</h1>"
-               add "<div class='container-fluid'>"
-               add " <div class='row'>"
+               if title != null then addn "<h1>{title.to_s.html_escape}</h1>"
+               addn "<div class='container-fluid'>"
+               addn " <div class='row'>"
                if not modules.is_empty then
-                       add "<div class='col-xs-4'>"
-                       add "<h3>Modules</h3>"
-                       add "<ul>"
+                       addn "<div class='col-xs-4'>"
+                       addn "<h3>Modules</h3>"
+                       addn "<ul>"
                        for m in modules do
                                add "<li>"
                                add m
-                               add "</li>"
+                               addn "</li>"
                        end
-                       add "</ul>"
-                       add "</div>"
+                       addn "</ul>"
+                       addn "</div>"
                end
                if not classes.is_empty then
-                       add "<div class='col-xs-4'>"
-                       add "<h3>Classes</h3>"
-                       add "<ul>"
+                       addn "<div class='col-xs-4'>"
+                       addn "<h3>Classes</h3>"
+                       addn "<ul>"
                        for c in classes do
                                add "<li>"
                                add c
-                               add "</li>"
+                               addn "</li>"
                        end
-                       add "</ul>"
-                       add "</div>"
+                       addn "</ul>"
+                       addn "</div>"
                end
                if not props.is_empty then
-                       add "<div class='col-xs-4'>"
-                       add "<h3>Properties</h3>"
-                       add "<ul>"
+                       addn "<div class='col-xs-4'>"
+                       addn "<h3>Properties</h3>"
+                       addn "<ul>"
                        for p in props do
                                add "<li>"
                                add p
-                               add "</li>"
+                               addn "</li>"
                        end
-                       add "</ul>"
-                       add "</div>"
+                       addn "</ul>"
+                       addn "</div>"
                end
-               add " </div>"
-               add "</div>"
+               addn " </div>"
+               addn "</div>"
        end
 end
 
@@ -652,18 +648,13 @@ class TplLink
        super Template
 
        # Link href
-       var href: String writable
+       var href: String is writable
 
        # Text to display in the link
-       var text: Streamable writable
+       var text: Streamable is writable
 
        # Optional title
-       var title: nullable String writable
-
-       init(href, text: String) do
-               self.href = href
-               self.text = text
-       end
+       var title: nullable String = null is writable
 
        init with_title(href, text, title: String) do
                init(href, text)
@@ -697,9 +688,7 @@ class TplList
        var css_classes = new Array[String]
 
        # Add content wrapped in a <li> element
-       fun add_li(content: Streamable) do elts.add new TplListItem.with_content(content)
-
-       init do end
+       fun add_li(item: TplListItem) do elts.add item
 
        init with_classes(classes: Array[String]) do self.css_classes = classes
 
@@ -707,9 +696,9 @@ class TplList
 
        redef fun rendering do
                if elts.is_empty then return
-               add "<ul class='{css_classes.join(" ")}'>"
+               addn "<ul class='{css_classes.join(" ")}'>"
                for elt in elts do add elt
-               add "</ul>"
+               addn "</ul>"
        end
 end
 
@@ -728,8 +717,6 @@ class TplListItem
        # CSS classes of the <li> element
        var css_classes = new Array[String]
 
-       init do end
-
        init with_content(content: Streamable) do append(content)
 
        init with_classes(content: Streamable, classes: Array[String]) do
@@ -744,7 +731,68 @@ class TplListItem
        redef fun rendering do
                add "<li class='{css_classes.join(" ")}'>"
                add content
-               add "</li>"
+               addn "</li>"
+       end
+end
+
+# A Bootstrap tab component that contains `TplTabPanel`.
+class TplTab
+       super Template
+
+       # Panels contained in the tab.
+       var panels = new Array[TplTabPanel]
+
+       # Add a new panel.
+       fun add_panel(panel: TplTabPanel) do panels.add panel
+
+       # CSS classes of the tab component.
+       var css_classes = new Array[String]
+
+       redef fun rendering do
+               addn "<div class='tab-content'>"
+               for panel in panels do add panel
+               addn "</div>"
+       end
+end
+
+# A panel that goes in a `TplTab`.
+class TplTabPanel
+       super Template
+
+       # CSS classes of the pane element.
+       var css_classes = new Array[String]
+
+       # The panel id.
+       #
+       # Used to show/hide panel.
+       var id: String is noinit
+
+       # The panel name.
+       #
+       # Displayed in the tab header or in the pointing link.
+       var name: Streamable
+
+       # Is the panel visible by default?
+       var is_active = false is writable
+
+       # Body of the panel
+       var content: nullable Streamable = null is writable
+
+       # Get a link pointing to this panel.
+       fun tpl_link_to: Streamable do
+               var lnk = new Template
+               lnk.add "<a data-target='#{id}' data-toggle='pill'>"
+               lnk.add name
+               lnk.add "</a>"
+               return lnk
+       end
+
+       redef fun rendering do
+               add "<div class='tab-pane {css_classes.join(" ")}"
+               if is_active then add "active"
+               addn "' id='{id}'>"
+               if content != null then add content.as(not null)
+               addn "</div>"
        end
 end
 
@@ -787,23 +835,29 @@ end
 
 # A HTML tag attribute
 #  `<tag attr="value">`
+#
+# ~~~nit
+# var attr: TagAttribute
+#
+# attr = new TagAttribute("foo", null)
+# assert attr.write_to_string == " foo=\"\""
+#
+# attr = new TagAttribute("foo", "bar<>")
+# assert attr.write_to_string == " foo=\"bar&lt;&gt;\""
+# ~~~
 class TagAttribute
        super Template
 
        var name: String
        var value: nullable String
 
-       init(name: String, value: nullable String) do
-               self.name = name
-               self.value = value
-       end
-
        redef fun rendering do
                var value = self.value
                if value == null then
-                       add(" {name}")
+                       # SEE: http://www.w3.org/TR/html5/infrastructure.html#boolean-attributes
+                       add " {name.html_escape}=\"\""
                else
-                       add(" {name}=\"{value}\"")
+                       add " {name.html_escape}=\"{value.html_escape}\""
                end
        end
 end
@@ -826,9 +880,9 @@ class TplScript
        redef fun rendering do
                add "<script"
                for attr in attrs do add attr
-               add ">"
+               addn ">"
                render_content
-               add "</script>"
+               addn "</script>"
        end
 end
 
@@ -839,24 +893,23 @@ class TplPiwikScript
        var tracker_url: String
        var site_id: String
 
-       init(tracker_url, site_id: String) do
-               super
-               self.tracker_url = tracker_url
-               self.site_id = site_id
-       end
-
        redef fun render_content do
-               add "<!-- Piwik -->"
-               add "var _paq = _paq || [];"
-               add " _paq.push([\"trackPageView\"]);"
-               add " _paq.push([\"enableLinkTracking\"]);"
-               add "(function() \{"
-               add " var u=((\"https:\" == document.location.protocol) ? \"https\" : \"http\") + \"://{tracker_url}\";"
-               add " _paq.push([\"setTrackerUrl\", u+\"piwik.php\"]);"
-               add " _paq.push([\"setSiteId\", \"{site_id}\"]);"
-               add " var d=document, g=d.createElement(\"script\"), s=d.getElementsByTagName(\"script\")[0]; g.type=\"text/javascript\";"
-               add " g.defer=true; g.async=true; g.src=u+\"piwik.js\"; s.parentNode.insertBefore(g,s);"
-               add "\})();"
+               var site_id = self.site_id.to_json
+               var tracker_url = self.tracker_url.trim
+               if tracker_url.chars.last != '/' then tracker_url += "/"
+               tracker_url = "://{tracker_url}".to_json
+
+               addn "<!-- Piwik -->"
+               addn "var _paq = _paq || [];"
+               addn " _paq.push([\"trackPageView\"]);"
+               addn " _paq.push([\"enableLinkTracking\"]);"
+               addn "(function() \{"
+               addn " var u=((\"https:\" == document.location.protocol) ? \"https\" : \"http\") + {tracker_url};"
+               addn " _paq.push([\"setTrackerUrl\", u+\"piwik.php\"]);"
+               addn " _paq.push([\"setSiteId\", {site_id}]);"
+               addn " var d=document, g=d.createElement(\"script\"), s=d.getElementsByTagName(\"script\")[0]; g.type=\"text/javascript\";"
+               addn " g.defer=true; g.async=true; g.src=u+\"piwik.js\"; s.parentNode.insertBefore(g,s);"
+               addn "\})();"
        end
 end