Skip to content

Instantly share code, notes, and snippets.

@chrislloyd

chrislloyd/control.coffee

Created March 19, 2011 12:37
Show Gist options
  • Save chrislloyd/877452 to your computer and use it in GitHub Desktop.
Save chrislloyd/877452 to your computer and use it in GitHub Desktop.
Download ZIP
Watch out for all the code BTW, this is a hack job.
Raw
control.coffee
delay = (ms, fn) ->
setTimeout fn, ms
Array::max = ->
max = @[0];
for elm in @ when elm > max
max = elm
max
fuzzyness = 0.1
certainty = 0.1
$(document).ready ->
input = $('#control input')
muteOut = null
categories = $('#control li')
input.keydown ->
clearTimeout muteOut
input.removeClass 'mute'
# Delaying the execution until the next even loop means that the pressed
# character is stored in the inputs value buffer.
delay 0, ->
str = input.val()
categories.removeClass 'match'
categories.removeClass 'final'
matches = ([$(category), score] for category in categories when (score = $(category).text().score(str, fuzzyness)) > certainty)
if matches?
maxScore = (match[1] for match in matches).max()
for match in matches
[elm, score] = match
elm.addClass('match')
elm.addClass('final') if score is maxScore
muteOut = delay 1000, ->
input.addClass 'mute'
input.focus()
$(document).keyup (e) ->
input.focus()
# CTRL-u for unsure
$('form').toggleClass('unsure') if e.ctrlKey and e.keyCode == 85
true
$(window).focus -> input.focus()
Raw
wikiannotate.html
<!DOCTYPE html>
<html>
<head>
<meta charset='utf8'>
<title>Polykleitos</title>
<style type="text/css">
* {margin:0;padding:0;}
body {
font: 13px/24px Helvetica;
width: 480px;
margin: 0 auto 50% auto;
color: #333;
}
header {
}
nav {
position: absolute;
top: 0; right: 0;
padding: 4px 8px;
color: #CCC;
background: rgba(255,255,255, 0.8);
}
nav a {
color: #CCC;
border: none;
}
nav a:hover {
color: #999;
}
form {
background: #FFF;
border-top: 1px solid #CCC;
overflow: hidden;
position: fixed;
bottom: 0;
left: 0;
right: 0;
margin: 4px 0 0;
min-height: 24px;
padding: 23px 0 24px;
box-shadow: 0 0 24px #CCC;
}
form input {
font: 13px/14px Helvetica;
display: inline;
border: none;
line-height: 16px;
padding: 3px 0;
color: #000;
font-style: italic;
font-weight: bold;
opacity: 1;
-webkit-transition: opacity 0.3s ease-in-out;
width: 100px;
float: left;
margin: 0;
margin-left: -356px;
text-align: right;
position: absolute;
top: 24px; left: 50%;
}
form input:focus {
outline: none;
}
form input.mute {
opacity: 0.4;
}
form ul {
width: 480px;
margin: 0 auto;
}
form ul li {
display: none;
font-size: 12px;
line-height: 24px;
color: #999;
margin: 0 1em 0 0;
}
form ul li.match {
display: inline;
}
form ul li.match.final {
color: #FFF;
background: #06C;
line-height: 14px;
padding: 4px 4px;
font-weight: bold;
display: inline-block;
border-radius: 2px;
}
form.unsure ul li.match.final {
background: #ff8e03;
}
article {
text-align: justify;
}
h1 {
line-height: 72px;
}
p {
margin-bottom: 1em;
}
sup {
display: none;
}
a {
color: #000;
text-decoration: none;
border-bottom: 1px dotted #CCC;
}
</style>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js'></script>
<script src='https://github.com/joshaven/string_score/raw/master/string_score.min.js'></script>
<script>(function() {
var certainty, delay, fuzzyness;
delay = function(ms, fn) {
return setTimeout(fn, ms);
};
Array.prototype.max = function() {
var elm, max, _i, _len;
max = this[0];
for (_i = 0, _len = this.length; _i < _len; _i++) {
elm = this[_i];
if (elm > max) {
max = elm;
}
}
return max;
};
fuzzyness = 0.1;
certainty = 0.1;
$(document).ready(function() {
var categories, input, muteOut;
input = $('#control input');
muteOut = null;
categories = $('#control li');
input.keydown(function() {
clearTimeout(muteOut);
input.removeClass('mute');
return delay(0, function() {
var category, elm, match, matches, maxScore, score, str, _i, _j, _k, _len, _len2, _len3, _results, _results2;
str = input.val();
categories.removeClass('match');
categories.removeClass('final');
matches = (function() {
_results = [];
for (_i = 0, _len = categories.length; _i < _len; _i++) {
category = categories[_i];
if ((score = $(category).text().score(str, fuzzyness)) > certainty) {
_results.push([$(category), score]);
}
}
return _results;
}());
if (matches != null) {
maxScore = (function() {
_results2 = [];
for (_j = 0, _len2 = matches.length; _j < _len2; _j++) {
match = matches[_j];
_results2.push(match[1]);
}
return _results2;
}()).max();
for (_k = 0, _len3 = matches.length; _k < _len3; _k++) {
match = matches[_k];
elm = match[0], score = match[1];
elm.addClass('match');
if (score === maxScore) {
elm.addClass('final');
}
}
}
return muteOut = delay(1000, function() {
return input.addClass('mute');
});
});
});
input.focus();
$(document).keyup(function(e) {
input.focus();
if (e.ctrlKey && e.keyCode === 85) {
$('form').toggleClass('unsure');
}
return true;
});
return $(window).focus(function() {
return input.focus();
});
});
}).call(this);
</script>
</head>
<body>
<header>
<form id='control'>
<input type='text' class='mute' />
<ul>
<li data-value='415'>Person:Academic / Teacher</li>
<li data-value='407'>Person:Actor / Director / Producer</li>
<li data-value='409'>Person:Artist</li>
<li data-value='410'>Person:Author/Journalist / Writer / Poet</li>
<li data-value='419'>Person:Business</li>
<li data-value='411'>Person:Celebrity</li>
<li data-value='414'>Person:Criminal</li>
<li data-value='416'>Person:Medical / Scientist / Researcher</li>
<li data-value='406'>Person:Military / Army / Navy / Airforce</li>
<li data-value='408'>Person:Musician / Singer</li>
<li data-value='417'>Person:Other</li>
<li data-value='405'>Person:Politician/Advisor</li>
<li data-value='412'>Person:Religious / Priest / Minister / Cleric</li>
<li data-value='413'>Person:Royalty</li>
<li data-value='420'>Person:Sports</li>
<li data-value='418'>Person:Uncelebrated / victims / bystander / witness</li>
</ul>
</form>
<nav>
<a href='/'>Home</a> &middot; <a href='/help'>Help</a> &middot; <a href='/signout'>Sign Out</a>
</nav>
</header>
<article><h1 id="firstHeading" class="firstHeading">Polykleitos</h1><p><b>Polykleitos</b> (or <b>Polyklitos</b>, <b>Polycleitus</b>, <b>Polyclitus</b>; <a href="http://en.wikipedia.org/wiki/Greek_language" title="Greek language">Greek</a> <b>Πολύκλειτος</b>); called the Elder,<sup id="cite_ref-0" class="reference"><a href="#cite_note-0"><span>[</span>1<span>]</span></a></sup> was a <a href="http://en.wikipedia.org/wiki/Ancient_Greece" title="Ancient Greece">Greek</a> <a href="http://en.wikipedia.org/wiki/Sculpture" title="Sculpture">sculptor</a> in bronze of the fifth and the early fourth century BC. Next to <a href="http://en.wikipedia.org/wiki/Phidias" title="Phidias">Phidias</a>, <a href="http://en.wikipedia.org/wiki/Myron" title="Myron">Myron</a> and <a href="http://en.wikipedia.org/wiki/Kresilas" title="Kresilas">Kresilas</a>, he is considered the most important sculptor of <a href="http://en.wikipedia.org/wiki/Classical_antiquity" title="Classical antiquity">Classical antiquity</a>: the fourth-century catalogue attributed to <a href="http://en.wikipedia.org/wiki/Xenocrates" title="Xenocrates">Xenocrates</a> (the "Xenocratic catalogue"), which was Pliny's guide in matters of art, ranked him between Phidias and Myron.<sup id="cite_ref-1" class="reference"><a href="#cite_note-1"><span>[</span>2<span>]</span></a></sup></p><p>He was of the school of <a href="http://en.wikipedia.org/wiki/Argos" title="Argos">Argos</a>, a contemporary of <a href="http://en.wikipedia.org/wiki/Phidias" title="Phidias">Phidias</a> (possibly also taught by <a href="http://en.wikipedia.org/wiki/Ageladas" title="Ageladas">Ageladas</a>) and, in the opinion of the Greeks<sup class="Template-Fact" title="This claim needs references to reliable sources from May 2008" style="white-space:nowrap;">[<i><a href="http://en.wikipedia.org/wiki/Wikipedia:Citation_needed" title="Wikipedia:Citation needed">citation needed</a></i>]</sup>, his equal. His figure of an <a href="http://en.wikipedia.org/wiki/Amazons" title="Amazons">Amazon</a> for <a href="http://en.wikipedia.org/wiki/Ephesus" title="Ephesus">Ephesus</a> was regarded as superior to those by Phidias and <a href="http://en.wikipedia.org/wiki/Kresilas" title="Kresilas">Kresilas</a> at the same time<sup class="Template-Fact" title="This claim needs references to reliable sources from May 2008" style="white-space:nowrap;">[<i><a href="http://en.wikipedia.org/wiki/Wikipedia:Citation_needed" title="Wikipedia:Citation needed">citation needed</a></i>]</sup>; and his colossal <a href="http://en.wikipedia.org/wiki/Chryselephantine" title="Chryselephantine" class="mw-redirect">gold and ivory</a> statue of <a href="http://en.wikipedia.org/wiki/Hera" title="Hera">Hera</a> which stood in her temple&#160;– the <a href="http://en.wikipedia.org/wiki/Heraion_of_Argos" title="Heraion of Argos">Heraion of Argos</a>&#160;– was compared with the <a href="http://en.wikipedia.org/wiki/Zeus" title="Zeus">Zeus</a> by Phidias. He also sculpted a famous <a href="http://en.wikipedia.org/wiki/Bronze" title="Bronze">bronze</a> male nude known as the <i><a href="http://en.wikipedia.org/wiki/Doryphoros" title="Doryphoros">Doryphoros</a></i> ("Spear-carrier"), which survives in the form of numerous <a href="http://en.wikipedia.org/wiki/Ancient_Rome" title="Ancient Rome">Roman</a> marble copies. Further sculptures attributed to Polykleitos<sup class="Template-Fact" title="This claim needs references to reliable sources from May 2008" style="white-space:nowrap;">[<i><a href="http://en.wikipedia.org/wiki/Wikipedia:Citation_needed" title="Wikipedia:Citation needed">citation needed</a></i>]</sup> are the <i><a href="http://en.wikipedia.org/wiki/Discophoros" title="Discophoros">Discophoros</a></i> ("<a href="http://en.wikipedia.org/wiki/Discus" title="Discus" class="mw-redirect">Discus</a>-bearer"), <i><a href="http://en.wikipedia.org/wiki/Diadumenos" title="Diadumenos">Diadumenos</a></i> ("<a href="http://en.wikipedia.org/wiki/Diadem" title="Diadem">Diadem</a>-wearer") and a <a href="http://en.wikipedia.org/wiki/Hermes" title="Hermes">Hermes</a> at one time placed, according to Pliny, in <a href="http://en.wikipedia.org/wiki/Lysimachia_(Thrace)" title="Lysimachia (Thrace)">Lysimachia (Thrace)</a>. Polykleitos' <i>Astragalizontes</i> ("Boys Playing at Knuckle-bones") was claimed by the Emperor <a href="http://en.wikipedia.org/wiki/Titus" title="Titus">Titus</a> and set in a place of honour in his <a href="http://en.wikipedia.org/wiki/Atrium_(architecture)" title="Atrium (architecture)">atrium</a>.<sup id="cite_ref-2" class="reference"><a href="#cite_note-2"><span>[</span>3<span>]</span></a></sup></p><p>Polykleitos, along with Phidias, created the Classical Greek style. Although none of his original works survive, literary sources identifying Roman marble copies of his work allow reconstructions to be made. An essential element of his and the Classical Greek style is the use of a relaxed pose with the shifted balance of weight known today as <a href="http://en.wikipedia.org/wiki/Contrapposto" title="Contrapposto">contrapposto</a> yielding a naturalness that was a source of his fame.</p><p>Polykleitos consciously created a new approach to sculpture; he wrote a treatise (<i><a href="http://en.wikipedia.org/wiki/Aesthetic_canon" title="Aesthetic canon">Kanon</a></i>) and designed a male nude (also known as <i>Kanon</i>) exemplifying his <a href="http://en.wikipedia.org/wiki/Aesthetics" title="Aesthetics">aesthetic theories</a> of the mathematical bases of artistic perfection, which motivated <a href="http://en.wikipedia.org/wiki/Kenneth_Clark" title="Kenneth Clark">Kenneth Clark</a> to place him among "the great puritans of art":<sup id="cite_ref-3" class="reference"><a href="#cite_note-3"><span>[</span>4<span>]</span></a></sup> His <i>Kanon</i> "got its name because it had a precise commensurability (<i>symmetria</i>) of all the parts to one another"<sup id="cite_ref-4" class="reference"><a href="#cite_note-4"><span>[</span>5<span>]</span></a></sup> "His general aim was clarity, balance, and completeness; his sole medium of communication the naked body of an athlete, standing poised between movement and repose" Kenneth Clark observed.<sup id="cite_ref-5" class="reference"><a href="#cite_note-5"><span>[</span>6<span>]</span></a></sup> Though the <i>Kanon</i> may be represented by his <i>Doryphoros</i>, the bronze has not survived, but references to it in other ancient books imply that its main principle was expressed by the Greek words <i>symmetria</i>, the <a href="http://en.wikipedia.org/wiki/Hippocrates" title="Hippocrates">Hippocratic</a> principle of <i>isonomia</i> ("equilibrium"), and <i>rhythmos</i>. "Perfection, he said, comes about little by little (<i>para mikron</i>) through many numbers".<sup id="cite_ref-6" class="reference"><a href="#cite_note-6"><span>[</span>7<span>]</span></a></sup> By this Polykleitos meant that a statue should be composed of clearly definable parts, all related to one another through a system of ideal mathematical proportions and balance, no doubt expressed in terms of the ratios established by <a href="http://en.wikipedia.org/wiki/Pythagoras" title="Pythagoras">Pythagoras</a> for the perfect <a href="http://en.wikipedia.org/wiki/Interval_(music)" title="Interval (music)">intervals</a> of the <a href="http://en.wikipedia.org/wiki/Musical_scale" title="Musical scale">musical scale</a>: 1:2 (<a href="http://en.wikipedia.org/wiki/Octave" title="Octave">octave</a>), 2:3 (<a href="http://en.wikipedia.org/wiki/Perfect_fifth" title="Perfect fifth">harmonic fifth</a>), and 3:4 (<a href="http://en.wikipedia.org/wiki/Perfect_fourth" title="Perfect fourth">harmonic fourth</a>). The refined detail of Polykleitos' models for casting executed in clay is revealed in a famous remark repeated in <a href="http://en.wikipedia.org/wiki/Plutarch" title="Plutarch">Plutarch</a>'s <i>Moralia</i>, that "the work is hardest when the clay is under the fingernail".<sup id="cite_ref-7" class="reference"><a href="#cite_note-7"><span>[</span>8<span>]</span></a></sup></p><p>Polykleitos and Phidias were of the first generation of Greek sculptors to have a <a href="http://en.wikipedia.org/wiki/School_(discipline)" title="School (discipline)" class="mw-redirect">schools of followers</a>. Polykleitos' school lasted for at least three generations, but it seems to have been most active in the late 300s and early 200s BC. The Roman writers <a href="http://en.wikipedia.org/wiki/Pliny_the_Elder" title="Pliny the Elder">Pliny</a> and <a href="http://en.wikipedia.org/wiki/Pausanias_(geographer)" title="Pausanias (geographer)">Pausanias</a> noted the names of about twenty sculptors in Polykleitos' school, defined by their adherence to his principles of balance and definition. <a href="http://en.wikipedia.org/wiki/Skopas" title="Skopas" class="mw-redirect">Skopas</a> and <a href="http://en.wikipedia.org/wiki/Lysippus" title="Lysippus" class="mw-redirect">Lysippus</a> are the best-known successors of Polykleitos.</p><p>His son, <a href="http://en.wikipedia.org/wiki/Polykleitos_the_Younger" title="Polykleitos the Younger">Polykleitos the Younger</a>, worked in the fourth century BC. Although he was also a sculptor of athletes, his greatest fame was won as an architect. He designed the great theater at <a href="http://en.wikipedia.org/wiki/Epidaurus" title="Epidaurus">Epidaurus</a>.</p><p>A <a href="http://en.wikipedia.org/wiki/Asteroid_belt" title="Asteroid belt">main-belt</a> <a href="http://en.wikipedia.org/wiki/Asteroid" title="Asteroid">asteroid</a> is named after Polykleitos. See <a href="http://en.wikipedia.org/wiki/5982_Polykletus" title="5982 Polykletus">5982 Polykletus</a>.</p><p>Wounded Amazon - Musei Capitolini, Rome</p><p><span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Alexander_the_Great" title="Alexander the Great">Alexander the Great</a>&#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Alcibiades" title="Alcibiades">Alcibiades</a>&#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Archimedes" title="Archimedes">Archimedes</a>&#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Aspasia" title="Aspasia">Aspasia</a>&#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Demosthenes" title="Demosthenes">Demosthenes</a>&#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Euclid" title="Euclid">Euclid</a>&#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Hipparchus" title="Hipparchus">Hipparchus</a>&#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Hippocrates" title="Hippocrates">Hippocrates</a>&#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Leonidas_I" title="Leonidas I">Leonidas</a>&#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Lycurgus_of_Sparta" title="Lycurgus of Sparta">Lycurgus</a>&#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Milo_of_Croton" title="Milo of Croton">Milo of Croton</a> &#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Pericles" title="Pericles">Pericles</a>&#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Ptolemy" title="Ptolemy">Ptolemy</a>&#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Solon" title="Solon">Solon</a>&#160;<b>·</b></span> <span style="white-space:nowrap"><a href="http://en.wikipedia.org/wiki/Themistocles" title="Themistocles">Themistocles</a></span></p></article>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment