70 lines
		
	
	
		
			2.8 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			70 lines
		
	
	
		
			2.8 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!DOCTYPE html>
 | |
| <html lang="en">
 | |
| 
 | |
| <head>
 | |
|     <meta charset="UTF-8">
 | |
|     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 | |
|     <meta http-equiv="X-UA-Compatible" content="ie=edge">
 | |
|     <title>Robotic Chuck</title>
 | |
|     <style>
 | |
|         code {
 | |
|             padding: 5px;
 | |
|             background: #eee;
 | |
|             border: 1px solid #ccc;
 | |
|             border-radius: 3px;
 | |
|             display: inline-block;
 | |
|         }
 | |
|         input{
 | |
|             width: 100em;
 | |
|         }
 | |
|     </style>
 | |
| </head>
 | |
| 
 | |
| <body>
 | |
|     <script>
 | |
|         console.log("load");
 | |
|         function generate() {
 | |
|             console.log("go!");
 | |
|             var inBox = document.getElementById("in");
 | |
|             console.log(inBox.value);
 | |
|             var links = JSON.parse(inBox.value);
 | |
|             var outBox = document.getElementById("output");
 | |
|             var titleBox = document.getElementById("titleIn");
 | |
|             var descBox = document.getElementById("description");
 | |
|             var tstring = "<style>.here,.invmenu a{font-style:italic}.here{font-size:14px;font-weight:400;color:grey}.invmenu{padding:5px 20px;margin:10px 0}</style>\n";
 | |
|             tstring = tstring + "<" + "div class=\"invmenu\" style=\"max-width:100%;background: #f2f2f2;\">\n<h3 style=\"text-align:left;\">" + titleBox.value + "</h3>\n<p><em>";
 | |
|             tstring = tstring + descBox.value + "</em></p>\n<hr style=\"border: 1px solid #cfcfcf\">\n"
 | |
|             formatter = links.map((object) => "<h4><a href=\"" + object.url + "\">" + object.headline + "</a></h4>\n");
 | |
|             tstring = tstring + formatter.join("");
 | |
|             tstring = tstring + "</div>"
 | |
|             outBox.innerText = tstring;
 | |
|         }
 | |
|     </script>
 | |
|     
 | |
|     <p></p>
 | |
|     Title of box: <input type="text" id="titleIn" placeholder="Investigating Hope: The Series"><br />
 | |
|     Description text: <input type="text" id="description" placeholder="This article is one in a series of investigative pieces about a complaint filed with ASU regarding accusations against on-campus ministry Hope Church."><br />
 | |
|     <p>Enter the links to generate according to this format:</p>
 | |
|     <pre><code class="json">[
 | |
|     {
 | |
|         "headline": "A beautiful headline!",
 | |
|         "url": "this-is-a-sample-url"
 | |
|     },
 | |
|     {
 | |
|         "headline": "Yet Another Headline",
 | |
|         "url": "yet-another-url"
 | |
|     }
 | |
| ]
 | |
| </code></pre>
 | |
|     <textarea name="input" id="in" cols="90" rows="30"></textarea>
 | |
|     <h2><a href="#" onclick="generate()">click to generate</a></h2>
 | |
|     <p>Paste the following code into a safeembed</p>
 | |
|     <pre><code id="output">
 | |
|     </code></pre>
 | |
|     <p><em> Don't forget:</em> For each page you embed on, add the following bit of code just before the <code></h4></code> at the end of the line on the line that corresponds to the current page.
 | |
|     <pre><code><span class="here">(You are here)</span>
 | |
| </pre></code>
 | |
| 
 | |
| </body>
 | |
| 
 | |
| </html> |