github.com/muhammedhassanm/blockchain@v0.0.0-20200120143007-697261defd4d/sawtooth-supply-chain-master/fish_client/src/components/navigation.js (about) 1 /** 2 * Copyright 2017 Intel Corporation 3 * 4 * Licensed under the Apache License, Version 2.0 (the "License"); 5 * you may not use this file except in compliance with the License. 6 * You may obtain a copy of the License at 7 * 8 * http://www.apache.org/licenses/LICENSE-2.0 9 * 10 * Unless required by applicable law or agreed to in writing, software 11 * distributed under the License is distributed on an "AS IS" BASIS, 12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 13 * See the License for the specific language governing permissions and 14 * limitations under the License. 15 * ---------------------------------------------------------------------------- 16 */ 17 'use strict' 18 19 const m = require('mithril') 20 21 /** 22 * A simple navbar wrapper, which displays children in the responsive collapse. 23 */ 24 const Navbar = { 25 view (vnode) { 26 return m('nav.navbar.navbar-expand-sm.navbar-dark.bg-dark.mb-5', [ 27 m('a.navbar-brand[href="/"]', { oncreate: m.route.link }, 'FishNet'), 28 m('button.navbar-toggler', { 29 type: 'button', 30 'data-toggle': 'collapse', 31 'data-target': '#navbar', 32 'aria-controls': 'navbar', 33 'aria-expanded': 'false', 34 'aria-label': 'Toggle navigation' 35 }, m('span.navbar-toggler-icon')), 36 m('#navbar.collapse.navbar-collapse', vnode.children) 37 ]) 38 } 39 } 40 41 /** 42 * Creates a list of left-aligned navbar links from href/label tuples. 43 */ 44 const links = items => { 45 return m('ul.navbar-nav.mr-auto', items.map(([href, label]) => { 46 return m('li.nav-item', [ 47 m('a.nav-link', { href, oncreate: m.route.link }, label) 48 ]) 49 })) 50 } 51 52 /** 53 * Creates a single link for use in a navbar. 54 */ 55 const link = (href, label) => { 56 return m('.navbar-nav', [ 57 m('a.nav-link', { href, oncreate: m.route.link }, label) 58 ]) 59 } 60 61 /** 62 * Creates a navigation button styled for use in the navbar. 63 */ 64 const button = (href, label) => { 65 return m('a.btn.btn-outline-primary.my-2.my-sm-0', { 66 href, 67 oncreate: m.route.link 68 }, label) 69 } 70 71 module.exports = { 72 Navbar, 73 link, 74 links, 75 button 76 }