Massive update to documentation

src/client/css/styles.css

@@ -633,16 +633,32 @@ section.modal > div.modal-window > section.buttonbar {
 }
 /* The action buttons get some styling as well */
 
+/******************************
+ *                            *
+ *    ACTIVATEABLE WRAPPER    *
+ *                            *
+ ******************************/
+/* The wrapper div */
+.activateable_wrapper {
+    display: flex;
+    align-items: center;
+    margin: 0 4em 1em 4em;
+}
+/* the activate flickerbox */
+.activateable_wrapper > flicker-box {
+    transform: scale(0.6);
+    margin-right: 1em;
+}
+
 /*******************************
  *                             *
  *          Statistics         *
  *                             *
  ******************************/
-/* The statistics section */
+/* INACTIVE stats style */
 #stats {
-    border: 1px solid darkgray;
+    border: 1px solid lightgray;
     border-radius: 4px;
-    margin: 0 4em 1em 4em;
     display: flex;
     width: fit-content;
     width: -moz-fit-content;
@@ -651,14 +667,14 @@ section.modal > div.modal-window > section.buttonbar {
 #stats > * {
     margin: 0.5em 0.5em;
 }
-
 /* stats title gets an additional 2 em right space */
 #stats > .stats_title {
     margin-right: 2em;
     min-width: fit-content;
     min-width: -moz-fit-content;
 }
 #stats > .stats_title > .label {
+    color: lightgray;
     font-size: 1.3em;
 }
 #stats > .stats_title > .control {
@@ -667,6 +683,11 @@ section.modal > div.modal-window > section.buttonbar {
     width: fit-content;
     width: -moz-fit-content;
 }
+/* ACTIVE stats panel */
+#stats.active > .stats_title > .label {
+    color: black;
+}
+
 /* Format the stats panel */
 #stats > .stats_panel {
     display: flex;

src/server/views/includes/filters.pug

@@ -0,0 +1,4 @@
+section#filters
+    section#other
+        include jrc-tagfilter
+    include search

src/server/views/includes/infobar.pug

@@ -9,15 +9,15 @@ nav#info-bar
         h2 Ecosystem domain
         p Click to zoom in on one of the six CS&P domains. For more detail, filter using the EC’s 
             | JRC taxonomy*: Cybersecurity domains, Sectors and Technology & Use Cases.
-        //- p.read_more: a(href="/doc/ecosystem-domains" target="_blank") More...
+        p.read_more: a(href="/doc/ecosystem-domains" target="_blank") More...
     div
         h2 Lifecycle
         p The radar rings show the stage of the projects based on the Software Development 
             | Life Cycle: From the centre: Adopt, Trial, Assess, Hold, Drop.
-        //- p.read_more: a(href="/doc/lifecycle" target="_blank") More...
+        p.read_more: a(href="/doc/lifecycle" target="_blank") More...
     div
         h2 Readiness
         p Traffic-light Coloured dots show the project market and technology readiness level 
             | relative to the average of their lifecycle stage. Green showing fastest relative 
             | progress. 
-        //- p.read_more: a(href="/doc/readiness" target="_blank") More...
+        p.read_more: a(href="/doc/readiness" target="_blank") More...

src/server/views/includes/stats.pug

@@ -1,15 +1,16 @@
 include ../../../common/widgets/simple-metric/simple-metric.pug
 
-div.stats_title
-    div.label Live statistics
-    div.control
-        input(type="checkbox" id="active" name="active")
-        label(for="active") Active
+div#stats
+    div.stats_title
+        div.label Live statistics
+        div.control
+            input(type="checkbox" id="active" name="active")
+            label(for="active") Active
 
-div.stats_panel(style='display: none;')
-    +simple-metric('# Projects', 0, 'num_prj')
-    +simple-metric('Project types', 0, 'prj_types')
-    +simple-metric('Avg. duration', 0, 'avg_dur')
-    +simple-metric('Total duration', 0, 'tot_dur')
-    +simple-metric('Avg. budget', 0, 'avg_bud')
-    +simple-metric('Total budget', 0, 'tot_bud')
+    div.stats_panel(style='display: none;')
+        +simple-metric('# Projects', 0, 'num_prj')
+        +simple-metric('Project types', 0, 'prj_types')
+        +simple-metric('Avg. duration', 0, 'avg_dur')
+        +simple-metric('Total duration', 0, 'tot_dur')
+        +simple-metric('Avg. budget', 0, 'avg_bud')
+        +simple-metric('Total budget', 0, 'tot_bud')

src/server/views/radar.pug

@@ -1,6 +1,6 @@
 extends structure/_base
 
-//- include ../../common/widgets/flickerbox/flickerbox.pug
+include ../../common/widgets/flickerbox/flickerbox.pug
 
 block append head
     style(type="text/css").
@@ -30,16 +30,15 @@ block content
                 #flicker
                     #summary-flicker &#x2303
         //- some reactive stats
-        section#stats
-            //- +flickerbox(true, 'stats')
+        section.activateable_wrapper
+            +flickerbox(true, 'stats')
             include includes/stats
         //- a wrapper to controll the height of the rada and filters
         #ctrl-wrp
             //- any filters for the radar blips
-            section#filters
-                section#other
-                    include includes/jrc-tagfilter
-                include includes/search
+            section.activateable_wrapper
+                +flickerbox(true, 'stats')
+                include includes/filters.pug
             //- the radar and the project tables
             section#radardata
                 #rendering

src/server/views/static/doc/ec-calls.pug

@@ -0,0 +1,131 @@
+extends ../../structure/_base
+
+block content
+
+    section.intro
+        a(name="intro")
+        div.title Project lifecycle
+        p:  | In the last 16 years, the European Commission has launched 115 calls that were 
+            | either explicitly supporting projects in the domain of Cybersecurity and Privacy 
+            | (CS & P), or from which projects in this area were supported. 
+        p:  | The Project Radar includes projects from the following calls.
+
+    section.topic
+        a(name="radar_rings")
+        div.title Alphabetical list of EC funding calls
+        div(style="column-count: 3;")
+            div CIP-01-2016-2017
+            div DRS-17-2014
+            div DS-01-2014
+            div DS-01-2016
+            div DS-02-2014
+            div DS-02-2016
+            div DS-02-2016
+            div DS-03-2015
+            div DS-03-2016
+            div DS-04-2015
+            div DS-04-2016
+            div DS-05-2015
+            div DS-05-2016
+            div DS-06-2014
+            div DS-07-2015
+            div DT-ICT-02-2018
+            div ECSEL-2016-2-IA-two-stage
+            div ECSEL-2017-2
+            div EE-13-2014
+            div EIC-SMEInst-2018-2020
+            div EINFRA-22-2016
+            div ERC-2013-SyG
+            div ERC-2018-COG
+            div ERC-AG-PE6
+            div ERC-CG-2013-PE6
+            div ERC-CoG-2014
+            div ERC-SG-PE6
+            div EUB-1-2015
+            div FCT-09-2015
+            div FP7-ICT-2013-10
+            div FP7-PEOPLE-2011-IOF
+            div FP7-PEOPLE-2012-CIG
+            div FP7-PEOPLE-2013-CIG
+            div FP7-PEOPLE-2013-IIF
+            div FP7-PEOPLE-IOF-2008
+            div FP7-SEC-2012-1
+            div H2020-DS-LEIT-2017
+            div H2020-DS-SC7-2016
+            div H2020-DS-SC7-2017	
+            div H2020-EU.3.7.4
+            div H2020-FOF-2016
+            div H2020-ICT-2014-1
+            div H2020-ICT-2015
+            div H2020-ICT-2016-1
+            div H2020-ICT-2017-1
+            div H2020-INFRAEOSC-2018-1
+            div H2020-IOT-2016
+            div H2020-IOT-2017
+            div H2020-MSCA-RISE-2015
+            div H2020-MSCA-RISE-2017
+            div H2020-SC1-FA-DTS-2018-1
+            div H2020-SMEINST-1-2016-2017
+            div H2020-SU-ICT-2018
+            div H2020-SU-ICT-2018-2
+            div ICT-01-2019
+            div ICT-06-2016
+            div ICT-07-2014
+            div ICT-09-2014
+            div ICT-10-2016
+            div ICT-12-2015
+            div ICT-12-2016
+            div ICT-16-2015
+            div ICT-18-2016
+            div ICT-20-2019-2020
+            div ICT-2007.1.4
+            div ICT-2007.6.2
+            div ICT-2009.1.4
+            div ICT-2013.1.5
+            div ICT-2013.10.1
+            div ICT-2013.6.1
+            div ICT-32-2014
+            div ICT-35-2016
+            div ICT-37-2014-1
+            div ICT-37-2015-1
+            div ICT-38-2015
+            div INNOSUP-02-2016
+            div JTI-CS2-2018-CfP09-SYS-01-11	
+            div MSCA-COFUND-2016
+            div MSCA-IF-2014-EF
+            div MSCA-IF-2015-EF
+            div MSCA-IF-2016
+            div MSCA-IF-2017
+            div MSCA-IF-2018
+            div MSCA-ITN-2014-ETN
+            div MSCA-ITN-2015-ETN
+            div MSCA-RISE-2015
+            div MSCA-RISE-2016
+            div MSCA-RISE-2018
+            div MSCA-RISE-2019
+            div PEOPLE-2007-4-3.IRG
+            div S2R-OC-IP2-01-2015
+            div SEC-2010.6.5-2
+            div SEC-2011.2.5-1
+            div SEC-2011.3.4-1
+            div SEC-2011.6.1-5
+            div SEC-2011.6.5-2
+            div SEC-2012.2.3-1
+            div SEC-2012.6.1-2
+            div SiS-2008-1.2.2.1
+            div SiS-2009-1.1.2.1
+            div SiS.2013.1.2-1
+            div SMEInst-01-2016-2017
+            div SMEInst-02-2016-2017
+            div SMEInst-09-2016-2017
+            div SMEInst-10-2016-2017
+            div SMEInst-13-2016-2017
+            div SSH-2009-3.2.1.
+            div SU-DS01-2018
+            div SU-DS04-2018-2020
+            div SU-DS05-2018-2019
+            div SU-FCT02-2018-2019-2020
+            div SU-ICT-01-2018
+            div SU-INFRA01-2018-2019-2020
+            div SU-TDS-02-2018
+            div SU-TDS-03-2018

src/server/views/static/doc/ecosystem-domains.pug

@@ -3,10 +3,104 @@ extends ../../structure/_base
 block content
 
     section.intro
+        a(name="intro")
         div.title Ecosystem domains
+        p:  | The EU Project radar provides an accurate and unique birds eye view of the European 
+            | R&I cybersecurity landscape of EC-funded projects. The backbone of the EU 
+            | Project Radar are six segments which represent the Cybersecurity R&I taxonomy as 
+            | defined by the University of Oxford. These are described below.
+        p:  | When populating the radar, a project's classification according to the taxonomy
+            | determines the sector in which the project's radar "blip" (a small circle) will
+            | be placed.
+        p:  img(src="/img/radar_segment_view.png" style="display: block; width: 50%; margin: auto;")
+        p:  | By clicking on the radar segments, you can dive deeper into each theme and get a 
+            | clearer picture of the different projects that have been funded and their relative 
+            | maturity. Each blip represents a project and you can click  on them for more 
+            | information. Projects are also listed on the right of the screen and information 
+            | can be accessed there too by clicking on the project name.
+        p:  | Use the JRC Taxonomy filter to identify projects working on a particular technology 
+            | or vertical sector.
 
     section.topic
-        div.title 
+        a(name="taxonomy")
+        div.title Cybersecurity Research and Innovation Taxonomy
+        p:  | The Cyberwatchng.eu project uses the University of Oxford's definition of a
+            | Cybersecurity Research and Innovation Taxonomy to classify projects for the radar.
+            | The taxonomy includes six terms whose definitions are given below.
+        p:  | To learn more about how and why this taxonomy was used for the radar, and how we also 
+            | mapped the taxonomy to other well-known about the cybersecurity definitions such as 
+            | the NIST Cybersecurity framework, please follow through to this Cyberwatching.eu 
+            a(href="https://www.cyberwatching.eu/d21-cybersecurity-and-privacy-ecosystem-model-report-taxonomy-cybersecurity-and-privacy-assess-coverage-developed-landscape-ec-and-nationally-funded-projects") report 
+            | .
 
     section.sub-topic
-        div.title 
+        div.title Secure systems and technology
+        p:  | How security can be built into technology from the design stage including cloud 
+            | computing security, cryptography, trusted platforms, wireless security, mobile 
+            | security and secure coding paradigms. 
+
+    section.sub-topic
+        div.title Verification and Assurance
+        p:  | Two disciplines that help establish how much confidence you can have in a system, 
+            | both in terms of security and the privacy of all stakeholder groups who act with 
+            | or in a system.  Assurance focuses on managing risks related to the use, 
+            | processing, storage, and transmission of information, whereas formal verification 
+            | seeks to build a mathematical model of a digital system and then try to prove 
+            | whether it is ‘correct’, often helping to find subtle flaws. 
+
+    section.sub-topic
+        div.title Operational risk, Management and Analytics
+        p:  | Understanding the risk and harm resulting from cyberattacks, and how it propagates 
+            | across and between organisations.  Work focuses on creating situational awareness 
+            | through aiming for a complete understanding of scenario and risk management; 
+            | metrics and models for security postures; and analytics for predicting risk, 
+            | prioritising responses and supporting security operations. 
+
+    section.sub-topic
+        div.title Identity, behaviour, ethics and Privacy
+        p:  | Bringing diverse perspectives and interpretations to questions such as: Who are 
+            | you online, how do you communicate, and what can (or should) you do? This also 
+            | connects to the ongoing activities on Privacy launched through directives and 
+            | regulations by the EC.
+
+    section.sub-topic
+        div.title National and international security, privacy and governance
+        p:  | Looking at politics, international relations, defence, policy and governance 
+            | issues; how do countries and communities interact with (and through) technology, 
+            | and how might this change in different contexts?
+
+    section.sub-topic
+        div.title Human aspects of cyber security
+        p:  | Understanding the ways humans interact with (and through) digital systems – 
+            | whether to understand and design for target users, or to understand how adversaries 
+            | operate and can exploit the systems.  This includes aspects like usability, trust, 
+            | collaborative practices, social embeddedness, nationhood, cultural diversity, 
+            | impact on economy, and the relationship between microsocial interactions and global 
+            | structures.
+
+    section.topic
+        a(name="jrc_taxonomy")
+        div.title Filter projects by JRC taxonomy terms
+        p:  | If you are looking for projects that are working on a particular technology or 
+            | vertical sector then by clicking on “JRC Taxonomy” you can hone in on range of 
+            | choices of exactly which topics to view.
+        p:  | The filters are based on the EC’s Joint Research Centre’s Cybersecurity taxonomy 
+            | which has been designed to categorise EU competencies in the field. The radar 
+            | quickly visualizes the different selections that you make based on this 
+            | three-dimensional taxonomy which covers research domains, sectors and technology 
+            | and use-case dimensions. 
+        p:  | The taxonomy is an integral part of the EC’s new 
+            a(href="https://cybersecurity-atlas.ec.europa.eu/") Cybersecurity Atlas 
+            | which maps, categorises and stimulates collaboration between European cybersecurity 
+            | experts in support of the EU Digital Strategy.
+        p:  | You can also quickly visualize statistics pertaining to your selection including 
+            | the number of projects and their type, total budget, average budget, total duration and average duration.
+
+        p:  img(src="/img/radar_filter_statistics.png" style="display: block; margin: auto; width: 60%;")
+
+        p:  | You can view the full JRC taxonomy 
+            a(href="https://publications.jrc.ec.europa.eu/repository/handle/JRC111441") here
+            | . Cyberwatching.eu contributed to this first edition sharing information of the 
+            | Cyberwatching.eu taxonomy mentioned above.
+
+