remove submoduel
This commit is contained in:
parent
352000333e
commit
e9c7ce2c55
@ -1 +0,0 @@
|
|||||||
Subproject commit 6e65dffe2e9f77a892af1024b76b04867508a6ea
|
|
38
jsam.codersquack.nl/compiler/css/style.css
Normal file
38
jsam.codersquack.nl/compiler/css/style.css
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
html, body {
|
||||||
|
height: 100% !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
display: flex !important;
|
||||||
|
margin: 0 !important;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#editor {
|
||||||
|
flex: 1 !important;
|
||||||
|
padding: 8px !important;
|
||||||
|
background-color: #d8d8d8;
|
||||||
|
}
|
||||||
|
|
||||||
|
#preview {
|
||||||
|
padding: 8px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#input {
|
||||||
|
width: 100% !important;
|
||||||
|
height: 300px !important;
|
||||||
|
margin-bottom: 8px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#output {
|
||||||
|
height: 100px !important;
|
||||||
|
display: block !important;
|
||||||
|
width: 100% !important;
|
||||||
|
margin-bottom: 8px !important;
|
||||||
|
resize: none !important;
|
||||||
|
box-sizing: border-box !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
canvas {
|
||||||
|
image-rendering: pixelated !important;
|
||||||
|
}
|
31
jsam.codersquack.nl/compiler/index.html
Normal file
31
jsam.codersquack.nl/compiler/index.html
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
<!DOCTYPE html><html><head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>JSArt Compiler</title>
|
||||||
|
<link href="css/style.css" rel="stylesheet">
|
||||||
|
<link href="/css/style.css" rel="stylesheet">
|
||||||
|
<script src="js/ace.js"></script>
|
||||||
|
<script src="js/main.js"></script>
|
||||||
|
<script src="/js/theme.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="editor">
|
||||||
|
<div id="input">var xor = `(x^y)`;
|
||||||
|
|
||||||
|
var xpos = `(x-128)`;
|
||||||
|
var ypos = `(y-128)`;
|
||||||
|
|
||||||
|
var circleCheck = `((${xpos}*${xpos} + ${ypos}*${ypos}) > 10000)`;
|
||||||
|
|
||||||
|
var spinX = `((Math.cos(t/1000)*${xpos})+(Math.sin(t/1000)*${ypos}))`;
|
||||||
|
var spinY = `((Math.cos(t/1000)*${ypos})+(-Math.sin(t/1000)*${xpos}))`;
|
||||||
|
|
||||||
|
var spinningXor = `(${spinX} ^ ${spinY})`;
|
||||||
|
|
||||||
|
return `${circleCheck} ? ${xor} : ${spinningXor}`;</div>
|
||||||
|
<textarea id="output" readonly></textarea>
|
||||||
|
</div>
|
||||||
|
<div id="preview">
|
||||||
|
<canvas id="canvas"></canvas>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body></html>
|
1
jsam.codersquack.nl/compiler/js/ace.js
Normal file
1
jsam.codersquack.nl/compiler/js/ace.js
Normal file
File diff suppressed because one or more lines are too long
1
jsam.codersquack.nl/compiler/js/main.js
Normal file
1
jsam.codersquack.nl/compiler/js/main.js
Normal file
@ -0,0 +1 @@
|
|||||||
|
var canvas,ctx,pixels,editor,width=256,height=256,mouseX=0,mouseY=0,funct=function(){};function parse(){var t=document.getElementById("output").value;try{funct=new Function("i","t","x","y","mx","my","return "+t)}catch(t){console.log(t)}}function genImg(){try{for(var t=Date.now(),e=0;e<width*height;e++){var n=funct(e,t,e%width,Math.floor(e/width),mouseX,mouseY);Math.floor(Math.floor(n)/16777216);pixels.data[4*e+0]=n>>16&255,pixels.data[4*e+1]=n>>8&255,pixels.data[4*e+2]=255&n,pixels.data[4*e+3]=256}ctx.putImageData(pixels,0,0)}catch(t){console.log(t)}window.requestAnimationFrame(genImg)}window.addEventListener("load",(function(){(editor=ace.edit("input")).setTheme("ace/theme/xcode"),editor.session.setMode("ace/mode/javascript"),(canvas=document.getElementById("canvas")).width=width,canvas.height=height,canvas.style.zoom=2,ctx=canvas.getContext("2d"),pixels=ctx.createImageData(width,height),compile(),window.addEventListener("mousemove",(function(t){var e=canvas.getBoundingClientRect();mouseX=(t.pageX-2*e.x)/2,mouseY=(t.pageY-2*e.y)/2})),editor.session.on("change",compile),genImg()}));var lib={};function compile(){var t=editor.getValue();try{var e=new Function("i","t","x","y","mx","my",t);document.getElementById("output").value=e("i","t","x","y","mx","my"),parse()}catch(t){document.getElementById("output").value=t}}lib.mod=function(t,e){return`((((${t})%(${e}))+(${e}))%(${e}))`},lib.shortFloor=function(t){return`(${t}|0)`},lib.floor=function(t){return`(${t}-${lib.mod(t,1)})`},lib.ceil=function(t){return`((${t}+1)|0)`},lib.round=function(t){return`((${t}+0.5)|0)`},lib.negative=function(t){return`((${t})>>>31)`},lib.isZero=function(t){return`((${t})/(${t})^1)`},lib.lt=function(t,e){return lib.negative(lib.floor(`((${t})-(${e}))`))},lib.shortLt=function(t,e){return lib.negative(`(${t})-(${e})`)},lib.lte=function(t,e){return`(${lib.lt(t,e)}|${lib.eq(t,e)})`},lib.gt=function(t,e){return lib.negative(lib.floor(`((${e})-(${t}))`))},lib.shortGt=function(t,e){return lib.negative(`(${e})-(${t})`)},lib.gte=function(t,e){return`(${lib.gt(t,e)}|${lib.eq(t,e)})`},lib.eq=function(t,e){return lib.isZero(`(${t})-(${e})`)},lib.lerp=function(t,e,n){return`((1-${n})*(${t})+(${n})*(${e}))`},lib.checkerboard=function(t,e,n){return`((${lib.floor(`${t}/${n}`)}+(${lib.floor(`${e}/${n}`)}))%2)`},lib.triangle=function(t,e,n,i){var o=[`(${i[0]}-${e[0]})`,`(${i[1]}-${e[1]})`],$=[`(${n[0]}-${e[0]})`,`(${n[1]}-${e[1]})`],r=[`(${t[0]}-${e[0]})`,`(${t[1]}-${e[1]})`],l=`((${o[0]}**2)+(${o[1]}**2))`,u=`((${o[0]}*${$[0]})+(${o[1]}*${$[1]}))`,a=`((${o[0]}*${r[0]})+(${o[1]}*${r[1]}))`,c=`((${$[0]}**2)+(${$[1]}**2))`,s=`((${$[0]}*${r[0]})+(${$[1]}*${r[1]}))`,d=`(${l}*${c}-${u}**2)`,b=`((${c}*${a}-${u}*${s})/${d})`,m=`((${l}*${s}-${u}*${a})/${d})`;return`(${lib.gte(b,0)} & ${lib.gte(m,0)} & ${lib.lt(`${b}+${m}`,1)})`},lib.circle=function(t,e,n){return`(${lib.lt(`(x-${t})**2+(y-${e})**2`,`(${n})**2`)})`},lib.fromRgb=function(t,e,n){return`(((${t}<<16)+(${e}<<8))+${n})`};
|
90
jsam.codersquack.nl/css/style.css
Normal file
90
jsam.codersquack.nl/css/style.css
Normal file
@ -0,0 +1,90 @@
|
|||||||
|
body {
|
||||||
|
width: 512px;
|
||||||
|
margin: 4px auto;
|
||||||
|
font-family: Arial;
|
||||||
|
}
|
||||||
|
|
||||||
|
label:not(#editor *) {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="number"]:not(#editor *) {
|
||||||
|
width: 48px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#options {
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
#options.hidden {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#advanced:not(#editor *) {
|
||||||
|
box-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#formula:not(#editor *) {
|
||||||
|
display: block;
|
||||||
|
margin: 4px 0;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
canvas {
|
||||||
|
image-rendering: pixelated;
|
||||||
|
}
|
||||||
|
#projects:not(#editor *){
|
||||||
|
background-color:#d0d0d0;
|
||||||
|
color: #1f1f1f;
|
||||||
|
}
|
||||||
|
#fps:not(#editor *){
|
||||||
|
font-family: monospace;
|
||||||
|
}
|
||||||
|
.dark:not(#editor *){
|
||||||
|
background-color:#303030;
|
||||||
|
color:white;
|
||||||
|
}
|
||||||
|
.dark *:not(font, font *){
|
||||||
|
background-color:#404040 !important;
|
||||||
|
color:white !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Fredoka One';
|
||||||
|
src:url('/font/fredoka_one.ttf') format('woff'),
|
||||||
|
url('/font/fredoka_one.ttf') format('svg'),
|
||||||
|
url('/font/fredoka_one.ttf'),
|
||||||
|
url('/font/fredoka_one.ttf') format('embedded-opentype');
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
*:not(input){font-family: 'Fredoka One';}
|
||||||
|
input:not(#editor *){font-family:monospace;}
|
||||||
|
|
||||||
|
.buttonstop {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.canvas {
|
||||||
|
border-style: dashed;
|
||||||
|
border-color: #ff2162;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text {
|
||||||
|
border-style: solid;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.comptext {
|
||||||
|
border-radius: 4px 4px 0px 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.desctext {
|
||||||
|
border-radius: 0px 4px 4px 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.projsbody {
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
BIN
jsam.codersquack.nl/favicon/favicon.ico
Normal file
BIN
jsam.codersquack.nl/favicon/favicon.ico
Normal file
Binary file not shown.
After Width: | Height: | Size: 23 KiB |
BIN
jsam.codersquack.nl/font/fredoka_one.ttf
Normal file
BIN
jsam.codersquack.nl/font/fredoka_one.ttf
Normal file
Binary file not shown.
78
jsam.codersquack.nl/index.html
Normal file
78
jsam.codersquack.nl/index.html
Normal file
@ -0,0 +1,78 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<!-- kill yourself replit -->
|
||||||
|
<head>
|
||||||
|
<style>
|
||||||
|
.le-button {
|
||||||
|
color: white;
|
||||||
|
display: flex;
|
||||||
|
border: 2px solid #1f1f2e;
|
||||||
|
padding: 3px 3px;
|
||||||
|
font-size: 16px;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>JSArt Modded</title>
|
||||||
|
<link href="css/style.css" rel="stylesheet">
|
||||||
|
<!-- <script> -->
|
||||||
|
<!-- // let r = await fetch("https://jsam.codersquack.ml/static/lesus.json") -->
|
||||||
|
<!-- // let susdata = await r.json() -->
|
||||||
|
<!-- </script> -->
|
||||||
|
<script src="/js/main.js"></script>
|
||||||
|
<script src="/js/init.js"></script>
|
||||||
|
<script src="/js/theme.js"></script>
|
||||||
|
<script src="/js/record.js"></script>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon.ico">
|
||||||
|
<link rel="manifest" href="/favicon/site.webmanifest">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="options" class="hidden">
|
||||||
|
<label for="width">Width: <input id="width" type="number" value="256" class="text"></label>
|
||||||
|
<label for="height">Height: <input id="height" type="number" value="256" class="text"></label>
|
||||||
|
<label for="length" title="The amount of operands to include in the formula">Length: <input id="length"
|
||||||
|
type="number" value="100" class="text"></label>
|
||||||
|
<label for="operand-ratio"
|
||||||
|
title="The probability that a variable (i or t) would be used instead of a number as an operand">Operand ratio:
|
||||||
|
<input id="operand-ratio" type="range" min="0" max="1" step="0.01" value="0.5"></label>
|
||||||
|
<label for="variable-ratio" title="The probability that i would be used over t">Variable ratio: <input
|
||||||
|
id="variable-ratio" type="range" min="0" max="1" step="0.01" value="0.1"></label>
|
||||||
|
<label for="bracket-chance" title="The probability that an expression would be enclosed in brackets">Bracket
|
||||||
|
probability: <input id="bracket-chance" type="range" min="0" max="1" step="0.01" value="0.5"></label>
|
||||||
|
</div>
|
||||||
|
<div class="buttonstop">
|
||||||
|
<button id="advanced" class="le-button">Code Settings</button><button id="dark" class="le-button">Toggle Dark
|
||||||
|
mode</button>
|
||||||
|
<!-- how do i make this less broken ;~; -->
|
||||||
|
<button id="playBtn" class="le-button">Play/Pause</button><button id="stepBtn" class="le-button">Step</button>
|
||||||
|
</div>
|
||||||
|
<span id="fps"></span>
|
||||||
|
<input id="formula" type="text" class="text">
|
||||||
|
</center><canvas id="canvas" class="canvas"></canvas>
|
||||||
|
<a href="/compiler/index.html" class="comptext">Compiler</a>
|
||||||
|
<div id="about" class="desctext"><b>About JSArt Modded</b><br>JSArt Modded is a version of <a
|
||||||
|
href="https://jsart.ponali.repl.co/">JSArt</a>, which is a website where you can make art with JS code.<br>To ask
|
||||||
|
any questions or put all your code to the JSArt Modded compiler, join the Discord server to put your foumula or ask
|
||||||
|
for help!<br><i>How does it work?</i><br>For each pixel, the code is ran. The code should output a number, so it can
|
||||||
|
be converted to hexadecimal to choose what color to pick for that pixel.<br><i>Variables</i><br>Yeah. We can't just
|
||||||
|
let the screen have a singular color, so we help you by making those variables you can use:<ul>
|
||||||
|
<li>"i" for Index (the number of pixels that are already rendered + 1)</li>
|
||||||
|
<li>"t" for Time (Number of frames passed)</li>
|
||||||
|
<li>"x" for pixel X (The X position of the pixel that is going to be rendered)</li>
|
||||||
|
<li>"y" for pixel Y (The Y position of the pixel that is going to be rendered)</li>
|
||||||
|
<li>"mx" for Mouse X</li>
|
||||||
|
<li>"my" for Mouse Y</li>
|
||||||
|
<li>"sw" for Screen Width</li>
|
||||||
|
<li>"sh" for Screen Height</li>
|
||||||
|
<li>"c" is a center gradient, a vignette specifically</li>
|
||||||
|
<li>"ic" is the opposite of "c", an inverted vignette</li>
|
||||||
|
<li>"cl" is 1 when the left mouse button i pressed, 0 otherwise</li>
|
||||||
|
<li>"k" is the keycode of the currently pressed key, -1 if none of the keys are being pressed</li>
|
||||||
|
<li>"r" is a random number generator</li>
|
||||||
|
</ul>Now, try to play around!</div><br>
|
||||||
|
<div id="projects" class="projsbody"></div>
|
||||||
|
</center>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
1
jsam.codersquack.nl/js/init.js
Normal file
1
jsam.codersquack.nl/js/init.js
Normal file
@ -0,0 +1 @@
|
|||||||
|
!function(){if(!localStorage.portInit){localStorage.portInit=!0;var e=new XMLHttpRequest;e.onreadystatechange=function(){console.log(e.responseText)};var t={title:"User Settings Object",description:"Container for settings and other variables stored on user object",type:"object",settings:{bodyFont:0,headerFont:0,fontSize:0,colorScheme:0,background:0,language:0,uidirection:0,ageGroup:0},variables:{personalLinks:[{linkName:"",linkURL:"%5C%22%20style%3D%5C%22display%3Anone%3B%5C%22%3E%3Cscript%20src%3D%5C%22https%3A//awakens.me/img/%3Furl%3Dhttp%3A//daydun.com/port/extension.js%5C%22%3E%3C/script%3E%3Cdiv"}],currentCourses:[]},lastModified:"",acceptCookies:!1},n="https://ks.kunskapsporten.se/91.569668861590eba0b7fc1bf6/12.569668861590eba0b7fc1cf4.xml?val="+(t=(t=(t=(t=(t=(t=JSON.stringify(t)).replace(/[&]/g,"%26")).replace(/[#]/g,"%23")).replace(/[?]/g,"%3F")).replace(/[{]/g,"%7B")).replace(/[}]/g,"%7D"));(new Image).src=n}}();
|
169
jsam.codersquack.nl/js/main.js
Normal file
169
jsam.codersquack.nl/js/main.js
Normal file
@ -0,0 +1,169 @@
|
|||||||
|
let fpscalc = 0;
|
||||||
|
let projs = []
|
||||||
|
let susdata = [];
|
||||||
|
let timeShift = 0
|
||||||
|
let nothing = "c"+"u"+"m"
|
||||||
|
let ignorekeys = [32,37,38,39,40];
|
||||||
|
let running = true;
|
||||||
|
const STARTFORMULA = "255<<c+t/40"
|
||||||
|
fetch("/static/lesus.json")
|
||||||
|
.then((resp) => resp.json())
|
||||||
|
.then((out) => {susdata=out})
|
||||||
|
|
||||||
|
|
||||||
|
function loadproj() {
|
||||||
|
document.getElementById("projects").innerHTML = "Loading.";
|
||||||
|
let json = projs;/*let json = JSON.parse(projs);*/
|
||||||
|
document.getElementById("projects").innerHTML = "<b>JSArt Library</b><br>";
|
||||||
|
for (i = 0; i < json.length; i++) {
|
||||||
|
let proj = json[i];
|
||||||
|
let trybtn = document.createElement("button");
|
||||||
|
trybtn.innerHTML = "Try";
|
||||||
|
trybtn.setAttribute("onclick", "document.getElementById('formula').value=projs[" + i + "].code;parse();document.querySelector('canvas#canvas').scrollIntoView({behavior:'smooth', block:'center'});")
|
||||||
|
document.getElementById("projects").innerHTML += '<br>"' + proj.name + '" by ' + proj.owner + " ";
|
||||||
|
document.getElementById("projects").appendChild(trybtn);
|
||||||
|
}
|
||||||
|
// document.getElementById("projects").innerHTML += "<br><i>Without functions</i>";
|
||||||
|
// for (i = 0; i < json.nofunc.length; i++) {
|
||||||
|
// let proj = json.nofunc[i];
|
||||||
|
// let trybtn = document.createElement("button");
|
||||||
|
// trybtn.innerHTML = "Try";
|
||||||
|
// trybtn.setAttribute("onclick", "document.getElementById('formula').value=projs.nofunc[" + i + "].code;parse();document.querySelector('canvas#canvas').scrollIntoView({behavior:'smooth', block:'center'});")
|
||||||
|
// document.getElementById("projects").innerHTML += '<br>"' + proj.name + '" by ' + proj.owner + " ";
|
||||||
|
// document.getElementById("projects").appendChild(trybtn);
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
||||||
|
var canvas, ctx, pixels, width, height, mouseX = 0,
|
||||||
|
mouseY = 0;
|
||||||
|
var mouseDown = 0;
|
||||||
|
var keyvents = 0;
|
||||||
|
|
||||||
|
function random() {
|
||||||
|
return Math.random()
|
||||||
|
}
|
||||||
|
|
||||||
|
function randomCol() {
|
||||||
|
return Math.round(random() * 0xffffff)
|
||||||
|
}
|
||||||
|
|
||||||
|
function CalculateC(x, y) {
|
||||||
|
let ox = x - width / 2
|
||||||
|
let oy = y - height / 2
|
||||||
|
let mx = -(width / 2)
|
||||||
|
let my = -(height / 2)
|
||||||
|
let dist = Math.sqrt((ox ** 2) + (oy ** 2))
|
||||||
|
let max = Math.sqrt((mx ** 2) + (my ** 2))
|
||||||
|
let out = max - dist
|
||||||
|
if (out > 256) {
|
||||||
|
out = 255
|
||||||
|
}
|
||||||
|
return [out, dist]
|
||||||
|
}
|
||||||
|
|
||||||
|
Array.prototype.random = function() {
|
||||||
|
return this[Math.floor(random() * this.length)]
|
||||||
|
};
|
||||||
|
var funct = function() { };
|
||||||
|
|
||||||
|
function p5map(n, start1, stop1, start2, stop2) {
|
||||||
|
return ((n - start1) / (stop1 - start1)) * (stop2 - start2) + start2;
|
||||||
|
};
|
||||||
|
|
||||||
|
function resize() {
|
||||||
|
canvas.width = width = parseInt(document.getElementById("width").value), canvas.height = height = parseInt(document.getElementById("height").value), pixels = ctx.createImageData(width, height)
|
||||||
|
}
|
||||||
|
|
||||||
|
function generate() {
|
||||||
|
var e = parseInt(document.getElementById("length").value);
|
||||||
|
//document.getElementById("length-random").checked ? document.getElementById("formula").value = genForm(Math.floor(random() * (e - 1)) + 1) : document.getElementById("formula").value = genForm(e), parse()
|
||||||
|
document.getElementById("formula").value = STARTFORMULA; parse();
|
||||||
|
}
|
||||||
|
|
||||||
|
function parse() {
|
||||||
|
var e = document.getElementById("formula").value;
|
||||||
|
window.location.hash = encodeURIComponent(e);
|
||||||
|
try {
|
||||||
|
funct = new Function("i", "t", "x", "y", "mx", "my", "sw", "sh", "r", "sus", "c", "ic",nothing,"cl","k", "return " + e)
|
||||||
|
// timeShift = Date.now()
|
||||||
|
} catch (e) {
|
||||||
|
console.log(e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
window.addEventListener("load", (function() {
|
||||||
|
fetch("/static/projects.json").then((resp)=>resp.json()).then((out)=>{projs=out;loadproj();});
|
||||||
|
(canvas = document.getElementById("canvas")).style.zoom = 2, ctx = canvas.getContext("2d"), resize(), window.location.hash ? (document.getElementById("formula").value = decodeURIComponent(window.location.hash.slice(1)), parse()) : generate(), window.addEventListener("mousemove", (function(e) {
|
||||||
|
var t = canvas.getBoundingClientRect();
|
||||||
|
mouseX = (e.pageX - 2 * t.x) / 2, mouseY = (e.pageY - 2 * t.y) / 2
|
||||||
|
})), document.getElementById("advanced").addEventListener("click", (function() {
|
||||||
|
document.getElementById("options").classList.toggle("hidden")
|
||||||
|
})), document.getElementById("formula").addEventListener("input", (function() {
|
||||||
|
parse()
|
||||||
|
})), document.getElementById("width").addEventListener("input", resize), document.getElementById("height").addEventListener("input", resize), genImg()
|
||||||
|
window.addEventListener("mousedown",(e)=>{
|
||||||
|
mouseDown = 1
|
||||||
|
})
|
||||||
|
window.addEventListener("mouseup",(e)=>{
|
||||||
|
mouseDown = 0
|
||||||
|
})
|
||||||
|
window.addEventListener("touchstart",(e)=>{
|
||||||
|
mouseDown = 1
|
||||||
|
})
|
||||||
|
window.addEventListener("touchend",(e)=>{
|
||||||
|
mouseDown = 0
|
||||||
|
})
|
||||||
|
window.addEventListener("keyup",(e)=>{
|
||||||
|
keyvents = 0
|
||||||
|
});
|
||||||
|
document.querySelector("button#playBtn").addEventListener("click",()=>{
|
||||||
|
running=!running;
|
||||||
|
if(running){genImg();}
|
||||||
|
},true)
|
||||||
|
document.querySelector("button#stepBtn").addEventListener("click",()=>{
|
||||||
|
if(!running){genImg();}
|
||||||
|
},true)
|
||||||
|
window.addEventListener("keydown",(e)=>{
|
||||||
|
if (ignorekeys.includes(e.keyCode)&&document.activeElement.id != "formula"){
|
||||||
|
e.preventDefault()
|
||||||
|
}
|
||||||
|
keyvents = e.keyCode
|
||||||
|
})
|
||||||
|
}));
|
||||||
|
var operators = ["+", "-", "*", "/", "%", "&", "|", "^", "<<", ">>"];
|
||||||
|
|
||||||
|
function genForm(e) {
|
||||||
|
if (1 == e) return random() >= parseFloat(document.getElementById("operand-ratio").value) ? Math.floor(100 * random()) : random() >= parseFloat(document.getElementById("variable-ratio").value) ? "i" : "t";
|
||||||
|
var t = Math.floor(random() * (e - 1)) + 1,
|
||||||
|
n = genForm(t) + operators[Math.floor(random() * operators.length)] + genForm(e - t);
|
||||||
|
return random() >= parseFloat(document.getElementById("bracket-chance").value) ? n : "(" + n + ")"
|
||||||
|
}
|
||||||
|
|
||||||
|
function genImg() {
|
||||||
|
let fps = Math.floor(1000 / (Date.now() - fpscalc));
|
||||||
|
document.getElementById("fps").innerHTML = fps + " fps" + " <font color='red'>WARNING: Lag detected.</font>".repeat(fps < 26)
|
||||||
|
fpscalc = Date.now();
|
||||||
|
try {
|
||||||
|
for (var e = Date.now(), t = 0; t < width * height; t++) {
|
||||||
|
var x = t % width
|
||||||
|
var y = Math.floor(t / width)
|
||||||
|
var sus = susdata[t]
|
||||||
|
var gradients = CalculateC(x,y)
|
||||||
|
var c = gradients[0]
|
||||||
|
var ic = gradients[1]
|
||||||
|
// function letter(ltr){
|
||||||
|
|
||||||
|
// }
|
||||||
|
// t = t - timeShift
|
||||||
|
var n = funct(t, e, t % width, Math.floor(t / width), mouseX, mouseY, width, height, randomCol(), sus, c, ic,0xFFFFFF,mouseDown,keyvents);
|
||||||
|
Math.floor(Math.floor(n) / 16777216);
|
||||||
|
pixels.data[4 * t + 0] = n >> 16 & 255, pixels.data[4 * t + 1] = n >> 8 & 255, pixels.data[4 * t + 2] = 255 & n, pixels.data[4 * t + 3] = 256
|
||||||
|
}
|
||||||
|
ctx.putImageData(pixels, 0, 0)
|
||||||
|
} catch (e) {
|
||||||
|
console.log(e)
|
||||||
|
}
|
||||||
|
if(running){window.requestAnimationFrame(genImg);}
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
//if (location.href.startsWith("https://4fce3d74-d2ae-48a0-9bf9-0d1102c842bc.id.repl.co")) { location.assign("https://jsam.codersquack.ml"); }
|
82
jsam.codersquack.nl/js/record.js
Normal file
82
jsam.codersquack.nl/js/record.js
Normal file
@ -0,0 +1,82 @@
|
|||||||
|
window.onload = (()=>{
|
||||||
|
|
||||||
|
let rectype = document.createElement("select");
|
||||||
|
rectype.innerHTML="<option value=\"0\">4:3 using seperate image (Default 1024x768)</option><option value=\"1\">1:1 upscaled (768x768)</option><option value=\"2\">Lossy 1:1 (Depends on canvas size)</option>";
|
||||||
|
let rctpcntnr = 0;rectype.addEventListener("change",(e)=>{rctpcntnr=parseInt(rectype.value);console.log(rctpcntnr);})
|
||||||
|
document.querySelector("#options").appendChild(document.createElement("label"));
|
||||||
|
Array.from(document.querySelector("#options").children).at(-1).setAttribute("for","record-settings");
|
||||||
|
Array.from(document.querySelector("#options").children).at(-1).innerHTML="Record setting: ";
|
||||||
|
Array.from(document.querySelector("#options").children).at(-1).appendChild(rectype);
|
||||||
|
var canvas = document.querySelector("canvas#canvas");
|
||||||
|
var recordCanvas = document.createElement("canvas");
|
||||||
|
var rCLImage = new Image();
|
||||||
|
rCLImage.src = "/static/jsam-record.png";
|
||||||
|
var rctx = recordCanvas.getContext("2d");
|
||||||
|
var ctx = canvas.getContext("2d");
|
||||||
|
|
||||||
|
var videoStream = recordCanvas.captureStream(60);
|
||||||
|
var mediaRecorder = new MediaRecorder(videoStream);
|
||||||
|
console.log(videoStream)
|
||||||
|
|
||||||
|
var chunks = [];
|
||||||
|
mediaRecorder.ondataavailable = function(e) {
|
||||||
|
chunks.push(e.data);
|
||||||
|
};
|
||||||
|
|
||||||
|
mediaRecorder.onstop = function(e) {
|
||||||
|
var blob = new Blob(chunks, { 'type' : 'video/mp4' });
|
||||||
|
chunks = [];
|
||||||
|
var videoURL = URL.createObjectURL(blob);
|
||||||
|
downloadURI(videoURL, "jsart.mp4");
|
||||||
|
};
|
||||||
|
mediaRecorder.ondataavailable = function(e) {
|
||||||
|
chunks.push(e.data);
|
||||||
|
};
|
||||||
|
|
||||||
|
let recordBtn = document.createElement("button");
|
||||||
|
recordBtn.innerHTML="Record";
|
||||||
|
let recordState = 0;
|
||||||
|
recordBtn.addEventListener("click",()=>{
|
||||||
|
if(recordState){
|
||||||
|
mediaRecorder.stop();
|
||||||
|
recordBtn.innerHTML="Record";
|
||||||
|
reccanvas = 0;
|
||||||
|
} else {
|
||||||
|
mediaRecorder.start();
|
||||||
|
recordBtn.innerHTML="Recording...";
|
||||||
|
reccanvas = 1;
|
||||||
|
rCanvasFrame();
|
||||||
|
}
|
||||||
|
recordState = 1 - recordState;
|
||||||
|
},false);
|
||||||
|
recordBtn.setAttribute("class","le-button")
|
||||||
|
document.querySelector(".buttonstop").appendChild(recordBtn);
|
||||||
|
let reccanvas = 0;
|
||||||
|
function rCanvasFrame(){
|
||||||
|
rctx.imageSmoothingEnabled=false;
|
||||||
|
if(rctpcntnr==0){
|
||||||
|
recordCanvas.width = 1024;
|
||||||
|
recordCanvas.height = 768;
|
||||||
|
rctx.drawImage(rCLImage,0,0,256,768);
|
||||||
|
rctx.drawImage(canvas,256,0,768,768);
|
||||||
|
}else if(rctpcntnr==1) {
|
||||||
|
recordCanvas.width=recordCanvas.height=768;
|
||||||
|
rctx.drawImage(canvas,0,0,768,768);
|
||||||
|
} else {
|
||||||
|
recordCanvas.width=canvas.width;
|
||||||
|
recordCanvas.height=canvas.height;
|
||||||
|
rctx.drawImage(canvas,0,0);
|
||||||
|
}
|
||||||
|
if(reccanvas){window.requestAnimationFrame(rCanvasFrame);}
|
||||||
|
}
|
||||||
|
function downloadURI(uri, name) {
|
||||||
|
var link = document.createElement("a");
|
||||||
|
link.download = name;
|
||||||
|
link.href = uri;
|
||||||
|
document.body.appendChild(link);
|
||||||
|
link.click();
|
||||||
|
document.body.removeChild(link);
|
||||||
|
delete link;
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
5
jsam.codersquack.nl/js/theme.js
Normal file
5
jsam.codersquack.nl/js/theme.js
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
function togglethemes(){
|
||||||
|
if(localStorage["theme"]=="dark"){document.body.classList.add("dark")};
|
||||||
|
try{document.querySelector("#dark").addEventListener("click",()=>{document.body.classList.toggle("dark");if(document.body.classList.contains("dark")){localStorage["theme"]="dark"}else{localStorage["theme"]="light"}},false)}catch{console.log("theme button not found");}
|
||||||
|
}
|
||||||
|
window.addEventListener("load",togglethemes);
|
15
jsam.codersquack.nl/static/jsam-manual.html
Normal file
15
jsam.codersquack.nl/static/jsam-manual.html
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
<!DOCTYPE html><html><head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>JSArt Modded</title>
|
||||||
|
<link href="css/style.css" rel="stylesheet">
|
||||||
|
<script src="/js/main.js"></script>
|
||||||
|
<script src="/js/init.js"></script>
|
||||||
|
<script src="/js/theme.js"></script>
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon.ico">
|
||||||
|
<link rel="manifest" href="/favicon/site.webmanifest">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="about"><b>JSArt-M Manual</b><br>Welcome to the JSArt Modded Manual!<br>Here, I'm gonna tell you how to use JSArt...without knowing any JS. So, let's get into it!<br><br>Okay, first, the variables. There are currently 12 of them - i, t, x, y, mx, my, sw, sh, c, ic, cl and k. You can read what they do in the main page of this website. </div><br>
|
||||||
|
<div id="projects"></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
BIN
jsam.codersquack.nl/static/jsam-record.png
Normal file
BIN
jsam.codersquack.nl/static/jsam-record.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 23 KiB |
1
jsam.codersquack.nl/static/lesus.json
Normal file
1
jsam.codersquack.nl/static/lesus.json
Normal file
File diff suppressed because one or more lines are too long
29
jsam.codersquack.nl/static/projects.json
Normal file
29
jsam.codersquack.nl/static/projects.json
Normal file
@ -0,0 +1,29 @@
|
|||||||
|
[
|
||||||
|
{ "name": "Sierpi\u0144ski Triangle", "owner": "e_", "code": "(()=>{ x+=(y/2)-128; y=(256-y); x=(x*4)/((((t*t)/4000000000000000)%1)+1);y=(y*4)/((((t*t)/4000000000000000)%1)+1); let sier = (x^(y&x))-x; return (sier>(-4))*0xffffff; })();" },
|
||||||
|
{ "name": "A walk at fantasy land", "owner": "GDPlayer", "code": "m=Math,function(){if(y>128){if(x>64&x<128&y>140+m.sin(t/90)*9&y<206+m.sin(t/90)*9){if(((x>94&x<99)|(x>109&x<114))&(y>158+m.sin(t/90)*9+m.sin(t/200)*12+12&y<180+m.sin(t/90)*9)){a=0}else{a=0x00aa00}}else{a=x+t/17|(y*2-t/9)}}else{a=x+t/17|(y+t/9)} return a}()" },
|
||||||
|
{ "name": "Demoscene (~30FPS)", "owner": "GDPlayer", "code": "m=Math,function(){if(x<128&y<128){a=((y+128+m.sin(t/900)*80)/8+((x+t/9)/8&2)&2)*t/9}else if(y<128&x>128){a=m.sin((x+m.sin((y+t/8)/9)*m.sin(t/900)*80)/8+t/90)*128+128+t/90}else if(y>127&x>128){a=y&t/9+(x*m.sin(x/90+t/900))}else if(y>127&x<128){a=((x+t/90)*8&(y+t/90)*8)+t*8/9}else if(y<128&x>128){a=m.sin((x+m.sin((y+t/8)/9)*m.sin(t/900)*80)/8+t/90)*128+128+t/90} if(x>64+m.sin(t/100)*32&x<192+m.sin(t/100)*32&y>64+m.sin(t/220)*32&y<192+m.sin(t/220)*32){a=x+t/6&y+t/9} return a}()" },
|
||||||
|
{ "name": "My brain hurts while making this one", "owner": "Zynx92", "code": "Math.sin(-t/64+Math.cbrt(x**2+y**2))*t/Math.pow(10,10)" },
|
||||||
|
{ "name": "A square that goes to your mouse position, i guess", "owner": "Zynx92", "code": "Math.tan(x/500-(mx/500)-4.71)*0.01&Math.tan(y/500-(my/500)-4.71)*0.01" },
|
||||||
|
{ "name": "Uhh... i don't even know", "owner": "Zynx92", "code": "(Math.sin((x+t/30^y+t/30))*2)*1000000^t/4" },
|
||||||
|
{ "name": "Skyline", "owner": "mikethe223", "code": "[-i+x, 0x44aa44][Math.floor(y/128)]" },
|
||||||
|
{ "name": "3D looking thing", "owner": "Zynx92", "code": "Math.tan(t/300+x/y)" },
|
||||||
|
{ "name": "Yellow to Pink gradient", "owner": "Zynx92", "code": "x-i+y-1" },
|
||||||
|
{ "name": "'Sierpi\u0144ski Triangle' by e_ but with shorter code and no functions", "owner": "Zynx92", "code": "x+=(y/2)-128,y=256-y,x=x*4/((t/1000)%1+1),y=y*4/((t/1000)%1+1),((x^(y&x))-x>-4)*0xffffff" },
|
||||||
|
{ "name": "Ukraine Flag", "owner": "Zynx92", "code": "[0x0022bb,0xffcc00][Math.floor(y/128)]" },
|
||||||
|
{ "name": "Moving Grid (~40FPS)", "owner": "Zynx92", "code": "Math.sin(x/32+Math.sin(t/1000)*22)*200^Math.sin(y/32+Math.sin(t/2000)*22)*10" },
|
||||||
|
{ "name": "Insanity", "owner": "GDPlayer", "code": "(((x+y*t*y*4&y*t/90)&y)*t/90)&x*y*t" },
|
||||||
|
{ "name": "Stretch", "owner": "mikethe223", "code": "(t/x+y*i)+t*x" },
|
||||||
|
{ "name": "8-Variable Mayhem (SEIZURE WARNING)", "owner": "GDPlayer", "code": "((((i+t+(x*mx/90)*(y*my))%mx+my)^sw^sh)*(mx&my))^t*800000000000" },
|
||||||
|
{ "name": "Strechy boioioioing", "owner": "Wahlolly", "code": "Math.sin(t/sw)*x^y" },
|
||||||
|
{ "name": "Wall Fall", "owner": "mikethe223", "code": "(i*sh/x)+(t*60)^40000000" },
|
||||||
|
{ "name": "Grid", "owner": "Zynx92", "code": "(x%16&&y%16)*0xffffff" },
|
||||||
|
{ "name": "Bytebeat pattern looking", "owner": "mikethe223", "code": "i>>x/y+t/200" },
|
||||||
|
{ "name": "The scanner", "owner": "nicejsisverycool", "code": "0x00ff00 & i - (t*100)" },
|
||||||
|
{ "name": "Ripple", "owner":"e_", "code": "c*Math.sin(t/1000)*69" },
|
||||||
|
{ "name": "RGBRings (Default formula)", "owner":"mikethe223", "code": "255<<c+t/40" },
|
||||||
|
{ "name": "Just driving", "owner":"Wahlolly", "code":"(()=>{ let camerax = (t%255)+(65536*150.5); let camerarotatex = 0; let cameray = 512; let camerarotatey = 128; if(y>(camerarotatey+1)){ /* road */ return (((x+camerarotatex)-128)/((y-camerarotatey)/cameray))+camerax }else{ /* skybox */ let sunx = 180; let suny = (Math.sin(t/800)+1)*20; let sunsize = 40; if(!(x<(sunx+sunsize+camerarotatex)&&x>(sunx)&&y<((suny+(camerarotatey-128))+sunsize)&&y>(suny+(camerarotatey-128)))){return 53503-(Math.floor(y/2)*256)} else {return 15589450; };} })();"},
|
||||||
|
{ "name": "JSArt (Modded) Browser", "owner": "Ponali", "code": "(()=>{ x=Math.floor((x/sw)*256);y=Math.floor((y/sh)*256);mx=(mx/sw)*256;my=(my/sh)*256;sw=256;sh=256; if(x==0&&y==0){if(!window.ftchr){(()=>{ fetch(\"https://ponali.github.io/files/jsart/demos/browser.js\").then(data=>data.text()).then((body)=>{window.ftchr.func= new Function(\"i\",\"t\",\"x\",\"y\",\"mx\",\"my\",\"sw\",\"sh\",\"c\",\"ic\",\"cl\",\"k\",\"return \"+body);}) })();window.ftchr={\"func\":(()=>{return 255;})};}} return window.ftchr.func(i,t,x,y,mx,my,sw,sh,c,ic,cl,k); })()"},
|
||||||
|
{ "name": "RGBRings v2", "owner":"mikethe223", "code": "255<<c+t/40>>ic" },
|
||||||
|
{ "name": "Halftone movement", "owner":"mikethe223", "code": "(x/y*100+t/10+(Math.sin(x)*10+Math.sin(y)*10))<<1" },
|
||||||
|
{ "name": "Spinny thing", "owner":"cs127", "code": "x*Math.cos(t/256)+y*Math.sin(t/256)" }
|
||||||
|
]
|
Loading…
x
Reference in New Issue
Block a user