embedded star

iShape-Rust · Sep 24, 2024 · b1549d8 · b1549d8
1 parent 4c47cb6
commit b1549d8
Show file tree

Hide file tree

Showing 33 changed files with 535 additions and 179 deletions.
diff --git a/docs-gen/src/embedded/star.html b/docs-gen/src/embedded/star.html
@@ -0,0 +1,171 @@
+<!DOCTYPE HTML>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8">
+        <title>Star</title>
+        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500&display=swap" rel="stylesheet">
+        <style>
+        body {
+            font-family: 'Roboto', sans-serif;
+        }
+
+        .sheet-container {
+            max-width: 1000px;
+            margin: auto;
+        }
+
+        .rotating-stars-input-container {
+            display: flex;
+            justify-content: center;
+            margin-bottom: 20px;
+        }
+
+        .star-input-container {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            margin: 10px;
+        }
+
+        .star-input-group {
+            display: flex;
+            justify-content: flex-start;
+            align-items: center;
+            margin-bottom: 10px;
+        }
+
+        .star-input-group label {
+            flex: none;
+            width: 150px;
+            white-space: nowrap;
+            text-align: right;
+            margin-right: 20px;
+            font-weight: 500;
+        }
+
+        .star-input-group input {
+            flex: none;
+            width: 150px;
+            font-family: 'Roboto', sans-serif;
+        }
+
+        #starCanvas {
+            display: block;
+            margin: 20px auto;
+        }
+
+        .operation-selection {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            margin-bottom: 10px;
+            margin-top: 20px;
+            font-size: 20px;
+        }
+
+        .operation-selection label {
+            flex: none;
+            width: 150px;
+            white-space: nowrap;
+            text-align: right;
+            margin-right: 20px;
+            font-size: 20px;
+            font-weight: 500;
+        }
+
+        .operation-selection select {
+            -webkit-appearance: none;
+            padding-left: 4px;
+            flex: none;
+            width: 150px;
+            font-size: 20px;
+            font-family: 'Roboto', sans-serif;
+        }
+        </style>
+    </head>
+    <body>
+        <div class="sheet-container">
+            <script type="text/javascript">
+                // in different environments the path is different
+                const paths = [
+                  '../js/overlay/stars.js',
+                  './js/overlay/stars.js',
+                  '/js/overlay/stars.js'
+                ];
+                async function fileExists(path) {
+                  try {
+                    const response = await fetch(path, { method: 'HEAD' });
+                    return response.ok;
+                  } catch (e) {
+                    return false;
+                  }
+                }
+                (async () => {
+                  for (const path of paths) {
+                    if (await fileExists(path)) {
+                      const script = document.createElement('script');
+                      script.type = 'module';
+                      script.src = path;
+                      script.defer = true;
+                      document.head.appendChild(script);
+                      break;
+                    }
+                  }
+                })();
+            </script>
+            <div class="rotating-stars-input-container">
+                <div class="star-input-container">
+                    <h3 id="subject-star" class="title">Subject Star</h3>
+                    <div class="star-input-group">
+                        <label for="subjFirstRadius">First Radius: </label>
+                        <input type="range" id="subjFirstRadius" min="10" max="100" value="60">
+                    </div>
+                    <div class="star-input-group">
+                        <label for="subjSecondRadius">Second Radius: </label>
+                        <input type="range" id="subjSecondRadius" min="10" max="100" value="30">
+                    </div>
+                    <div class="star-input-group">
+                        <label for="subjRotationSpeed">Rotation Speed: </label>
+                        <input type="range" id="subjRotationSpeed" min="1" max="100" value="5">
+                    </div>
+                    <div class="star-input-group">
+                        <label for="subjAngleCount">Corners Count: </label>
+                        <input type="range" id="subjAngleCount" min="3" max="24" value="7">
+                    </div>
+                </div>
+                <div class="star-input-container">
+                    <h3 id="clip-star" class="title">Clip Star</h3>
+                    <div class="star-input-group">
+                        <label for="clipFirstRadius">First Radius: </label>
+                        <input type="range" id="clipFirstRadius" min="10" max="100" value="60">
+                    </div>
+                    <div class="star-input-group">
+                        <label for="clipSecondRadius">Second Radius: </label>
+                        <input type="range" id="clipSecondRadius" min="10" max="100" value="30">
+                    </div>
+                    <div class="star-input-group">
+                        <label for="clipRotationSpeed">Rotation Speed: </label>
+                        <input type="range" id="clipRotationSpeed" min="1" max="100" value="5">
+                    </div>
+                    <div class="star-input-group">
+                        <label for="clipAngleCount">Corners Count: </label>
+                        <input type="range" id="clipAngleCount" min="3" max="24" value="7">
+                    </div>
+                </div>
+            </div>
+            <div class="operation-selection">
+                <label for="operationType">Operation: </label>
+                <select id="operationType">
+                    <option value="Xor">Xor</option>
+                    <option value="Union">Union</option>
+                    <option value="Intersect">Intersect</option>
+                    <option value="Difference">Difference</option>
+                    <option value="InverseDifference">InverseDifference</option>
+                    <option value="Subject">Subject</option>
+                    <option value="Clip">Clip</option>
+                </select>
+            </div>
+            <canvas id="starCanvas" width="750" height="750"></canvas>
+        </div>
+    </body>
+</html>
diff --git a/docs-gen/src/overlay/extract/define_contour.svg b/docs-gen/src/overlay/extract/define_contour.svg
diff --git a/docs-gen/src/overlay/extract/define_shape.svg b/docs-gen/src/overlay/extract/define_shape.svg
diff --git a/docs-gen/src/overlay/extract/extract_outer_contour.svg b/docs-gen/src/overlay/extract/extract_outer_contour.svg
diff --git a/docs-gen/src/overlay/extract/matching_contours.svg b/docs-gen/src/overlay/extract/matching_contours.svg
diff --git a/docs-gen/src/overlay/extract/segment_under_point.svg b/docs-gen/src/overlay/extract/segment_under_point.svg
diff --git a/docs-gen/src/overlay/extract/segment_under_segment_a.svg b/docs-gen/src/overlay/extract/segment_under_segment_a.svg
diff --git a/docs-gen/src/overlay/extract/segment_under_segment_ab.svg b/docs-gen/src/overlay/extract/segment_under_segment_ab.svg
diff --git a/docs-gen/src/overlay/extract/segment_under_segment_b.svg b/docs-gen/src/overlay/extract/segment_under_segment_b.svg