2c2
< // Place a font family/style/weight/variant/stretch dropdown into element ID called upon, or appended to document.body
---
> // Place a font family dropdown into element ID called upon, or appended to document.body
7,23d6
<    var conceptfont='family';
<    var theidff='';
<    var proposedidff='';
<    
<    var ffindex=0;
<    if (('' + location.hash).replace('#','') != '') {
<      ffindex=eval(('' + location.hash).replace('#',''));
<    }
<    
<    if (document.head.innerHTML.indexOf('fon' + 't_fam' + 'ily.js?i' + 'd') != -1) {
<      proposedidff=document.head.innerHTML.split('fon' + 't_fam' + 'ily.js?i' + 'd')[eval(1 + ffindex)].split('=')[0];
<      theidff=document.head.innerHTML.split('fon' + 't_fam' + 'ily.js?i' + 'd' + proposedidff + '=')[1].split('&')[0].split('#')[0].split('"')[0].split("'")[0].split('>')[0];
<      if (proposedidff != '') {  conceptfont=proposedidff;  }
<    }
<    
<    location.href='#' + eval(1 + ffindex);
<    
25,46d7
< 
<    switch (conceptfont) {
<      case 'weight':
<        fonttableis="  <tbody>      <tr>       <th colspan=\"3\">Weights       </th></tr><tr>       <td><code>font-weight: 100</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-weight: 100\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-weight: 100\">The Quick…       </td></tr><tr>       <td><code>font-weight: 200</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-weight: 200\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-weight: 200\">The Quick…       </td></tr><tr>       <td><code>font-weight: 300</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-weight: 300\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-weight: 300\">The Quick…       </td></tr><tr>       <td><code>font-weight: normal</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-weight: normal\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-weight: normal\">The Quick…       </td></tr><tr>       <td><code>font-weight: 500</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-weight: 500\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-weight: 500\">The Quick…       </td></tr><tr>       <td><code>font-weight: 600</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-weight: 600\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-weight: 600\">The Quick…       </td></tr><tr>       <td><code>font-weight: bold</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-weight: bold\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-weight: bold\">The Quick…       </td></tr><tr>       <td><code>font-weight: 800</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-weight: 800\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-weight: 800\">The Quick…       </td></tr><tr>       <td><code>font-weight: 900</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-weight: 900\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-weight: 900\">The Quick…      </td></tr></tbody>";
<        break;
<        
<      case 'style':
<        fonttableis="       <tbody>      <tr>       <th colspan=\"3\">Styles       </th></tr><tr>       <td><code>font-style: normal</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-style: normal\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-style: normal\">The Quick…       </td></tr><tr>       <td><code>font-style: italic</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-style: italic\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-style: italic\">The Quick…       </td></tr><tr>       <td><code>font-style: oblique</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-style: oblique\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-style: oblique\">The Quick…      </td></tr></tbody>        ";
<        break;
<        
<      case 'stretch':
<        fonttableis="<tbody>      <tr>       <th colspan=\"3\">Stretch       </th></tr><tr>       <td><code>font-stretch: ultra-condensed</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-stretch: ultra-condensed\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-stretch: ultra-condensed\">The Quick…       </td></tr><tr>       <td><code>font-stretch: extra-condensed</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-stretch: extra-condensed\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-stretch: extra-condensed\">The Quick…       </td></tr><tr>       <td><code>font-stretch: condensed</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-stretch: condensed\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-stretch: condensed\">The Quick…       </td></tr><tr>       <td><code>font-stretch: semi-condensed</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-stretch: semi-condensed\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-stretch: semi-condensed\">The Quick…       </td></tr><tr>       <td><code>font-stretch: normal</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-stretch: normal\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-stretch: normal\">The Quick…       </td></tr><tr>       <td><code>font-stretch: semi-expanded</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-stretch: semi-expanded\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-stretch: semi-expanded\">The Quick…       </td></tr><tr>       <td><code>font-stretch: expanded</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-stretch: expanded\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-stretch: expanded\">The Quick…       </td></tr><tr>       <td><code>font-stretch: extra-expanded</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-stretch: extra-expanded\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-stretch: extra-expanded\">The Quick…       </td></tr><tr>       <td><code>font-stretch: ultra-expanded </code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-stretch: ultra-expanded \">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-stretch: ultra-expanded \">The Quick…    </td></tr></tbody>";
<        break;
< 
<      case 'variant':
<        fonttableis="<tbody>      <tr>       <th colspan=\"3\">Variants       </th></tr><tr>       <td><code>font-variant: normal</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-variant: normal\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-variant: normal\">The Quick…       </td></tr><tr>       <td><code>font-variant: small-caps</code>        </td><td style=\"font: larger Arno Pro, Tribun ADF Std, serif; font-variant: small-caps\">The Quick…        </td><td style=\"font: larger Lato, Roboto, sans-serif; font-variant: small-caps\">The Quick…      </td></tr></tbody>";
<        break;
<        
<      default:
<        break;
<    }
< 
48,49c9
<    var newffblurb='Add new Font ' + conceptfont.substring(0,1).toUpperCase() + conceptfont.substring(1).toLowerCase() + ' here ...';
<    newffblurb='Add new Font option here ...';
---
>    var newffblurb='Add new Font Family here ...';
51d10
<    var thisffval='';
60c19
<        fddcont='<select onchange="if (this.value.trim().length != 0) { document.getElementById(' + "'optsel" + conceptfont.substring(0,1).toLowerCase() + conceptfont.substring(1).toLowerCase() + "'" + ').innerText=newffblurb; } else if (this.value.trim().length == 0) { var newffis=prompt(' + "'Enter a Font " + conceptfont.substring(0,1).toUpperCase() + conceptfont.substring(1).toLowerCase() + " name of interest.',''" + '); if (newffis != null) { this.innerHTML+=anffopt.replace(String.fromCharCode(62) + String.fromCharCode(120) + String.fromCharCode(60), String.fromCharCode(62) + newffis + String.fromCharCode(60)).replace(String.fromCharCode(34) + String.fromCharCode(120) + String.fromCharCode(34), String.fromCharCode(34) + newffis + String.fromCharCode(34)); this.value=newffis;  }  }" title="Font ' + conceptfont.substring(0,1).toUpperCase() + conceptfont.substring(1).toLowerCase() + '" id=selfont' + conceptfont.substring(0,1).toLowerCase() + conceptfont.substring(1).toLowerCase() + ' name=selfont' + conceptfont.substring(0,1).toLowerCase() + conceptfont.substring(1).toLowerCase() + ' style="background-color:yellow;"><option id=optsel' + conceptfont.substring(0,1).toLowerCase() + conceptfont.substring(1).toLowerCase() + ' value="">Optional Font ' + conceptfont.substring(0,1).toUpperCase() + conceptfont.substring(1).toLowerCase() + ' ...</option></select>';
---
>        fddcont='<select onchange="if (this.value.trim().length != 0) { document.getElementById(' + "'optselff'" + ').innerText=newffblurb; } else if (this.value.trim().length == 0) { var newffis=prompt(' + "'Enter a Font Family name of interest.',''" + '); if (newffis != null) { this.innerHTML+=anffopt.replace(String.fromCharCode(62) + String.fromCharCode(120) + String.fromCharCode(60), String.fromCharCode(62) + newffis + String.fromCharCode(60)).replace(String.fromCharCode(34) + String.fromCharCode(120) + String.fromCharCode(34), String.fromCharCode(34) + newffis + String.fromCharCode(34)); this.value=newffis;  }  }" title="Font Family" id=selfontfamily name=selfontfamily style="background-color:yellow;"><option id=optselff value="">Optional Font Family ...</option></select>';
62,64c21
<      thisffval=codeflines[icodeflines].split('</code>')[0].split('>')[1];
<      if (thisffval.indexOf(': ') != -1) { thisffval=thisffval.split(': ')[1];  }
<      fddcont=fddcont.replace('</select>', '<option value="' + thisffval + '">' + thisffval + '</option></select>');
---
>      fddcont=fddcont.replace('</select>', '<option value="' + codeflines[icodeflines].split('</code>')[0].split('>')[1] + '">' + codeflines[icodeflines].split('</code>')[0].split('>')[1] + '</option></select>');
68,71c25,26
<      if (theidff != '') {
<       if (document.getElementById(theidff)) {
<        thefele=document.getElementById(theidff);
<       }
---
>      if (document.head.innerHTML.indexOf('fon' + 't_fam' + 'ily.js?i' + 'd=') != -1) {
>        thefele=document.getElementById(document.head.innerHTML.split('fon' + 't_fam' + 'ily.js?i' + 'd=')[1].split('&')[0].split('#')[0].split('"')[0].split("'")[0].split('>')[0]);