From ee9c54af61acbc1849beae00484f33100bb901f4 Mon Sep 17 00:00:00 2001 From: lifegpc Date: Fri, 26 May 2023 13:31:28 +0800 Subject: [PATCH] Update --- components/StyleSheet.tsx | 2 +- deno.lock | 24 ++++++++++++++ fetch_static_files.ts | 6 +++- fresh.gen.ts | 6 ++-- islands/Container.tsx | 70 +++++++++++++++++++++++++++++++++++++++ islands/Menu.tsx | 36 -------------------- islands/Settings.tsx | 15 +++++++++ routes/index.tsx | 4 +-- static/common.css | 12 +++++++ 9 files changed, 133 insertions(+), 42 deletions(-) create mode 100644 islands/Container.tsx delete mode 100644 islands/Menu.tsx create mode 100644 islands/Settings.tsx create mode 100644 static/common.css diff --git a/components/StyleSheet.tsx b/components/StyleSheet.tsx index 23a00ff..5b7dfd7 100644 --- a/components/StyleSheet.tsx +++ b/components/StyleSheet.tsx @@ -1,5 +1,5 @@ import { asset } from "$fresh/runtime.ts"; -import { Component, ContextType, RenderableProps } from "preact"; +import { Component, ContextType } from "preact"; import { GlobalCtx } from "./GlobalContext.tsx"; export type StyleSheetType = { diff --git a/deno.lock b/deno.lock index 260ad25..6b6e1f0 100644 --- a/deno.lock +++ b/deno.lock @@ -194,6 +194,8 @@ "https://deno.land/x/zipjs@v2.7.14/lib/z-worker-inline.js": "df83d91413a2e79f76924f39f26f59e6efbe8f5487d3a91b7e92b6d64236927c", "https://deno.land/x/zipjs@v2.7.14/lib/zip-fs.js": "a733360302f5fbec9cc01543cb9fcfe7bae3f35a50d0006626ce42fe8183b63f", "https://esm.sh/*preact-render-to-string@5.2.6": "88ec8d8706b6a3f1e0fdad3862a2690dcd9b350d87bdc8e7bd0e27fbc0f7d29e", + "https://esm.sh/preact-material-components@1.6.1/Icon": "e15153f88485e448a8d5ee9d1399205717b41d9cb72bd5824c3b42e1dc463cf6", + "https://esm.sh/preact-material-components@1.6.1/List": "5eefaedd7a0f66843c1a1de658f4058b6fc1bbdcd0af1ec627c0f9412f4510c5", "https://esm.sh/preact-material-components@1.6.1/TopAppBar": "e418485020aecb866d9cc44216cd52c5ac1ff120bd1ad422b318428c274b3474", "https://esm.sh/preact@10.13.1": "ae382301328ab874e2c42bee76e261bb8d094673fe76ca7eb71917636d43d8ad", "https://esm.sh/preact@10.13.1/hooks": "1813f80c6d648f8137a62569e35972b0716f92539f192d6db66d45b7aafea43a", @@ -202,6 +204,7 @@ "https://esm.sh/stable/preact@10.13.1/deno/jsx-runtime.js": "7c8e1b8f272996846cbac0837dcb71f6f8cfc82611b3f7819501d07c37383dc0", "https://esm.sh/stable/preact@10.13.1/deno/preact.mjs": "9b73545225d0ed274c89f39aee524a2857c81a73060e80c2c4bdc2a6de7bec26", "https://esm.sh/stable/preact@10.14.1/deno/preact.mjs": "f51b1a99f29fa9879d70dc283bb8f42ce9beef99aa93dd6ca969f297e101e964", + "https://esm.sh/stable/preact@10.15.0/deno/preact.mjs": "a5ce3f9331d537fb190ea0655f77fb1923e606799fb63bf7964c8ce6bd253baf", "https://esm.sh/twind@0.16.19": "e6db0352eb940ca8cdbf129fe4520809916d002b8ccc2e2fc7f8551138f7a161", "https://esm.sh/twind@0.16.19/sheets": "3472c3c28394aa25c026ff81a393361e71aca014b3b8db5d6c67396e60f87cc9", "https://esm.sh/v118/preact@10.13.1/hooks/src/index.d.ts": "5c29febb624fc25d71cb0e125848c9b711e233337a08f7eacfade38fd4c14cc3", @@ -210,6 +213,8 @@ "https://esm.sh/v118/preact@10.13.1/src/jsx.d.ts": "fde41cfb4944bcc5005e653c989ef8f85deb1cbb5364a1726654993937cd08d0", "https://esm.sh/v118/preact@10.14.1/src/index.d.ts": "65398710de6aa0a07412da79784e05e6e96763f51c7c91b77344d2d0af06385c", "https://esm.sh/v118/preact@10.14.1/src/jsx.d.ts": "de467cd980f79a13bf3026146afed7173a3634e7d6415d349184663c67174c0c", + "https://esm.sh/v118/preact@10.15.0/src/index.d.ts": "65398710de6aa0a07412da79784e05e6e96763f51c7c91b77344d2d0af06385c", + "https://esm.sh/v118/preact@10.15.0/src/jsx.d.ts": "1b91f662e58a27ec1af166842ac814c8665404d3789a76ff1e3248f009a29de6", "https://esm.sh/v122/@babel/runtime@7.21.5/deno/helpers/classCallCheck.js": "678d4a1fc837f06947628e73a957e1f017fe30c77e8500008ec9a5977563c4f9", "https://esm.sh/v122/@babel/runtime@7.21.5/deno/helpers/createClass.js": "4205e44f1238343af0a0e0ebc92cfb043382600f54c3e53aa4e6801c9bec7a44", "https://esm.sh/v122/@babel/runtime@7.21.5/deno/helpers/get.js": "2021a8fa9d0d4880ece83c1d93266ac1d7414430f4f4671691a336ef3aa25dbe", @@ -230,10 +235,29 @@ "https://esm.sh/v122/bind-decorator@1.0.11/deno/bind-decorator.mjs": "21a126bdebaca6e38120139d903c3485c4f57e15487646666e79c1b5c15d0e44", "https://esm.sh/v122/preact-material-components@1.6.1/Base/MaterialComponent.d.ts": "af619a28f2d2f76113e29e952308a2ce46577438f7ed40531458b880ff9a141f", "https://esm.sh/v122/preact-material-components@1.6.1/Base/types.d.ts": "4ec93636595145b9c5cdd628111f28e66148821c23c8ef6273f84bb84a6b8eb8", + "https://esm.sh/v122/preact-material-components@1.6.1/List/index.d.ts": "b4159279b6622abbf057385c2b155875dc7e80bdd4403def72d1c0cf58324c73", "https://esm.sh/v122/preact-material-components@1.6.1/TopAppBar/index.d.ts": "d921bd9336541339b0fff19e0769cea149b798bc172d261a7b7a1595f6b90266", "https://esm.sh/v122/preact-material-components@1.6.1/deno/Base/MaterialComponent.js": "7dca052dee2ab5010232055eac4a3159c8455e9b2857870525f7002cb50160bd", + "https://esm.sh/v122/preact-material-components@1.6.1/deno/Icon.js": "44e17e354a08a2421fffcca3493efa60cc92e2357d410ed387e40f5d34da0ee2", + "https://esm.sh/v122/preact-material-components@1.6.1/deno/List.js": "6e908d2bac752351683097bcc22ea26d8e46009c60bc3cee2312728af2f60776", "https://esm.sh/v122/preact-material-components@1.6.1/deno/TopAppBar.js": "ab7ec4fa168d7867961b9fd818e10d138ffb075c20ea4b11f6d231318d897145", + "https://esm.sh/v124/@babel/runtime@7.21.5/deno/helpers/classCallCheck.js": "678d4a1fc837f06947628e73a957e1f017fe30c77e8500008ec9a5977563c4f9", + "https://esm.sh/v124/@babel/runtime@7.21.5/deno/helpers/createClass.js": "4205e44f1238343af0a0e0ebc92cfb043382600f54c3e53aa4e6801c9bec7a44", + "https://esm.sh/v124/@babel/runtime@7.21.5/deno/helpers/getPrototypeOf.js": "41e694838de6926a04a013646f2b3915afa24a57a9301f3e226eadc78fa32e76", + "https://esm.sh/v124/@babel/runtime@7.21.5/deno/helpers/inherits.js": "09429b866edd8b9dd67dab992f9ad8865c19e15ffecde5ff632e4929755e2807", + "https://esm.sh/v124/@babel/runtime@7.21.5/deno/helpers/interopRequireDefault.js": "273ebefd452416883e9e517a620b46197b732a9ee384dfcb2ef33f731b7293d4", + "https://esm.sh/v124/@babel/runtime@7.21.5/deno/helpers/possibleConstructorReturn.js": "c48587b6a4194dac1f823e4706c67a286187cec9f29d35aac06df940443baa51", + "https://esm.sh/v124/@babel/runtime@7.21.5/deno/helpers/typeof.js": "ea8e5723c88f83ac7cfbb5728d38e20449f7387093b2825e6c8c81fdc50a7f32", + "https://esm.sh/v124/@material/base@0.39.0/deno/component.js": "aca74f4f0a80339f5bbba649c24b374ded56762679ea161a3db9563de595cec2", + "https://esm.sh/v124/@material/base@0.39.0/deno/foundation.js": "4edd0737b3601305ffe599556e98e4861542210744da83af19194c8c4f50c0e0", + "https://esm.sh/v124/@material/ripple@0.39.3/deno/ripple.mjs": "df299ee5ebdca82a60414bd942f39bd08eddb47071b7e8e1bcb2ae87f73f2c94", + "https://esm.sh/v124/bind-decorator@1.0.11/deno/bind-decorator.mjs": "21a126bdebaca6e38120139d903c3485c4f57e15487646666e79c1b5c15d0e44", "https://esm.sh/v124/csstype@3.1.2/index.d.ts": "4c68749a564a6facdf675416d75789ee5a557afda8960e0803cf6711fa569288", + "https://esm.sh/v124/preact-material-components@1.6.1/Base/MaterialComponent.d.ts": "2ea7a1ffbff6c43619f3f85d69a9e9a3c62575f409fc93ad651f6906adba47d0", + "https://esm.sh/v124/preact-material-components@1.6.1/Base/types.d.ts": "4ec93636595145b9c5cdd628111f28e66148821c23c8ef6273f84bb84a6b8eb8", + "https://esm.sh/v124/preact-material-components@1.6.1/Icon/index.d.ts": "b2c27c8b912f07f20025951d9d05b2e4fb07c773d43db567b930e59b1c444f1c", + "https://esm.sh/v124/preact-material-components@1.6.1/deno/Base/MaterialComponent.js": "a1ec4698c20561f82924708a3d728cdd4ba2c8b3cd895fe3b060c17911528c5c", + "https://esm.sh/v124/preact-material-components@1.6.1/deno/Icon.js": "9d5ff5fb97a2a4005cf7bb2091e716ca77f920363c68c84108f1dc5e77bb7b7d", "https://esm.sh/v124/preact-render-to-string@5.2.6/X-ZS8q/deno/preact-render-to-string.mjs": "672116885c5e5072207c527a0ec663f5bc52774a0868ec487985109520382a55", "https://esm.sh/v124/preact-render-to-string@5.2.6/X-ZS8q/src/index.d.ts": "b1d73703252c8570fdf2952475805f5808ba3511fefbd93a3e7bd8406de7dcd0", "https://esm.sh/v124/style-vendorizer@2.2.3/deno/style-vendorizer.mjs": "fb725497dd9621a84f552f9b6a4f3df82af5989ff18c40e972de1bdf475c9765", diff --git a/fetch_static_files.ts b/fetch_static_files.ts index c5228a2..a87084d 100644 --- a/fetch_static_files.ts +++ b/fetch_static_files.ts @@ -2,7 +2,11 @@ import { dirname, join } from "std/path/mod.ts"; import { sure_dir } from "./utils.ts"; const map = JSON.parse(await Deno.readTextFile("./import_map.json")).imports; -const LIST: string[] = ["preact-material-components/TopAppBar/style.css"]; +const LIST: string[] = [ + "preact-material-components/TopAppBar/style.css", + "preact-material-components/List/style.css", + "preact-material-components/Icon/style.css", +]; function get_url(i: string) { for (const v of Object.getOwnPropertyNames(map)) { diff --git a/fresh.gen.ts b/fresh.gen.ts index 1ae7d47..a3aeae2 100644 --- a/fresh.gen.ts +++ b/fresh.gen.ts @@ -5,7 +5,8 @@ import config from "./deno.json" assert { type: "json" }; import * as $0 from "./routes/api/task/list.ts"; import * as $1 from "./routes/index.tsx"; -import * as $$0 from "./islands/Menu.tsx"; +import * as $$0 from "./islands/Container.tsx"; +import * as $$1 from "./islands/Settings.tsx"; const manifest = { routes: { @@ -13,7 +14,8 @@ const manifest = { "./routes/index.tsx": $1, }, islands: { - "./islands/Menu.tsx": $$0, + "./islands/Container.tsx": $$0, + "./islands/Settings.tsx": $$1, }, baseUrl: import.meta.url, config, diff --git a/islands/Container.tsx b/islands/Container.tsx new file mode 100644 index 0000000..f4742e5 --- /dev/null +++ b/islands/Container.tsx @@ -0,0 +1,70 @@ +import { Head } from "$fresh/runtime.ts"; +import { Component, ContextType } from "preact"; +import { useState } from "preact/hooks"; +import Icon from "preact-material-components/Icon"; +import List from "preact-material-components/List"; +import TopAppBar from "preact-material-components/TopAppBar"; +import StyleSheet from "../components/StyleSheet.tsx"; +import { GlobalCtx } from "../components/GlobalContext.tsx"; +import Settings from "./Settings.tsx"; + +export default class Container extends Component { + static contextType = GlobalCtx; + declare context: ContextType; + render() { + const [display, set_display] = useState(false); + const [show_settings, set_show_settings] = useState(false); + const close_all = () => { + set_display(false); + set_show_settings(false); + }; + return ( +
+ + + + + + + + + + set_display(true)}> + + + menu + + EH Downloader + + + + more_vert + + + + + set_display(false)}> + close + + + home + + { + close_all(); + set_show_settings(true); + }} + > + settings + + +
+ +
+
+ ); + } +} diff --git a/islands/Menu.tsx b/islands/Menu.tsx deleted file mode 100644 index 67f39a8..0000000 --- a/islands/Menu.tsx +++ /dev/null @@ -1,36 +0,0 @@ -import { Head } from "$fresh/runtime.ts"; -import { Component } from "preact"; -import { ContextType } from "preact"; -import TopAppBar from "preact-material-components/TopAppBar"; -import StyleSheet from "../components/StyleSheet.tsx"; -import { GlobalCtx } from "../components/GlobalContext.tsx"; - -export default class Menu extends Component { - static contextType = GlobalCtx; - declare context: ContextType; - render() { - return ( -
- - - - - - - {}}> - - - menu - - EH Downloader - - - - more_vert - - - -
- ); - } -} diff --git a/islands/Settings.tsx b/islands/Settings.tsx new file mode 100644 index 0000000..2e14246 --- /dev/null +++ b/islands/Settings.tsx @@ -0,0 +1,15 @@ +import { Component, ContextType } from "preact"; +import { GlobalCtx } from "../components/GlobalContext.tsx"; + +export type SettingsProps = { + show: boolean; +}; + +export default class Settings extends Component { + static contextType = GlobalCtx; + declare context: ContextType; + render() { + if (!this.props.show) return; + return
Settings
; + } +} diff --git a/routes/index.tsx b/routes/index.tsx index c3ddc41..b88de1f 100644 --- a/routes/index.tsx +++ b/routes/index.tsx @@ -1,6 +1,6 @@ import { Head } from "$fresh/runtime.ts"; import GlobalContext from "../components/GlobalContext.tsx"; -import Menu from "../islands/Menu.tsx"; +import Container from "../islands/Container.tsx"; export default function Index() { return ( @@ -9,7 +9,7 @@ export default function Index() { EH Downloader - + ); diff --git a/static/common.css b/static/common.css new file mode 100644 index 0000000..252f469 --- /dev/null +++ b/static/common.css @@ -0,0 +1,12 @@ +.nav-menu { + z-index: 100; + position: fixed; + background-color: white; + box-sizing: border-box; + display: none; +} + +.main { + position: fixed; + top: 64px; +}