Your household interviewer led - First part of journey added

_data/your-household-interview-led.yml

@@ -0,0 +1,5 @@
+navigationItemsHousehold:
+- label: People in your household
+  state: current
+- label: Accommodation
+  state: incomplete

_includes/footer-eq-default-minimal.html

@@ -0,0 +1,11 @@
+<footer class="footer" role="contentinfo">
+    <div class="container">
+        <div class="grid">
+            <div class="grid__col col-12@m">
+                <img alt="OGL" class="footer__ogl-img" src="https://cdn.ons.gov.uk/sdc/{% if page.cdn %}{{ page.cdn }}{% else %}v1.0.0{% endif %}/img/UKOpenGovernmentLicence-grey.svg"> All content is available under the
+                <a href="https://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/" class="footer__link">Open Government
+                    Licence v3.0</a>, except where otherwise stated
+            </div>
+        </div>
+    </div>
+</footer>

_includes/header-eq-default.html

@@ -26,7 +26,9 @@
                                 {{ site.title }}
                             {% endif %}
                         </span>
+                        {% unless page.hideSaveLater %}
                         <button class="btn btn--ghost u-fr">Cadw a chwblhau'n ddiweddarach</button>
+                        {% endunless %}
                     </h1>
                 </div>
             </div>

_layouts/eq-default-extras.html

@@ -21,7 +21,11 @@
         {{ content }}
     </div>
     <div class="page__footer">
-        {% include footer-eq-default-transactional.html %}
+        {% if page.footer == "minimal" %}
+            {% include footer-eq-default-minimal.html %}
+        {% else %}
+            {% include footer-eq-default-transactional.html %}
+        {% endif %}
     </div>
 </div>
 <script src="https://cdn.ons.gov.uk/sdc/{% if page.cdn %}{{ page.cdn }}{% else %}v1.0.0{% endif %}/scripts/bundle.js"></script>

_prototypes/your-household-interview-led/assets/household.js

@@ -0,0 +1,133 @@
+import {autoIncrementId} from './utils';
+
+export const HOUSEHOLD_MEMBERS_STORAGE_KEY = 'household-members';
+export const USER_HOUSEHOLD_MEMBER_ID = 'person_me';
+export const HOUSEHOLD_MEMBER_TYPE = 'household-member';
+export const VISITOR_TYPE = 'visitor';
+
+/**
+ * Types
+ */
+export function person(opts) {
+  if (opts.firstName === '' || opts.lastName === '') {
+    console.log('Unable to create person with data: ',
+      opts.firstName,
+      !opts.middleName,
+      !opts.lastName);
+  }
+
+  let middleName = opts.middleName || '';
+
+  return {
+    fullName: opts.firstName + ' ' + middleName + ' ' + opts.lastName,
+    firstName: opts.firstName,
+    middleName,
+    lastName: opts.lastName
+  };
+}
+
+/**
+ * Storage
+ */
+export function getUserAsHouseholdMember() {
+  return getAllHouseholdMembers().find((member) => {
+    return member['@person'].id === USER_HOUSEHOLD_MEMBER_ID;
+  });
+}
+
+export function deleteUserAsHouseholdMember() {
+  deleteHouseholdMember(USER_HOUSEHOLD_MEMBER_ID);
+}
+
+export function deleteHouseholdMember(personId) {
+  let members = getAllHouseholdMembers().filter((member) => {
+    return member['@person'].id !== personId;
+  });
+
+  sessionStorage.setItem(HOUSEHOLD_MEMBERS_STORAGE_KEY,
+    JSON.stringify(members));
+}
+
+export function updateUserAsHouseholdMember(person, memberData) {
+  let userAsHouseholdMember = getUserAsHouseholdMember();
+
+  person.id = USER_HOUSEHOLD_MEMBER_ID;
+
+  userAsHouseholdMember
+    ? updateHouseholdMember(person, memberData)
+    : addHouseholdMember(person, memberData, USER_HOUSEHOLD_MEMBER_ID);
+}
+
+export function updateHouseholdMember(person, memberData) {
+  let membersUpdated = getAllHouseholdMembers().map((member) => {
+    return member['@person'].id === person.id
+      ? {...member, ...memberData, '@person': {...member['@person'], ...person}}
+      : member;
+  });
+
+  sessionStorage.setItem(HOUSEHOLD_MEMBERS_STORAGE_KEY,
+    JSON.stringify(membersUpdated));
+}
+
+export function addHouseholdMember(person, memberData, id) {
+  let people = getAllHouseholdMembers() || [];
+  memberData = memberData || {};
+
+  /**
+   * User is always first in the household list
+   */
+  people[id === USER_HOUSEHOLD_MEMBER_ID ? 'unshift' : 'push']({
+    ...memberData,
+    type: memberData.type || HOUSEHOLD_MEMBER_TYPE,
+    '@person': {
+      ...person,
+      id: id || 'person' + autoIncrementId('household-members')
+    }
+  });
+
+  sessionStorage.setItem(HOUSEHOLD_MEMBERS_STORAGE_KEY, JSON.stringify(people));
+}
+
+export function getAllHouseholdMembers() {
+  return JSON.parse(sessionStorage.getItem(HOUSEHOLD_MEMBERS_STORAGE_KEY)) || [];
+}
+
+export function getHouseholdMemberByPersonId(id) {
+  return getAllHouseholdMembers().find(function(member) {
+    return member['@person'].id === id;
+  });
+}
+
+export function getMemberPersonId(member) {
+  return member['@person'].id;
+}
+
+/**
+ * Comparators
+ */
+export function isVisitor(member) {
+  return member.type === window.ONS.storage.KEYS.VISITOR_TYPE;
+}
+
+export function isHouseholdMember(member) {
+  return member.type === window.ONS.storage.KEYS.HOUSEHOLD_MEMBER_TYPE;
+}
+
+export function isOtherHouseholdMember(member) {
+  return member.type === window.ONS.storage.KEYS.HOUSEHOLD_MEMBER_TYPE &&
+    member['@person'].id !== window.ONS.storage.IDS.USER_HOUSEHOLD_MEMBER_ID;
+}
+
+export const tempAwayQuestionSentenceMap = {
+  'three-more': 'People who usually live outside the UK who are staying in the UK for 3 months or more',
+  'perm-away': 'People who work away from home within the UK, if this is' +
+    ' their permanent or family home',
+  'armed-forces': 'Members of the armed forces, if this is their permanent or' +
+    ' family home',
+  'less-twelve': 'People who are temporarily outside the UK for less than 12' +
+    ' months',
+  'usually-temp': 'People staying temporarily who usually live in the UK but' +
+    ' do not have another UK address, for example, relatives, friends',
+  'other': 'Other people who usually live here, including anyone temporarily' +
+    ' away from home'
+};

_prototypes/your-household-interview-led/assets/numbers-to-words.js

@@ -0,0 +1,146 @@
+/**
+ * Copied from:
+ * https://codereview.stackexchange.com/questions/90349/changing-number-to-words-in-javascript
+ * ===============
+ */
+var ONE_TO_NINETEEN = [
+  'one', 'two', 'three', 'four', 'five',
+  'six', 'seven', 'eight', 'nine', 'ten',
+  'eleven', 'twelve', 'thirteen', 'fourteen', 'fifteen',
+  'sixteen', 'seventeen', 'eighteen', 'nineteen'
+];
+
+var TENS = [
+  'ten', 'twenty', 'thirty', 'forty', 'fifty',
+  'sixty', 'seventy', 'eighty', 'ninety'
+];
+
+var SCALES = ['thousand', 'million', 'billion', 'trillion'];
+
+// helper function for use with Array.filter
+function isTruthy(item) {
+  return !!item;
+}
+
+// convert a number into 'chunks' of 0-999
+function chunk(number) {
+  var thousands = [];
+
+  while(number > 0) {
+    thousands.push(number % 1000);
+    number = Math.floor(number / 1000);
+  }
+
+  return thousands;
+}
+
+// translate a number from 1-999 into English
+function inEnglish(number) {
+  var thousands, hundreds, tens, ones, words = [];
+
+  if(number < 20) {
+    return ONE_TO_NINETEEN[number - 1]; // may be undefined
+  }
+
+  if(number < 100) {
+    ones = number % 10;
+    tens = number / 10 | 0; // equivalent to Math.floor(number / 10)
+
+    words.push(TENS[tens - 1]);
+    words.push(inEnglish(ones));
+
+    return words.filter(isTruthy).join('-');
+  }
+
+  hundreds = number / 100 | 0;
+  words.push(inEnglish(hundreds));
+  words.push('hundred');
+  words.push(inEnglish(number % 100));
+
+  return words.filter(isTruthy).join(' ');
+}
+
+// append the word for a scale. Made for use with Array.map
+function appendScale(chunk, exp) {
+  var scale;
+  if (!chunk) {
+    return null;
+  }
+  scale = SCALES[exp - 1];
+  return [chunk, scale].filter(isTruthy).join(' ');
+}
+
+/**
+ * ===============
+ * End copy
+ */
+
+/**
+ * Modification - decorator
+ */
+var NUMBER_TO_POSITION_TEXT_MAP = {
+  'one': 'first',
+  'two': 'second',
+  'three': 'third',
+  'four': 'fourth',
+  'five': 'fifth',
+  'six': 'sixth',
+  'seven': 'seventh',
+  'eight': 'eighth',
+  'nine': 'nineth',
+  'ten': 'tenth',
+  'eleven': 'eleventh',
+  'twelve': 'twelveth',
+  'thirteen': 'thirteenth',
+  'fourteen': 'fourteenth',
+  'fifteen': 'fifteenth',
+  'sixteen': 'sixteenth',
+  'seventeen': 'seventeenth',
+  'eighteen': 'eighteenth',
+  'nineteen': 'nineteenth',
+
+  'twenty': 'twentieth',
+  'thirty': 'thirtieth',
+  'forty': 'fortieth',
+  'fifty': 'fiftieth',
+  'sixty': 'sixtieth',
+  'seventy': 'seventieth',
+  'eighty': 'eightieth',
+  'ninety': 'ninetieth',
+  'hundred': 'hundredth',
+
+  'thousand': 'thousandth',
+  'million': 'millionth',
+  'billion': 'billionth',
+  'trillion': 'trillionth'
+};
+
+export function numberToPositionWord(num) {
+  const str = chunk(num)
+    .map(inEnglish)
+    .map(appendScale)
+    .filter(isTruthy)
+    .reverse()
+    .join(' ');
+
+  const sub = str.split(' '),
+    lastWordDashSplitArr = sub[sub.length - 1].split('-'),
+    lastWord = lastWordDashSplitArr[lastWordDashSplitArr.length - 1],
+
+    newLastWord = (lastWordDashSplitArr.length > 1? lastWordDashSplitArr[0] + '-' : '') +
+      NUMBER_TO_POSITION_TEXT_MAP[lastWord];
+
+  /*console.log('str:', str);
+  console.log('sub:', sub);
+  console.log('lastWordDashSplitArr:', lastWordDashSplitArr);
+  console.log('lastWord:', lastWord);
+  console.log('newLastWord:', newLastWord);*/
+
+  const subCopy = [].concat(sub);
+  subCopy.pop();
+  const prefix = subCopy.join(' ');
+  const result = (prefix ? prefix + ' ' : '') + newLastWord;
+
+  // console.log('result', (prefix ? prefix + ' ' : '') + newLastWord);
+  return result;
+}