Guusvanmeerveld
/
First-Website
Archived
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

17-11 #1

Browse Source
add-license-1
Guuq 5 years ago
parent cfe3ec2a90
commit a26ada0b3d
3 changed files with 26 additions and 16 deletions
Show Stats Download Patch File Download Diff File

13
playground/css.css
Unescape View File

@ -1,14 +1,14 @@
#content {
position: absolute;
width: 100%;
height: 94vh;
height: 95vh;
top: 55px;
}
#content div {
float: left;
}
#codeContent {
height: 100%;
height: 95vh;
width: 50%;
background-color: #222226;
}
@ -47,3 +47,12 @@
height: 100%;
width: 50%;
}
@media screen and (min-width:0px) and (max-width:1079px) {
#codeContent {
display: block!important;
width: 100%;
}
iframe {
width: 100%!important;
}
}

12
playground/index.html
Unescape View File

@ -17,14 +17,14 @@
<div id="content">
<div id="codeContent">
<div>
<button onclick="showCode('html')">HTML</button>
<button onclick="showCode('css')">CSS</button>
<button onclick="showCode()">JS</button>
<button onclick="showCode('html')" class="langButton" id="htmlButton">HTML</button>
<button onclick="showCode('css')" class="langButton" id="cssButton">CSS</button>
<button onclick="showCode()" class="langButton" id="jsButton">JS</button>
<button class="options" id="autoRun" onclick="autoRun()">AUTORUN</button>
<button onclick="updateCode('run')" class="options">RUN</button>
<textarea class="input" id="htmlInput" onkeyup="updateCode('autoRun')" spellcheck="false"></textarea>
<textarea class="input" id="cssInput" onkeyup="updateCode('autoRun')" spellcheck="false"></textarea>
<textarea class="input" id="jsInput" onkeyup="updateCode('autoRun')" spellcheck="false"></textarea>
<textarea class="input langInput" id="htmlInput" onkeyup="updateCode('autoRun')" spellcheck="false"></textarea>
<textarea class="input langInput" id="cssInput" onkeyup="updateCode('autoRun')" spellcheck="false"></textarea>
<textarea class="input langInput" id="jsInput" onkeyup="updateCode('autoRun')" spellcheck="false"></textarea>
</div>
</div>
<iframe src="" frameborder="0" id="htmlOutput"></iframe>

17
playground/js.js
Unescape View File

@ -1,4 +1,5 @@
var d = document.getElementById.bind(document);
var g = document.querySelector.bind(document);
var autoRunCheck = localStorage.getItem("autoRun")
var setCodeHTML = localStorage.getItem("writtenCodeHTML")
var setCodeCSS = localStorage.getItem("writtenCodeCSS")
@ -30,16 +31,18 @@ function autoRun() {
}
function showCode(lang) {
d("cssInput").style = "display: none"
d("jsInput").style = "display: none"
d("htmlInput").style = "display: none"
$(".langButton").css("background-color", "#3b3c45")
$(".langInput").css("display", "none")
if (lang == "html") {
d("htmlButton").style = "background-color: #27282e;"
d("htmlInput").style = "display: block"
}
else if (lang == "css") {
d("cssButton").style = "background-color: #27282e;"
d("cssInput").style = "display: block"
}
else {
d("jsButton").style = "background-color: #27282e;"
d("jsInput").style = "display: block"
}
}
@ -48,15 +51,13 @@ function updateCode(source) {
var autoRunCheck = localStorage.getItem("autoRun")
var code = "<style>" + d("cssInput").value + "</style>" + "<script>" + d("jsInput").value + "</script>" + d("htmlInput").value
if (source == "run" || autoRunCheck == "on") {
localStorage.setItem("writtenCodeHTML", d("htmlInput").value)
localStorage.setItem("writtenCodeCSS", d("cssInput").value)
localStorage.setItem("writtenCodeJS", d("jsInput").value)
d("htmlOutput").setAttribute('srcdoc', code)
}
localStorage.setItem("writtenCodeHTML", d("htmlInput").value)
localStorage.setItem("writtenCodeCSS", d("cssInput").value)
localStorage.setItem("writtenCodeJS", d("jsInput").value)
}
emmet.require('textarea').setup({
pretty_break: true, // enable formatted line breaks (when inserting
// between opening and closing tag)
use_tab: true // expand abbreviations by Tab key
});