forked from gkoberger/stacksort
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
136 lines (119 loc) · 6.06 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
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>stacksort</title>
<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body id="home">
<a href="http://github.com/gkoberger/stacksort" target="_blank"><img style="position: absolute; top: 0; left: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_left_green_007200.png" alt="Fork me on GitHub"></a>
<header>
<div id="top">
<img src="xkcd.png" title="This probably isn't the best time to say I'm for hire, huh?">
<h1>stack<strong>sort</strong></h1>
<p>
In a <a href="http://xkcd.com/1185/" target="_blank">recent xkcd's</a> alt text, Randall Munroe suggested <strong>stacksort</strong>, a sort that searches StackOverflow
for sorting functions and runs them until it returns the correct answer. So, I made it. If you like running arbitrary code in your browser, try it out.
</p>
</div>
</header>
<a href="https://news.ycombinator.com/item?id=5395463" target="_blank" class="hn">
<strong>Like (or hate) it?</strong> Comment on HackerNews
</a>
<section>
<div id="left">
<div class="label">
<strong>stackoverflow_sort(</strong>
<div class="desc">Try <a href="#" data-type="list">a list of numbers</a>, <a href="#" data-type="words">a list of words</a> or <a href="#" data-type="json">json</a>.</div>
</div>
<div class="input">
<textarea id="input"></textarea>
</div>
<div class="after"><strong>);</strong></div>
<div class="sorter">
<button id="sort">Sort</button>
</div>
<div class="label">
<strong>var output = </strong>
<div>Output from the function.</div>
</div>
<div class="input">
<textarea id="output"></textarea>
<div id="done">
<a href="#" id="no">Didn't work? <strong>Try the next answer</strong></a>
<div class="desc start-now">
<strong>Try again with…</strong>
<a href="#" data-type="list">a list of numbers</a>
<a href="#" data-type="words">a list of words</a>
<a href="#" data-type="json">json blob</a>
</div>
<div class="tweet">
<strong>Mention it on …</strong>
<a target="_blank"
href="https://twitter.com/intent/tweet?source=webclient&text=An+xkcd-inspired+StackSort+http://gkoberger.github.com/stacksort+(By+@gkoberger)">on Twitter</a>
<a href="https://news.ycombinator.com/item?id=5395463" target="_blank">on Hacker News</a></div>
</div>
</div>
<div class="after"><strong>;</strong></div>
<div class="waiting-sadly">
<div class="sad-waiter">
<div class="hour"></div>
<div class="minute"></div>
</div>
</div>
</div>
<div id="right">
<div id="logger">
</div>
<div id="stopper">
Had enough? <a href="#" id="stop">Stop it!</a>
</div>
</div>
</section>
<section id="questions">
<div class="question q1">
<strong>How does it work?</strong>
<p>As outlined by <a href="http://xkcd.com/1185/">xkcd's recent alt text</a>, this site downloads the top answers from StackOverflow for the tags
"javascript" and "sort", and uses the last code block (in theory, the "final" example) in the answer. It does its best to determine which function should be called. It then evals the code from StackOverflow,
with the inputted data as the parameter for the function.
</p>
<p><strong>If it returns a wrongly-sorted list</strong> (or you just want to keep playing), a link to "Try the next answer" will appear under the result.</p>
<p>You can view the code <a href="http://github.com/gkoberger/stacksort">on GitHub</a>. If you see any bugs (or just want to berate me), please file an issue.</p>
</div>
<div class="question q2">
<strong>Is it safe?</strong>
<p>Uh… it evals both user input <em>and</em> random code, unchecked, from an external site. This is what security minded folks would refer to as Very Bad™.
</p>
<p>
That being said, for
what it is, it should be relatively harmless. The site will only fetch accepted answers, and it only uses answers that were posted before the xkcd was
released (meaning that if someone posted malicious code now, it wouldn't matter). It also searches for potentially-malicious code (like the word
"cookie"), and skips those. It's definitely not the safest thing, however at most it would probably just crash your browser.
</p>
</div>
</section>
<section id="about">
Shamefully created by <a href="http://gkoberger.net" target="_blank">Gregory Koberger</a>. Follow me <a href="http://twitter.com/gkoberger"
target="_blank">on Twitter</a>. I'm so sorry.
<div>(Thanks to <a href="http://xkcd.com/1185">xkcd</a> for the idea, and <a href="http://twitter.com/superic">Eric Willis</a> for helping out)</div>
</section>
<script src="js/lib/jquery.js"></script>
<!-- <script src="js/lib/jquery.lightbox_me.js"></script> -->
<script src="js/script.js"></script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-39357628-1']);
_gaq.push(['_setDomainName', 'github.com']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>