Skip to content

Commit

Permalink
Merge pull request #50 from fac-13/scale
Browse files Browse the repository at this point in the history
Scale
  • Loading branch information
eadehemingway authored May 13, 2018
2 parents be94dda + 5b61aca commit 664063b
Show file tree
Hide file tree
Showing 3 changed files with 33 additions and 8 deletions.
19 changes: 19 additions & 0 deletions public/dom.js
Original file line number Diff line number Diff line change
@@ -1 +1,20 @@
/* eslint-disable */
var scales = document.querySelectorAll('input[type=range]')
// we need to use an array of comments from the database - this one is for testing only
const test = ['No pain', '', '', '', '4 means I take some pain medication', '', '', '', 'Can\'t focus on anything but my pain', '', ''];

scales.forEach((scale) => {
scale.addEventListener('change', function () {
var currentScaleId = `${this.id}`; //e.g. gives scale-fatigue
var commentBoxId = `comment${currentScaleId.slice(currentScaleId.indexOf('-'))}`;
var scaleNumberId = `${this.id}-number`;
var scaleNumber = document.querySelector(`#${scaleNumberId}`);
var commentBox = document.querySelector(`#${commentBoxId}`);


scaleNumber.textContent = `${this.value}`;
commentBox.textContent = test[this.value] === '' ? "Any comments you've saved will appear here as you move the scale" : `Hint: ${test[this.value]}`
})
})


2 changes: 1 addition & 1 deletion src/controllers/addData.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
const symptomsList = [{ symptom: 'fatigue' }, { symptom: 'dry skin' }];
const symptomsList = [{ symptom: 'fatigue' }, { symptom: 'headache' }];
const factorsList = [{ factor: 'water' }, { factor: 'sleep' }];


Expand Down
20 changes: 13 additions & 7 deletions src/views/addData.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -3,20 +3,26 @@
<h2>Symptoms</h2>
<ul>
{{#each symptomsList}}
<span>
<li>{{this.symptom}}</li>
{{!-- need to add icon at the end --}}
<button class="expand">E</button>
</span>

<div id="symptom-rating">
<span>
<li>{{this.symptom}}</li>
{{!-- need to add icon at the end --}}
<button class="expand">E</button>
</span>
<br>
<input id="scale-{{this.symptom}}" type="range" min="0" max="10" value="0" steps="1">
<span id="scale-{{this.symptom}}-number"></span>
<p id="comment-{{this.symptom}}">Any comments you've saved will appear here as you move the scale</p>
</div>
{{/each}}
</ul>


<h2>Factors</h2>

<ul>
{{#each factorsList}}
<span>
<span id="factors-rating">
<li>{{this.factor}}</li>
{{!-- need to add icon at the end --}}
<button class="expand">E</button>
Expand Down

0 comments on commit 664063b

Please sign in to comment.