API tools faq
paste
Advertisement
Guest User

factotron 3000

a guest
Oct 23rd, 2017
129
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 10.24 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <head>
  3.      <meta charset="UTF-8">
  4.      <meta name="viewport" content="width=device-width, initial-scale=1">
  5. </head>
  6. <!--
  7.    
  8.    factotron 3000, version 1.0
  9.  
  10.    Feel free to distribute.
  11.    The code in here is not minified/uglified/mangled or whatever.
  12.    
  13.    This code is under MIT license (see below)
  14. -->
  15. <!--
  16.  
  17.    Copyright 2017, James Russell
  18.  
  19.    Permission is hereby granted, free of charge, to any person
  20.    obtaining a copy of this software and associated documentation
  21.    files (the "Software"), to deal in the Software without
  22.    restriction, including without limitation the rights to use,
  23.    copy, modify, merge, publish, distribute, sublicense, and/or
  24.    sell copies of the Software, and to permit persons to whom the
  25.    Software is furnished to do so, subject to the following conditions:
  26.  
  27.    The above copyright notice and this permission notice shall be
  28.    included in all copies or substantial portions of the Software.
  29.  
  30.    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
  31.    EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
  32.    OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
  33.    NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
  34.    HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
  35.    WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
  36.    FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
  37.    OTHER DEALINGS IN THE SOFTWARE.
  38.  
  39. -->
  40. <title>factotron 3000</title>
  41. <style>
  42. body {
  43.     font-family: sans-serif;
  44.     line-height: 1.8em;
  45. }
  46.    
  47. #facts-questionnaire {
  48.     max-width: 40em;
  49.     padding: 1em;
  50. }
  51.  
  52. .opt-label {
  53.     min-width: 10em;
  54.     display: inline-block;
  55. }
  56.  
  57. .text-input {
  58.     width: 20em;
  59. }
  60.  
  61. #generated-code {
  62.     width: 30em;
  63. }
  64. </style>
  65. <body>
  66.  
  67.     <div id="facts-questionnaire">
  68.         <h3>factotron 3000</h3>
  69.         version 1.0, by James Russell
  70.  
  71.     <br>
  72.         Google Fact Check API Generator
  73.        
  74.         <hr>
  75.  
  76.  
  77.         <span class="opt-label">Fact-Checker Author</span>
  78.         <input class="text-input" type="text" key="author.name" placeholder="Debunkers, Inc."></input>
  79.         <br>
  80.         <span class="opt-label">Fact-Checker URL</span>
  81.         <input class="text-input" type="text" key="url" placeholder="http://example.com/news/dihydrogen-monoxide"></input>
  82.         <br>
  83.         <span class="opt-label">Date of Fact-Check</span>
  84.         <input class="date-input" type="date" key="datePublished" placeholder="YYYY-MM-DD"></input>
  85.         <br>
  86.  
  87.         <hr>
  88.  
  89.         <span class="opt-label">Claim Author</span>
  90.         <input class="text-input" type="text" key="itemReviewed.author.name" placeholder="Conspiracyland"></input>
  91.         <br>
  92.         <span class="opt-label">Claim Author is</span>
  93.         <input type="radio" class="author-radio-button" name="opt-fact-claim-authortype" value="Organization">
  94.         <span class="radio-label">Organization</span>
  95.         <input type="radio" class="author-radio-button" name="opt-fact-claim-authortype" value="Person">
  96.         <span class="radio-label">Person</span>
  97.         <br>
  98.         <span class="opt-label">Claim Made</span>
  99.         <input class="text-input" type="text" key="claimReviewed" placeholder="DHMO (Water) can exist as a gas"></input>
  100.         <br>
  101.         <span class="opt-label">Claim URL</span>
  102.         <input class="text-input" type="text" key="itemReviewed.author.sameAs" placeholder="http://example.conspiracyland.org/five-facts-about-DHMO-you-wouldnt-believe"></input>
  103.         <br>
  104.         <span class="opt-label">Date of Claim</span>
  105.         <input class="date-input" type="date" key="itemReviewed.datePublished" placeholder="YYYY-MM-DD"></input>
  106.         <br>
  107.  
  108.         <hr>
  109.  
  110.         <span class="opt-label">Claim Truth Rating</span><br>
  111.         <input type="radio" class="claim-radio-button" name="opt-fact-claim-rating" value="5">
  112.         <span class="radio-label">True</span>
  113.         <input type="radio" class="claim-radio-button" name="opt-fact-claim-rating" value="4">
  114.         <span class="radio-label">Mostly True</span>
  115.         <input type="radio" class="claim-radio-button" name="opt-fact-claim-rating" value="3">
  116.         <span class="radio-label">Half True</span>
  117.         <input type="radio" class="claim-radio-button" name="opt-fact-claim-rating" value="2">
  118.         <span class="radio-label">Mostly False</span>
  119.         <input type="radio" class="claim-radio-button" name="opt-fact-claim-rating" value="1">
  120.         <span class="radio-label">False</span>
  121.         <input type="radio" class="claim-radio-button" name="opt-fact-claim-rating" value="-1" id="other-button">
  122.         <span class="radio-label">Other (explain)</span>
  123.  
  124.         <br>
  125.  
  126.         <input class="text-input" type="text" id="verbose-truth" key="reviewRating.alternateName" placeholder="Explain if Other"></input>
  127.         <br>
  128.        
  129.         <hr>
  130.        
  131.         <h4>&#x2193; generated code &#x2193;</h4>
  132.         <textarea id="generated-code" spellcheck="false"></textarea>
  133.  
  134.     </div>
  135.  
  136.     <br>
  137.    
  138.  
  139. <a href="https://search.google.com/structured-data/testing-tool">Fact Check code can be tested here</a>
  140. <br>
  141. <a href="https://developers.google.com/search/docs/data-types/factcheck">Google's Fact Check API can be found here</a>
  142.  
  143. </body>
  144. <script>
  145. (function () {
  146.  
  147. var truth_lookup = {
  148.     5: 'True',
  149.     4: 'Mostly True',
  150.     3: 'Half True',
  151.     2: 'Mostly False',
  152.     1: 'False',
  153. };
  154.  
  155. var check_fields = [
  156.     'datePublished',
  157.     'url',
  158.     'itemReviewed.author.@type',
  159.     'itemReviewed.author.name',
  160.     'itemReviewed.author.sameAs',
  161.     'itemReviewed.datePublished',
  162.     'claimReviewed',
  163.     'author.name',
  164.     'reviewRating.ratingValue',
  165.     'reviewRating.bestRating',
  166.     'reviewRating.worstRating',
  167.     'reviewRating.alternateName',
  168. ];
  169.  
  170. // from the Google spec
  171. var claim_object = {
  172.   "@context": "http://schema.org", // constant
  173.   "@type": "ClaimReview",          // constant
  174.   "datePublished": null,           // checker date (YYYY-MM-DD)
  175.   "url": null,                     // checker URL
  176.   "itemReviewed":
  177.   {
  178.     "@type": "CreativeWork",
  179.     "author":
  180.     {
  181.       "@type": null, // Organization or Individual
  182.       "name": null,  // Claimant
  183.       "sameAs": null // claim URL
  184.     },
  185.     "datePublished": null // Claim publish date (YYYY-MM-DD)
  186.   },
  187.   "claimReviewed": null,  // Claim as reviewed, under 75 characters
  188.   "author":
  189.   {
  190.     "@type": "Organization", // fact checkers are always organizations
  191.     "name": null             // Verbose name of checker
  192.   },
  193.   "reviewRating":
  194.   {
  195.     "@type": "Rating",     // Kept the same as the Google spec for now
  196.     "ratingValue": null,   // 1-5, or -1
  197.     "bestRating": null,    // 5 or -1
  198.     "worstRating": null,   // 1 or -1
  199.     "alternateName" : null // Verbose name of claim
  200.   }
  201. };
  202.  
  203. // yoinked from MDN as an alternative to eval()
  204. function setDescendantProp(obj, desc, value) {
  205.   var arr = desc.split('.');
  206.   while (arr.length > 1) {
  207.     obj = obj[arr.shift()];
  208.   }
  209.   obj[arr[0]] = value;
  210. }
  211.  
  212. // also borrowed from MDN
  213. function getDescendantProp(obj, desc) {
  214.   var arr = desc.split('.');
  215.   while (arr.length) {
  216.     obj = obj[arr.shift()];
  217.   }
  218.   return obj;
  219. }
  220.  
  221. function validate() {
  222.     var valid = true;
  223.     for(var i=0; i < check_fields.length; i++) {
  224.        var v = getDescendantProp(claim_object, check_fields[i]);
  225.        
  226.        if(!v)
  227.            valid = false;
  228.        else if(v.length = 0)
  229.            valid = false;
  230.        
  231.    }
  232.    
  233.    return valid;
  234. }
  235.  
  236. function update() {
  237.    var code = null;
  238.    if(!validate()) {
  239.        code = "Please fill in all fields.";
  240.    } else {
  241.        var jstr = JSON.stringify(claim_object, null, 2);
  242.        code = "\<script type=\"application/ld+json\"\>\n"
  243.              + jstr
  244.              + "\n\</script\>";
  245.     }
  246.    
  247.     var codetxt = document.querySelector('#generated-code');
  248.     codetxt.value = code;
  249. }
  250.  
  251. function updateTextField(txt) {
  252.     var key = txt.getAttribute("key");
  253.     var val = txt.value;
  254.     setDescendantProp(claim_object, key, val);
  255.     update();
  256. }
  257.  
  258. function updateDateField(date) {
  259.     var key = date.getAttribute("key");
  260.     var val = date.value;
  261.     setDescendantProp(claim_object, key, val);
  262.     update();
  263. }
  264.  
  265. function setRating(val) {
  266.     claim_object.reviewRating.ratingValue = "" + val;
  267.     // Normal claims
  268.     if(val != -1) { // this is intentional
  269.         claim_object.reviewRating.alternateName = truth_lookup[val];
  270.         claim_object.reviewRating.bestRating = "5";
  271.         claim_object.reviewRating.worstRating = "1";
  272.         document.querySelector('#verbose-truth').disabled = true;
  273.     } else {
  274.         // "other" variety claims
  275.         claim_object.reviewRating.bestRating = "-1";
  276.         claim_object.reviewRating.worstRating = "-1";
  277.  
  278.         document.querySelector('#verbose-truth').disabled = false;
  279.        
  280.     }
  281.     update();
  282. }
  283.  
  284. onload = function() {
  285.  
  286.     var radios = document.querySelectorAll('.claim-radio-button');
  287.     for(var i=0; i < radios.length; i++) {
  288.        radios[i].checked = false;
  289.        radios[i].onclick = function(e) {
  290.            setRating(e.target.value);
  291.        }
  292.    }
  293.  
  294.    radios = document.querySelectorAll('.author-radio-button');
  295.    for(var i=0; i < radios.length; i++) {
  296.        radios[i].checked = false;
  297.        radios[i].onclick = function(e) {
  298.            claim_object.itemReviewed.author["@type"] = e.target.value;
  299.            update();
  300.        }
  301.    }
  302.    
  303.    var textFields = document.querySelectorAll('.text-input');
  304.    for(var i=0; i < textFields.length; i++) {
  305.        textFields[i].value = "";
  306.        textFields[i].onchange = function(e) {
  307.            updateTextField(e.target);
  308.        }
  309.    }
  310.    
  311.    var dateFields = document.querySelectorAll('.date-input');
  312.    for(var i=0; i < dateFields.length; i++) {
  313.        dateFields[i].value = "";
  314.        dateFields[i].onchange = function(e) {
  315.            updateDateField(e.target);
  316.        }
  317.    }
  318.    
  319.    var verboseTruth = document.querySelector('#verbose-truth');
  320.    var otherRadio = document.querySelector('#other-button');
  321.    verboseTruth.onchange = function(e) {
  322.        updateTextField(e.target);
  323.        otherRadio.checked = true;
  324.        setRating(-1);
  325.   }
  326.    
  327.    update();
  328.  
  329. }
  330.  
  331. }());
  332. </script>
  333. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!