From 1b79b9e310c42bedd85e5fc67f0bade512f459c3 Mon Sep 17 00:00:00 2001 From: Shane Edwards Date: Wed, 25 Apr 2018 10:42:29 +0100 Subject: [PATCH] New version of your household initialised --- _prototypes/your-household-v2/bundle.js | 398 ++++++++++++++++++ .../your-household-v2/confirm-address.html | 105 +++++ .../your-household-v2/do-you-live-here.html | 117 +++++ .../does-anyone-else-live-here.html | 144 +++++++ _prototypes/your-household-v2/index.html | 237 +++++++++++ .../relationships-summary.html | 177 ++++++++ .../your-household-v2/relationships.html | 388 +++++++++++++++++ .../your-household-v2/section-intro.html | 76 ++++ _prototypes/your-household-v2/style.css | 20 + _prototypes/your-household-v2/summary.html | 313 ++++++++++++++ .../temp-away-from-home.html | 111 +++++ _prototypes/your-household-v2/visitors.html | 88 ++++ .../your-household-v2/what-is-your-name.html | 140 ++++++ .../your-household-v2/who-else-to-add.html | 181 ++++++++ _prototypes/your-household/bundle.js | 86 ++-- _prototypes/your-household/summary.html | 245 ++++++----- 16 files changed, 2682 insertions(+), 144 deletions(-) create mode 100644 _prototypes/your-household-v2/bundle.js create mode 100644 _prototypes/your-household-v2/confirm-address.html create mode 100644 _prototypes/your-household-v2/do-you-live-here.html create mode 100644 _prototypes/your-household-v2/does-anyone-else-live-here.html create mode 100644 _prototypes/your-household-v2/index.html create mode 100644 _prototypes/your-household-v2/relationships-summary.html create mode 100644 _prototypes/your-household-v2/relationships.html create mode 100644 _prototypes/your-household-v2/section-intro.html create mode 100644 _prototypes/your-household-v2/style.css create mode 100644 _prototypes/your-household-v2/summary.html create mode 100644 _prototypes/your-household-v2/temp-away-from-home.html create mode 100644 _prototypes/your-household-v2/visitors.html create mode 100644 _prototypes/your-household-v2/what-is-your-name.html create mode 100644 _prototypes/your-household-v2/who-else-to-add.html diff --git a/_prototypes/your-household-v2/bundle.js b/_prototypes/your-household-v2/bundle.js new file mode 100644 index 0000000000..8ee37c644c --- /dev/null +++ b/_prototypes/your-household-v2/bundle.js @@ -0,0 +1,398 @@ +export const HOUSEHOLD_MEMBERS_STORAGE_KEY = 'household-members'; +export const USER_STORAGE_KEY = 'user-details'; +export const USER_HOUSEHOLD_MEMBER_ID = 'person_me'; +export const HOUSEHOLD_MEMBER_TYPE = 'household-member'; +export const RELATIONSHIPS_STORAGE_KEY = 'relationships'; +export const VISITOR_TYPE = 'visitor'; + +let relationshipTypes = { + 'spouse': {}, + 'child-parent': {}, + 'step-child-parent': {}, + 'grandchild-grandparent': {}, + 'sibling': {}, + 'step-brother-sister': {}, + 'partner': {}, + 'unrelated': {}, + 'other-relation': {} +}; + +let relationshipDescriptionMap = { + 'husband-wife': { + sentanceLabel: 'husband or wife', + type: relationshipTypes['spouse'] + }, + 'mother-father': { + sentanceLabel: 'mother or father', + type: relationshipTypes['child-parent'] + }, + 'step-mother-father': { + sentanceLabel: 'step-mother or step-father', + type: relationshipTypes['step-child-parent'] + }, + 'son-daughter': { + sentanceLabel: 'son or daughter', + type: relationshipTypes['child-parent'] + }, + 'step-child': { + sentanceLabel: 'step-child', + type: relationshipTypes['step-child-parent'] + }, + 'grandparent': { + sentanceLabel: 'grandparent', + type: relationshipTypes['grandchild-grandparent'] + }, + 'grandchild': { + sentanceLabel: 'grandchild', + type: relationshipTypes['grandchild-grandparent'] + }, + 'brother-sister': { + sentanceLabel: 'brother or sister', + type: relationshipTypes['sibling'] + }, + 'step-brother-sister': { + sentanceLabel: 'step-brother or step-sister', + type: relationshipTypes['step-brother-sister'] + }, + 'other-relation': { + sentanceLabel: 'other type of relation', + type: relationshipTypes['other-relation'] + }, + 'partner': { + sentanceLabel: 'partner', + type: relationshipTypes['partner'] + }, + 'unrelated': { + sentanceLabel: 'not related', + type: relationshipTypes['unrelated'] + } +}; + +export function getAddress() { + let addressLines = sessionStorage.getItem('address').split(','); + + return { + addressLine1: addressLines[0], + addressLine2: addressLines[1], + addressLine3: addressLines[2], + addressCounty: addressLines[4], + addressTownCity: addressLines[3], + addressPostcode: addressLines[5] + } +} + +/** + * User + */ +export function addUserPerson(person) { + sessionStorage.setItem(USER_STORAGE_KEY, JSON.stringify(person)); +} + +export function getUserPerson() { + return JSON.parse(sessionStorage.getItem(USER_STORAGE_KEY)); +} + +/** + * Household + */ +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(); + + userAsHouseholdMember + ? updateHouseholdMember(userAsHouseholdMember['@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 || {}; + + people.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 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 + }; +} + +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; +} + +/** + * Relationships + */ +export function addRelationship(relationshipObj) { + let householdRelationships = getAllRelationships() || [], + item = { + ...relationshipObj, + id: autoIncrementId('relationships') + }; + + householdRelationships.push(item); + + sessionStorage.setItem(RELATIONSHIPS_STORAGE_KEY, + JSON.stringify(householdRelationships)); + + return item; +} + +export function editRelationship(relationshipId, valueObject) { + let householdRelationships = (getAllRelationships() || []).map(function(relationship) { + return (relationship.id + '') === (relationshipId + '') ? { + ...valueObject, + id: relationshipId + } : relationship; + }); + + sessionStorage.setItem(RELATIONSHIPS_STORAGE_KEY, + JSON.stringify(householdRelationships)); +} + +export function getAllRelationships() { + return JSON.parse(sessionStorage.getItem(RELATIONSHIPS_STORAGE_KEY)) || []; +} + +export function deleteAllRelationshipsForMember(memberId) { + const householdRelationships = getAllRelationships() + .filter((relationship) => { + return !(memberId === relationship.personIsId || memberId === relationship.personToId); + }); + + sessionStorage.setItem(RELATIONSHIPS_STORAGE_KEY, + JSON.stringify(householdRelationships)); +} + +export function relationship(description, personIsId, personToId) { + return { + personIsDescription: description, + personIsId: personIsId, + personToId: personToId + }; +} + +/** + * Helpers + */ +function createNavItem(member) { + let $nodeEl = $('
  • ' + + ' ' + + '
    • '), + $linkEl = $nodeEl.find('.js-template-nav-item-label'); + + $linkEl.html(member['@person'].fullName); + + if (member['@person'].id === USER_HOUSEHOLD_MEMBER_ID) { + $linkEl.attr('href', '../what-is-your-name'); + } else { + $linkEl.attr('href', '../who-else-to-add?edit=' + member['@person'].id); + } + + return $nodeEl; +} + +function updateHouseholdVisitorsNavigationItems() { + let allHouseholdMembers = window.ONS.storage.getAllHouseholdMembers(), + householdMembers = allHouseholdMembers.filter(window.ONS.storage.isHouseholdMember), + visitors = allHouseholdMembers.filter(window.ONS.storage.isVisitor); + + const $navigationHouseholdMembersEl = $('#navigation-household-members'), + $navigationVisitorsEl = $('#navigation-visitors'); + + if (householdMembers.length) { + $.each(householdMembers, function(i, member) { + $navigationHouseholdMembersEl.append(createNavItem(member)); + }); + } else { + $navigationHouseholdMembersEl.parent().hide(); + } + + if (visitors.length) { + $.each(visitors, function(i, member) { + $navigationVisitorsEl.append(createNavItem(member)); + }); + } else { + $navigationVisitorsEl.parent().hide(); + } +} + +function createListItemPerson(member) { + return $('
  • ').addClass('mars').html( + '' + member['@person'].fullName + '' + ); +} + +function populateHouseholdList() { + const $el = $('#household-members'); + + if (!$el.length) { + return; + } + + let members = getAllHouseholdMembers() || []; + + $el.empty().append(members.filter((member) => { + return member.type === HOUSEHOLD_MEMBER_TYPE; + }).map(createListItemPerson)); + + $el.addClass('list list--people-plain'); +} + +function populateVisitorList() { + const $el = $('#visitors-list'); + + if (!$el.length) { + return; + } + + let members = getAllHouseholdMembers() || []; + + $el.empty().append(members.filter((member) => { + return member.type === VISITOR_TYPE; + }).map(createListItemPerson)); + + $el.addClass('list list--people-plain'); +} + +function updateAddresses() { + let addressLines = (sessionStorage.getItem('address') || '').split(','), + addressLine1 = addressLines[0], + addressLine2 = addressLines[1]; + + $('#section-address').html(addressLine1); + $('.address-text').html(addressLine1 + ', ' + addressLine2); +} + +function autoIncrementId(collection) { + let k = collection + '-increment', + id = parseInt(sessionStorage.getItem(k)) || 0; + + id++; + + sessionStorage.setItem(k, JSON.stringify(id)); + + return id; +} + +window.ONS = {}; +window.ONS.storage = { + getAddress, + addHouseholdMember, + updateHouseholdMember, + deleteHouseholdMember, + getAllHouseholdMembers, + addUserPerson, + getUserPerson, + getUserAsHouseholdMember, + getHouseholdMemberByPersonId, + updateUserAsHouseholdMember, + deleteUserAsHouseholdMember, + + isVisitor, + isOtherHouseholdMember, + isHouseholdMember, + + addRelationship, + editRelationship, + getAllRelationships, + deleteAllRelationshipsForMember, + + relationshipDescriptionMap, + + KEYS: { + HOUSEHOLD_MEMBERS_STORAGE_KEY, + USER_STORAGE_KEY, + HOUSEHOLD_MEMBER_TYPE, + VISITOR_TYPE + }, + + IDS: { + USER_HOUSEHOLD_MEMBER_ID + }, + + TYPES: { + person, + relationship + } +}; + +window.ONS.helpers = { + populateHouseholdList, + populateVisitorList +}; + +$(populateHouseholdList); +$(populateVisitorList); +$(updateHouseholdVisitorsNavigationItems); +$(updateAddresses); diff --git a/_prototypes/your-household-v2/confirm-address.html b/_prototypes/your-household-v2/confirm-address.html new file mode 100644 index 0000000000..8cc5996143 --- /dev/null +++ b/_prototypes/your-household-v2/confirm-address.html @@ -0,0 +1,105 @@ +--- +title: Confirm address +project: your-household +globalcss: false +--- + + + +
    + {% include bar.html %} + {% include header-census.html %} +
    + +
    +
    + Previous +
    +
    + +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +

    + Can you confirm this address is correct? +

    +
    + +

    Pipe in address here

    + +
    +
    +
    +
    + + +
    + +
    + + +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    + + + +
    + +
    +
    + + + + + + + + + diff --git a/_prototypes/your-household-v2/do-you-live-here.html b/_prototypes/your-household-v2/do-you-live-here.html new file mode 100644 index 0000000000..eafcff235d --- /dev/null +++ b/_prototypes/your-household-v2/do-you-live-here.html @@ -0,0 +1,117 @@ +--- +title: Do you live here +project: your-household +globalcss: false +--- + + + +
    + {% include bar.html %} + {% include header-census.html %} +
    + +
    +
    + Previous +
    +
    + +
    +
    +
    + {% include navigation.html items=site.data.your-household.navigationItemsHousehold nav-title-id="section-address" %} +
    +
    +
    +
    +
    +
    +
    +
    +

    + Do you live at ? +

    + +
    +
    +
    +
    + + +
    + +
    + + +
    +
    +
    +
    +
    +
    +
    +
    + +
    + +
    +
    + Previous +
    +
    +
    +
    + + + + + + diff --git a/_prototypes/your-household-v2/does-anyone-else-live-here.html b/_prototypes/your-household-v2/does-anyone-else-live-here.html new file mode 100644 index 0000000000..119f955298 --- /dev/null +++ b/_prototypes/your-household-v2/does-anyone-else-live-here.html @@ -0,0 +1,144 @@ +--- +title: Does anyone else live here +project: your-household +globalcss: false +--- + + + +
    + {% include bar.html %} + {% include header-census.html %} +
    + +
    +
    + Previous +
    +
    + +
    +
    +
    + {% include navigation.html items=site.data.your-household.navigationItemsHousehold nav-title-id="section-address" %} +
    +
    +
    +
    + +
    +
    +
    +
    +

    + Does anybody else live at ? +

    +
    + +
    + +
    +
    +
    +
    + + +
    + +
    + + +
    +
    +
    +
    +
    +
    +
    + +
    + +
    +
    + Previous +
    +
    +
    +
    + + + + + + + diff --git a/_prototypes/your-household-v2/index.html b/_prototypes/your-household-v2/index.html new file mode 100644 index 0000000000..50dcd781d3 --- /dev/null +++ b/_prototypes/your-household-v2/index.html @@ -0,0 +1,237 @@ +--- +title: Enter your address +project: your-household +globalcss: false +--- + + + +
    + {% include bar.html %} + {% include header-census.html %} +
    + +
    +
    + Previous +
    +
    + +
    +
    +
    +
    + +
    +
    + + +
    +
    +
    +

    + What is your address? +

    + +
    + + What is your address? + +
    +
    +
    +
    +
    + +

    Including your house name or number

    + + +
    +
    +
    +
    + +
    +
    +
    +
    + + + +
    +
    +
    +
    + +
    +
    +
    +
    + + +
    +
    +
    +
    + +
    +
    +
    +
    + + + +
    +
    +
    +
    + +
    +
    +
    +
    + + + +
    +
    +
    +
    + +
    +
    +
    +
    + + + +
    +
    +
    +
    + +
    +
    +
    +
    + + + +
    +
    +
    +
    +
    +
    +
    +
    +
    + + + + +
    + +
    + + Previous +
    +
    +
    +
    + + + + + diff --git a/_prototypes/your-household-v2/relationships-summary.html b/_prototypes/your-household-v2/relationships-summary.html new file mode 100644 index 0000000000..2fa75bbb65 --- /dev/null +++ b/_prototypes/your-household-v2/relationships-summary.html @@ -0,0 +1,177 @@ +--- +title: Household relationships +project: your-household +globalcss: false +householdMembers: +visitors: +--- + + + +
    + {% include bar.html %} + {% include header-census.html %} +
    + +
    +
    + Previous +
    +
    + +
    +
    +
    + {% include navigation.html items=site.data.your-household.navigationItemsRelationships nav-title-id="section-address" %} + {% include navigation.html items=page.householdMembers title="Household members" nav-id="navigation-household-members" %} + {% include navigation.html items=page.visitors title="Visitors" nav-id="navigation-visitors" %} +
    +
    +
    +
    +
    +
    +
    +

    Household relationships

    + +
    + This section is now complete +
      +
    • You can check your answers below
      • +
    +
    +
    + +
    +
    +
    +
    + +
    +
    +
    +
    +
    + + + +
    +
    +

    +
      +
      +
      + + + + + + + diff --git a/_prototypes/your-household-v2/relationships.html b/_prototypes/your-household-v2/relationships.html new file mode 100644 index 0000000000..9b01fd58cc --- /dev/null +++ b/_prototypes/your-household-v2/relationships.html @@ -0,0 +1,388 @@ +--- +title: Relationships +project: your-household +globalcss: false +householdMembers: +visitors: +--- + + + +
      + {% include bar.html %} + {% include header-census.html %} +
      + +
      +
      + Previous +
      +
      + +
      +
      +
      + {% include navigation.html items=site.data.your-household.navigationItemsRelationships nav-title-id="section-address" %} + {% include navigation.html items=page.householdMembers title="Household members" nav-id="navigation-household-members" %} + {% include navigation.html items=page.visitors title="Visitors" nav-id="navigation-visitors" %} +
      +
      +
      +
      +
      +
      +
      +
      +

      + How is + related to ? +

      + +

      + is + ... to + +

      +
      +
      +
      +
      + + +
      +
      + + +
      +
      + + +
      +
      + + +
      +
      + + +
      +
      + + +
      +
      + + +
      +
      + + +
      +
      + + +
      +
      + + +
      +
      + + +
      +
      + + +
      +
      +
      +
      +
      +
      +
      +
      + +
      +
      +
      +
      +
      + + + + + + + diff --git a/_prototypes/your-household-v2/section-intro.html b/_prototypes/your-household-v2/section-intro.html new file mode 100644 index 0000000000..c144abba8e --- /dev/null +++ b/_prototypes/your-household-v2/section-intro.html @@ -0,0 +1,76 @@ +--- +title: Section intro +project: your-household +globalcss: false +--- + + + +
      + {% include bar.html %} + {% include header-census.html %} +
      + +
      +
      + Previous +
      +
      + +
      +
      +
      + {% include navigation.html items=site.data.your-household.navigationItemsHousehold nav-title-id="section-address" %} +
      +
      +
      +
      +
      +
      +

      Who lives here?

      + +

      In this section, we’re going to ask you about all the people that live or + are visting .

      + +

      Information you will need:

      +
        +
      • Names of the people living in household
        • +
      • Names of the visitors staying in the household on 27th February 2018
        • +
      +
      +
      +
      + + +
      + +
      + + Previous +
      +
      +
      +
      + + + + + + + + diff --git a/_prototypes/your-household-v2/style.css b/_prototypes/your-household-v2/style.css new file mode 100644 index 0000000000..a12e072264 --- /dev/null +++ b/_prototypes/your-household-v2/style.css @@ -0,0 +1,20 @@ +.list.list--people-plain { + margin-bottom : 1rem; + list-style-type : none; +} + +.list.list--people-plain .list__item { + background: url(/img/icons/person.svg) 0 .2rem no-repeat; +} + +.list.list--people-plain .list__item-name { + padding-left: 1.5rem; +} + +.list.list--people-plain .list__item-actions { + margin-top: -4px; +} + +.list.list--people-plain .list__item-action + .list__item-action { + margin-left : .5rem; +} diff --git a/_prototypes/your-household-v2/summary.html b/_prototypes/your-household-v2/summary.html new file mode 100644 index 0000000000..ffa54ba2e5 --- /dev/null +++ b/_prototypes/your-household-v2/summary.html @@ -0,0 +1,313 @@ +--- +title: Summary +project: your-household +globalcss: false +--- + + + +
      + {% include bar.html %} + {% include header-census.html %} +
      + +
      +
      + Previous +
      +
      + +
      +
      +
      + {% include navigation.html + items=site.data.your-household.navigationItemsHousehold + nav-title-id="section-address" %} +
      +
      +
      +
      +
      +
      +
      +
      +

      + Who lives here? +

      +
      + +
      + This section is now + complete +
        +
      • You can check your answers below +
        • +
      +
      +
      + +

      Household members

      +
        +

        Is + anyone else missing from this list?

        + +
        +

        Visitors staying + overnight on 27th February 2018

        +
          +

          Is + anyone else missing from this list? +

          +
          +
          +
          +
          + +
          + +
          +
          + Previous +
          +
          +
          +
          + + + + + + + + + + + + + diff --git a/_prototypes/your-household-v2/temp-away-from-home.html b/_prototypes/your-household-v2/temp-away-from-home.html new file mode 100644 index 0000000000..d9b70175d3 --- /dev/null +++ b/_prototypes/your-household-v2/temp-away-from-home.html @@ -0,0 +1,111 @@ +--- +title: do-you-live-here +project: your-household +globalcss: false +--- + + + +
          + {% include bar.html %} + {% include header-census.html %} +
          + +
          +
          + Previous +
          +
          + +
          +
          +
          + {% include navigation.html items=site.data.your-household.navigationItemsHousehold nav-title-id="section-address" %} +
          +
          +
          +
          + + +
          +
          +
          + + +
          +

          + Also thinking about those who are temporarily away from home and those staying + without a UK address, is this everyone? +

          +
          + +
            + +
            +
            + Include +
              +
            • people who usually live outside the UK who are + staying in the UK for three months or more
              • +
            • people who work away from home within the UK if this + is their permanent or family home
              • +
            • members of the Armed Force if this is their permanent + or family home
              • +
            • people who are temporarily outside the UK for less + than 12 months
              • +
            • poeple staying temporarily who usually live in the UK + but do not have another UK address, for example relatives, friends
              • +
            • other people who usually live here, including anyone + temporarily away from home
              • +
            + +
            +
            + +
            +
            +
            +
            + + +
            + +
            + + +
            +
            +
            +
            +
            +
            +
            + +
            + +
            +
            + Previous +
            +
            +
            +
            + + + + + diff --git a/_prototypes/your-household-v2/visitors.html b/_prototypes/your-household-v2/visitors.html new file mode 100644 index 0000000000..e729337ffe --- /dev/null +++ b/_prototypes/your-household-v2/visitors.html @@ -0,0 +1,88 @@ +--- +title: Visitors +project: your-household +globalcss: false +--- + + + +
            + {% include bar.html %} + {% include header-census.html %} +
            + +
            +
            + Previous +
            +
            + +
            +
            +
            + {% include navigation.html items=site.data.your-household.navigationItemsHousehold nav-title-id="section-address" %} +
            +
            +
            +
            + + +
            +
            +
            +
            +

            + Were there any visitors staying overnight on 27th February 2018 at + ? +

            +
            + + + +
            +
            +
            +
            + + +
            + +
            + + +
            +
            +
            +
            +
            +
            +
            + +
            + +
            +
            + Previous +
            +
            +
            +
            + + + + + diff --git a/_prototypes/your-household-v2/what-is-your-name.html b/_prototypes/your-household-v2/what-is-your-name.html new file mode 100644 index 0000000000..638cb2978e --- /dev/null +++ b/_prototypes/your-household-v2/what-is-your-name.html @@ -0,0 +1,140 @@ +--- +title: What is your name +project: your-household +globalcss: false +--- + + + +
            + {% include bar.html %} + {% include header-census.html %} +
            + +
            +
            + Previous +
            +
            + +
            +
            +
            + {% include navigation.html items=site.data.your-household.navigationItemsHousehold nav-title-id="section-address" %} +
            + +
            +
            + + +
            +
            + +
            +

            + What is your name? +

            + +
            + What is your name? + +
            +
            + + +
            + +
            + + +
            + +
            + + +
            +
            +
            +
            +
            +
            + + + +
            + +
            + + Previous +
            +
            +
            +
            + + + + + + diff --git a/_prototypes/your-household-v2/who-else-to-add.html b/_prototypes/your-household-v2/who-else-to-add.html new file mode 100644 index 0000000000..9e74d27fdf --- /dev/null +++ b/_prototypes/your-household-v2/who-else-to-add.html @@ -0,0 +1,181 @@ +--- +title: Who else to add +project: your-household +globalcss: false +--- + + + +
            + {% include bar.html %} + {% include header-census.html %} +
            + +
            +
            + Previous +
            +
            + +
            +
            +
            + {% include navigation.html items=site.data.your-household.navigationItemsHousehold nav-title-id="section-address" %} +
            +
            +
            + + +
            +
            + +
            +

            + Who do you need to add to +

            + +
            + +
            + What is your name? + +
            +
            + + +
            + +
            + + +
            + +
            + + +
            +
            +
            +
            +
            +
            + + + +
            + +
            + + Previous +
            +
            +
            +
            + + + + + + diff --git a/_prototypes/your-household/bundle.js b/_prototypes/your-household/bundle.js index 7d43bc1f24..8ee37c644c 100644 --- a/_prototypes/your-household/bundle.js +++ b/_prototypes/your-household/bundle.js @@ -5,7 +5,7 @@ export const HOUSEHOLD_MEMBER_TYPE = 'household-member'; export const RELATIONSHIPS_STORAGE_KEY = 'relationships'; export const VISITOR_TYPE = 'visitor'; -var relationshipTypes = { +let relationshipTypes = { 'spouse': {}, 'child-parent': {}, 'step-child-parent': {}, @@ -17,7 +17,7 @@ var relationshipTypes = { 'other-relation': {} }; -var relationshipDescriptionMap = { +let relationshipDescriptionMap = { 'husband-wife': { sentanceLabel: 'husband or wife', type: relationshipTypes['spouse'] @@ -110,13 +110,16 @@ export function deleteHouseholdMember(personId) { return member['@person'].id !== personId; }); - sessionStorage.setItem(HOUSEHOLD_MEMBERS_STORAGE_KEY, JSON.stringify(members)); + sessionStorage.setItem(HOUSEHOLD_MEMBERS_STORAGE_KEY, + JSON.stringify(members)); } export function updateUserAsHouseholdMember(person, memberData) { let userAsHouseholdMember = getUserAsHouseholdMember(); - userAsHouseholdMember ? updateHouseholdMember(userAsHouseholdMember['@person'], memberData) : addHouseholdMember(person, memberData, USER_HOUSEHOLD_MEMBER_ID); + userAsHouseholdMember + ? updateHouseholdMember(userAsHouseholdMember['@person'], memberData) + : addHouseholdMember(person, memberData, USER_HOUSEHOLD_MEMBER_ID); } export function updateHouseholdMember(person, memberData) { @@ -126,7 +129,8 @@ export function updateHouseholdMember(person, memberData) { : member; }); - sessionStorage.setItem(HOUSEHOLD_MEMBERS_STORAGE_KEY, JSON.stringify(membersUpdated)); + sessionStorage.setItem(HOUSEHOLD_MEMBERS_STORAGE_KEY, + JSON.stringify(membersUpdated)); } export function addHouseholdMember(person, memberData, id) { @@ -145,17 +149,6 @@ export function addHouseholdMember(person, memberData, id) { sessionStorage.setItem(HOUSEHOLD_MEMBERS_STORAGE_KEY, JSON.stringify(people)); } -function autoIncrementId(collection) { - let k = collection + '-increment', - id = parseInt(sessionStorage.getItem(k)) || 0; - - id++; - - sessionStorage.setItem(k, JSON.stringify(id)); - - return id; -} - export function getAllHouseholdMembers() { return JSON.parse(sessionStorage.getItem(HOUSEHOLD_MEMBERS_STORAGE_KEY)) || []; } @@ -168,7 +161,10 @@ export function getHouseholdMemberByPersonId(id) { export function person(opts) { if (opts.firstName === '' || opts.lastName === '') { - console.log('Unable to create person with data: ', opts.firstName, !opts.middleName, !opts.lastName); + console.log('Unable to create person with data: ', + opts.firstName, + !opts.middleName, + !opts.lastName); } let middleName = opts.middleName || ''; @@ -206,7 +202,8 @@ export function addRelationship(relationshipObj) { householdRelationships.push(item); - sessionStorage.setItem(RELATIONSHIPS_STORAGE_KEY, JSON.stringify(householdRelationships)); + sessionStorage.setItem(RELATIONSHIPS_STORAGE_KEY, + JSON.stringify(householdRelationships)); return item; } @@ -219,7 +216,8 @@ export function editRelationship(relationshipId, valueObject) { } : relationship; }); - sessionStorage.setItem(RELATIONSHIPS_STORAGE_KEY, JSON.stringify(householdRelationships)); + sessionStorage.setItem(RELATIONSHIPS_STORAGE_KEY, + JSON.stringify(householdRelationships)); } export function getAllRelationships() { @@ -227,11 +225,13 @@ export function getAllRelationships() { } export function deleteAllRelationshipsForMember(memberId) { - const householdRelationships = getAllRelationships().filter((relationship) => { - return !(memberId === relationship.personIsId || memberId === relationship.personToId); - }); + const householdRelationships = getAllRelationships() + .filter((relationship) => { + return !(memberId === relationship.personIsId || memberId === relationship.personToId); + }); - sessionStorage.setItem(RELATIONSHIPS_STORAGE_KEY, JSON.stringify(householdRelationships)); + sessionStorage.setItem(RELATIONSHIPS_STORAGE_KEY, + JSON.stringify(householdRelationships)); } export function relationship(description, personIsId, personToId) { @@ -246,7 +246,7 @@ export function relationship(description, personIsId, personToId) { * Helpers */ function createNavItem(member) { - var $nodeEl = $('
          • ' + + let $nodeEl = $('
          • ' + ' ' + '
            • '), $linkEl = $nodeEl.find('.js-template-nav-item-label'); @@ -267,20 +267,23 @@ function updateHouseholdVisitorsNavigationItems() { householdMembers = allHouseholdMembers.filter(window.ONS.storage.isHouseholdMember), visitors = allHouseholdMembers.filter(window.ONS.storage.isVisitor); + const $navigationHouseholdMembersEl = $('#navigation-household-members'), + $navigationVisitorsEl = $('#navigation-visitors'); + if (householdMembers.length) { $.each(householdMembers, function(i, member) { - $('#navigation-household-members').append(createNavItem(member)); + $navigationHouseholdMembersEl.append(createNavItem(member)); }); } else { - $('#navigation-household-members').parent().hide(); + $navigationHouseholdMembersEl.parent().hide(); } if (visitors.length) { $.each(visitors, function(i, member) { - $('#navigation-visitors').append(createNavItem(member)); + $navigationVisitorsEl.append(createNavItem(member)); }); } else { - $('#navigation-visitors').parent().hide(); + $navigationVisitorsEl.parent().hide(); } } @@ -291,31 +294,35 @@ function createListItemPerson(member) { } function populateHouseholdList() { - if (!$('#household-members').length) { + const $el = $('#household-members'); + + if (!$el.length) { return; } let members = getAllHouseholdMembers() || []; - $('#household-members').empty().append(members.filter((member) => { + $el.empty().append(members.filter((member) => { return member.type === HOUSEHOLD_MEMBER_TYPE; }).map(createListItemPerson)); - $('#household-members').addClass('list list--people-plain'); + $el.addClass('list list--people-plain'); } function populateVisitorList() { - if (!$('#visitors-list').length) { + const $el = $('#visitors-list'); + + if (!$el.length) { return; } let members = getAllHouseholdMembers() || []; - $('#visitors-list').empty().append(members.filter((member) => { + $el.empty().append(members.filter((member) => { return member.type === VISITOR_TYPE; }).map(createListItemPerson)); - $('#visitors-list').addClass('list list--people-plain'); + $el.addClass('list list--people-plain'); } function updateAddresses() { @@ -327,6 +334,17 @@ function updateAddresses() { $('.address-text').html(addressLine1 + ', ' + addressLine2); } +function autoIncrementId(collection) { + let k = collection + '-increment', + id = parseInt(sessionStorage.getItem(k)) || 0; + + id++; + + sessionStorage.setItem(k, JSON.stringify(id)); + + return id; +} + window.ONS = {}; window.ONS.storage = { getAddress, diff --git a/_prototypes/your-household/summary.html b/_prototypes/your-household/summary.html index 374db9d23c..ffa54ba2e5 100644 --- a/_prototypes/your-household/summary.html +++ b/_prototypes/your-household/summary.html @@ -4,8 +4,9 @@ globalcss: false --- - - + +
            {% include bar.html %} {% include header-census.html %} @@ -20,15 +21,20 @@
            - {% include navigation.html items=site.data.your-household.navigationItemsHousehold nav-title-id="section-address" %} + {% include navigation.html + items=site.data.your-household.navigationItemsHousehold + nav-title-id="section-address" %}
            -
            +
            -
            -
            +
            +

            Who lives here?

            @@ -36,33 +42,47 @@

            - This section is now complete -
              -
            • You can check your answers below
              • + This section is now + complete +
                +
              • You can check your answers below +
            -
            +

            Household members

            -
              -

              Is anyone else missing from this list?

              +
                +

                Is + anyone else missing from this list?

                -

                Visitors staying overnight on 27th February 2018

                -
                  -

                  Is anyone else missing from this list?

                  +

                  Visitors staying + overnight on 27th February 2018

                  +
                    +

                    Is + anyone else missing from this list? +

                    - +
                    -
                    - Previous
                    @@ -71,12 +91,17 @@

                    Visitors staying overnight on 27th February 2018

                    @@ -104,13 +129,13 @@

                    Are you sure you want to remove } .list.list--records .list__item { - margin-bottom : 0; + margin-bottom: 0; padding: 1rem 0; border-bottom: 1px solid #ccc; } .list.list--people { - list-style-type : none; + list-style-type: none; } .list.list--people .list__item { @@ -126,7 +151,7 @@

                    Are you sure you want to remove } .list.list--people .list__item-action + .list__item-action { - margin-left : .5rem; + margin-left: .5rem; } .btn--toggle { @@ -168,121 +193,121 @@

                    Are you sure you want to remove position: relative; background-color: white; max-width: 520px; - padding : 2rem; - text-align : center; + padding: 2rem; + text-align: center; } .modal__buttons { - text-align : center; + text-align: center; } /** * hmmm */ .modal__buttons .btn--toggle { - margin-right : .25rem; - padding : 9px 14px; + margin-right: .25rem; + padding: 9px 14px; } .modal__buttons .btn--primary { - margin-left : .25rem; - padding : 10px 14px; + margin-left: .25rem; + padding: 10px 14px; }