diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/Render.hs | 104 |
1 files changed, 53 insertions, 51 deletions
diff --git a/src/Render.hs b/src/Render.hs index d74898c..574f5a7 100644 --- a/src/Render.hs +++ b/src/Render.hs @@ -84,8 +84,8 @@ protoentry db (ident, p) = , data_ "rank" (T.pack $ show $ prank p) ] $ do div_ [class_ "card-header", role_ "tab"] $ do - h3_ [class_ "name"] $ do - a_ [href_ $ T.pack $ '#':ident, title_ "permalink", data_ "toggle" "collapse", data_ "parent" "#protocols", data_ "target" $ T.pack $ '#':bodyIdent, class_ "collapsed"] $ toHtml $ pname p + h3_ [class_ "name h5"] $ do + a_ [href_ $ T.pack $ '#':ident, title_ "permalink", data_ "toggle" "collapse", data_ "parent" "#protocols", data_ "target" $ T.pack $ '#':bodyIdent, class_ "collapsed dropdown-toggle"] $ toHtml $ pname p " " maybe "" (small_ [class_ "longname text-muted"] . toHtml) $ plongname p div_ [class_ "collapse", id_ $ T.pack bodyIdent, role_ "tabpanel"] $ do @@ -145,56 +145,63 @@ introduction db = let " and " toHtml lastyear "." - p_ [class_ "lead"] $ a_ [class_ "btn btn-primary btn-lg", href_ "#about", role_ "button", data_ "toggle" "collapse", id_ "learnmore"] "Learn more" + p_ [class_ "lead"] $ a_ [class_ "btn btn-primary btn-lg", href_ "#about", role_ "button", data_ "toggle" "modal", id_ "learnmore"] "Learn more" featuresFilter :: Database -> Html () -featuresFilter db = select_ [multiple_ "", size_ "10", id_ "filter-feature"] $ forM_ (M.toList $ getFeaturesByLevel db 0) $ \(baseident, basefeature) -> do +featuresFilter db = select_ [multiple_ "", id_ "filter-feature", class_ "form-control", placeholder_ "Filter by feature or name"] $ forM_ (M.toList $ getFeaturesByLevel db 0) $ \(baseident, basefeature) -> do optgroup_ [label_ $ T.pack $ fname basefeature] $ do forM_ (M.toList $ getFeaturesByBase db baseident) $ \(ident, feature) -> do - option_ [value_ $ T.pack ident] $ toHtml $ fname feature + option_ [value_ $ T.pack $ concat ["tag:", ident]] $ toHtml $ fname feature -- |List of protocol features features :: Database -> Html () -features db = dl_ [class_ "row"] $ forM_ (M.toList $ getFeaturesByLevel db 0) $ \(baseident, basefeature) -> do - dt_ [class_ "col-sm-3"] $ toHtml $ fname basefeature +features db = dl_ [class_ "row learnmore-features"] $ forM_ (M.toList $ getFeaturesByLevel db 0) $ \(baseident, basefeature) -> do + dt_ [class_ "col-sm-3"] $ h4_ $ toHtml $ fname basefeature dd_ [class_ "col-sm-9"] $ do maybe mempty (p_ . toHtml) $ fdescription basefeature dl_ $ forM_ (M.toList $ getFeaturesByBase db baseident) $ \(ident, feature) -> do dt_ $ toHtml $ fname feature maybe mempty (dd_ . toHtml) $ fdescription feature -about :: Database -> Html () -about db = let +about :: Database -> [E.T] -> Html () +about db attrib = let (firstyear, lastyear) = minMaxPublicationYears db categoryCount = M.size $ getFeaturesByLevel db 0 in do - h2_ "Motivation" - p_ "In recent years the scientific community has proposed a surprisingly large number of wireless medium access (MAC) protocols. That number is still climbing year by year, rendering classic surveys outdated rather quick. Additionally the sheer number of protocols results in name collisions, often making it harder than necessary to identify which protocol exactly is referenced by just looking at its name. Ordinary surveys also cannot provide interactivity like feature-based filtering and searching. Its results are not reusable easily since they are not machine-readable." - p_ $ do - "This comprehensive MAC taxonomy database (comatose), aims to fix most of these problems. It lists most known scientific MAC protocol proposals and is not limited to a subset with specific properties. The list includes the protocol’s short and long name, a description, as well as references to the publication it originated from. It also introduces a taxonomy. Some of its terminology is based on or inspired by " - a_ [href_ "#references"] "existing surveys" - ". Features are grouped into " - toHtml $ show categoryCount - " categories and those within the same category can be mutually exclusive. Below is a list of all features in use." - features db - h2_ "Implementation" - p_ $ do - "comatose uses two databases. The first one contains features and protocols in a " - a_ [href_ "http://yaml.org/"] "YAML" - " file. It is human and machine-readable at the same time and thus easy to edit. Also it does not require additional software like a SQL database server. This first database links protocols to publications with a second database. That one is just a standard BibTeX file. Since TeX is used for a lot of scientific publications these records usually exist already and can be copied, as well as reused for new publications. Therefore both should databases provide value beyond the scope of this project." - p_ "This very page is generated with a HTML renderer written in Haskell. It reads both databases and transforms them into a single-page HTML document. Additional JavaScript code provides client-side filtering and searching." - h2_ "Contributing" - p_ $ do - "As mentioned above this database is not complete yet and will never be, as long as new protocols are invented. Descriptions and feature tags are missing for a lot of protocols due to lack of time. If you want to help send an email with your suggestions to " - a_ [href_ "mailto:lars+comatose@6xq.net"] "lars+comatose@6xq.net" - " or clone the repository from " - a_ [href_ "https://github.com/PromyLOPh/comatose"] "GitHub" - ", edit the database and create a pull request." - h2_ "Acknowledgements" - p_ $ do - "This database is part of a project funded by the " - a_ [href_ "https://www.bmbf.de/en/index.html"] "Federal Ministry of Education and Research" - " from 2015 to 2017." + div_ [class_ "modal fade", id_ "about"] + $ div_ [class_ "modal-dialog"] + $ div_ [class_ "modal-content"] $ do + div_ [class_ "modal-header"] $ do + h2_ [class_ "modal-title"] "About" + button_ [type_ "button", class_ "close", data_ "dismiss" "modal"] "×" + div_ [class_ "modal-body"] $ do + p_ "In recent years the scientific community has proposed a surprisingly large number of wireless medium access (MAC) protocols. That number is still climbing year by year, rendering classic surveys outdated rather quick. Additionally the sheer number of protocols results in name collisions, often making it harder than necessary to identify which protocol exactly is referenced by just looking at its name. Ordinary surveys also cannot provide interactivity like feature-based filtering and searching. Its results are not reusable easily since they are not machine-readable." + p_ $ do + "This comprehensive MAC taxonomy database (comatose), aims to fix most of these problems. It lists most known scientific MAC protocol proposals and is not limited to a subset with specific properties. The list includes the protocol’s short and long name, a description, as well as references to the publication it originated from. It also introduces a taxonomy. Some of its terminology is based on or inspired by " + a_ [href_ "#references"] "existing surveys" + ". Features are grouped into " + toHtml $ show categoryCount + " categories and those within the same category can be mutually exclusive. Below is a list of all features in use." + features db + h2_ "Implementation" + p_ $ do + "comatose uses two databases. The first one contains features and protocols in a " + a_ [href_ "http://yaml.org/"] "YAML" + " file. It is human and machine-readable at the same time and thus easy to edit. Also it does not require additional software like a SQL database server. This first database links protocols to publications with a second database. That one is just a standard BibTeX file. Since TeX is used for a lot of scientific publications these records usually exist already and can be copied, as well as reused for new publications. Therefore both should databases provide value beyond the scope of this project." + p_ "This very page is generated with a HTML renderer written in Haskell. It reads both databases and transforms them into a single-page HTML document. Additional JavaScript code provides client-side filtering and searching." + h2_ "Contributing" + p_ $ do + "As mentioned above this database is not complete yet and will never be, as long as new protocols are invented. Descriptions and feature tags are missing for a lot of protocols due to lack of time. If you want to help send an email with your suggestions to " + a_ [href_ "mailto:lars+comatose@6xq.net"] "lars+comatose@6xq.net" + " or clone the repository from " + a_ [href_ "https://github.com/PromyLOPh/comatose"] "GitHub" + ", edit the database and create a pull request." + h2_ "Acknowledgements" + p_ $ do + "This database is part of a project funded by the " + a_ [href_ "https://www.bmbf.de/en/index.html"] "Federal Ministry of Education and Research" + " from 2015 to 2017." + references (sortBy (compare `on` lookup "year" . E.fields) attrib) -- | The list of protocols protocols :: Database -> Html () @@ -210,31 +217,26 @@ page db attrib = doctypehtml_ $ do extjs "https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" extjs "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" extcss "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" + extjs "https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.4/js/standalone/selectize.min.js" + extcss "https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.4/css/selectize.min.css" + extcss "https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.4/css/selectize.bootstrap3.min.css" extcss "style.css" body_ $ do nav_ [class_ "navbar navbar-expand-md navbar-dark bg-dark fixed-top"] $ do - div_ [class_ "collapse navbar-collapse"] $ do - span_ [class_ "navbar-brand"] "comatose" + span_ [class_ "navbar-brand"] "comatose" + button_ [class_ "navbar-toggler", type_ "button", data_ "toggle" "collapse", data_ "target" "#navbarSupportedContent"] $ span_ [class_ "navbar-toggler-icon"] mempty + div_ [class_ "collapse navbar-collapse", id_ "navbarSupportedContent"] $ do ul_ [class_ "navbar-nav mr-auto"] mempty - form_ [id_ "protosort", class_ "navbar-nav form-inline my-2 my-lg-0"] $ do - input_ [id_ "filter", type_ "search", class_ "form-control mr-sm-2", placeholder_ "Filter by name"] - " " - div_ [class_ "nav-item dropdown keep-open"] $ do - a_ [class_ "nav-link dropdown-toggle", data_ "toggle" "dropdown", href_ "#"] "Features" - div_ [class_ "dropdown-menu"] $ featuresFilter db - " " - label_ [for_ "sort", class_ "navbar-text"] "Sort by" - " " + form_ [id_ "protosort", class_ "navbar-nav form-inline my-2 my-lg-0", action_ "#"] $ do + featuresFilter db + " " select_ [id_ "sort", class_ "form-control"] $ do option_ [value_ "name"] "Name" option_ [value_ "year"] "Year" option_ [value_ "rank"] "Rank" div_ [class_ "jumbotron" ] $ section_ [class_ "container"] $ do introduction db - div_ [class_ "about collapse", id_ "about"] $ do - about db - references (sortBy (compare `on` lookup "year" . E.fields) attrib) - p_ $ a_ [class_ "btn btn-secondary", data_ "toggle" "collapse", data_ "target" "#about", href_ "#"] "Close" + about db attrib div_ [class_ "container"] $ protocols db extjs "script.js" |