Skip to content

Instantly share code, notes, and snippets.

@reebalazs

reebalazs/Hyphenator-proof-of-concept-1.markdown

Created July 20, 2014 12:19
Show Gist options
  • Save reebalazs/b488ef4e2a0f79107d60 to your computer and use it in GitHub Desktop.
Save reebalazs/b488ef4e2a0f79107d60 to your computer and use it in GitHub Desktop.
Download ZIP
A Pen by Balazs Ree.
Raw
index.html
<html lang="de">
<div>
<form method="GET">
<label for="mode">Hyphens:</label>
<select name="mode" class="controls">
<option value="normal">Normal</option>
<option value="visible">Visible</option>
<option value="off">Off</button>
</select>
<label for="corrections">Corrections:</label>
<textarea name="corrections">
din-ge
tat-sa-chen
</textarea>
<button type="submit">Update</button>
<form>
</div>
<p class="can-hyphenate">
Die Welt ist alles, was der Fall ist.
<span class='separator'></span>
Die Welt ist die Gesamtheit der Tatsachen, nicht der Dinge.
<span class='separator'></span>
Die Welt ist durch die Tatsachen bestimmt und dadurch, dass es alle Tatsachen sind.
<span class='separator'></span>
Denn, die Gesamtheit der Tatsachen bestimmt, was der Fall ist
und auch, was alles nicht der Fall ist.
<span class='separator'></span>
Die Tatsachen im logischen Raum sind die Welt.
<span class='separator'></span>
Die Welt zerfällt in Tatsachen.
<span class='separator'></span>
Eines kann der Fall sein oder nicht der Fall sein und alles übrige gleich blieben.
<span class='separator'></span>
Was der Fall ist, die Tatsache, ist das Bestehen von
Sachverhalten.
<span class='separator'></span>
Der Sachverhalt ist eine Verbindung von Gegenständen.
(Sachen, Dingen.)
<span class='separator'></span>
Es ist dem Ding wesentlich, der Bestandteil eines
Sachverhaltes sein zu können.
<span class='separator'></span>
In der Logik ist nichts zufällig: Wenn das Ding im Sachverhalt
vorkommen kann, so muss die Möglichkeit des Sachverhaltes im
Ding bereits präjudiziert sein.
<span class='separator'></span>
Es Erschiene gleichsam als Zufall, wenn dem Ding, das allein
für sich bestehen könnte, nachträglich eine Sachlage passen
würde.
Wenn die Dinge in Sachverhalten vorkommen können, so muss
dies schon in ihnen liegen.
(Etwas Logisches kann nicht nur-möglich sein. Die Logik
handelt von jeder Möglichkeit und alle Möglichkeiten sind
ihre Tatsachen.)
Wie wir uns räumliche Gegenstände überhaupt nicht außerhalb
des Raumes, zeitliche nicht außerhalb der Zeit denken können,
so können wir uns keinen Gegenstand außerhalb der Möglichkeit
seiner Verbindung mit anderen denken.
Wenn ich mir den Gegenstand im Verbande des Sachverhalts
denken kann, so kann ich ihn nicht außerhalb der Möglichkeit
dieses Verbandes denken.
<span class='separator'></span>
Das Ding ist selbständig, insofern es in allen möglichen
Sachlagen vorkommen kann, aber diese Form der Selbständigkeit
ist eine Form des Zusammenhangs mit dem Sachverhalt, eine
Form der
Unselbständigkeit. (Es ist unmöglich, dass Worte in zwei
verschiedenen Weisen auftreten, allein und im Satz.)
<span class='separator'></span>
Wenn ich den Gegenstand kenne, so kenne ich auch sämtliche
Möglichkeiten seines Vorkommens in Sachverhalten.
(Jede solche Möglichkeit muss in der Natur des Gegenstandes
liegen.)
Es kann nicht nachträglich eine neue Möglichkeit gefunden
werden.
</p>
</html>
Raw
script.js
// get a query param from the request
function getParameterByName(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
// initial parameters for mode and corrections
var initialMode = getParameterByName('mode');
var initialCorrections = getParameterByName('corrections');
// set the dom from initial values
if (initialMode) {
$('[name="mode"]').val(initialMode);
}
if (initialCorrections) {
$('[name="corrections"]').val(initialCorrections);
}
var controller = {
mode: initialMode,
modeMap: {
normal: {
// INVISIBLE SEPARATOR
hyphenchar: String.fromCharCode(173),
// ZERO WIDTH SPACE
urlhyphenchar: '\u200b',
},
visible: {
hyphenchar: '-',
urlhyphenchar: '-',
},
off: {
hyphenchar: '',
urlhyphenchar: '',
}
},
init: function() {
if (this.config == 'off') {
return;
}
this.config();
Hyphenator.run();
},
config: function() {
Hyphenator.config(_.assign({}, {
minwordlength : 4,
selectorfunction: function () {
return $('.can-hyphenate').get();
}
}, this.modeMap[this.mode]));
var exceptions = [];
// Let's split it to rows, filtering out blanks
_.each($('[name="corrections"]').val().split(/\r?\n/), function(val) {
if (/^\s*$/.test(val)) {
return;
}
// Surprisingly, capitals do matter, (??) so
// we add both lowercase and capitalized version.
exceptions.push(val.toLowerCase());
exceptions.push(val.charAt(0).toUpperCase() + val.slice(1).toLowerCase());
});
Hyphenator.addExceptions('de', exceptions.join(', '));
}
};
controller.init();
$('[name="mode"]').change(function(evt) {
$('form').submit();
});
Raw
style.css
p {
font-size: 300%;
text-align: justify;
}
.separator:after {
font-weight: bold;
content: '+++';
color: #176fb1;
}
textarea[name="corrections"] {
height: 6em;
vertical-align: middle;
}
.controls {
margin-top: 4em;
margin-right: 2em;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment