navbar.jst

   1 let XDate = require('xdate')
   2
   3 return async (env, head, body) => {
   4   let feedback_form = await _require('/feedback_form.jst')
   5   let globals = await env.site.get_json('/_config/globals.json')
   6   let icon_search = await env.site.get_min_svg('/_svg/icon_search.svg')
   7   let logo_large = await env.site.get_min_svg('/_svg/logo_large.svg')
   8   let page = await _require('/page.jst')
   9
  10   await page(
  11     env,
  12     // head
  13     async _out => {
  14       title {
  15         _out.push(
  16           globals.site_title +
  17           ": " +
  18           (globals.page_to_title[env.parsed_url.pathname] || env.parsed_url.pathname)
  19         )
  20       }
  21
  22       await head(_out)
  23     },
  24     // body
  25     async _out => {
  26       div(style="padding-left: calc(100vw - 100%);") {
  27         div.container(style="margin-top: 15px; margin-bottom: 15px;") {
  28           //div.row {
  29           //  div.col-sm-12(style="text-align: right;") {
  30           //    a(href="/login.html") {'Login'}
  31           //  }
  32           //}
  33           div.row {
  34             div.'col-sm-8'.vbottom {
  35               _out.push(logo_large)
  36             }
  37             div.'col-sm-4'.vbottom(style="padding-bottom: 15px;") {
  38               form(action="/search.html") {
  39                 div.input-group {
  40                   input.form-control(name="query" type="text" placeholder="Search") {}
  41                   span.input-group-btn {
  42                     button.btn.btn-default(type="submit") {
  43                       _out.push(icon_search)
  44                     }
  45                   }
  46                 }
  47               }
  48             }
  49           }
  50         }
  51       }
  52       nav.navbar.navbar-default(style="margin-top: 0px; margin-bottom: 0px;") {
  53         div(style="padding-left: calc(100vw - 100%);") {
  54           div.container { //-fluid") {
  55             //  Brand and toggle get grouped for better mobile display
  56             div.navbar-header {
  57               button.navbar-toggle.collapsed(type="button" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false") {
  58                 span.sr-only {'Toggle navigation'}
  59                 span.icon-bar {}
  60                 span.icon-bar {}
  61                 span.icon-bar {}
  62               }
  63               //a.navbar-brand(href="#") {'Brand'}
  64             }
  65
  66             //  Collect the nav links, forms, and other content for toggling
  67             div.collapse.navbar-collapse#bs-example-navbar-collapse-1 {
  68               ul.nav.navbar-nav {
  69                 let navigation = globals.navigation
  70                 for (let i = 0; i < navigation.length; ++i) {
  71                   let page = navigation[i]
  72                   let title = globals.page_to_title[page] || page
  73                   if (page === env.parsed_url.pathname)
  74                     li.active {
  75                       a(href=page) {
  76                         `${title}`
  77                         span.sr-only {'(current)'}
  78                       }
  79                     }
  80                   else
  81                     li {
  82                       a(href=page) {`${title}`}
  83                     }
  84                 }
  85               }
  86               ul.nav.navbar-nav.navbar-right {
  87                 li {
  88                   a#give-feedback {'Give feedback'}
  89                 }
  90               }
  91             }
  92           }
  93         }
  94       }
  95       div(style="padding-left: calc(100vw - 100%);") {
  96         div.container {
  97           await body(_out)
  98         }
  99       }
 100       br {}
 101       div.footer(style="padding-left: calc(100vw - 100%);") {
 102         div.container { //-fluid") {
 103           div(style="height: 16px;") {}
 104           a(rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/") {
 105             img(alt="Creative Commons License" style="border-width:0" src="/images/by-sa_3.0_88x31.png") {}
 106           }
 107           p {
 108             'This website is '
 109             a(href="https://git.ndcode.org/public/ndcode_site.git") {
 110               'open source'
 111             }
 112             ' and licensed under a '
 113             a(rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/") {
 114               'Creative Commons Attribution-ShareAlike 3.0 Unported License'
 115             }
 116             '.'
 117           }
 118
 119           p {'Code samples within the page are placed in the public domain unless otherwise noted.'}
 120
 121           p {`Copyright � ${new XDate().getUTCFullYear()} Integration Logic Pty Ltd trading as NDCODE and contributors.`}
 122         }
 123       }
 124
 125       // hidden part
 126       div#feedback-modal.modal.fade(role="dialog") {
 127         div.modal-dialog {
 128           div.modal-content {
 129             div.modal-header {
 130               button.close(type="button" data-dismiss="modal") {
 131                 '�'
 132               }
 133               h4.modal-title {
 134                 'Give feedback'
 135               }
 136             }
 137             div.modal-body {
 138               p {
 139                 'Did you notice something not quite right, or just want to share your impression of this page?'
 140               }
 141               await feedback_form(env, _out)
 142             }
 143             div.modal-footer {
 144               button.btn.btn-primary(type="submit" form="feedback-form") {
 145                 'Submit'
 146               }
 147               button.btn.btn-default(type="button" data-dismiss="modal") {
 148                 'Close'
 149               }
 150             }
 151           }
 152         }
 153       }
 154
 155       div#message-modal.modal.fade(role="dialog") {
 156         div.modal-dialog {
 157           div.modal-content {
 158             div.modal-header {
 159               button.close(type="button" data-dismiss="modal") {
 160                 '�'
 161               }
 162               h4.modal-title {
 163                 'Message'
 164               }
 165             }
 166             div.modal-body {
 167               p#message-modal-message {}
 168             }
 169             div.modal-footer {
 170               button.btn.btn-default(type="button" data-dismiss="modal") {
 171                 'Close'
 172               }
 173             }
 174           }
 175         }
 176       }
 177     },
 178     // scripts
 179     async _out => {
 180       // when feedback form is submitted, do not reload the page
 181       script {
 182         $(document).ready(function() {
 183           $('#give-feedback').click(function() {
 184             $('#feedback-modal').modal('show')
 185             $('#feedback-form-message').text('')
 186           })
 187           $('#feedback-modal').on('shown.bs.modal', function() {
 188             $('#feedback-form-message').focus()
 189           })
 190           $(document).on('submit', '#feedback-form', function(e) {
 191             e.preventDefault()
 192             $.ajax({
 193               url: '/feedback.html',
 194               type: 'POST',
 195               data: {
 196                 page: window.location.href,
 197                 message: $('#feedback-form-message').val()
 198               },
 199               success: function(data, textStatus, jqXHR) {
 200                 $('#feedback-modal').modal('hide')
 201                 $('#message-modal-message').text(data)
 202                 $('#message-modal').modal('show')
 203               },
 204               error: function(jqXHR, textStatus, errorThrown) {
 205                 $('#feedback-modal').modal('hide')
 206                 $('#message-modal-message').text(errorThrown)
 207                 $('#message-modal').modal('show')
 208               }
 209             })
 210           })
 211         })
 212       }
 213     }
 214   )
 215 }