crappyrules/notehub
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

preview added to the left

Browse Source
This commit is contained in:
Christian Müller
2015-11-03 12:45:40 +01:00
parent 2357caf598
commit 15bfde9a8c
3 changed files with 45 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/public/js/publishing.js
+3 -10
View File
@@ -4,10 +4,7 @@ var $ = function(id) {
var iosDetected = navigator.userAgent.match("(iPad|iPod|iPhone)");
var timer = null;
var timerDelay = iosDetected ? 800 : 400;
var show = function(elem) {
elem.style.display = "block"
}
var $note, $action, $preview, $plain_password, $input_elems, $dashed_line, $proposed_title, updatePreview;
var $note, $action, $preview, $plain_password, updatePreview;
var backendTimer;
function md2html(input) {
@@ -15,6 +12,7 @@ function md2html(input) {
}
function saveDraft() {
if ($action == "UPDATE") return;
console.log("draft autosave...");
localStorage.setItem("draft", $note.value);
}
@@ -22,18 +20,13 @@ function saveDraft() {
function onLoad() {
$note = $("note");
$action = $("action").value;
$preview = $("preview");
$preview = $("previewPane");
$plain_password = $("plain-password");
$proposed_title = $("proposed-title");
$input_elems = $("input-elems");
$dashed_line = $("dashed-line");
updatePreview = function() {
clearTimeout(timer);
var content = $note.value;
var delay = Math.min(timerDelay, timerDelay * (content.length / 400));
timer = setTimeout(function() {
show($dashed_line);
show($input_elems);
$preview.innerHTML = md2html(content);
}, delay);
};
resources/public/style.css
+37 -25
View File
@@ -11,6 +11,7 @@ html, body {
margin: 0;
color: #333;
background: #fff;
height: 100%;
}
#hero {
@@ -57,11 +58,6 @@ a:visited {
border: 1px solid #333;
}
textarea, fieldset {
border: none;
margin: 1em;
}
.landing-button {
line-height: 200%;
display: inline-block;
@@ -204,23 +200,6 @@ pre {
outline: 0px none transparent;
}
textarea {
height: 500px;
font-size: 1em;
font-family: Courier;
border-radius: 5px;
}
.hidden {
display: none;
}
#dashed-line {
margin-bottom: 3em;
margin-top: 3em;
border-bottom: 1px dashed#888;
}
table {
border-collapse: collapse;
width: 100%;
@@ -242,16 +221,49 @@ td {
padding: 0.5em;
}
/* MEDIA QUERIES */
/* MEDIA QUERIES */
@media screen and (min-width: 1024px) {
textarea, article, .central-element {
article, .central-element {
width: 800px;
}
}
@media screen and (max-width: 1023px) {
textarea, article, .central-element {
article, .central-element {
width: 90%;
}
}
#editContainer {
display: flex;
flex-direction: row;
height: 100%;
}
#previewPane {
flex: 1 0 46%;
height: 100%;
overflow-y: auto;
margin: 0 !important;
padding: 1em;
border-left: 1px solid #444;
}
#editPane {
flex: 1 0 46%;
height: 100%;
padding: 1em;
}
textarea {
font-size: 1em;
font-family: Courier;
border-radius: 5px;
width: 100%;
height: 93%;
}
textarea, fieldset {
border: none;
}