diff --git a/src/build.tsx b/src/build.tsx
index 9619d5a..9233918 100644
--- a/src/build.tsx
+++ b/src/build.tsx
@@ -23,7 +23,8 @@ const S3 = new S3Client({
},
});
-let items: string[] = [];
+let images: string[] = [];
+let videos: string[] = [];
async function listAllObjects(bucketName: string, prefix: string) {
let isTruncated: boolean = true;
@@ -41,8 +42,10 @@ async function listAllObjects(bucketName: string, prefix: string) {
response.Contents.forEach((item) => {
if (item.Key != undefined) {
const ext = item.Key.split(".")[item.Key.split(".").length - 1];
- if (["png", "jpg", "mp4", "jpeg"].includes(ext.toLowerCase())) {
- items.push(item.Key);
+ if (["png", "jpg", "jpeg"].includes(ext.toLowerCase())) {
+ images.push(item.Key);
+ } else if (["mp4"].includes(ext.toLowerCase())) {
+ videos.push(item.Key);
}
}
});
@@ -56,42 +59,77 @@ if (!fs.existsSync(".cache")) fs.mkdirSync(".cache");
if (!fs.existsSync(".cache/objects.json")) {
log.info("Listing all objects in S3 bucket . . .");
await listAllObjects(process.env.BUCKET as string, "red_panda");
- fs.writeFileSync(".cache/objects.json", JSON.stringify({ items }));
- log.info(`Total: ${items.length}`);
+ fs.writeFileSync(".cache/objects.json", JSON.stringify({ images, videos }));
+ log.info(
+ `Total: ${images.length + videos.length} | ${images.length} Images | ${
+ videos.length
+ } Videos`
+ );
} else {
log.info("Using S3 Bucket cache . . .");
- items = JSON.parse(
- fs.readFileSync(".cache/objects.json", { encoding: "utf-8" })
- )["items"];
- log.info(`Total: ${items.length}`);
+ const _cacheFile = fs.readFileSync(".cache/objects.json", {
+ encoding: "utf-8",
+ });
+ images = JSON.parse(_cacheFile)["images"];
+ videos = JSON.parse(_cacheFile)["videos"];
+ log.info(
+ `Total: ${images.length + videos.length} | ${images.length} Images | ${
+ videos.length
+ } Videos`
+ );
+}
+
+if (!fs.existsSync("out/data")) fs.mkdirSync("out/data");
+if (!fs.existsSync("out/data/images.json")) {
+ fs.writeFileSync("out/data/images.json", JSON.stringify(images));
+}
+if (!fs.existsSync("out/data/videos.json")) {
+ fs.writeFileSync("out/data/videos.json", JSON.stringify(videos));
}
import { renderToString } from "react-dom/server";
+import IndexPage from "./templates/index";
import fs from "fs";
-function App(props: {}) {
- return (
-
-
-
- {environment == "dev" ? (
-
- ) : (
- ""
- )}
- Bun Render Test
-
-
- {[1, 2, 3, 4, 5, 6, 7, 8, 9].map((el) => (
-
- ))}
-
-
- );
-}
-let html = renderToString();
+// function App(props: {}) {
+// return (
+//
+//
+//
+// {environment == "dev" ? (
+//
+// ) : (
+// ""
+// )}
+// Bun Render Test
+//
+//
+// {[1, 2, 3, 4, 5, 6, 7, 8, 9].map((el) => (
+//
+//
{el}
+//
{el * 2}
+//
+// ))}
+//
+//
+// );
+// }
+let html = renderToString(
+
+);
fs.cpSync("src/static", "out/static", { recursive: true });
if (environment == "dev") {
diff --git a/src/static/functions.js b/src/static/functions.js
new file mode 100644
index 0000000..8e5d448
--- /dev/null
+++ b/src/static/functions.js
@@ -0,0 +1,37 @@
+async function get(url) {
+ const res = await fetch(url);
+ if (!res.ok) {
+ throw new Error(`Failed to fetch ${url}`);
+ }
+ return await res.json();
+}
+
+function random_five(type) {
+ let _selection = [];
+ let result = [];
+
+ if (type == "images") {
+ _selection = images;
+ } else if (type == "videos") {
+ _selection = videos;
+ } else {
+ console.error(`WRONG TYPE (${type})! @ function random_five!`);
+ }
+
+ const max = _selection.length - 1;
+
+ for (let i = 0; i < 4; i++) {
+ result.push(_selection[Math.floor(Math.random() * max)]);
+ }
+
+ return result;
+}
+
+// async function FetchData() {
+// let images = await get("./data/images.json");
+// let videos = await get("./data/videos.json");
+// console.log(images, videos);
+// }
+// window.onload = () => {
+// FetchData();
+// }
diff --git a/src/static/tailwind.css b/src/static/tailwind.css
index 4b5823c..7c4a924 100644
--- a/src/static/tailwind.css
+++ b/src/static/tailwind.css
@@ -585,6 +585,9 @@
outline-style: var(--tw-outline-style);
outline-width: 1px;
}
+ .filter {
+ filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
+ }
}
@keyframes spin {
to {
@@ -647,3 +650,39 @@
inherits: false;
initial-value: solid;
}
+@property --tw-blur {
+ syntax: "*";
+ inherits: false;
+}
+@property --tw-brightness {
+ syntax: "*";
+ inherits: false;
+}
+@property --tw-contrast {
+ syntax: "*";
+ inherits: false;
+}
+@property --tw-grayscale {
+ syntax: "*";
+ inherits: false;
+}
+@property --tw-hue-rotate {
+ syntax: "*";
+ inherits: false;
+}
+@property --tw-invert {
+ syntax: "*";
+ inherits: false;
+}
+@property --tw-opacity {
+ syntax: "*";
+ inherits: false;
+}
+@property --tw-saturate {
+ syntax: "*";
+ inherits: false;
+}
+@property --tw-sepia {
+ syntax: "*";
+ inherits: false;
+}
diff --git a/src/templates/Components/Head.tsx b/src/templates/Components/Head.tsx
new file mode 100644
index 0000000..273553e
--- /dev/null
+++ b/src/templates/Components/Head.tsx
@@ -0,0 +1,40 @@
+export default function head(props: {
+ title: string;
+ description: string;
+ image: string;
+ path: string;
+ url: string;
+ environment: "prod" | "dev";
+ preload?: string[];
+ dns?: string[];
+}) {
+ const mimetype = `image/${
+ props.image.split(".")[props.image.split(".").length - 1]
+ }`;
+
+ return (
+
+
+
+ {props.title}
+
+
+
+
+
+
+
+
+
+ {props.preload ? props.preload.map((item) => ) : ""}
+ {props.dns ? props.dns.map((item) => ) : ""}
+ {/* */}
+ {props.environment == "dev" ? (
+
+ ) : (
+ ""
+ )}
+ {/* */}
+
+ );
+}
diff --git a/src/templates/index.tsx b/src/templates/index.tsx
index e69de29..f524c3e 100644
--- a/src/templates/index.tsx
+++ b/src/templates/index.tsx
@@ -0,0 +1,26 @@
+import Head from "./Components/Head";
+export default function Index(props: {
+ environment: "prod" | "dev";
+ title: string;
+ head: {
+ description: string;
+ image: string;
+ path: string;
+ url: string;
+ preload?: string[];
+ dns?: string[];
+ };
+}) {
+ return (
+
+
+ nothing yet . . .
+
+
+ );
+}