Merge pull request #71 from FAC-11/progressBar

Progress bar
FAC-11 · Oct 12, 2017 · 45a75ce · 45a75ce
2 parents ec7bcc3 + 3579f39
commit 45a75ce
Show file tree

Hide file tree

Showing 11 changed files with 11 additions and 28 deletions.
diff --git a/public/modal.js b/public/modal.js
@@ -1,9 +1,7 @@
 var modal = document.getElementById('modal');
 var close = document.getElementsByClassName('close')[0];
 
-var lightbulbs = [].slice.call(
-  document.querySelectorAll('.lightbulb');
-);
+var lightbulbs = [].slice.call(document.querySelectorAll('.lightbulb'));
 
 lightbulbs.forEach(function(lightbulb){
   lightbulb.addEventListener('click', function () {

diff --git a/public/theme.css b/public/theme.css
@@ -28,16 +28,6 @@
   color: rgba(165, 84, 236, 1);
 }
 
-
-#myBar {
-    width: 10%;
-    height: 30px;
-    background-color: #4CAF50;
-    text-align: center; /* To center it horizontally (if you want) */
-    line-height: 30px; /* To center it vertically */
-    color: white;
-}
-
 .header-background-colour{
   background-color: rgba(18, 192, 191, 1);
 }

diff --git a/src/controllers/about.js b/src/controllers/about.js
@@ -6,6 +6,7 @@ exports.get = (req, res) => {
       res.render('about', {
         activePage: { about: true },
         pageTitle: 'About Me',
+        progressPercentage: '60',
         previousPage: '/symptoms',
         nextPage: '/background',
         data,

diff --git a/src/controllers/appointments.js b/src/controllers/appointments.js
@@ -26,7 +26,7 @@ exports.get = (req, res) => {
       pageTitle: 'Your appointment',
       data,
       checked,
-      percentage: '15%',
+      progressPercentage: '20',
       previousPage: '/progress',
       nextPage: '/symptoms',
     });
@@ -42,7 +42,7 @@ exports.post = (req, res) => {
     res.render('appointments', {
       activePage: { appointments: true },
       pageTitle: 'Your appointment',
-      percentage: '15%',
+      progressPercentage: '15%',
       previousPage: '/progress',
       nextPage: '/symptoms',
       messages: [{ error: true, content: 'Sorry - the appointments section couldn\'t be saved' }],

diff --git a/src/controllers/background.js b/src/controllers/background.js
@@ -6,7 +6,7 @@ exports.get = (req, res) => {
       res.render('background', {
         activePage: { background: true },
         pageTitle: 'Your background',
-        percentage: '85%',
+        progressPercentage: '80',
         previousPage: '/about',
         nextPage: '/send',
         data,
@@ -17,7 +17,7 @@ exports.get = (req, res) => {
       res.render('background', {
         activePage: { background: true },
         pageTitle: 'Your background',
-        percentage: '85%',
+        progressPercentage: '60%',
         previousPage: '/about',
         nextPage: '/send',
       });

diff --git a/src/controllers/send.js b/src/controllers/send.js
@@ -2,6 +2,5 @@ exports.get = (req, res) => {
   res.render('send', {
     activePage: { send: true },
     pageTitle: 'Send',
-    percentage: '95%',
   });
 };
diff --git a/src/controllers/symptoms.js b/src/controllers/symptoms.js
@@ -12,7 +12,7 @@ exports.get = (req, res) => {
       res.render('symptoms', {
         activePage: { symptoms: true },
         pageTitle: 'Symptoms & Difficulties',
-        percentage: '40%',
+        progressPercentage: '40',
         previousPage: '/appointments',
         nextPage: '/about',
         data,
@@ -30,7 +30,7 @@ exports.post = (req, res) => {
       res.render('symptoms', {
         activePage: { symptoms: true },
         pageTitle: 'Symptoms & Difficulties',
-        percentage: '40%',
+        progressPercentage: '40',
         previousPage: '/appointments',
         nextPage: '/about',
         messages: [{ error: true, content: 'Sorry - the symptoms section couldn\'t be saved' }],

diff --git a/src/views/appointments.hbs b/src/views/appointments.hbs
@@ -1,4 +1,4 @@
-{{> header }}
+{{> header }} {{> progress_bar }}
 
 
 <section class="tc">

diff --git a/src/views/helpers/progress.js b/src/views/helpers/progress.js
diff --git a/src/views/partials/navbar.hbs b/src/views/partials/navbar.hbs
@@ -2,7 +2,7 @@
   <footer class="navbar list flex justify-around pt3 bt b--black-20">
     <div class=""><a href={{previousPage}}><img src="https://files.gitter.im/foundersandcoders/AllAboutMe/hAmU/image.png" alt="progress icon"></img></a></div>
     <div class=""><a href=/progress><img src="https://files.gitter.im/foundersandcoders/AllAboutMe/UUxu/image.png" alt="progress icon"></img></a></div>
-    <div class=""><a href={{nextPage}}><img src="https://files.gitter.im/foundersandcoders/AllAboutMe/AMao/image.png" alt="progress icon"></img></a></div>
+    <div class=""><a href={{nextPage}}><img src="https://files.gitter.im/foundersandcoders/AllAboutMe/AMao/image.png" alt="progress icon"  class="nextButton"></img></a></div>
   </footer>
 
 </nav>
diff --git a/src/views/partials/progress_bar.hbs b/src/views/partials/progress_bar.hbs
@@ -1,3 +1,3 @@
 <div id="myProgress">
-  <div id="myBar">{{percentage}}</div>
+  <progress id="myBar" value="{{progressPercentage}}" max="100" class="progressBar w-100 bg-light-green">{{progressPercentage}}</progress>
 </div>