-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
91 lines (82 loc) · 4.79 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
<html>
<header>
<link href="https://fonts.googleapis.com/css?family=Taviraj" rel="stylesheet">
<script type="text/javascript" src="db.js"></script>
<script type="text/javascript" src="teleologic.js"></script>
<style>
/*!
* "Fork me on GitHub" CSS ribbon v0.2.0 | MIT License
* https://github.com/simonwhitaker/github-fork-ribbon-css
*/
.github-fork-ribbon{
width:12.1em;height:12.1em;position:absolute;overflow:hidden;top:0;right:0;z-index:9999;pointer-events:none;font-size:13px;text-decoration:none;text-indent:-999999px}.github-fork-ribbon.fixed{position:fixed}.github-fork-ribbon:before,.github-fork-ribbon:after{position:absolute;display:block;width:15.38em;height:1.54em;top:3.23em;right:-3.23em;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}.github-fork-ribbon:before{content:"";padding:.38em 0;background-color:#a00;background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,0)),to(rgba(0,0,0,0.15)));background-image:-webkit-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.15));background-image:-moz-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.15));background-image:-ms-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.15));background-image:-o-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.15));background-image:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0.15));-webkit-box-shadow:0 .15em .23em 0 rgba(0,0,0,0.5);-moz-box-shadow:0 .15em .23em 0 rgba(0,0,0,0.5);box-shadow:0 .15em .23em 0 rgba(0,0,0,0.5);pointer-events:auto}.github-fork-ribbon:after{content:attr(title);color:#fff;font:700 1em "Helvetica Neue",Helvetica,Arial,sans-serif;line-height:1.54em;text-decoration:none;text-shadow:0 -.08em rgba(0,0,0,0.5);text-align:center;text-indent:0;padding:.15em 0;margin:.15em 0;border-width:.08em 0;border-style:dotted;border-color:#fff;border-color:rgba(255,255,255,0.7)}.github-fork-ribbon.left-top,.github-fork-ribbon.left-bottom{right:auto;left:0}.github-fork-ribbon.left-bottom,.github-fork-ribbon.right-bottom{top:auto;bottom:0}.github-fork-ribbon.left-top:before,.github-fork-ribbon.left-top:after,.github-fork-ribbon.left-bottom:before,.github-fork-ribbon.left-bottom:after{right:auto;left:-3.23em}.github-fork-ribbon.left-bottom:before,.github-fork-ribbon.left-bottom:after,.github-fork-ribbon.right-bottom:before,.github-fork-ribbon.right-bottom:after{top:auto;bottom:3.23em}.github-fork-ribbon.left-top:before,.github-fork-ribbon.left-top:after,.github-fork-ribbon.right-bottom:before,.github-fork-ribbon.right-bottom:after{-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)
}
.centered{
margin: 0 auto; text-align:center;
}
.inp{
margin-top:2em; text-align: center; font-size: 3em;
line-height: 1.5em;
}
.outp{
font-size: 4em; margin-top:2em;
font-family: 'Taviraj', serif;
}
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color: #ddd;
font-style: italic;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #ddd;
opacity: 1;
font-style: italic;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #ddd;
opacity: 1;
font-style: italic;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #ddd;
font-style: italic;
}
</style>
</header>
<body>
<a class="github-fork-ribbon right-bottom fixed" href="https://github.com/hernaneche/teleologic/blob/gh-pages/db.js" title="Help updating DB!">Contribute with DB</a>
<div class="centered">
<input id="in" type="text" list="jdatalist" class="inp" autofocus placeholder="tech or product name"></input>
<datalist id="jdatalist"></datalist>
<button type="button" title="is descentralized? Check for necessary, not sufficient, conditions to avoid extinction " class="inp" onclick="show()" >see future</button>
<div id="out" class="outp"></div>
</div>
<script type="text/javascript">
function init(){
var jsonOptions = db;
var dataList = document.getElementById('jdatalist');
jsonOptions.forEach(function(item) {
var option = document.createElement('option');
option.value = item.name;
dataList.appendChild(option);
});
}
function setOut(ou){
document.getElementById('out').innerHTML=ou;
}
function show() {
setOut(extintionTest(document.getElementById('in').value));
}
window.onload=init();
var inel = document.getElementById("in");
inel.addEventListener("keyup", function (event) {
if (event.keyCode == 13) {
event.preventDefault();
if (inel.value.length != 0) {
show();
inel.value = '';
}
}
}, false);
</script>
</body>
</html>