2017-01-20 17:59:59 +01:00
|
|
|
// CodeMirror
|
|
|
|
var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
|
|
|
|
lineNumbers: true,
|
|
|
|
styleActiveLine: true,
|
|
|
|
matchBrackets: true,
|
|
|
|
theme: "pastel-on-dark",
|
|
|
|
lineWrapping: true
|
|
|
|
});
|
|
|
|
|
|
|
|
function applyColors() {
|
2017-07-24 22:39:27 +02:00
|
|
|
$("body").css("color", $(".CodeMirror .cm-def").css("color"));
|
2017-01-20 17:59:59 +01:00
|
|
|
$("body").css("background", $(".CodeMirror").css("background-color"));
|
|
|
|
}
|
|
|
|
|
|
|
|
// CodeMirror theme selector
|
2017-07-24 22:39:27 +02:00
|
|
|
var input = document.getElementById("select-theme");
|
2017-01-20 17:59:59 +01:00
|
|
|
function selectTheme() {
|
|
|
|
var theme = input.options[input.selectedIndex].innerHTML;
|
|
|
|
editor.setOption("theme", theme);
|
2017-07-24 22:48:10 +02:00
|
|
|
document.cookie = "theme=" + theme;
|
2017-01-20 17:59:59 +01:00
|
|
|
applyColors();
|
|
|
|
}
|
|
|
|
|
|
|
|
// ProgrammingFonts font selector
|
|
|
|
function selectFont() {
|
|
|
|
var font = $("#select-font").val();
|
|
|
|
|
|
|
|
if (font === "input") {
|
|
|
|
$("pre").css({ fontFamily: "Input Mono, monospace" });
|
|
|
|
$("textarea").css({ fontFamily: "Input Mono, monospace" });
|
|
|
|
$(".CodeMirror").css({ fontFamily: "Input Mono, monospace" });
|
|
|
|
} else {
|
|
|
|
$("pre").css({ fontFamily: font + ", monospace" });
|
|
|
|
$("textarea").css({ fontFamily: font + ", monospace" });
|
|
|
|
$(".CodeMirror").css({ fontFamily: font + ", monospace" });
|
|
|
|
}
|
|
|
|
|
|
|
|
$("#font-info p").hide();
|
|
|
|
$("." + font).show();
|
2017-07-24 22:39:27 +02:00
|
|
|
document.cookie = "font=" + font;
|
2017-01-20 17:59:59 +01:00
|
|
|
updateHash();
|
|
|
|
}
|
|
|
|
|
|
|
|
function setSize() {
|
2017-07-24 22:39:27 +02:00
|
|
|
var size = $("#size").val();
|
|
|
|
$(".CodeMirror").css({ fontSize: size + "px" });
|
|
|
|
document.cookie = "size=" + size;
|
2017-01-20 17:59:59 +01:00
|
|
|
}
|
|
|
|
function setSpacing() {
|
2017-07-24 22:39:27 +02:00
|
|
|
var spacing = $("#spacing").val();
|
|
|
|
$(".CodeMirror").css({ lineHeight: spacing });
|
|
|
|
document.cookie = "spacing=" + spacing;
|
2017-01-20 17:59:59 +01:00
|
|
|
}
|
|
|
|
function setAntialiasing() {
|
|
|
|
if ($("#aliasing").is(":checked")) {
|
|
|
|
$(".CodeMirror").removeClass("no-smooth");
|
2017-07-24 22:39:27 +02:00
|
|
|
document.cookie = "antialiasing=smooth";
|
2017-01-20 17:59:59 +01:00
|
|
|
} else {
|
|
|
|
$(".CodeMirror").addClass("no-smooth");
|
2017-07-24 22:39:27 +02:00
|
|
|
document.cookie = "antialiasing=no-smooth";
|
2017-01-20 17:59:59 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
function selectLanguage() {
|
2017-07-24 22:48:10 +02:00
|
|
|
var lang = $("#select-language").val();
|
|
|
|
editor.setOption("mode", lang.toLowerCase());
|
|
|
|
document.cookie = "language=" + lang;
|
2017-01-20 17:59:59 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
function updateHash(){
|
|
|
|
var newHash = '#' + $("#select-font").val();
|
|
|
|
if(history.pushState) {
|
|
|
|
history.pushState(null, null, newHash);
|
|
|
|
}
|
|
|
|
else {
|
|
|
|
location.hash = newHash;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
$(document).ready(function(){
|
2017-07-24 22:39:27 +02:00
|
|
|
|
|
|
|
var cookieValueSpacing = document.cookie.replace(/(?:(?:^|.*;\s*)spacing\s*\=\s*([^;]*).*$)|^.*$/, "$1");
|
|
|
|
var cookieValueSize = document.cookie.replace(/(?:(?:^|.*;\s*)size\s*\=\s*([^;]*).*$)|^.*$/, "$1");
|
|
|
|
var cookieValueAntialiasing = document.cookie.replace(/(?:(?:^|.*;\s*)antialiasing\s*\=\s*([^;]*).*$)|^.*$/, "$1");
|
2017-07-24 22:48:10 +02:00
|
|
|
var cookieValueTheme = document.cookie.replace(/(?:(?:^|.*;\s*)theme\s*\=\s*([^;]*).*$)|^.*$/, "$1");
|
|
|
|
var cookieValueLanguage = document.cookie.replace(/(?:(?:^|.*;\s*)language\s*\=\s*([^;]*).*$)|^.*$/, "$1");
|
2017-07-24 22:39:27 +02:00
|
|
|
|
|
|
|
if (cookieValueSpacing !== "") {
|
|
|
|
$("#spacing").val(cookieValueSpacing);
|
|
|
|
}
|
|
|
|
if (cookieValueSize !== "") {
|
|
|
|
$("#size").val(cookieValueSize);
|
|
|
|
}
|
|
|
|
if (cookieValueAntialiasing === "smooth") {
|
|
|
|
$("#aliasing").prop('checked', true);
|
|
|
|
} else if (cookieValueAntialiasing === "no-smooth") {
|
|
|
|
$("#aliasing").prop('checked', false);
|
|
|
|
}
|
2017-07-24 22:48:10 +02:00
|
|
|
if (cookieValueTheme !== "") {
|
|
|
|
$("#select-theme").val(cookieValueTheme);
|
|
|
|
}
|
|
|
|
if (cookieValueLanguage !== "") {
|
|
|
|
$("#select-language").val(cookieValueLanguage);
|
|
|
|
}
|
2017-07-24 22:39:27 +02:00
|
|
|
|
2017-07-24 22:48:10 +02:00
|
|
|
selectTheme();
|
|
|
|
applyColors();
|
2017-01-20 17:59:59 +01:00
|
|
|
setSize();
|
|
|
|
setSpacing();
|
2017-07-24 22:39:27 +02:00
|
|
|
setAntialiasing();
|
2017-07-24 22:48:10 +02:00
|
|
|
selectLanguage();
|
2017-01-20 17:59:59 +01:00
|
|
|
|
|
|
|
var font_aliases = [];
|
|
|
|
$.getJSON("fonts.json", function(data) {
|
|
|
|
|
|
|
|
$.each(data, function(k,v) {
|
|
|
|
font_aliases.push(v.alias);
|
|
|
|
$("#select-font").append("<option value=\"" + v.alias + "\">" + v.name + "</option>");
|
|
|
|
|
|
|
|
if (typeof v.year === "undefined") {
|
|
|
|
yearString = "";
|
|
|
|
} else {
|
|
|
|
yearString = " (" + v.year + ")";
|
|
|
|
}
|
|
|
|
|
|
|
|
$("#font-info").append(
|
2017-07-24 22:39:27 +02:00
|
|
|
"<p class=\"" + v.alias + "\"> " +
|
|
|
|
"<a href=\""+ v.website + "\" rel=\"external\">" + v.author + "</a>" + yearString +
|
2017-01-20 17:59:59 +01:00
|
|
|
"</p>"
|
|
|
|
);
|
|
|
|
});
|
|
|
|
|
|
|
|
var hash = window.location.hash.substring(1);
|
|
|
|
if(hash){
|
|
|
|
$("#select-font").val(hash);
|
|
|
|
}
|
|
|
|
else {
|
|
|
|
$("#select-font").val('input'); // default to this awesome font
|
|
|
|
}
|
|
|
|
|
|
|
|
selectFont();
|
|
|
|
});
|
|
|
|
|
|
|
|
$("#next").click(function() {
|
|
|
|
$("#select-font :selected").next().prop("selected", true);
|
|
|
|
selectFont();
|
|
|
|
});
|
|
|
|
|
|
|
|
$("#previous").click(function() {
|
|
|
|
$("#select-font :selected").prev().prop("selected", true);
|
|
|
|
selectFont();
|
|
|
|
});
|
|
|
|
|
|
|
|
$("#theme-next").click(function() {
|
2017-07-24 22:39:27 +02:00
|
|
|
$("#select-theme :selected").next().prop("selected", true);
|
2017-01-20 17:59:59 +01:00
|
|
|
selectTheme();
|
|
|
|
});
|
|
|
|
|
|
|
|
$("#theme-previous").click(function() {
|
2017-07-24 22:39:27 +02:00
|
|
|
$("#select-theme :selected").prev().prop("selected", true);
|
2017-01-20 17:59:59 +01:00
|
|
|
selectTheme();
|
|
|
|
});
|
|
|
|
});
|