Update files

leikareipa · Dec 4, 2024 · bc9adaa · bc9adaa
1 parent 5f64951
commit bc9adaa
Show file tree

Hide file tree

Showing 28 changed files with 3,252 additions and 58 deletions.
diff --git a/blog/briefly-evaluating-qwq-preview/content.md b/blog/briefly-evaluating-qwq-preview/content.md
diff --git a/blog/briefly-evaluating-qwq-preview/index.html b/blog/briefly-evaluating-qwq-preview/index.html
diff --git a/blog/briefly-evaluating-qwq-preview/index.intermediate.html b/blog/briefly-evaluating-qwq-preview/index.intermediate.html
@@ -0,0 +1,65 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta name="viewport" content="width=device-width">
+        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
+
+        <link rel="stylesheet" href="../+assets/blog.css">
+        <link rel="stylesheet" href="/assets/font-awesome-5-15-4/css/all.min.css">
+        <script defer src="/assets/font-awesome-5-15-4/attribution.js"></script>
+        <script defer src="../+assets/highlight.min.js"></script>
+        <script defer src="/dokki/distributable/dokki.js"></script>
+        <script type="module" src="../+assets/blog-post-widgets.js"></script>
+        <script type="module" src="../+assets/post-date.js"></script>
+
+        <style>
+            x-prompt {
+                margin: 2rem 0;
+                margin-bottom: 1.375rem;
+                display: block;
+                padding: calc(1.5 * var(--dokkiCSS-embedded-header-padding));
+                border: 1px solid var(--dokkiCSS-page-primary-line-color);
+                position: relative;
+            }
+
+            x-prompt::before {
+                content: "Prompt:";
+                position: absolute;
+                top: -1.25ex;
+                background-color: var(--dokkiCSS-page-secondary-bg-color);
+                font-weight: var(--dokkiCSS-bold-text-weight);
+                padding: 0 0.5em;
+                margin-left: -0.5em;
+            }
+
+            .model-response {
+                background-color: var(--dokkiCSS-embedded-auxiliary-color) !important;
+                border: none !important;
+            }
+
+            .model-response .dokki-area {
+                background-color: transparent !important;
+                padding: 0.25rem !important;
+                padding-top: 0 !important;
+            }
+
+            .dokki-area {
+                max-height: 55vh;
+            }
+        </style>
+    </head>
+    <body>
+        <ths-feedback></ths-feedback>
+        <template dokki-document>
+            <section title>
+                Briefly evaluating QwQ Preview
+            </section>
+            <section widgets>
+                <blog-post-widgets/>
+            </section>
+            <section content>
+                <article src="content.md"></article>
+            </section>
+        </template>
+    </body>
+</html>
diff --git a/blog/briefly-evaluating-qwq-preview/rend-o.png b/blog/briefly-evaluating-qwq-preview/rend-o.png
diff --git a/blog/briefly-evaluating-qwq-preview/rend-qc.png b/blog/briefly-evaluating-qwq-preview/rend-qc.png
diff --git a/blog/briefly-evaluating-qwq-preview/rend-qw.png b/blog/briefly-evaluating-qwq-preview/rend-qw.png
diff --git a/blog/briefly-evaluating-qwq-preview/rngon-qc.html b/blog/briefly-evaluating-qwq-preview/rngon-qc.html
@@ -0,0 +1,110 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Rotating Cube</title>
+</head>
+<body>
+    <canvas id="canvas" width="800" height="600"></canvas>
+    <script src="http://localhost:8000/retro-ngon/distributable/rngon.global.js"></script>
+    <script>
+// Define the vertices of the cube
+const vertices = [
+    Rngon.vertex(-1, -1, 1),
+    Rngon.vertex(1, -1, 1),
+    Rngon.vertex(1, 1, 1),
+    Rngon.vertex(-1, 1, 1),
+
+    Rngon.vertex(-1, -1, -1),
+    Rngon.vertex(1, -1, -1),
+    Rngon.vertex(1, 1, -1),
+    Rngon.vertex(-1, 1, -1)
+];
+
+// Define the faces of the cube with different colors
+const cubeFaces = [
+    // Front face (red)
+    Rngon.ngon([vertices[0], vertices[1], vertices[2], vertices[3]], {
+        color: Rngon.color.red,
+        hasWireframe: true,
+        wireframeColor: Rngon.color.black
+    }),
+
+    // Back face (green)
+    Rngon.ngon([vertices[4], vertices[5], vertices[6], vertices[7]], {
+        color: Rngon.color.green,
+        hasWireframe: true,
+        wireframeColor: Rngon.color.black
+    }),
+
+    // Left face (blue)
+    Rngon.ngon([vertices[0], vertices[3], vertices[7], vertices[4]], {
+        color: Rngon.color.blue,
+        hasWireframe: true,
+        wireframeColor: Rngon.color.black
+    }),
+
+    // Right face (yellow)
+    Rngon.ngon([vertices[1], vertices[2], vertices[6], vertices[5]], {
+        color: Rngon.color.yellow,
+        hasWireframe: true,
+        wireframeColor: Rngon.color.black
+    }),
+
+    // Top face (magenta)
+    Rngon.ngon([vertices[3], vertices[2], vertices[6], vertices[7]], {
+        color: Rngon.color.magenta,
+        hasWireframe: true,
+        wireframeColor: Rngon.color.black
+    }),
+
+    // Bottom face (cyan)
+    Rngon.ngon([vertices[0], vertices[1], vertices[5], vertices[4]], {
+        color: Rngon.color.cyan,
+        hasWireframe: true,
+        wireframeColor: Rngon.color.black
+    })
+];
+
+// Create a mesh from the cube faces
+const cubeMesh = Rngon.mesh(cubeFaces);
+
+let rotationAngle = 0;
+
+function renderFrame() {
+    // Rotate the cube mesh
+    rotationAngle += 1;
+    const rotateXMatrix = Rngon.matrix.rotating(rotationAngle, 0, 0);
+    const rotateYMatrix = Rngon.matrix.rotating(0, rotationAngle * 0.5, 0);
+
+    // Apply the rotations to each vertex in the mesh
+    for (const ngon of cubeMesh.ngons) {
+        for (const vertex of ngon.vertices) {
+            Rngon.vector.transform(vertex, rotateXMatrix);
+            Rngon.vector.transform(vertex, rotateYMatrix);
+        }
+        // Recalculate normals if necessary (not needed for this simple example)
+    }
+
+    // Render the cube mesh
+    Rngon.render({
+        target: "canvas",
+        meshes: [cubeMesh],
+        options: {
+            cameraPosition: Rngon.vector(0, 0, -5),
+            resolution: { width: 800, height: 600 },
+            useBackfaceCulling: true
+        }
+    });
+
+    // Request the next animation frame
+    requestAnimationFrame(renderFrame);
+}
+
+// Start rendering
+renderFrame();
+
+</script>
+</body>
+</html>
+
diff --git a/blog/briefly-evaluating-qwq-preview/rngon-qw.html b/blog/briefly-evaluating-qwq-preview/rngon-qw.html
@@ -0,0 +1,68 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Rotating Cube</title>
+</head>
+<body>
+    <canvas id="renderCanvas" width="640" height="480"></canvas>
+    <script src="http://localhost:8000/retro-ngon/distributable/rngon.global.js"></script>
+    <script>
+    // Define vertices
+const vertices = [
+    Rngon.vertex(-1, -1, 1), // Front bottom left
+    Rngon.vertex(1, -1, 1),  // Front bottom right
+    Rngon.vertex(1, 1, 1),   // Front top right
+    Rngon.vertex(-1, 1, 1),  // Front top left
+    Rngon.vertex(-1, -1, -1),// Back bottom left
+    Rngon.vertex(1, -1, -1), // Back bottom right
+    Rngon.vertex(1, 1, -1),  // Back top right
+    Rngon.vertex(-1, 1, -1)  // Back top left
+];
+
+// Define materials for each face
+const frontMaterial = { color: Rngon.color.red };
+const backMaterial = { color: Rngon.color.blue };
+const topMaterial = { color: Rngon.color.yellow };
+const bottomMaterial = { color: Rngon.color.green };
+const leftMaterial = { color: Rngon.color.magenta };
+const rightMaterial = { color: Rngon.color.cyan };
+
+// Define quads for each face
+const frontQuad = Rngon.ngon([vertices[0], vertices[1], vertices[2], vertices[3]], frontMaterial);
+const backQuad = Rngon.ngon([vertices[4], vertices[5], vertices[6], vertices[7]], backMaterial);
+const topQuad = Rngon.ngon([vertices[3], vertices[2], vertices[6], vertices[7]], topMaterial);
+const bottomQuad = Rngon.ngon([vertices[0], vertices[1], vertices[5], vertices[4]], bottomMaterial);
+const leftQuad = Rngon.ngon([vertices[0], vertices[4], vertices[7], vertices[3]], leftMaterial);
+const rightQuad = Rngon.ngon([vertices[1], vertices[5], vertices[6], vertices[2]], rightMaterial);
+
+// Create mesh
+const cubeMesh = Rngon.mesh([frontQuad, backQuad, topQuad, bottomQuad, leftQuad, rightQuad]);
+
+function animate() {
+    // Calculate the current rotation angle based on time
+    const angle = performance.now() / 1000 * 90; // Rotate 90 degrees per second
+
+    // Apply rotation to the mesh
+    cubeMesh.rotate = Rngon.vector(angle, angle, 0);
+
+    // Render the scene
+    Rngon.render({
+        target: "renderCanvas",
+        meshes: [cubeMesh],
+        options: {
+            cameraPosition: Rngon.vector(0, 0, -5),
+            useBackfaceCulling: true,
+        },
+    });
+
+    // Request the next frame
+    requestAnimationFrame(animate);
+}
+
+// Start the animation loop
+animate();
+</script>
+</body>
+</html>
+
diff --git a/blog/briefly-evaluating-qwq-preview/rngon-s35.html b/blog/briefly-evaluating-qwq-preview/rngon-s35.html
@@ -0,0 +1,89 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Rotating Cube</title>
+</head>
+<body>
+    <canvas id="renderCanvas" width="640" height="480"></canvas>
+    <script src="http://localhost:8000/retro-ngon/distributable/rngon.global.js"></script>
+    <script>
+// Create vertices for a cube
+const vertices = [
+    // Front face vertices
+    Rngon.vertex(-1, -1,  1),
+    Rngon.vertex( 1, -1,  1),
+    Rngon.vertex( 1,  1,  1),
+    Rngon.vertex(-1,  1,  1),
+
+    // Back face vertices  
+    Rngon.vertex(-1, -1, -1),
+    Rngon.vertex( 1, -1, -1),
+    Rngon.vertex( 1,  1, -1),
+    Rngon.vertex(-1,  1, -1),
+];
+
+// Create faces with different colors
+const faces = [
+    // Front face (red)
+    Rngon.ngon([vertices[0], vertices[1], vertices[2], vertices[3]], {
+        color: Rngon.color(255, 0, 0),
+    }),
+
+    // Back face (green)
+    Rngon.ngon([vertices[5], vertices[4], vertices[7], vertices[6]], {
+        color: Rngon.color(0, 255, 0),
+    }),
+
+    // Top face (blue)
+    Rngon.ngon([vertices[3], vertices[2], vertices[6], vertices[7]], {
+        color: Rngon.color(0, 0, 255),
+    }),
+
+    // Bottom face (yellow)
+    Rngon.ngon([vertices[4], vertices[5], vertices[1], vertices[0]], {
+        color: Rngon.color(255, 255, 0),
+    }),
+
+    // Right face (magenta)
+    Rngon.ngon([vertices[1], vertices[5], vertices[6], vertices[2]], {
+        color: Rngon.color(255, 0, 255),
+    }),
+
+    // Left face (cyan)
+    Rngon.ngon([vertices[4], vertices[0], vertices[3], vertices[7]], {
+        color: Rngon.color(0, 255, 255),
+    }),
+];
+
+let rotation = 0;
+
+function animate() {
+    // Create a mesh with the current rotation
+    const mesh = Rngon.mesh(faces, {
+        rotate: Rngon.vector(rotation, rotation, 0),
+    });
+
+    // Render the scene
+    Rngon.render({
+        target: "renderCanvas",
+        meshes: [mesh],
+        options: {
+            cameraPosition: Rngon.vector(0, 0, -5),
+            useBackfaceCulling: true,
+        },
+    });
+
+    // Increment rotation for next frame
+    rotation += 1;
+
+    // Request next animation frame
+    requestAnimationFrame(animate);
+}
+
+// Start the animation
+animate();
+</script>
+</body>
+</html>
+