Noteworthy Programs Map

    mithril-stream-router

    0.1.3 • Public • Published

    mithril-stream-router

    This is a very early draft at an opinionated router. Use with caution.

    Low Level Example

    High Level Example

    Quick Start

    const Albums = 
      ({ getState, link, Route }) => {
        return m('.albums'
          ,m('h1', 'Albums')
          ,m('ul'
            ,['One', 'Two', 'Three']
            .map(
              k => m('a', link( Route.of.Album({ album_key: k }) ), k )
            )
            .map( x => m('li', x) )
          )
        )
      }
     
    const Album = 
      ({ album_key, link, Route }) => {
       
        const base = '/albums/'+album_key+'/photo/'
        return m('.album'
          ,m('h1', 'Album '+album_key )
          ,m('h2', 'Files')
          ,m('ul'
            ,['A', 'B', 'C']
            .map( k => 
                m('a', 
                 link( Route.of.AlbumFile({ album_key, file_id: k }))
                  , k 
                ) 
            )
            .map( x => m('li', x) )
          )
        )
      }
     
    const AlbumFile = 
      ({ album_key, file_id }) => {
        return m('.file'
          ,m('h1', 'File ' + file_id +' from ' + album_key )
        )
      }
     
    const render = 
      attrs => m('.app'
        ,m('pre', attrs.Route.toURL(attrs.getState().route))
        ,m('button', { onclick: () => window.history.back() }, 'Back' )
        ,attrs.Route.fold({
          Albums: () => Albums(attrs),
          Album: route => Album({ ...attrs, ...route }),
          AlbumFile: route => AlbumFile({ ...attrs, ...route }),
        }) (attrs.getState().route)           
      )
     
    m.mount(document.body, () => {
      const Route =
        superouter.type('Route', {
          'Albums': '/',
          'Album': '/albums/:album_key',
          'AlbumFile': '/albums/:album_key/photo/:file_id',
        })
        
      return {
        view: () => 
          m(m.stream.router.component, {
            m,
            stream: m.stream,
            fromURL: url => Route.matchOr( () => Route.of.Albums(), url ),
            toURL: x => Route.toURL(x),
            location: () => window.location,
            initial(){
              return {
                route: Route.of.Albums()
              }
            },
            services(){},
            render: attrs => render({ ...attrs, Route })
          })
      }
    })

    Install

    npm i mithril-stream-router

    DownloadsWeekly Downloads

    0

    Version

    0.1.3

    License

    MIT

    Unpacked Size

    22.5 kB

    Total Files

    7

    Last publish

    Collaborators

    • jaforbes