this was supposef to be submitted 30 mins ago but its wtv

100 views • 2 upvotes • Made by Dustin. 1 week ago in MS_memer_group
20 Comments
pissr
0 ups, 1w, 1 reply
how wide can you spread it before shit pours out
Dustin.
0 ups, 1w
67 inches 😂😂😂😂✌️✌️✌️
ANORMAL_Leaf
0 ups, 1w, 1 reply
does it bounce?
Dustin.
0 ups, 1w, 1 reply
does what bounce
ANORMAL_Leaf
0 ups, 1w, 1 reply
if ykyk😏
Dustin.
0 ups, 1w, 1 reply
are these about boobs 💔

im a guy
ANORMAL_Leaf
0 ups, 1w
nah I was talking abt that ahh💔🥀
Captain.Soap_if_he_was_goated
0 ups, 1w, 1 reply
What will be the next Roblox fandom to be the most hated
Dustin.
0 ups, 1w
die of death probably
[deleted]
0 ups, 1w, 1 reply
what's your favorite candy?
Dustin.
0 ups, 1w, 1 reply
m&ms
[deleted]
0 ups, 1w, 1 reply
W

mine's Reese's
Dustin.
0 ups, 1w
oh peam
The-Return-of-Cheze
0 ups, 1w, 1 reply
<!DOCTYPE html>

<html>

<head>

  <meta charset="utf-8">

  <meta http-equiv="X-UA-Compatible" content="IE=edge">

  <title>Calc</title>

  <meta name="description" content="graphing calculator i made because i was bored and didnt feel like using desmos">

  <meta name="viewport" content="width=device-width, initial-scale=1">

  <style>

    /* root variables */

    :root {

      --primaryBG: #1e1e1e;

      --secondaryBG: #2a2a2a;

      --accent: #ff9100;

      --accent2: #c26e00;

      --link: #00e1ff;

    }

    body {

      margin: 0;

      font-family: Arial, sans-serif;

      height: 100vh;

      display: flex;

      background-color: var(--primaryBG);

      color: white;

    }

    /* toolbar */

    #toolbar {

      width: 300px;

      padding: 20px;

      background-color: var(--secondaryBG);

      box-sizing: border-box;

      border-right: 2px solid #444;

    }

    #toolbar h2 {

      margin-top: 0;

      text-align: center;

    }

    input {

      width: 100%;

      padding: 10px;

      font-size: 16px;

      margin-bottom: 10px;

      box-sizing: border-box;

      border: none;

      border-radius: 4px;

    }

    button {

      width: 100%;

      padding: 10px;

      margin-bottom: 5px;

      font-size: 16px;

      cursor: pointer;

      border: none;

      border-radius: 4px;

      background-color: var(--accent);

      color: white;

    }

    button:hover {

      background-color: var(--accent2);

    }

    .footer {

      width: 100%;

      padding-top: 10px;

      font-size: 16px;

      color: var(--accent);

      text-align: center;

    }

    .footer a {

      color: var(--link);

      cursor: pointer;

      text-decoration: none;

      text-shadow: none;

    }

    .footer a:hover {

      text-shadow: 0px 0px 3px white;

    }

    /* graph area */

    #graph-container {

      flex: 1;

      display: flex;

      justify-content: center;

      align-items: center;

      background-color: #111;

    }

    canvas {

      background-color: #000;

      border: 2px solid #444;

    }

  </style>

</head>

<body>

  <!-- Equation Toolbar -->

  <div id="toolbar">

    <h2>Calculator</h2>

    <div id="equations">

      <input id="equation" placeholder="y = x" />

    </div>

    <button onclick="addRow()">Add Row</button>

    <button onclick="removeRow()">Remove Row</button>

    <button onclick="draw()">Graph</button>

    <div class="footer">Made + by + <a href="https://github.com/Cheze-Burgur">Cheze</a></div>

  </div>

  <!-- Coordinate Plane -->
The-Return-of-Cheze
0 ups, 1w, 1 reply
<div id="graph-container">

    <canvas id="graph" width="600" height="600"></canvas>

  </div>

  <script>

    const canvas = document.getElementById("graph");

    const ctx = canvas.getContext("2d");

    const width = canvas.width;

    const height = canvas.height;

    const scale = 50; // px / unit

    function drawGrid() {

      ctx.clearRect(0, 0, width, height);

      ctx.strokeStyle = "#333";

      ctx.lineWidth = 1;

      for (let x = 0; x <= width; x += scale) {

        ctx.beginPath();

        ctx.moveTo(x, 0);

        ctx.lineTo(x, height);

        ctx.stroke();

      }

      for (let y = 0; y <= height; y += scale) {

        ctx.beginPath();

        ctx.moveTo(0, y);

        ctx.lineTo(width, y);

        ctx.stroke();

      }

      // Axes

      ctx.strokeStyle = "#888";

      ctx.lineWidth = 2;

      ctx.beginPath();

      ctx.moveTo(width / 2, 0);

      ctx.lineTo(width / 2, height);

      ctx.stroke();

      ctx.beginPath();

      ctx.moveTo(0, height / 2);

      ctx.lineTo(width, height / 2);

      ctx.stroke();

    }

    function draw() {

      drawGrid();

      let eq = document.getElementById("equation").value;

      if (!eq.includes("=")) return;

      let expr = eq.split("=")[1];

      expr = expr

        .replace(/\^/g, "**")

        .replace(/sin/g, "Math.sin")

        .replace(/cos/g, "Math.cos")

        .replace(/tan/g, "Math.tan");

      expr = addImplicitMultiplication(expr);

      ctx.strokeStyle = "#00ffcc";

      ctx.lineWidth = 2;

      ctx.beginPath();

      let first = true;

      // Sample x in small steps (not 1 pixel per step) to avoid stair-step artifacts

      const step = 0.1; // pixels; reduce to 0.5 or 0.25 for smoother curves

      for (let px = -width / 2; px < width / 2; px += step) {

        let x = px / scale;

        let y;

        // Break the path on invalid or extreme values to avoid vertical jumps

        try {

          y = eval(expr);

        } catch {

          return;

        }

        if (!isFinite(y) || Math.abs(y) > 1e6) {

          first = true;

          continue;

        }

        let py = -y * scale;

        let cx = width / 2 + px;

        let cy = height / 2 + py;

        if (first) {

          ctx.moveTo(cx, cy);

          first = false;

        } else {

          ctx.lineTo(cx, cy);

        }

      }

      ctx.stroke();

    }

    function addImplicitMultiplication(expr) {

      // 2a -> 2*a

      expr = expr.replace(/(\d)(x)/g, "$1*$2");

      // xb -> x*b
The-Return-of-Cheze
0 ups, 1w, 1 reply
expr = expr.replace(/(x)(\d)/g, "$1*$2");

      // c(x+d) -> c*(x+d)

      expr = expr.replace(/(\d)\(/g, "$1*(");

      // (x+e)f -> (x+e)*f

      expr = expr.replace(/\)(\d)/g, ")*$1");

      // x(x+g) -> x*(x+g)

      expr = expr.replace(/(x)\(/g, "$1*(");

      // (x+h)x -> (x+h)*x

      expr = expr.replace(/\)(x)/g, ")*$1");

      // )( -> )*(

      expr = expr.replace(/\)\(/g, ")*(");

      // isin(x) -> i*sin(x)

      expr = expr.replace(/(\d)(Math\.)/g, "$1*$2");

      // xsin(x) -> x*sin(x)

      expr = expr.replace(/(x)(Math\.)/g, "$1*$2");

      return expr;

    }

    function addRow() {

      const container = document.getElementById("equations");

      const input = document.createElement("input");

      input.className = "equation";

      input.placeholder = "y = x";

      container.appendChild(input);

    }

    function removeRow() {

      const container = document.getElementById("equations");

      if (container.children.length > 1) {

        container.removeChild(container.lastChild);

      }

    }

    drawGrid();

  </script>

</body>

</html>
The-Return-of-Cheze
0 ups, 1w, 1 reply
opinion on this
Dustin.
0 ups, 1w, 1 reply
pretty cool. i cant code so its rly impressive to me.
The-Return-of-Cheze
0 ups, 1w, 1 reply
thank you
Dustin.
0 ups, 1w
no problem dude
Show More Comments
Created with the Imgflip Meme Generator
IMAGE DESCRIPTION:
ask me anything i guess