spec_first_draft.html

  <h2>About You</h2>
  <p>All optional, but recommended if you are the responsible party. All info will be visible to people who view the declaration.</p>

  <p>
  <label for="a1">A1. Name</label><br>
  <input type="text" id="a1" name="a1">
  </p>

  <p>
  <label for="a2">A2. Email</label><br>
  <input type="email" id="a2" name="a2">
  </p>

  <p>
  <label for="a3">A3. Country</label><br>
  <select id="a3" name="a3">
  <option value="">Select a country</option>
  <option>Afghanistan</option><option>Albania</option><option>Algeria</option><option>Andorra</option><option>Angola</option><option>Antigua and Barbuda</option><option>Argentina</option><option>Armenia</option><option>Australia</option><option>Austria</option><option>Azerbaijan</option><option>Bahamas</option><option>Bahrain</option><option>Bangladesh</option><option>Barbados</option><option>Belarus</option><option>Belgium</option><option>Belize</option><option>Benin</option><option>Bhutan</option><option>Bolivia</option><option>Bosnia and Herzegovina</option><option>Botswana</option><option>Brazil</option><option>Brunei</option><option>Bulgaria</option><option>Burkina Faso</option><option>Burundi</option><option>Cabo Verde</option><option>Cambodia</option><option>Cameroon</option><option>Canada</option><option>Central African Republic</option><option>Chad</option><option>Chile</option><option>China</option><option>Colombia</option><option>Comoros</option><option>Congo</option><option>Costa Rica</option><option>Croatia</option><option>Cuba</option><option>Cyprus</option><option>Czech Republic</option><option>Denmark</option><option>Djibouti</option><option>Dominica</option><option>Dominican Republic</option><option>Ecuador</option><option>Egypt</option><option>El Salvador</option><option>Equatorial Guinea</option><option>Eritrea</option><option>Estonia</option><option>Eswatini</option><option>Ethiopia</option><option>Fiji</option><option>Finland</option><option>France</option><option>Gabon</option><option>Gambia</option><option>Georgia</option><option>Germany</option><option>Ghana</option><option>Greece</option><option>Grenada</option><option>Guatemala</option><option>Guinea</option><option>Guinea-Bissau</option><option>Guyana</option><option>Haiti</option><option>Honduras</option><option>Hungary</option><option>Iceland</option><option>India</option><option>Indonesia</option><option>Iran</option><option>Iraq</option><option>Ireland</option><option>Israel</option><option>Italy</option><option>Jamaica</option><option>Japan</option><option>Jordan</option><option>Kazakhstan</option><option>Kenya</option><option>Kiribati</option><option>Kuwait</option><option>Kyrgyzstan</option><option>Laos</option><option>Latvia</option><option>Lebanon</option><option>Lesotho</option><option>Liberia</option><option>Libya</option><option>Liechtenstein</option><option>Lithuania</option><option>Luxembourg</option><option>Madagascar</option><option>Malawi</option><option>Malaysia</option><option>Maldives</option><option>Mali</option><option>Malta</option><option>Marshall Islands</option><option>Mauritania</option><option>Mauritius</option><option>Mexico</option><option>Micronesia</option><option>Moldova</option><option>Monaco</option><option>Mongolia</option><option>Montenegro</option><option>Morocco</option><option>Mozambique</option><option>Myanmar</option><option>Namibia</option><option>Nauru</option><option>Nepal</option><option>Netherlands</option><option>New Zealand</option><option>Nicaragua</option><option>Niger</option><option>Nigeria</option><option>North Korea</option><option>North Macedonia</option><option>Norway</option><option>Oman</option><option>Pakistan</option><option>Palau</option><option>Panama</option><option>Papua New Guinea</option><option>Paraguay</option><option>Peru</option><option>Philippines</option><option>Poland</option><option>Portugal</option><option>Qatar</option><option>Romania</option><option>Russia</option><option>Rwanda</option><option>Saint Kitts and Nevis</option><option>Saint Lucia</option><option>Saint Vincent and the Grenadines</option><option>Samoa</option><option>San Marino</option><option>Sao Tome and Principe</option><option>Saudi Arabia</option><option>Senegal</option><option>Serbia</option><option>Seychelles</option><option>Sierra Leone</option><option>Singapore</option><option>Slovakia</option><option>Slovenia</option><option>Solomon Islands</option><option>Somalia</option><option>South Africa</option><option>South Korea</option><option>South Sudan</option><option>Spain</option><option>Sri Lanka</option><option>Sudan</option><option>Suriname</option><option>Sweden</option><option>Switzerland</option><option>Syria</option><option>Taiwan</option><option>Tajikistan</option><option>Tanzania</option><option>Thailand</option><option>Timor-Leste</option><option>Togo</option><option>Tonga</option><option>Trinidad and Tobago</option><option>Tunisia</option><option>Turkey</option><option>Turkmenistan</option><option>Tuvalu</option><option>Uganda</option><option>Ukraine</option><option>United Arab Emirates</option><option>United Kingdom</option><option>United States</option><option>Uruguay</option><option>Uzbekistan</option><option>Vanuatu</option><option>Vatican City</option><option>Venezuela</option><option>Vietnam</option><option>Yemen</option><option>Zambia</option><option>Zimbabwe</option>
  </select>
  </p>


  <hr>
  <h2>The Material</h2>

  <h3>Crux</h3>

  <p>
  <label>M1. Is this digital, physical, or both?</label><br>
  <label><input type="radio" name="m1" value="digital"> Digital</label><br>
  <label><input type="radio" name="m1" value="physical"> Physical</label><br>
  <label><input type="radio" name="m1" value="both"> Both</label>
  </p>

  <p>
  <label>M2. Are you the copyright holder?</label><br>
  <label><input type="radio" name="m2" value="yes"> Yes</label><br>
  <label><input type="radio" name="m2" value="no"> No</label><br>
  <label><input type="radio" name="m2" value="notsure"> Not sure</label>
  </p>

  <h3>Details</h3>

  <p>
  <label for="m3">M3. What should we call this material?</label><br>
  <input type="text" id="m3" name="m3">
  </p>

  <p>
  <label for="m4">M4. What is it?</label><br>
  <textarea id="m4" name="m4" rows="3"></textarea>
  </p>

  <p id="m4-1-wrap">
  <label>M4.1 Does it live online?</label><br>
  <label><input type="radio" name="m4-1" value="urls"> Yes, I have a URL or URLs</label><br>
  <input type="text" id="m4-1-urls" name="m4-1-urls" placeholder="Paste URLs here"><br>
  <label><input type="radio" name="m4-1" value="ids"> Yes, I have some IDs (e.g. DOI)</label><br>
  <input type="text" id="m4-1-ids" name="m4-1-ids" placeholder="Paste IDs here"><br>
  <label><input type="radio" name="m4-1" value="no"> No</label>
  </p>

  <p id="m4-2-wrap">
  <label for="m4-2">M4.2 Which file formats or file extensions are involved?</label><br>
  <input type="text" id="m4-2" name="m4-2" placeholder="e.g. jpg, pdf, wav">
  </p>

  <p>
  <label>M5. What's your relationship to it?</label><br>
  <label><input type="checkbox" name="m5" value="made"> I made it</label><br>
  <label><input type="checkbox" name="m5" value="own"> I own it</label><br>
  <label><input type="checkbox" name="m5" value="family"> I'm a family member of the creator</label><br>
  <label><input type="checkbox" name="m5" value="steward"> I'm a designated steward</label><br>
  <label><input type="checkbox" name="m5" value="community"> I'm a community member</label><br>
  <label><input type="checkbox" name="m5" value="other" onchange="toggle('m5-other',this)"> Let me tell you...</label><br>
  <textarea id="m5-other" name="m5-other" rows="2" hidden></textarea>
  </p>

  <p>
  <label for="m6">M6. Who made this, and who owns it now?</label><br>
  <textarea id="m6" name="m6" rows="3"></textarea>
  </p>

  <p>
  <label>M7. What's its copyright or licensing status, if you know?</label><br>
  <label><input type="radio" name="m7" value="arr"> All Rights Reserved</label><br>
  <label><input type="radio" name="m7" value="open"> Open License (e.g. Creative Commons)</label><br>
  <label><input type="radio" name="m7" value="pd"> Public Domain</label><br>
  <label><input type="radio" name="m7" value="notsure"> Not sure</label><br>
  <label><input type="radio" name="m7" value="complicated" onchange="toggle('m7-complicated',this)"> It's complicated...</label><br>
  <textarea id="m7-complicated" name="m7-complicated" rows="2" hidden></textarea>
  </p>

  <p>
  <label for="m8">M8. Can you add any background on how, why, or when it was made? This will help future stewards understand the material. (optional)</label><br>
  <textarea id="m8" name="m8" rows="5"></textarea>
  </p>


  <hr>
  <h2>Keep Right</h2>

  <p>
  <label>KR1. Who would you love to take care of this?</label><br>
  <label><input type="checkbox" name="kr1" value="person" onchange="toggle('kr1-person',this)"> A specific person</label><br>
  <input type="text" id="kr1-person" name="kr1-person" placeholder="Name them" hidden><br>
  <label><input type="checkbox" name="kr1" value="institution" onchange="toggle('kr1-institution',this)"> A specific institution</label><br>
  <input type="text" id="kr1-institution" name="kr1-institution" placeholder="Name it" hidden><br>
  <label><input type="checkbox" name="kr1" value="anyarchive"> Any qualified archive or library</label><br>
  <label><input type="checkbox" name="kr1" value="anysteward"> Open to any steward</label><br>
  <label><input type="checkbox" name="kr1" value="depends" onchange="toggle('kr1-depends',this)"> It depends...</label><br>
  <textarea id="kr1-depends" name="kr1-depends" rows="2" hidden></textarea>
  </p>

  <p id="kr1-1-wrap">
  <label for="kr1-1">KR1.1 And where should it live?</label><br>
  <input type="text" id="kr1-1" name="kr1-1">
  </p>

  <p>
  <label>KR2. Who should be able to see it, and are there any conditions?</label><br>
  <label><input type="radio" name="kr2" value="anyone"> Anyone</label><br>
  <label><input type="radio" name="kr2" value="researchers"> Researchers only</label><br>
  <label><input type="radio" name="kr2" value="family"> Family or designated people only</label><br>
  <label><input type="radio" name="kr2" value="noone"> No one for now</label><br>
  <label><input type="radio" name="kr2" value="complicated" onchange="toggle('kr2-complicated',this)"> It's complicated...</label><br>
  <textarea id="kr2-complicated" name="kr2-complicated" rows="2" hidden></textarea>
  </p>

  <p>
  <label for="kr2-1">KR2.1 Until when? (optional)</label><br>
  <input type="text" id="kr2-1" name="kr2-1" placeholder="e.g. 10 years, after my death, 2075">
  </p>

  <p id="kr3-wrap">
  <label id="kr3-label">KR3. What can your caretaker do with it?</label><br>
  <label><input type="checkbox" name="kr3" value="preserve"> Preserve only</label><br>
  <label><input type="checkbox" name="kr3" value="share"> Share freely</label><br>
  <label><input type="checkbox" name="kr3" value="sell"> May sell</label><br>
  <label><input type="checkbox" name="kr3" value="yourcall"> Your call</label><br>
  <label><input type="checkbox" name="kr3" value="dontcare"> Don't care</label><br>
  <label><input type="checkbox" name="kr3" value="destroy" onchange="toggle('kr3-destroy',this)"> May destroy it</label><br>
  <input type="text" id="kr3-destroy" name="kr3-destroy" placeholder="Under what conditions, or when?" hidden><br>
  <label><input type="checkbox" name="kr3" value="depends" onchange="toggle('kr3-depends',this)"> It depends...</label><br>
  <textarea id="kr3-depends" name="kr3-depends" rows="2" hidden></textarea>
  </p>


  <hr>
  <h2>Copy Right</h2>

  <div id="cr-digital-wrap">
  <p>
  <label>CR1. Can copies be made?</label><br>
  <label><input type="radio" name="cr1" value="yes"> Yes, freely</label><br>
  <label><input type="radio" name="cr1" value="yesbut" onchange="toggle('cr1-yesbut',this)"> Yes, but...</label><br>
  <textarea id="cr1-yesbut" name="cr1-yesbut" rows="2" hidden></textarea>
  <label><input type="radio" name="cr1" value="no"> No</label><br>
  <label><input type="radio" name="cr1" value="dontcare"> Don't care</label>
  </p>

  <p>
  <label>CR2. What must copies preserve?</label><br>
  <label><input type="checkbox" name="cr2" value="format"> Original file format</label><br>
  <label><input type="checkbox" name="cr2" value="metadata"> All metadata</label><br>
  <label><input type="checkbox" name="cr2" value="folders"> Folder structure</label><br>
  <label><input type="checkbox" name="cr2" value="filenames"> File names</label><br>
  <label><input type="checkbox" name="cr2" value="quality"> Original quality (no compression)</label><br>
  <label><input type="checkbox" name="cr2" value="depends" onchange="toggle('cr2-depends',this)"> It depends...</label><br>
  <textarea id="cr2-depends" name="cr2-depends" rows="2" hidden></textarea>
  </p>

  <p>
  <label>CR3. Where can copies live?</label><br>
  <label><input type="radio" name="cr3" value="anywhere"> Anywhere</label><br>
  <label><input type="radio" name="cr3" value="countries" onchange="toggle('cr3-countries',this)"> Only in specific countries</label><br>
  <input type="text" id="cr3-countries" name="cr3-countries" placeholder="List countries" hidden><br>
  <label><input type="radio" name="cr3" value="institutions" onchange="toggle('cr3-institutions',this)"> Only with specific institutions</label><br>
  <input type="text" id="cr3-institutions" name="cr3-institutions" placeholder="List institutions" hidden><br>
  <label><input type="radio" name="cr3" value="distributed"> Distributed as widely as possible for safety</label><br>
  <label><input type="radio" name="cr3" value="tellus" onchange="toggle('cr3-tellus',this)"> Let me tell you...</label><br>
  <textarea id="cr3-tellus" name="cr3-tellus" rows="2" hidden></textarea>
  </p>
  </div>

  <div id="cr-physical-wrap">
  <p>
  <label>CR4. Should this be digitised?</label><br>
  <label><input type="radio" name="cr4" value="yes"> Yes, please</label><br>
  <label><input type="radio" name="cr4" value="qualified"> Yes, but only by a qualified institution</label><br>
  <label><input type="radio" name="cr4" value="yesbut" onchange="toggle('cr4-yesbut',this)"> Yes, but...</label><br>
  <textarea id="cr4-yesbut" name="cr4-yesbut" rows="2" hidden></textarea>
  <label><input type="radio" name="cr4" value="no"> No</label><br>
  <label><input type="radio" name="cr4" value="dontmind"> Don't mind</label>
  </p>

  <p>
  <label>CR5. What must a digitised version preserve?</label><br>
  <label><input type="checkbox" name="cr5" value="colours"> Original colours</label><br>
  <label><input type="checkbox" name="cr5" value="resolution"> Full resolution</label><br>
  <label><input type="checkbox" name="cr5" value="bothsides"> Both sides</label><br>
  <label><input type="checkbox" name="cr5" value="scale"> Physical scale</label><br>
  <label><input type="checkbox" name="cr5" value="accompanying"> All accompanying materials (e.g. notes, packaging)</label><br>
  <label><input type="checkbox" name="cr5" value="tellus" onchange="toggle('cr5-tellus',this)"> Let me tell you...</label><br>
  <textarea id="cr5-tellus" name="cr5-tellus" rows="2" hidden></textarea>
  </p>

  <p>
  <label>CR6. Where can digital copies live?</label><br>
  <label><input type="radio" name="cr6" value="anywhere"> Anywhere</label><br>
  <label><input type="radio" name="cr6" value="countries" onchange="toggle('cr6-countries',this)"> Only in specific countries</label><br>
  <input type="text" id="cr6-countries" name="cr6-countries" placeholder="List countries" hidden><br>
  <label><input type="radio" name="cr6" value="institutions" onchange="toggle('cr6-institutions',this)"> Only with specific institutions</label><br>
  <input type="text" id="cr6-institutions" name="cr6-institutions" placeholder="List institutions" hidden><br>
  <label><input type="radio" name="cr6" value="distributed"> Distributed as widely as possible for safety</label><br>
  <label><input type="radio" name="cr6" value="depends" onchange="toggle('cr6-depends',this)"> It depends...</label><br>
  <textarea id="cr6-depends" name="cr6-depends" rows="2" hidden></textarea>
  </p>
  </div>


  <hr>
  <h2>Machine Right</h2>

  <p>A KeepRight declaration expresses your intentions. It is not legally binding, but it gives future stewards something real to honour.</p>

  <p>
  <label>MR1. Can machines analyse or index this material?</label><br>
  <label><input type="radio" name="mr1" value="yes"> Yes, freely</label><br>
  <label><input type="radio" name="mr1" value="preservation"> Yes, for preservation purposes only</label><br>
  <label><input type="radio" name="mr1" value="yesbut" onchange="toggle('mr1-yesbut',this)"> Yes, but...</label><br>
  <textarea id="mr1-yesbut" name="mr1-yesbut" rows="2" hidden></textarea>
  <label><input type="radio" name="mr1" value="no"> No</label>
  </p>

  <p>
  <label>MR2. Can this material be used to train AI?</label><br>
  <label><input type="radio" name="mr2" value="yes"> Yes</label><br>
  <label><input type="radio" name="mr2" value="noncommercial"> Yes, but not for commercial purposes</label><br>
  <label><input type="radio" name="mr2" value="yesbut" onchange="toggle('mr2-yesbut',this)"> Yes, but...</label><br>
  <textarea id="mr2-yesbut" name="mr2-yesbut" rows="2" hidden></textarea>
  <label><input type="radio" name="mr2" value="no"> No</label><br>
  <label><input type="radio" name="mr2" value="dontmind"> Don't mind</label>
  </p>

  <p>
  <label>MR3. If this material is used by an AI, what matters to you?</label><br>
  <label><input type="checkbox" name="mr3" value="attribution"> Attribution (I want to be credited)</label><br>
  <label><input type="checkbox" name="mr3" value="transparency"> Transparency (I want to know how it was used)</label><br>
  <label><input type="checkbox" name="mr3" value="copy"> A copy of anything produced using it</label><br>
  <label><input type="checkbox" name="mr3" value="nothing"> Nothing in particular</label><br>
  <label><input type="checkbox" name="mr3" value="complicated" onchange="toggle('mr3-complicated',this)"> It's complicated...</label><br>
  <textarea id="mr3-complicated" name="mr3-complicated" rows="2" hidden></textarea>
  </p>


  <hr>
  <p><button type="submit">Preview my declaration</button></p>

  </form>

  <script>
  function toggle(id, trigger) {
      var el = document.getElementById(id);
      if (!el) return;
      el.hidden = !trigger.checked;
  }

  document.querySelectorAll('input[name="m1"]').forEach(function(r) {
      r.addEventListener('change', function() {
          var v = this.value;
          var digital = v === 'digital' || v === 'both';
          var physical = v === 'physical' || v === 'both';
          document.getElementById('m4-1-wrap').hidden = !digital;
          document.getElementById('m4-2-wrap').hidden = !digital;
          document.getElementById('kr1-1-wrap').hidden = !physical;
          document.getElementById('cr-digital-wrap').hidden = !digital;
          document.getElementById('cr-physical-wrap').hidden = !physical;
      });
  });

  document.querySelectorAll('input[name="m2"]').forEach(function(r) {
      r.addEventListener('change', function() {
          var kr3 = document.getElementById('kr3-wrap');
          var kr3label = document.getElementById('kr3-label');
          if (this.value === 'no') {
              kr3.hidden = true;
          } else {
              kr3.hidden = false;
              kr3label.textContent = this.value === 'notsure'
                  ? 'KR3. What would you wish a caretaker to be allowed to do with it?'
                  : 'KR3. What can your caretaker do with it?';
          }
      });
  });

  document.querySelectorAll('input[name="m4-1"]').forEach(function(r) {
      r.addEventListener('change', function() {
          document.getElementById('m4-1-urls').hidden = this.value !== 'urls';
          document.getElementById('m4-1-ids').hidden = this.value !== 'ids';
      });
  });

  document.querySelectorAll('input[name="cr3"]').forEach(function(r) {
      r.addEventListener('change', function() {
          document.getElementById('cr3-countries').hidden = this.value !== 'countries';
          document.getElementById('cr3-institutions').hidden = this.value !== 'institutions';
          document.getElementById('cr3-tellus').hidden = this.value !== 'tellus';
      });
  });

  document.querySelectorAll('input[name="cr6"]').forEach(function(r) {
      r.addEventListener('change', function() {
          document.getElementById('cr6-countries').hidden = this.value !== 'countries';
          document.getElementById('cr6-institutions').hidden = this.value !== 'institutions';
          document.getElementById('cr6-depends').hidden = this.value !== 'depends';
      });
  });

  document.getElementById('m4-1-wrap').hidden = true;
  document.getElementById('m4-2-wrap').hidden = true;
  document.getElementById('kr1-1-wrap').hidden = true;
  document.getElementById('cr-digital-wrap').hidden = true;
  document.getElementById('cr-physical-wrap').hidden = true;
  document.getElementById('m4-1-urls').hidden = true;
  document.getElementById('m4-1-ids').hidden = true;
  document.getElementById('cr3-countries').hidden = true;
  document.getElementById('cr3-institutions').hidden = true;
  document.getElementById('cr3-tellus').hidden = true;
  document.getElementById('cr6-countries').hidden = true;
  document.getElementById('cr6-institutions').hidden = true;
  document.getElementById('cr6-depends').hidden = true;
  </script>