Navigation tool

viewof qTimeScale = {
  const form = Inputs.checkbox(new Map([["Yes", 1], ["No", 2], ["I am not sure", 3]]), {label: "Do you know at what timescale your construct varies?"})
  const scope = DOM.uid().id;
  form.classList.add(scope);
  form.append(htl.html`<style>
      form.${scope} > label {
        display: block;
        width: 100%;
      }
      form.${scope}, .${scope} > div label { display: block }
  </style>`);
  return form;
}

qTimeScaleB_show = {
  let result;
  result = null;
  if (qTimeScale.some((element) => element == 1)) {
    result = viewof qTimeScaleB;
  }
  return result;
}

aTimeScale = {
  const p = document.createElement("p");
  const ul = document.createElement("ul");
  if (qTimeScale.some((element) => element == 2) | qTimeScale.some((element) => element == 3) | qTimeScaleB.length) {
    p.appendChild(document.createElement("strong")).appendChild(document.createTextNode("We recommend the following pages:"));
  }
  if (qTimeScaleB.some((element) => element == 1)) {
    const li1 = document.createElement("li");
    var link = document.createElement("a");
    link.href = "timescale/time-span-process-coverage-granularity.html";
    link.appendChild(document.createTextNode("Key design aspects related to timescales: Time span, process coverage, and granularity"));
    li1.appendChild(link);
    ul.appendChild(li1);
  }
  if (qTimeScale.some((element) => element == 2) | qTimeScale.some((element) => element == 3) | qTimeScaleB.some((element) => element == 3)) {
    const li2 = document.createElement("li");
    const link2 = document.createElement("a");
    link2.href = "theory/timescale.html";
    link2.appendChild(document.createTextNode("Time Scales"))
    li2.appendChild(link2);
    ul.appendChild(li2);
  }
  if (qTimeScaleB.some((element) => element == 2)) {
    const li2 = document.createElement("li");
    const link2 = document.createElement("a");
    link2.href = "theory/timescale/relating-constructs-timescales.html";
    link2.appendChild(document.createTextNode("Relating constructs measured at different timescales"))
    li2.appendChild(link2);
    ul.appendChild(li2);
  }
  p.appendChild(ul);
  return p;
}

viewof qTimeScaleB = {
  const form = Inputs.checkbox(new Map([["Yes", 1], ["No", 2], ["I am not sure", 3]]), {label: "Strictly speaking, do all constructs vary at the same timescale?"})
  const scope = DOM.uid().id;
  form.classList.add(scope);
  form.append(htl.html`<style>
      form.${scope} > label {
        display: block;
        width: 100%;
        margin-left: 25px;
      }
      form.${scope}, .${scope} > div label {
        display: block;
        margin-left: 25px;
      }
  </style>`);
  return form;
}

viewof qItem = {
  const form = Inputs.checkbox(new Map([["Single items", 1], ["Multiple items", 2], ["I am not sure", 3]]), {label: "I want to measure my construct(s) with"})
  const scope = DOM.uid().id;
  form.classList.add(scope);
  form.append(htl.html`<style>
      form.${scope} > label {
        display: block;
        width: 100%;
      }
      form.${scope}, .${scope} > div label { display: block }
  </style>`);
  return form;
}

aItem = {
  const p = document.createElement("p");
  const ul = document.createElement("ul");
  if (qItem.length) {
    p.appendChild(document.createElement("strong")).appendChild(document.createTextNode("We recommend the following pages:"));
  }
  if (qItem.some((element) => element == 1)) {
    const li1 = document.createElement("li");
    var link = document.createElement("a");
    link.href = "measurement/validation/reliability-single-item-measures.html";
    link.appendChild(document.createTextNode("Reliability for single item measures"));
    li1.appendChild(link);
    ul.appendChild(li1);
  }
  if (qItem.some((element) => element == 2)) {
    const li2 = document.createElement("li");
    const link2 = document.createElement("a");
    link2.href = "measurement/validation.html";
    link2.appendChild(document.createTextNode("Validation landing page"))
    li2.appendChild(link2);
    ul.appendChild(li2);
  }
  if (qItem.some((element) => element == 3)) {
    const li3 = document.createElement("li");
    const link3 = document.createElement("a");
    link3.href = "measurement/instrument/single-item-multiple-item-measures.html";
    link3.appendChild(document.createTextNode("Using single item or multiple item measures"))
    li3.appendChild(link3);
    ul.appendChild(li3);
  }
  p.appendChild(ul);
  return p;
}