Updated packages

README.md

@@ -6,8 +6,9 @@
 
 * JavaScript、TypeScript、Vue
 * Nuxt
-* node npm
+* node, npm
 * sqlite
+* typedoc, eslint, prettier
 
 ## コンテンツの管理
 
@@ -21,8 +22,13 @@
 git clone https://git.kenryu.us/kenryuS/sera-new-hp.git # レポジトリをクローン
 cd sera-new-hp # 移動して
 npm install # 依存パッケージのインストール
+
 npm run dev # デベロッパーモードでサーバーを起動
 npm run generate # 静的サイトを生成
+
+npm run lint # 静的解析ツール eslint を実行
+npm run format # prettier を使用してソースコードを整形
+npm run documentation # typedoc でドキュメンテーションを生成
 ```
 
 ## 便利・重要なファイル/フォルダ

components/DropDown.vue

@@ -59,8 +59,8 @@ const handleFocusOutEvent = () => {
         >
             {{ property.label }}
         </button>
-        <Transition name="dropdown-fade">
-            <div class="dropdown-item-list" v-if="isOpen">
+        <div class="dropdown-item-list-wrapper">
+            <div class="dropdown-item-list" :class="{ 'show-list': isOpen }">
                 <ul>
                     <li
                         v-for="entry in property.entries"
@@ -70,7 +70,7 @@ const handleFocusOutEvent = () => {
                     </li>
                 </ul>
             </div>
-        </Transition>
+        </div>
     </div>
 </template>
 
@@ -86,25 +86,27 @@ const handleFocusOutEvent = () => {
 }
 
 .dropdown-menu {
-    display: inline-block;
-    width: fit-content;
-    position: relative;
+    display: inline-flex;
+    flex-direction: column;
 }
 
 .dropdown-label {
     background: none;
-    width: fit-content;
+    width: 100%;
     padding: 1rem 2rem;
-    border: transparent solid 3px;
+    border-top: currentColor solid 3px;
+    border-inline: transparent solid 3px;
+    border-bottom: transparent solid 3px;
     font-size: 1em;
     font-weight: bold;
     color: var(--neptune1);
+    transition: 0.2s linear;
 }
 
 .dropdown-label:hover {
     cursor: pointer;
     color: var(--andromeda);
-    border-top: currentColor solid 3px;
+    border: currentColor solid 3px;
     transition: 0.2s linear;
 }
 
@@ -123,24 +125,35 @@ const handleFocusOutEvent = () => {
     }
 }
 
+.dropdown-item-list-wrapper {
+    height: 0;
+}
+
 .dropdown-item-list {
     display: block;
     background: var(--neptune1);
     color: var(--starlight);
     font-weight: bold;
-    position: absolute;
-    top: auto;
+    position: relative;
     z-index: 100;
-    min-width: 100%;
+    visibility: hidden;
+    opacity: 0;
+    transition: all 0.2s ease;
     width: fit-content;
+    min-width: 9rem;
     text-wrap: nowrap;
+    line-height: 2.125rem;
     & ul {
         list-style: none;
         padding: 0 0.25rem;
+        margin-top: 0;
+        margin-bottom: 0;
+        padding-top: 1rem;
+        padding-bottom: 1rem;
+        padding-inline: 0.5rem;
     }
     & ul li {
         margin: 0.5rem 0;
-        transition: 0.2s linear;
     }
     & ul li:first-child {
         margin-top: 0;
@@ -160,4 +173,10 @@ const handleFocusOutEvent = () => {
         text-decoration-thickness: 2px;
     }
 }
+
+.show-list {
+    visibility: visible;
+    opacity: 1;
+    transition: all 0.2s ease;
+}
 </style>

components/LinkCard.vue

@@ -1,111 +1,133 @@
 <script setup lang="ts">
 import type { LinkCardProperty } from "~/utils/types/linkCard";
 const property = defineProps<LinkCardProperty>();
-const doesNotHaveImage = ref<boolean>(property.imagePath === undefined);
+const { backgroundImageStyles } = useBackgroundImageOptimization();
+const imagePath =
+    property.imagePath === undefined || property.imagePath === ""
+        ? "/sera-logo-text.svg"
+        : (property.imagePath as string);
+const optimizeImage = (backgroundImagePath: string) => {
+    backgroundImageStyles.value = backgroundImagePath;
+    return backgroundImageStyles.value;
+};
 </script>
 
 <template>
-    <NuxtLink :to="property.link" :class="{ withoutImage: doesNotHaveImage }">
-        <div
-            class="image"
-            v-if="property.imagePath"
-            :style="{ backgroundImage: `url(${property.imagePath})` }"
-        ></div>
-        <h2>{{ property.title }}</h2>
-        <p>{{ property.description }}</p>
-    </NuxtLink>
+    <div class="card-wrapper">
+        <NuxtLink :to="property.link" class="card">
+            <div class="image">
+                <div :style="optimizeImage(imagePath)"></div>
+            </div>
+            <div class="texts">
+                <h2>{{ property.title }}</h2>
+                <p>{{ property.description }}</p>
+            </div>
+        </NuxtLink>
+    </div>
 </template>
 
 <style scoped>
-a {
+.card-wrapper {
+    container: link-card / inline-size;
+}
+
+@property --minimum-card-width {
+    syntax: "<length>";
+    inherits: false;
+    initial-value: 320px;
+}
+
+@property --minimum-card-height {
+    syntax: "<length>";
+    inherits: false;
+    initial-value: 16rem;
+}
+
+@property --card-padding-inline {
+    syntax: "<length>";
+    inherits: false;
+    initial-value: 1rem;
+}
+
+@property --card-padding-vertical {
+    syntax: "<length>";
+    inherits: false;
+    initial-value: 0.75rem;
+}
+
+.card {
     display: grid;
-    width: 25rem;
-    height: clamp(10rem, 15vh, max(30rem, fit-content));
-    grid: 2fr 1fr 1.5fr / 1fr;
-    background-color: var(--starlight);
-    border-radius: 1rem;
-    text-decoration: none;
-    transition: scale 0.2s ease-in-out;
-}
-
-a:hover {
-    scale: 105%;
-    transition: scale 0.2s ease-in-out;
-}
-
-a > * {
-    margin: 0 2rem;
-}
-
-.withoutImage {
-    grid: 1fr 1.5fr / 1fr;
-}
-
-.image {
-    background-repeat: no-repeat;
-    background-position: center;
-    background-size: cover;
-    width: 18rem;
-    height: 12rem;
-    margin-top: 1.75rem;
-    margin-bottom: 0.75rem;
-    place-self: center;
-}
-
-h2 {
     position: relative;
-    color: var(--neptune1);
-    background-color: var(--starlight5);
+    grid-template-areas: "image texts";
     border-radius: 1rem;
-    margin: 0.75rem 2rem;
-    padding: 1rem 1.75rem;
-    align-self: center;
-    line-height: 2rem;
-    font-size: clamp(16pt, 3vw, 20pt);
-}
-
-h2::after {
-    display: block;
-    content: "";
-    position: absolute;
-    width: 7px;
-    height: max(2rem, 60%);
-    top: 50%;
-    left: 0.75rem;
-    transform: translateY(-50%);
-    background-color: var(--neptune1);
-    border-radius: 3px;
-}
-
-p {
-    color: var(--deep-space);
-    margin: 0 2rem;
-}
-
-@media screen and (max-width: 1024px) {
-    a {
-        width: 20rem;
-    }
-    a > * {
-        margin: unset 0.25rem;
-    }
-    .image {
-        width: 16rem;
-        height: 10rem;
+    box-shadow: 10px 5px 5px var(--starlight1);
+    background-color: var(--starlight);
+    min-width: calc(var(--minimum-card-width) - 2 * var(--card-padding-inline));
+    min-height: calc(
+        var(--minimum-card-height) - 2 * var(--card-padding-vertical)
+    );
+    padding: var(--card-padding-vertical) var(--card-padding-inline);
+    transition: all 0.3s ease-in-out;
+    text-decoration: none;
+    aspect-ratio: 5 / 2;
+    &:hover {
+        scale: 105%;
+        transition: all 0.3s ease-in-out;
     }
 }
 
-@media screen and (max-width: 640px) {
-    a {
-        width: 16rem;
+.card > .image {
+    grid-area: image;
+    min-width: 128px;
+    width: 30cqw;
+    align-content: center;
+    & > div {
+        aspect-ratio: 1 / 1;
+        background: inherit;
+        background-repeat: no-repeat;
+        background-position: center;
+        background-attachment: local;
+        background-size: cover;
+        border-radius: 1rem;
+        margin-inline: 0.75rem;
     }
-    a > * {
-        margin: unset 0.75rem;
+}
+
+.card > .texts {
+    grid-area: texts;
+    margin-inline: 0.75rem;
+    height: 50cqw;
+    width: 60cqw;
+    & > h2 {
+        color: var(--ocean-blue);
+        height: 15cqw;
+        margin-bottom: 0;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        align-content: center;
     }
-    .image {
-        width: 12rem;
-        height: 8rem;
-        margin-top: 0.75rem;
+    & > p {
+        color: var(--deep-space);
+        height: 25cqw;
+        margin-top: 0;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+}
+
+@container link-card (width < 28rem) {
+    .card {
+        padding: 0.5rem 0;
+    }
+    .card > .image {
+        min-width: 96px;
+    }
+    .card > .texts > p {
+        height: 75px;
+        display: -webkit-box;
+        -webkit-line-clamp: 3;
+        -webkit-box-orient: vertical;
     }
 }
 </style>

components/LinksGrid.vue

@@ -0,0 +1,59 @@
+<script lang="ts" setup>
+import type { LinksGridProperty } from "~/utils/types/linksGrid";
+const property = defineProps<LinksGridProperty>();
+</script>
+
+<template>
+    <div class="links-grid">
+        <ul>
+            <li
+                v-for="entry in property.links"
+                :key="property.links.indexOf(entry)"
+            >
+                <LinkCard
+                    :title="entry.title"
+                    :description="entry.description"
+                    :link="entry.link"
+                    :image-path="entry.imagePath"
+                />
+            </li>
+        </ul>
+    </div>
+</template>
+
+<style scoped>
+.links-grid {
+    container: links-grid / inline-size;
+    width: 100%;
+    min-width: 320px;
+}
+
+@property --links-grid-gap {
+    syntax: "<length>";
+    inherits: false;
+    initial-value: 30px;
+}
+
+ul {
+    list-style: none;
+    display: grid;
+    gap: var(--links-grid-gap);
+    grid-template-columns: repeat(2, 1fr);
+    padding-left: 0;
+    place-items: center;
+    & > li {
+        width: 100%;
+        min-width: 16rem;
+        height: 100%;
+    }
+}
+
+@container links-grid (width < 36rem) {
+    ul {
+        grid-template-columns: 1fr;
+    }
+    ul > li {
+        width: 100%;
+    }
+}
+</style>

components/NewsCard.vue

@@ -1,9 +1,24 @@
 <script setup lang="ts">
 import type { NewsCardProperty } from "~/utils/types/newsCard";
+import DOMPurify from "isomorphic-dompurify";
 import { marked } from "marked";
 
+const { backgroundImageStyles } = useBackgroundImageOptimization();
+const optimizeImage = (backgroundImagePath: string) => {
+    backgroundImageStyles.value = backgroundImagePath;
+    return backgroundImageStyles.value;
+};
+
 const property = defineProps<NewsCardProperty>();
 
+const newsTypeText = ref<string>(
+    property.newsEntry.entryType === EntryType.Article ? "記事" : "お知らせ"
+);
+
+const isArticle = computed(() => {
+    return property.newsEntry.entryType === EntryType.Article;
+});
+
 const datePosted = new Date(
     property.newsEntry.date as number
 ).toLocaleDateString("ja-JP", { dateStyle: "medium" });
@@ -16,41 +31,32 @@ const coverImagePath = ref<string>(
 </script>
 
 <template>
-    <div
-        class="news-card"
-        :style="{ backgroundImage: `url(${coverImagePath})` }"
-    >
+    <div class="news-card" :style="optimizeImage(coverImagePath)">
         <NuxtLink
             class="card-content"
-            :to="property.newsEntry.linkPath"
-            v-if="
-                property.newsEntry.linkPath !== null &&
-                property.newsEntry.entryType === EntryType.Article
-            "
+            v-bind:data-type="property.newsEntry.entryType"
+            :to="property.newsEntry.linkPath || ''"
         >
-            <p class="news-type article">記事</p>
+            <p
+                class="news-type"
+                :class="{ article: isArticle, tweet: !isArticle }"
+            >
+                {{ newsTypeText }}
+            </p>
             <p class="new" v-if="property.isNew">NEW!</p>
             <div class="content">
                 <article
                     v-html="
-                        marked.parse(property.newsEntry.cardContent as string)
+                        DOMPurify.sanitize(
+                            marked.parse(
+                                property.newsEntry.cardContent as string
+                            ) as string
+                        )
                     "
                 ></article>
             </div>
             <small>{{ datePosted }}</small>
         </NuxtLink>
-        <div class="card-content" v-else>
-            <p class="news-type tweet">お知らせ</p>
-            <p class="new" v-if="property.isNew">NEW!</p>
-            <div class="content">
-                <article
-                    v-html="
-                        marked.parse(property.newsEntry.cardContent as string)
-                    "
-                ></article>
-            </div>
-            <small>{{ datePosted }}</small>
-        </div>
     </div>
 </template>
 
@@ -66,6 +72,12 @@ const coverImagePath = ref<string>(
     background-position: center;
     background-attachment: local;
     background-size: cover;
+    transition: all 0.3s ease-in-out;
+    &:has(a[data-type="0"]):hover {
+        scale: 105%;
+        filter: grayscale(25%);
+        transition: all 0.3s ease-in-out;
+    }
 }
 
 .card-content {
@@ -78,36 +90,31 @@ const coverImagePath = ref<string>(
     right: 0;
     width: 100%;
     height: 100%;
-    background-color: rgba(255, 255, 255, 0.15);
+    background-color: rgba(255, 255, 255, 0.1);
     backdrop-filter: blur(5px) brightness(55%);
     color: var(--starlight);
     text-decoration: none;
 }
 
-.card-content .content {
+.card-content > .content {
     font-size: larger;
     font-weight: 400;
     margin-top: 2.75rem;
 }
 
-.card-content article,
-.card-content img {
+.content > article {
     margin: 0 1rem;
 }
 
-.card-content img {
-    margin-top: 3rem;
-    width: 10rem;
-    height: auto;
-    padding: 0.25rem;
-    margin-left: 1.75rem;
+.content > article :deep(a) {
+    font-weight: 600;
+    color: var(--neptune2);
+    &:visited {
+        color: var(--neptune2);
+    }
 }
 
-.card-content img[src="/sera-logo-text.svg"] {
-    background-color: var(--starlight);
-}
-
-.card-content .news-type {
+.card-content > .news-type {
     position: absolute;
     margin: 0;
     padding-top: 0.25rem;
@@ -119,17 +126,17 @@ const coverImagePath = ref<string>(
     border-bottom-right-radius: 1rem;
 }
 
-.card-content .tweet {
+.card-content > .tweet {
     background-color: var(--venus2);
     color: var(--venus1);
 }
 
-.card-content .article {
+.card-content > .article {
     background-color: var(--venus1);
     color: var(--astronaut);
 }
 
-.card-content .new {
+.card-content > .new {
     position: absolute;
     margin: 0;
     right: 0;
@@ -144,7 +151,7 @@ const coverImagePath = ref<string>(
     border-bottom-left-radius: 1rem;
 }
 
-.card-content small {
+.card-content > small {
     position: absolute;
     bottom: 0;
     right: 0;

components/PageTop.vue

@@ -2,10 +2,13 @@
 import type { PageTopProperty } from "~/utils/types/pageTop";
 
 const property = defineProps<PageTopProperty>();
+const backgroundImageOptimizer = useBackgroundImageOptimization();
+
+backgroundImageOptimizer.backgroundImageStyles.value = property.imagePath;
 </script>
 
 <template>
-    <div :style="{ backgroundImage: `url(${property.imagePath})` }">
+    <div :style="backgroundImageOptimizer.backgroundImageStyles.value">
         {{ property.text }}
     </div>
 </template>

components/Slide.vue

@@ -1,8 +1,16 @@
 <script setup lang="ts">
 import type { SlideProperty, SlideEntry } from "~/utils/types/slide.ts";
 
+import DOMPurify from "isomorphic-dompurify";
+import { marked } from "marked";
+
 const property = defineProps<SlideProperty>();
-const { viewPortOrientation } = useWindowDimensions();
+const { backgroundImageStyles } = useBackgroundImageOptimization();
+
+const optimizeImage = (backgroundImagePath: string) => {
+    backgroundImageStyles.value = backgroundImagePath;
+    return backgroundImageStyles.value;
+};
 
 const UnitREM = 16;
 const fourREM = 4 * UnitREM;
@@ -169,15 +177,20 @@ onUnmounted(() => {
                 <li
                     v-for="(entry, index) in property.entries"
                     :key="index"
-                    :style="{
-                        backgroundImage: `url('${entry.imagePath}')`,
-                    }"
+                    :style="optimizeImage(entry.imagePath)"
                     v-show="currentSlide === index"
                     class="slide"
                 >
                     <div class="content">
                         <h1>{{ entry.title }}</h1>
-                        <p>{{ entry.content }}</p>
+                        <div
+                            class="rendered-paragraph"
+                            v-html="
+                                DOMPurify.sanitize(
+                                    marked.parse(entry.content) as string
+                                )
+                            "
+                        ></div>
                         <NuxtLink :to="entry.link" v-if="entry.link">
                             詳しくはコチラ
                         </NuxtLink>
@@ -192,7 +205,7 @@ onUnmounted(() => {
                 class="preview"
                 @click="handelClick(entry)"
             >
-                <img :src="entry.imagePath" alt="slide image preview" />
+                <NuxtImg :src="entry.imagePath" alt="slide image preview" />
                 <svg
                     width="72"
                     height="72"
@@ -257,14 +270,25 @@ ul {
         text-align: center;
         color: var(--starlight);
     }
-    & > p {
+    & > :deep(.rendered-paragraph) p {
         height: 3rem;
+        margin: 0;
         justify-self: center;
         color: var(--starlight);
         font-size: clamp(14pt, 1.5cqw, 24pt);
         font-weight: 600;
         text-align: center;
     }
+    & > :deep(.rendered-paragraph) a {
+        color: var(--neptune2);
+        &:visited {
+            color: var(--neptune2);
+        }
+    }
+    & > .rendered-paragraph {
+        height: 3rem;
+        margin: 1.5rem 0;
+    }
     & > a {
         width: fit-content;
         border: var(--starlight) 3px solid;
@@ -328,6 +352,7 @@ ul {
     scale: 90%;
     &:hover {
         cursor: pointer;
+        scale: 1.01;
     }
     & svg {
         position: absolute;
@@ -374,9 +399,4 @@ ul {
         margin: calc(1rem / 16) 0;
     }
 }
-
-.portrait-controler {
-    flex-direction: column;
-    right: 0rem;
-}
 </style>

components/TheFooter.vue

@@ -52,6 +52,12 @@ const showThePast = (event: Event) => {
                                 <li>
                                     <NuxtLink to="/news"> News </NuxtLink>
                                 </li>
+                                <li>
+                                    <NuxtLink to="/contact">
+                                        Contact
+                                        {{ SiteInfo.clubNameAbbreviation }}
+                                    </NuxtLink>
+                                </li>
                             </ul>
                         </li>
                         <li>

components/TheHeader.vue

@@ -20,6 +20,15 @@ const mediaDropDownEntries: Array<DropDownEntry> = [
     { text: "Gallery", link: "/about/gallery" },
 ];
 
+const informationDropDownEntries: Array<DropDownEntry> = [
+    { text: `About ${SiteInfo.clubNameAbbreviation}`, link: "/about/sera" },
+    {
+        text: "中学生・新入生向け",
+        link: "/about/for-middle-schoolers-and-new-comers",
+    },
+    { text: "Contact", link: "/contact" },
+];
+
 const hamburgerMenuEntries: Array<DropDownEntry> = [
     { text: "Home", link: "/" },
     { text: "News", link: "/news" },
@@ -35,6 +44,7 @@ const hamburgerMenuEntries: Array<DropDownEntry> = [
         text: "中学生・新入生向け",
         link: "/about/for-middle-schoolers-and-new-comers",
     },
+    { text: "Contact SERA", link: "/contact" },
 ];
 </script>
 
@@ -47,7 +57,7 @@ const hamburgerMenuEntries: Array<DropDownEntry> = [
                     :mode="DropDownMode.onClick"
                     :alignment="DropDownAlignment.Left"
                     :entries="exploreDropDownEntries"
-                    class="left-dropdown"
+                    class="explore-dropdown"
                 />
             </div>
             <div id="logo-link">
@@ -56,12 +66,19 @@ const hamburgerMenuEntries: Array<DropDownEntry> = [
                 </NuxtLink>
             </div>
             <div id="header-right">
+                <DropDown
+                    label="Info"
+                    :mode="DropDownMode.onClick"
+                    :alignment="DropDownAlignment.Right"
+                    :entries="informationDropDownEntries"
+                    class="info-dropdown"
+                />
                 <DropDown
                     label="Media"
                     :mode="DropDownMode.onClick"
                     :alignment="DropDownAlignment.Right"
                     :entries="mediaDropDownEntries"
-                    class="right-dropdown"
+                    class="media-dropdown"
                 />
                 <HamburgerMenu
                     :entries="hamburgerMenuEntries"
@@ -97,6 +114,9 @@ header {
 #header-left,
 #header-right {
     display: flex;
+    & > * {
+        margin-inline: 0.25rem;
+    }
 }
 
 #header-left {
@@ -140,8 +160,9 @@ header {
         padding-inline: 1rem;
         width: calc(100% - 2rem);
     }
-    .left-dropdown,
-    .right-dropdown {
+    .explore-dropdown,
+    .info-dropdown,
+    .media-dropdown {
         display: none;
     }
 }

composables/backgroundImageOptimization.ts

@@ -0,0 +1,30 @@
+/**
+ * Vue Composable for optimizing image used in background-image.
+ * @module composables/backgroundImageOptimization
+ */
+
+/**
+ * Vue Composable for optimizing background-image with Nuxt Image
+ * @returns { WritableComputedRef<{ backgroundImage: string}, string>} writable computed value that will return the Vue style object with optimized image URL
+ */
+function useBackgroundImageOptimization() {
+    const targetImage = ref("");
+
+    const img = useImage();
+    const backgroundImageStyles = computed({
+        get: () => {
+            const imageURL = img(targetImage.value, {
+                format: "webp",
+                quality: 80,
+            });
+            return { backgroundImage: `url("${imageURL}")` };
+        },
+        set: (value: string) => {
+            targetImage.value = value;
+        },
+    });
+
+    return { backgroundImageStyles };
+}
+
+export { useBackgroundImageOptimization };

composables/windowDimensions.ts

@@ -13,9 +13,13 @@ const mobileMaxWidth = 640;
  * @enum {number}
  */
 const enum ViewPortType {
+    // width > 1024
     DESKTOP,
+    // 1024 >= width > 960
     LARGE_TABLET,
+    // 960 >= width > 640
     MEDIUM_TABLET,
+    // 640 >= width
     MOBILE,
 }
 

docs/assets/navigation.js

@@ -1 +1 @@
-window.navigationData = "data:application/octet-stream;base64,H4sIAAAAAAAAA61XXU/bMBT9L3lG+0CDbbx1dGNIlHWA4AFNlZu4rVXHzhxHpZv473NMvuz448IQD0jNOeeec++1m97/TSR+kMlJggqSHCTphtBMYJac3HdP1lhOhCQpxQpQILlRn+U8qygu3yrWon/+ZiNzqkBbwrLk5NAtl+EVqqjstVYVSyXhbKTWIE3V4w+Pvx4PHOYuSCljBmvM65rUikCjZ4hSLPbnOVrj0mvVQL2SWVMTaPeG5P6J1w9fyZyW8nsaukp5XvASLanun6tcmQpO6VRNBbHUYX+gsDCxoDRVia89FfpcgRojfnAIO/Uh301Vf1hZK4fj2GhQoFuCd3Mu5A9BMJOoDtBXwazKIzUcfLPup0GeFnyzL/CLqtREv7xq7p23Y+7xjCo5NCI7WUlCfduIyj1Lp0iiJSody6ipCwMEGprBuOK78lSd7yVKt9+akH0pqTrmLhQVsay8+/zx/dHhILghcMtJ9t8uXCLPcnGFUeYaeTy/Io7m7ClyJ4h0nvtoFc2MXLsMCyTxNeYzLJFvZSwYaGm80nYAWzxYzPKvB+05DJngxZTvmC+U5i5aFCjTtAFPKFkzdV6lfas4lUcs/5XSQmc8G91YQe2aEJf9yqTY97qESSxWKPW1xKBZDTo6dujP1X8s5AtKtMxxFWNdn94rrBiusQ6RoNGeOaU99g31M38py/4G5ctKrLGYqYmG/RtQUIDvQwZ4EGYdp0Y4EyVse4pEFo7TokBJLhowOESnbjPD1hneOV5xhsI1AmRZD9/1mjFS65D+09q86p+zFY9G15oDQuiUXiosbL+1agePdzG+AC0K1M3LBgxegE7dZoatF+rnyQ0vws4bEMj4/AkL9t1qW7yYa7at/lTu35+megcEuu/wz0jQ13Dww0l+T1g2+cIfwjFaFCjDzwYMDtCp28yw9ZIS9YUrI/eHRi0k7A65rsGw89np9pzQwdcocEdM8VA79N8/BzihttMRAAA="
+window.navigationData = "data:application/octet-stream;base64,H4sIAAAAAAAAA61Y207bMBh+l1yjHdBgG3eFbh0SBQYILtBUuYnbWnXszHFUysS747g52bGdvwxxgdR8R/92mvTxXyTxk4xOIpSR6CCKV4QmArPo5LG5ssRyJCSJKVaADMmV+izlSUFx/lGxZu31DyuZUgVaE5ZEJ4duuQQvUEFlq7UoWCwJZz21CmmqHn95+fNy4Ah3QXI5FLDEvG9IrQgMOkGUYrE9T9ES596oBuqdwpqawLh3JPVPvLz4TuG0lD9TN1XM04znaE71+rns5iheLwUvWKLLXmWSpOQZlYb9Lh25WYAI6lnk+BTi3daHuoeVg1PMY8EpHas9iljsGGY3gomFdr71OLhrWh49frDMRn3IN2O1W1heKofr2GhQoXuCN9dcyCtBMJPW5DAr0gEPB9/0/dbpU4Pvthl+k0tJ9MurxX3wrph7PD0nh8bACS0kob6zifIti8dIojnKHZtRU2cGCDQ0g3HDN/mZutuVB+pnVbK1kmrF3EaDIlaUT9+/fj467BQ3BO45Sf47hUtkrxQ3GCWukQ/3V8TenD0mD4JI57kfdNHMgS8hhgWS+BbzKZbIt2UsGGjTeKXtArZ40MzKrwftOQyJ4NmYbxzfSjtfzZ3VKFCncQUeUbJk6rxK+67iVO6x/LeUGjrlSe+OFdQuCcOyP5gU21aXMInFAsW+JTFo1gIdHTv0r9V/LOQbLGpm38XYrrunLKuGa6xdJGi0E6e0J76hPvFbWfFXKJ0XYonFVE00nN+Aggr86jLAgzB9nBrhTpSw9RkSSbhOjQI1uajA4BKNus0cjp5PBAFk1zBweI3eK/1Ov8cN52d443hE60qXCFBqvXldj0k9tQbpv9tUL27nbMEHy2vNDiF0l7lUWNj51KoNfHgVhzdwjQKt5mUFBm+BRt1mhqNn6k3ljmfh5BUIFPx6hwXnrrUt3lBqti6eC/evCaZ6AwSmb/B7NGg9HPxwk78jloxO+VO4Ro0CdfhdgcEFGnWbGY6eU5J43xB2yhoCCn1bImEncyfaEkLnXaPAC9FRDi2B/nsFPG2JMJUTAAA="

docs/enums/composables_windowDimensions.ViewPortOrientation.html

@@ -1,4 +1,4 @@
 <!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>ViewPortOrientation | sera-hp</title><meta name="description" content="Documentation for sera-hp"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">sera-hp</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">sera-hp</a></li><li><a href="../modules/composables_windowDimensions.html">composables/windowDimensions</a></li><li><a href="composables_windowDimensions.ViewPortOrientation.html">ViewPortOrientation</a></li></ul><h1>Enumeration ViewPortOrientation<code class="tsd-tag">Const</code> <code class="tsd-tag">Readonly</code></h1></div><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography"><p>Enums for viewport orientation</p>
-</div><div class="tsd-comment tsd-typography"></div></section><aside class="tsd-sources"><ul><li>Defined in composables/windowDimensions.ts:27</li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><details class="tsd-index-content tsd-accordion" open><summary class="tsd-accordion-summary tsd-index-summary"><h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex="0"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-chevronSmall"></use></svg> Index</h5></summary><div class="tsd-accordion-details"><section class="tsd-index-section"><h3 class="tsd-index-heading">Enumeration Members</h3><div class="tsd-index-list"><a href="composables_windowDimensions.ViewPortOrientation.html#LANDSCAPE" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-16"></use></svg><span>LANDSCAPE</span></a>
+</div><div class="tsd-comment tsd-typography"></div></section><aside class="tsd-sources"><ul><li>Defined in composables/windowDimensions.ts:31</li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><details class="tsd-index-content tsd-accordion" open><summary class="tsd-accordion-summary tsd-index-summary"><h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex="0"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-chevronSmall"></use></svg> Index</h5></summary><div class="tsd-accordion-details"><section class="tsd-index-section"><h3 class="tsd-index-heading">Enumeration Members</h3><div class="tsd-index-list"><a href="composables_windowDimensions.ViewPortOrientation.html#LANDSCAPE" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-16"></use></svg><span>LANDSCAPE</span></a>
 <a href="composables_windowDimensions.ViewPortOrientation.html#PORTRAIT" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-16"></use></svg><span>PORTRAIT</span></a>
-</div></section></div></details></section></section><details class="tsd-panel-group tsd-member-group tsd-accordion" open><summary class="tsd-accordion-summary" data-key="section-Enumeration Members"><h2><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg> Enumeration Members</h2></summary><section><section class="tsd-panel tsd-member"><a id="LANDSCAPE" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>LANDSCAPE</span><a href="#LANDSCAPE" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-enum-member">LANDSCAPE</span></div><aside class="tsd-sources"><ul><li>Defined in composables/windowDimensions.ts:28</li></ul></aside></section><section class="tsd-panel tsd-member"><a id="PORTRAIT" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>PORTRAIT</span><a href="#PORTRAIT" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-enum-member">PORTRAIT</span></div><aside class="tsd-sources"><ul><li>Defined in composables/windowDimensions.ts:29</li></ul></aside></section></section></details></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>On This Page</h3></summary><div class="tsd-accordion-details"><details open class="tsd-accordion tsd-page-navigation-section"><summary class="tsd-accordion-summary" data-key="tsd-otp-Enumeration Members"><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Enumeration Members</summary><div><a href="#LANDSCAPE" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-16"></use></svg><span>LANDSCAPE</span></a><a href="#PORTRAIT" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-16"></use></svg><span>PORTRAIT</span></a></div></details></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>sera-hp</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
+</div></section></div></details></section></section><details class="tsd-panel-group tsd-member-group tsd-accordion" open><summary class="tsd-accordion-summary" data-key="section-Enumeration Members"><h2><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg> Enumeration Members</h2></summary><section><section class="tsd-panel tsd-member"><a id="LANDSCAPE" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>LANDSCAPE</span><a href="#LANDSCAPE" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-enum-member">LANDSCAPE</span></div><aside class="tsd-sources"><ul><li>Defined in composables/windowDimensions.ts:32</li></ul></aside></section><section class="tsd-panel tsd-member"><a id="PORTRAIT" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>PORTRAIT</span><a href="#PORTRAIT" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-enum-member">PORTRAIT</span></div><aside class="tsd-sources"><ul><li>Defined in composables/windowDimensions.ts:33</li></ul></aside></section></section></details></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>On This Page</h3></summary><div class="tsd-accordion-details"><details open class="tsd-accordion tsd-page-navigation-section"><summary class="tsd-accordion-summary" data-key="tsd-otp-Enumeration Members"><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Enumeration Members</summary><div><a href="#LANDSCAPE" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-16"></use></svg><span>LANDSCAPE</span></a><a href="#PORTRAIT" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-16"></use></svg><span>PORTRAIT</span></a></div></details></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>sera-hp</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>

docs/functions/composables_backgroundImageOptimization.useBackgroundImageOptimization.html

@@ -0,0 +1,3 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>useBackgroundImageOptimization | sera-hp</title><meta name="description" content="Documentation for sera-hp"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">sera-hp</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">sera-hp</a></li><li><a href="../modules/composables_backgroundImageOptimization.html">composables/backgroundImageOptimization</a></li><li><a href="composables_backgroundImageOptimization.useBackgroundImageOptimization.html">useBackgroundImageOptimization</a></li></ul><h1>Function useBackgroundImageOptimization</h1></div><section class="tsd-panel"><ul class="tsd-signatures"><li class="tsd-signature tsd-anchor-link"><a id="useBackgroundImageOptimization" class="tsd-anchor"></a><span class="tsd-kind-call-signature">use<wbr/>Background<wbr/>Image<wbr/>Optimization</span><span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-symbol">{ </span><br/><span>    </span><span class="tsd-kind-property">backgroundImageStyles</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">WritableComputedRef</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-symbol">{ </span><br/><span>        </span><span class="tsd-kind-property">backgroundImage</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><span class="tsd-signature-symbol">}</span><span class="tsd-signature-symbol">, </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">&gt;</span><span class="tsd-signature-symbol">; </span><br/><span class="tsd-signature-symbol">}</span><a href="#useBackgroundImageOptimization" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></li><li class="tsd-description"><div class="tsd-comment tsd-typography"><p>Vue Composable for optimizing background-image with Nuxt Image</p>
+</div><h4 class="tsd-returns-title">Returns <span class="tsd-signature-symbol">{ </span><br/><span>    </span><span class="tsd-kind-property">backgroundImageStyles</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">WritableComputedRef</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-symbol">{ </span><br/><span>        </span><span class="tsd-kind-property">backgroundImage</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><span class="tsd-signature-symbol">}</span><span class="tsd-signature-symbol">, </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">&gt;</span><span class="tsd-signature-symbol">; </span><br/><span class="tsd-signature-symbol">}</span></h4><p>writable computed value that will return the Vue style object with optimized image URL</p>
+<ul class="tsd-parameters"><li class="tsd-parameter"><h5><span class="tsd-kind-property">background<wbr/>Image<wbr/>Styles</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">WritableComputedRef</span><span class="tsd-signature-symbol">&lt;</span><span class="tsd-signature-symbol">{ </span><br/><span>    </span><span class="tsd-kind-property">backgroundImage</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span class="tsd-signature-symbol">}</span><span class="tsd-signature-symbol">, </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">&gt;</span></h5></li></ul><div class="tsd-comment tsd-typography"></div><aside class="tsd-sources"><ul><li>Defined in composables/backgroundImageOptimization.ts:10</li></ul></aside></li></ul></section></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>sera-hp</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>

docs/functions/utils_asyncDatabase.asyncDatabaseWrite.html

@@ -6,4 +6,4 @@
 </div><div class="tsd-comment tsd-typography"></div></li><li><span><span class="tsd-kind-parameter">sqlQuery</span>: <span class="tsd-signature-type">string</span></span><div class="tsd-comment tsd-typography"><p>SQL query to execute</p>
 </div><div class="tsd-comment tsd-typography"></div></li><li><span><span class="tsd-kind-parameter">callback</span>: <a href="../types/utils_asyncDatabase.asyncDatabaseVoidCallbackFunction.html" class="tsd-signature-type tsd-kind-type-alias">asyncDatabaseVoidCallbackFunction</a></span><div class="tsd-comment tsd-typography"><p>callback to perform after the operation</p>
 </div><div class="tsd-comment tsd-typography"></div></li></ul></div><h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">Promise</span><span class="tsd-signature-symbol">&lt;</span><a class="tsd-signature-type tsd-kind-type-parameter" href="utils_asyncDatabase.asyncDatabaseWrite.html#asyncDatabaseWrite.Type">Type</a><span class="tsd-signature-symbol">&gt;</span></h4><p>Promise for database operation</p>
-<div class="tsd-comment tsd-typography"></div><aside class="tsd-sources"><ul><li>Defined in utils/asyncDatabase.ts:54</li></ul></aside></li></ul></section></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>sera-hp</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>
+<div class="tsd-comment tsd-typography"></div><aside class="tsd-sources"><ul><li>Defined in utils/asyncDatabase.ts:56</li></ul></aside></li></ul></section></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>sera-hp</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>

docs/index.html

@@ -2,14 +2,15 @@
 <a id="md:使用言語、ライブラリー、フレームワーク、ツール" class="tsd-anchor"></a><h2 class="tsd-anchor-link">使用言語、ライブラリー、フレームワーク、ツール<a href="#md:使用言語、ライブラリー、フレームワーク、ツール" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><ul>
 <li>JavaScript、TypeScript、Vue</li>
 <li>Nuxt</li>
-<li>node npm</li>
+<li>node, npm</li>
 <li>sqlite</li>
+<li>typedoc, eslint, prettier</li>
 </ul>
 <a id="md:コンテンツの管理" class="tsd-anchor"></a><h2 class="tsd-anchor-link">コンテンツの管理<a href="#md:コンテンツの管理" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><p>ニュース等のコンテンツの管理は<code>src-manager/</code>内の<code>README.md</code>を参照すること</p>
 <a id="md:開発を開始する" class="tsd-anchor"></a><h2 class="tsd-anchor-link">開発を開始する<a href="#md:開発を開始する" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><blockquote>
 <p>初めてこのプロジェクトに参加する際には<code>CONTRIBUTING.md</code>を<em><strong>必ず</strong></em>読んでおくこと</p>
 </blockquote>
-<pre><code class="bash"><span class="hl-0">git</span><span class="hl-1"> </span><span class="hl-2">clone</span><span class="hl-1"> </span><span class="hl-2">https://git.kenryu.us/kenryuS/sera-new-hp.git</span><span class="hl-1"> </span><span class="hl-3"># レポジトリをクローン</span><br/><span class="hl-0">cd</span><span class="hl-1"> </span><span class="hl-2">sera-new-hp</span><span class="hl-1"> </span><span class="hl-3"># 移動して</span><br/><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">install</span><span class="hl-1"> </span><span class="hl-3"># 依存パッケージのインストール</span><br/><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">run</span><span class="hl-1"> </span><span class="hl-2">dev</span><span class="hl-1"> </span><span class="hl-3"># デベロッパーモードでサーバーを起動</span><br/><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">run</span><span class="hl-1"> </span><span class="hl-2">generate</span><span class="hl-1"> </span><span class="hl-3"># 静的サイトを生成</span>
+<pre><code class="bash"><span class="hl-0">git</span><span class="hl-1"> </span><span class="hl-2">clone</span><span class="hl-1"> </span><span class="hl-2">https://git.kenryu.us/kenryuS/sera-new-hp.git</span><span class="hl-1"> </span><span class="hl-3"># レポジトリをクローン</span><br/><span class="hl-0">cd</span><span class="hl-1"> </span><span class="hl-2">sera-new-hp</span><span class="hl-1"> </span><span class="hl-3"># 移動して</span><br/><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">install</span><span class="hl-1"> </span><span class="hl-3"># 依存パッケージのインストール</span><br/><br/><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">run</span><span class="hl-1"> </span><span class="hl-2">dev</span><span class="hl-1"> </span><span class="hl-3"># デベロッパーモードでサーバーを起動</span><br/><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">run</span><span class="hl-1"> </span><span class="hl-2">generate</span><span class="hl-1"> </span><span class="hl-3"># 静的サイトを生成</span><br/><br/><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">run</span><span class="hl-1"> </span><span class="hl-2">lint</span><span class="hl-1"> </span><span class="hl-3"># 静的解析ツール eslint を実行</span><br/><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">run</span><span class="hl-1"> </span><span class="hl-2">format</span><span class="hl-1"> </span><span class="hl-3"># prettier を使用してソースコードを整形</span><br/><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">run</span><span class="hl-1"> </span><span class="hl-2">documentation</span><span class="hl-1"> </span><span class="hl-3"># typedoc でドキュメンテーションを生成</span>
 </code><button type="button">Copy</button></pre>
 
 <a id="md:便利・重要なファイルフォルダ" class="tsd-anchor"></a><h2 class="tsd-anchor-link">便利・重要なファイル/フォルダ<a href="#md:便利・重要なファイルフォルダ" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="assets/icons.svg#icon-anchor"></use></svg></a></h2><ul>

docs/interfaces/utils_types_linksGrid.LinksGridProperty.html

@@ -0,0 +1,7 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>LinksGridProperty | sera-hp</title><meta name="description" content="Documentation for sera-hp"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">sera-hp</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">sera-hp</a></li><li><a href="../modules/utils_types_linksGrid.html">utils/types/linksGrid</a></li><li><a href="utils_types_linksGrid.LinksGridProperty.html">LinksGridProperty</a></li></ul><h1>Interface LinksGridProperty</h1></div><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography"><p>Interface that defines property for LinksGrid component</p>
+</div><div class="tsd-comment tsd-typography"><div class="tsd-tag-Example"><h4 class="tsd-anchor-link"><a id="Example" class="tsd-anchor"></a>Example<a href="#Example" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h4><pre><code class="ts"><span class="hl-4">const</span><span class="hl-1"> </span><span class="hl-8">linksList</span><span class="hl-1"> = [</span><br/><span class="hl-1">    {</span><br/><span class="hl-1">        </span><span class="hl-6">title:</span><span class="hl-1"> </span><span class="hl-2">&quot;test 1&quot;</span><span class="hl-1">,</span><br/><span class="hl-1">        </span><span class="hl-6">description:</span><span class="hl-1"> </span><span class="hl-2">&quot;Test Page #1&quot;</span><span class="hl-1">,</span><br/><span class="hl-1">        </span><span class="hl-6">link:</span><span class="hl-1"> </span><span class="hl-2">&quot;/test/1&quot;</span><span class="hl-1">,</span><br/><span class="hl-1">        </span><span class="hl-6">imagePath:</span><span class="hl-1"> </span><span class="hl-2">&quot;/images/test-1.png&quot;</span><span class="hl-1">,</span><br/><span class="hl-1">    },</span><br/><span class="hl-1">    ...</span><br/><span class="hl-1">    {</span><br/><span class="hl-1">        </span><span class="hl-6">title:</span><span class="hl-1"> </span><span class="hl-2">&quot;test n&quot;</span><span class="hl-1">,</span><br/><span class="hl-1">        </span><span class="hl-6">description:</span><span class="hl-1"> </span><span class="hl-2">&quot;Test Page #n&quot;</span><span class="hl-1">,</span><br/><span class="hl-1">        </span><span class="hl-6">link:</span><span class="hl-1"> </span><span class="hl-2">&quot;/test/n&quot;</span><span class="hl-1">,</span><br/><span class="hl-1">        </span><span class="hl-6">imagePath:</span><span class="hl-1"> </span><span class="hl-2">&quot;/images/test-n.png&quot;</span><span class="hl-1">,</span><br/><span class="hl-1">    },</span><br/><span class="hl-1">];</span><br/><span class="hl-1">&lt;</span><span class="hl-9">LinksGrid</span><span class="hl-1"> :</span><span class="hl-6">links</span><span class="hl-1">=</span><span class="hl-2">&quot;linksList&quot;</span><span class="hl-1"> /&gt;</span>
+</code><button type="button">Copy</button></pre>
+
+</div></div></section><div class="tsd-signature"><span class="tsd-signature-keyword">interface </span><span class="tsd-kind-interface">LinksGridProperty</span> <span class="tsd-signature-symbol">{ </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_linksGrid.LinksGridProperty.html#links">links</a><span class="tsd-signature-symbol">: </span><a href="utils_types_linkCard.LinkCardProperty.html" class="tsd-signature-type tsd-kind-interface">LinkCardProperty</a><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol">; </span><br/><span class="tsd-signature-symbol">}</span></div><aside class="tsd-sources"><ul><li>Defined in utils/types/linksGrid.ts:29</li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><details class="tsd-index-content tsd-accordion" open><summary class="tsd-accordion-summary tsd-index-summary"><h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex="0"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-chevronSmall"></use></svg> Index</h5></summary><div class="tsd-accordion-details"><section class="tsd-index-section"><h3 class="tsd-index-heading">Properties</h3><div class="tsd-index-list"><a href="utils_types_linksGrid.LinksGridProperty.html#links" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>links</span></a>
+</div></section></div></details></section></section><details class="tsd-panel-group tsd-member-group tsd-accordion" open><summary class="tsd-accordion-summary" data-key="section-Properties"><h2><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg> Properties</h2></summary><section><section class="tsd-panel tsd-member"><a id="links" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>links</span><a href="#links" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">links</span><span class="tsd-signature-symbol">:</span> <a href="utils_types_linkCard.LinkCardProperty.html" class="tsd-signature-type tsd-kind-interface">LinkCardProperty</a><span class="tsd-signature-symbol">[]</span></div><div class="tsd-comment tsd-typography"><p>Array of property of LinkCard components</p>
+</div><div class="tsd-comment tsd-typography"></div><aside class="tsd-sources"><ul><li>Defined in utils/types/linksGrid.ts:30</li></ul></aside></section></section></details></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>On This Page</h3></summary><div class="tsd-accordion-details"><details open class="tsd-accordion tsd-page-navigation-section"><summary class="tsd-accordion-summary" data-key="tsd-otp-Properties"><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Properties</summary><div><a href="#links" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>links</span></a></div></details></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>sera-hp</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>

docs/interfaces/utils_types_slide.SlideEntry.html

@@ -1,11 +1,11 @@
-<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>SlideEntry | sera-hp</title><meta name="description" content="Documentation for sera-hp"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">sera-hp</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">sera-hp</a></li><li><a href="../modules/utils_types_slide_ts.html">utils/types/slide.ts</a></li><li><a href="utils_types_slide_ts.SlideEntry.html">SlideEntry</a></li></ul><h1>Interface SlideEntry</h1></div><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography"><p>Entries to show in the slide show</p>
+<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>SlideEntry | sera-hp</title><meta name="description" content="Documentation for sera-hp"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">sera-hp</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">sera-hp</a></li><li><a href="../modules/utils_types_slide.html">utils/types/slide</a></li><li><a href="utils_types_slide.SlideEntry.html">SlideEntry</a></li></ul><h1>Interface SlideEntry</h1></div><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography"><p>Entries to show in the slide show</p>
 </div><div class="tsd-comment tsd-typography"><div class="tsd-tag-Example"><h4 class="tsd-anchor-link"><a id="Example" class="tsd-anchor"></a>Example<a href="#Example" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h4><pre><code class="ts"><span class="hl-4">let</span><span class="hl-1"> </span><span class="hl-6">entry</span><span class="hl-1">: </span><span class="hl-5">SlideEntry</span><span class="hl-1"> = {</span><br/><span class="hl-1">    </span><span class="hl-6">imagePath:</span><span class="hl-1"> </span><span class="hl-2">&quot;/images/slide/1.jpg&quot;</span><span class="hl-1">,</span><br/><span class="hl-1">    </span><span class="hl-6">title:</span><span class="hl-1"> </span><span class="hl-2">&quot;First Slide&quot;</span><span class="hl-1">,</span><br/><span class="hl-1">    </span><span class="hl-6">content:</span><span class="hl-1"> </span><span class="hl-2">&quot;This is first slide&quot;</span><span class="hl-1">,</span><br/><span class="hl-1">    </span><span class="hl-6">link:</span><span class="hl-1"> </span><span class="hl-2">&quot;/to-some-page&quot;</span><span class="hl-1">,</span><br/><span class="hl-1">};</span>
 </code><button type="button">Copy</button></pre>
 
-</div></div></section><div class="tsd-signature"><span class="tsd-signature-keyword">interface </span><span class="tsd-kind-interface">SlideEntry</span> <span class="tsd-signature-symbol">{ </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide_ts.SlideEntry.html#content">content</a><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide_ts.SlideEntry.html#imagePath">imagePath</a><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide_ts.SlideEntry.html#link">link</a><span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide_ts.SlideEntry.html#title">title</a><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span class="tsd-signature-symbol">}</span></div><aside class="tsd-sources"><ul><li>Defined in utils/types/slide.ts:20</li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><details class="tsd-index-content tsd-accordion" open><summary class="tsd-accordion-summary tsd-index-summary"><h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex="0"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-chevronSmall"></use></svg> Index</h5></summary><div class="tsd-accordion-details"><section class="tsd-index-section"><h3 class="tsd-index-heading">Properties</h3><div class="tsd-index-list"><a href="utils_types_slide_ts.SlideEntry.html#content" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>content</span></a>
-<a href="utils_types_slide_ts.SlideEntry.html#imagePath" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>image<wbr/>Path</span></a>
-<a href="utils_types_slide_ts.SlideEntry.html#link" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>link?</span></a>
-<a href="utils_types_slide_ts.SlideEntry.html#title" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>title</span></a>
+</div></div></section><div class="tsd-signature"><span class="tsd-signature-keyword">interface </span><span class="tsd-kind-interface">SlideEntry</span> <span class="tsd-signature-symbol">{ </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide.SlideEntry.html#content">content</a><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide.SlideEntry.html#imagePath">imagePath</a><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide.SlideEntry.html#link">link</a><span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide.SlideEntry.html#title">title</a><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span class="tsd-signature-symbol">}</span></div><aside class="tsd-sources"><ul><li>Defined in utils/types/slide.ts:20</li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><details class="tsd-index-content tsd-accordion" open><summary class="tsd-accordion-summary tsd-index-summary"><h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex="0"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-chevronSmall"></use></svg> Index</h5></summary><div class="tsd-accordion-details"><section class="tsd-index-section"><h3 class="tsd-index-heading">Properties</h3><div class="tsd-index-list"><a href="utils_types_slide.SlideEntry.html#content" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>content</span></a>
+<a href="utils_types_slide.SlideEntry.html#imagePath" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>image<wbr/>Path</span></a>
+<a href="utils_types_slide.SlideEntry.html#link" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>link?</span></a>
+<a href="utils_types_slide.SlideEntry.html#title" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>title</span></a>
 </div></section></div></details></section></section><details class="tsd-panel-group tsd-member-group tsd-accordion" open><summary class="tsd-accordion-summary" data-key="section-Properties"><h2><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg> Properties</h2></summary><section><section class="tsd-panel tsd-member"><a id="content" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>content</span><a href="#content" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">content</span><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div><div class="tsd-comment tsd-typography"><p>text to show in the p element</p>
 </div><div class="tsd-comment tsd-typography"></div><aside class="tsd-sources"><ul><li>Defined in utils/types/slide.ts:23</li></ul></aside></section><section class="tsd-panel tsd-member"><a id="imagePath" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>image<wbr/>Path</span><a href="#imagePath" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">image<wbr/>Path</span><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div><div class="tsd-comment tsd-typography"><p>path to the image</p>
 </div><div class="tsd-comment tsd-typography"></div><aside class="tsd-sources"><ul><li>Defined in utils/types/slide.ts:21</li></ul></aside></section><section class="tsd-panel tsd-member"><a id="link" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><code class="tsd-tag">Optional</code><span>link</span><a href="#link" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">link</span><span class="tsd-signature-symbol">?:</span> <span class="tsd-signature-type">string</span></div><div class="tsd-comment tsd-typography"><p>optional link to a page</p>

docs/interfaces/utils_types_slide.SlideProperty.html

@@ -1,13 +1,13 @@
-<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>SlideProperty | sera-hp</title><meta name="description" content="Documentation for sera-hp"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">sera-hp</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">sera-hp</a></li><li><a href="../modules/utils_types_slide_ts.html">utils/types/slide.ts</a></li><li><a href="utils_types_slide_ts.SlideProperty.html">SlideProperty</a></li></ul><h1>Interface SlideProperty</h1></div><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography"><p>Interface for Slide component</p>
+<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>SlideProperty | sera-hp</title><meta name="description" content="Documentation for sera-hp"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">sera-hp</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">sera-hp</a></li><li><a href="../modules/utils_types_slide.html">utils/types/slide</a></li><li><a href="utils_types_slide.SlideProperty.html">SlideProperty</a></li></ul><h1>Interface SlideProperty</h1></div><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography"><p>Interface for Slide component</p>
 </div><div class="tsd-comment tsd-typography"><div class="tsd-tag-Example"><h4 class="tsd-anchor-link"><a id="Example" class="tsd-anchor"></a>Example<a href="#Example" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h4><pre><code class="ts"><span class="hl-1">&lt;</span><span class="hl-9">Slide</span><span class="hl-1"> :</span><span class="hl-6">entries</span><span class="hl-1">=</span><span class="hl-2">&quot;slideEntries&quot;</span><span class="hl-1"> </span><span class="hl-6">duration</span><span class="hl-1">=</span><span class="hl-2">&quot;5000&quot;</span><span class="hl-1"> </span><span class="hl-6">width</span><span class="hl-1">=</span><span class="hl-2">&quot;200px&quot;</span><span class="hl-1"> </span><span class="hl-6">height</span><span class="hl-1">=</span><span class="hl-2">&quot;150px&quot;</span><span class="hl-1"> /&gt;</span>
 </code><button type="button">Copy</button></pre>
 
-</div></div></section><div class="tsd-signature"><span class="tsd-signature-keyword">interface </span><span class="tsd-kind-interface">SlideProperty</span> <span class="tsd-signature-symbol">{ </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide_ts.SlideProperty.html#duration">duration</a><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide_ts.SlideProperty.html#entries">entries</a><span class="tsd-signature-symbol">: </span><a href="utils_types_slide_ts.SlideEntry.html" class="tsd-signature-type tsd-kind-interface">SlideEntry</a><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide_ts.SlideProperty.html#height">height</a><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide_ts.SlideProperty.html#width">width</a><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span class="tsd-signature-symbol">}</span></div><aside class="tsd-sources"><ul><li>Defined in utils/types/slide.ts:36</li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><details class="tsd-index-content tsd-accordion" open><summary class="tsd-accordion-summary tsd-index-summary"><h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex="0"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-chevronSmall"></use></svg> Index</h5></summary><div class="tsd-accordion-details"><section class="tsd-index-section"><h3 class="tsd-index-heading">Properties</h3><div class="tsd-index-list"><a href="utils_types_slide_ts.SlideProperty.html#duration" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>duration</span></a>
-<a href="utils_types_slide_ts.SlideProperty.html#entries" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>entries</span></a>
-<a href="utils_types_slide_ts.SlideProperty.html#height" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>height</span></a>
-<a href="utils_types_slide_ts.SlideProperty.html#width" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>width</span></a>
+</div></div></section><div class="tsd-signature"><span class="tsd-signature-keyword">interface </span><span class="tsd-kind-interface">SlideProperty</span> <span class="tsd-signature-symbol">{ </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide.SlideProperty.html#duration">duration</a><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide.SlideProperty.html#entries">entries</a><span class="tsd-signature-symbol">: </span><a href="utils_types_slide.SlideEntry.html" class="tsd-signature-type tsd-kind-interface">SlideEntry</a><span class="tsd-signature-symbol">[]</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide.SlideProperty.html#height">height</a><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span>    </span><a class="tsd-kind-property" href="utils_types_slide.SlideProperty.html#width">width</a><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">; </span><br/><span class="tsd-signature-symbol">}</span></div><aside class="tsd-sources"><ul><li>Defined in utils/types/slide.ts:36</li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><details class="tsd-index-content tsd-accordion" open><summary class="tsd-accordion-summary tsd-index-summary"><h5 class="tsd-index-heading uppercase" role="button" aria-expanded="false" tabIndex="0"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-chevronSmall"></use></svg> Index</h5></summary><div class="tsd-accordion-details"><section class="tsd-index-section"><h3 class="tsd-index-heading">Properties</h3><div class="tsd-index-list"><a href="utils_types_slide.SlideProperty.html#duration" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>duration</span></a>
+<a href="utils_types_slide.SlideProperty.html#entries" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>entries</span></a>
+<a href="utils_types_slide.SlideProperty.html#height" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>height</span></a>
+<a href="utils_types_slide.SlideProperty.html#width" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>width</span></a>
 </div></section></div></details></section></section><details class="tsd-panel-group tsd-member-group tsd-accordion" open><summary class="tsd-accordion-summary" data-key="section-Properties"><h2><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg> Properties</h2></summary><section><section class="tsd-panel tsd-member"><a id="duration" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>duration</span><a href="#duration" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">duration</span><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">number</span></div><div class="tsd-comment tsd-typography"><p>duration for each slide to show in milliseconds</p>
-</div><div class="tsd-comment tsd-typography"></div><aside class="tsd-sources"><ul><li>Defined in utils/types/slide.ts:38</li></ul></aside></section><section class="tsd-panel tsd-member"><a id="entries" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>entries</span><a href="#entries" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">entries</span><span class="tsd-signature-symbol">:</span> <a href="utils_types_slide_ts.SlideEntry.html" class="tsd-signature-type tsd-kind-interface">SlideEntry</a><span class="tsd-signature-symbol">[]</span></div><div class="tsd-comment tsd-typography"><p>slides to show</p>
+</div><div class="tsd-comment tsd-typography"></div><aside class="tsd-sources"><ul><li>Defined in utils/types/slide.ts:38</li></ul></aside></section><section class="tsd-panel tsd-member"><a id="entries" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>entries</span><a href="#entries" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">entries</span><span class="tsd-signature-symbol">:</span> <a href="utils_types_slide.SlideEntry.html" class="tsd-signature-type tsd-kind-interface">SlideEntry</a><span class="tsd-signature-symbol">[]</span></div><div class="tsd-comment tsd-typography"><p>slides to show</p>
 </div><div class="tsd-comment tsd-typography"></div><aside class="tsd-sources"><ul><li>Defined in utils/types/slide.ts:37</li></ul></aside></section><section class="tsd-panel tsd-member"><a id="height" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>height</span><a href="#height" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">height</span><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div><div class="tsd-comment tsd-typography"><p>css height property value</p>
 </div><div class="tsd-comment tsd-typography"></div><aside class="tsd-sources"><ul><li>Defined in utils/types/slide.ts:40</li></ul></aside></section><section class="tsd-panel tsd-member"><a id="width" class="tsd-anchor"></a><h3 class="tsd-anchor-link"><span>width</span><a href="#width" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3><div class="tsd-signature"><span class="tsd-kind-property">width</span><span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div><div class="tsd-comment tsd-typography"><p>css width property value</p>
 </div><div class="tsd-comment tsd-typography"></div><aside class="tsd-sources"><ul><li>Defined in utils/types/slide.ts:39</li></ul></aside></section></section></details></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div><details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>On This Page</h3></summary><div class="tsd-accordion-details"><details open class="tsd-accordion tsd-page-navigation-section"><summary class="tsd-accordion-summary" data-key="tsd-otp-Properties"><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Properties</summary><div><a href="#duration" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>duration</span></a><a href="#entries" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>entries</span></a><a href="#height" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>height</span></a><a href="#width" class=""><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1024"></use></svg><span>width</span></a></div></details></div></details></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>sera-hp</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>

docs/modules.html

@@ -2,6 +2,7 @@
 <a href="modules/api_getArticleList.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>api/get<wbr/>Article<wbr/>List</span></a>
 <a href="modules/api_getGalleryImages.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>api/get<wbr/>Gallery<wbr/>Images</span></a>
 <a href="modules/api_getTime.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>api/get<wbr/>Time</span></a>
+<a href="modules/composables_backgroundImageOptimization.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>composables/background<wbr/>Image<wbr/>Optimization</span></a>
 <a href="modules/composables_scrollDistance.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>composables/scroll<wbr/>Distance</span></a>
 <a href="modules/composables_windowDimensions.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>composables/window<wbr/>Dimensions</span></a>
 <a href="modules/utils_asyncDatabase.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>utils/async<wbr/>Database</span></a>
@@ -10,10 +11,11 @@
 <a href="modules/utils_types_galleryEntry.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>utils/types/gallery<wbr/>Entry</span></a>
 <a href="modules/utils_types_hamburgerMenu.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>utils/types/hamburger<wbr/>Menu</span></a>
 <a href="modules/utils_types_linkCard.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>utils/types/link<wbr/>Card</span></a>
+<a href="modules/utils_types_linksGrid.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>utils/types/links<wbr/>Grid</span></a>
 <a href="modules/utils_types_news.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>utils/types/news</span></a>
 <a href="modules/utils_types_newsCard.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>utils/types/news<wbr/>Card</span></a>
 <a href="modules/utils_types_pageTop.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>utils/types/page<wbr/>Top</span></a>
 <a href="modules/utils_types_pankuzuList.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>utils/types/pankuzu<wbr/>List</span></a>
 <a href="modules/utils_types_qAndABox.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>utils/types/q<wbr/>AndABox</span></a>
-<a href="modules/utils_types_slide_ts.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>utils/types/slide.ts</span></a>
+<a href="modules/utils_types_slide.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-2"></use></svg><span>utils/types/slide</span></a>
 </div></section></section></section></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="modules.html" class="current"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="assets/icons.svg#icon-1"></use></svg><span>sera-hp</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base="."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>

docs/modules/composables_backgroundImageOptimization.html

@@ -0,0 +1,3 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>composables/backgroundImageOptimization | sera-hp</title><meta name="description" content="Documentation for sera-hp"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">sera-hp</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">sera-hp</a></li><li><a href="composables_backgroundImageOptimization.html">composables/backgroundImageOptimization</a></li></ul><h1>Module composables/backgroundImageOptimization</h1></div><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography"><p>Vue Composable for optimizing image used in background-image.</p>
+</div><div class="tsd-comment tsd-typography"></div></section><aside class="tsd-sources"><ul><li>Defined in composables/backgroundImageOptimization.ts:1</li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><h3 class="tsd-index-heading uppercase">Index</h3><section class="tsd-index-section"><h3 class="tsd-index-heading">Functions</h3><div class="tsd-index-list"><a href="../functions/composables_backgroundImageOptimization.useBackgroundImageOptimization.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-64"></use></svg><span>use<wbr/>Background<wbr/>Image<wbr/>Optimization</span></a>
+</div></section></section></section></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>sera-hp</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>

docs/modules/utils_types_linksGrid.html

@@ -0,0 +1,3 @@
+<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>utils/types/linksGrid | sera-hp</title><meta name="description" content="Documentation for sera-hp"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">sera-hp</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">sera-hp</a></li><li><a href="utils_types_linksGrid.html">utils/types/linksGrid</a></li></ul><h1>Module utils/types/linksGrid</h1></div><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography"><p>Types for LinksGrid component</p>
+</div><div class="tsd-comment tsd-typography"></div></section><aside class="tsd-sources"><ul><li>Defined in utils/types/linksGrid.ts:1</li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><h3 class="tsd-index-heading uppercase">Index</h3><section class="tsd-index-section"><h3 class="tsd-index-heading">Interfaces</h3><div class="tsd-index-list"><a href="../interfaces/utils_types_linksGrid.LinksGridProperty.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-256"></use></svg><span>Links<wbr/>Grid<wbr/>Property</span></a>
+</div></section></section></section></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>sera-hp</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>

docs/modules/utils_types_slide.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>utils/types/slide.ts | sera-hp</title><meta name="description" content="Documentation for sera-hp"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">sera-hp</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">sera-hp</a></li><li><a href="utils_types_slide_ts.html">utils/types/slide.ts</a></li></ul><h1>Module utils/types/slide.ts</h1></div><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography"><p>Types for Slide component</p>
-</div><div class="tsd-comment tsd-typography"></div></section><aside class="tsd-sources"><ul><li>Defined in utils/types/slide.ts:1</li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><h3 class="tsd-index-heading uppercase">Index</h3><section class="tsd-index-section"><h3 class="tsd-index-heading">Interfaces</h3><div class="tsd-index-list"><a href="../interfaces/utils_types_slide_ts.SlideEntry.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-256"></use></svg><span>Slide<wbr/>Entry</span></a>
-<a href="../interfaces/utils_types_slide_ts.SlideProperty.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-256"></use></svg><span>Slide<wbr/>Property</span></a>
+<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>utils/types/slide | sera-hp</title><meta name="description" content="Documentation for sera-hp"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"><div class="tsd-toolbar-contents container"><div class="table-cell" id="tsd-search" data-base=".."><div class="field"><label for="tsd-search-field" class="tsd-widget tsd-toolbar-icon search no-caption"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-search"></use></svg></label><input type="text" id="tsd-search-field" aria-label="Search"/></div><div class="field"><div id="tsd-toolbar-links"></div></div><ul class="results"><li class="state loading">Preparing search index...</li><li class="state failure">The search index is not available</li></ul><a href="../index.html" class="title">sera-hp</a></div><div class="table-cell" id="tsd-widgets"><a href="#" class="tsd-widget tsd-toolbar-icon menu no-caption" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></div></header><div class="container container-main"><div class="col-content"><div class="tsd-page-title"><ul class="tsd-breadcrumb"><li><a href="../modules.html">sera-hp</a></li><li><a href="utils_types_slide.html">utils/types/slide</a></li></ul><h1>Module utils/types/slide</h1></div><section class="tsd-panel tsd-comment"><div class="tsd-comment tsd-typography"><p>Types for Slide component</p>
+</div><div class="tsd-comment tsd-typography"></div></section><aside class="tsd-sources"><ul><li>Defined in utils/types/slide.ts:1</li></ul></aside><section class="tsd-panel-group tsd-index-group"><section class="tsd-panel tsd-index-panel"><h3 class="tsd-index-heading uppercase">Index</h3><section class="tsd-index-section"><h3 class="tsd-index-heading">Interfaces</h3><div class="tsd-index-list"><a href="../interfaces/utils_types_slide.SlideEntry.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-256"></use></svg><span>Slide<wbr/>Entry</span></a>
+<a href="../interfaces/utils_types_slide.SlideProperty.html" class="tsd-index-link"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-256"></use></svg><span>Slide<wbr/>Property</span></a>
 </div></section></section></section></div><div class="col-sidebar"><div class="page-menu"><div class="tsd-navigation settings"><details class="tsd-accordion"><summary class="tsd-accordion-summary"><h3><svg width="20" height="20" viewBox="0 0 24 24" fill="none"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>Settings</h3></summary><div class="tsd-accordion-details"><div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span><ul id="tsd-filter-options"><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-protected" name="protected"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Protected</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li><li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div><div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div></div><div class="site-menu"><nav class="tsd-navigation"><a href="../modules.html"><svg class="tsd-kind-icon" viewBox="0 0 24 24"><use href="../assets/icons.svg#icon-1"></use></svg><span>sera-hp</span></a><ul class="tsd-small-nested-navigation" id="tsd-nav-container" data-base=".."><li>Loading...</li></ul></nav></div></div></div><footer><p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer><div class="overlay"></div></body></html>

nuxt.config.ts

@@ -11,6 +11,9 @@ export default defineNuxtConfig({
     dirs: ["utils/types"],
   },
   devtools: { enabled: true },
+  image: {
+    inject: true
+  },
   modules: [
     '@nuxt/image',
     'nuxt-svgo',

package.json

@@ -14,8 +14,10 @@
     },
     "dependencies": {
         "@unhead/schema": "^1.11.6",
+        "isomorphic-dompurify": "^2.17.0",
         "marked": "^14.1.2",
         "nuxt": "^3.12.4",
+        "sharp": "^0.33.5",
         "sqlite3": "^5.1.7",
         "vue": "latest"
     },

pages/about/achievements.vue

@@ -28,7 +28,7 @@ useSeoMeta(
         </section>
 
         <section>
-            <img
+            <NuxtImg
                 src="/images/koshien2020_mission-rogo.png"
                 alt="2020 Mission Logo"
                 class="float-right"
@@ -58,7 +58,7 @@ useSeoMeta(
         <section>
             <h3>種子島ロケットコンテスト</h3>
             <h4>滑空・定点回収</h4>
-            <img
+            <NuxtImg
                 src="/images/rocket_top.jpg"
                 alt="rockets"
                 class="float-right"
@@ -93,7 +93,7 @@ useSeoMeta(
             </ul>
             <br />
             <h4>CanSat</h4>
-            <img
+            <NuxtImg
                 src="/images/cansat/cansat_03.jpg"
                 alt="Sample Image"
                 class="float-right"
@@ -145,7 +145,7 @@ useSeoMeta(
 
         <section>
             <h2>その他活動実績 (イベントなど)</h2>
-            <img
+            <NuxtImg
                 src="/images/uchu_fea.jpg"
                 alt="Sample Image"
                 class="float-right"

pages/about/gallery.vue

@@ -63,7 +63,7 @@ useSeoMeta(
                 :key="entry.id"
             >
                 <figure>
-                    <img :src="entry.imagePath" :alt="entry.caption" />
+                    <NuxtImg :src="entry.imagePath" :alt="entry.caption" />
                     <figcaption>{{ entry.caption }}</figcaption>
                 </figure>
             </div>
@@ -73,7 +73,7 @@ useSeoMeta(
                 <button @click="closeViewer" class="close">
                     <Icon name="ic:baseline-close" />
                 </button>
-                <img :src="imagePathViewer" :alt="captionViewer" />
+                <NuxtImg :src="imagePathViewer" :alt="captionViewer" />
                 <p>{{ captionViewer }}</p>
                 <button @click="changeImage(Direction.FORWARD)" class="next">
                     <Icon name="material-symbols:arrow-forward-rounded" />
@@ -163,6 +163,7 @@ main {
     grid-area: caption;
     justify-self: center;
     align-self: flex-end;
+    margin-inline: 1.25rem;
 }
 
 .image-viewer .close {

pages/about/index.vue

@@ -1,4 +1,31 @@
 <script setup lang="ts">
+const linksList: Array<LinkCardProperty> = [
+    {
+        title: "SERAについて",
+        description: "岐阜工業高等専門学校宇宙工学研究会【SERA】の概要です。",
+        link: "/about/sera",
+        imagePath: "",
+    },
+    {
+        title: "活動実績",
+        description: "SERAの活動実績、受賞歴を紹介します。",
+        link: "/about/achievements",
+        imagePath: "",
+    },
+    {
+        title: "写真集",
+        description: "大会や普段の活動での様子です。",
+        link: "/about/gallery",
+        imagePath: "",
+    },
+    {
+        title: "中学生・新入生向け",
+        description: "部活のFAQを集めてみました。",
+        link: "/about/for-middle-schoolers-and-new-comers",
+        imagePath: "",
+    },
+];
+
 useSeoMeta(
     generateSeoMeta(
         "About Us",
@@ -12,56 +39,30 @@ useSeoMeta(
     <PageTop text="クラブ情報" image-path="/images/page-top.jpg" />
     <PankuzuList />
     <main>
-        <ul>
-            <li>
-                <LinkCard
-                    title="SERAについて"
-                    description="岐阜工業高等専門学校宇宙工学研究会【SERA】の概要です。"
-                    link="/about/sera"
-                />
-            </li>
-            <li>
-                <LinkCard
-                    title="活動実績"
-                    description="SERAの活動実績、受賞歴を紹介します。"
-                    link="/about/achievements"
-                />
-            </li>
-            <li>
-                <LinkCard
-                    title="写真集"
-                    description="大会や普段の活動での様子です。"
-                    link="/about/gallery"
-                />
-            </li>
-            <li>
-                <LinkCard
-                    title="中学生・新入生向け"
-                    description="部活のFAQを集めてみました。"
-                    link="/about/for-middle-schoolers-and-new-comers"
-                />
-            </li>
-        </ul>
+        <LinksGrid id="links" :links="linksList" />
     </main>
 </template>
 
 <style scoped>
-ul {
-    list-style: none;
-    display: grid;
-    gap: 20px;
-    grid: repeat(2, 1fr) / repeat(2, 1fr);
-    width: fit-content;
-    padding: 0;
-    margin: auto;
+main {
+    display: flex;
+    justify-content: center;
 }
 
-@media screen and (max-width: 1024px) {
+#links {
+    width: 80%;
+    max-width: 64rem;
+}
+
+@media screen and (max-width: 960px) {
     main {
         margin: var(--main-margin-top-bottom) 0;
     }
-    ul {
-        grid: repeat(3, 1fr) / 1fr;
+}
+
+@media screen and (max-width: 640px) {
+    main {
+        margin: var(--main-margin-top-bottom) 0;
     }
 }
 </style>

pages/about/sera.vue

@@ -15,7 +15,11 @@ useSeoMeta(
     <PankuzuList current-page-name="SERAについて" />
     <main>
         <section>
-            <img src="/sera-logo-text.svg" alt="SERA Logo" class="float-left" />
+            <NuxtImg
+                src="/sera-logo-text.svg"
+                alt="SERA Logo"
+                class="float-left"
+            />
             <p>
                 宇宙分野に興味ある学生が集い、宇宙理工学に関する知識を身に付けると共に、宇宙分野に関連する各種競技会へ参加して人間力と実践力を養うことを目的に活動しています。
             </p>

pages/contact.vue

@@ -0,0 +1,41 @@
+<script setup lang="ts">
+import SiteInfo from "~/assets/siteinfo.json";
+const WebsiteMetaData = generateSeoMeta(
+    "Contact SERA",
+    `${SiteInfo.clubNameAbbreviation}へのお問い合わせ`,
+    "/sera-logo-text.svg"
+);
+
+useSeoMeta(WebsiteMetaData);
+</script>
+
+<template>
+    <PageTop text="Contact" image-path="/images/page-top.jpg" />
+    <PankuzuList
+        :currentPageName="`Contact ${SiteInfo.clubNameAbbreviation}`"
+    />
+    <main>
+        <section>
+            <h1>{{ SiteInfo.clubNameAbbreviation }}へのお問い合わせ</h1>
+        </section>
+
+        <section>
+            <iframe
+                src="https://docs.google.com/forms/d/e/1FAIpQLSd2a8WMfu4v5potmKbwIPJ7fKfL2xpVhaTN6ys2J1A-dRU3sw/viewform?embedded=true"
+                width="100%"
+                height="950"
+                frameborder="0"
+                marginheight="0"
+                marginwidth="0"
+                >読み込んでいます…</iframe
+            >
+        </section>
+    </main>
+</template>
+
+<style scoped>
+main {
+    width: clamp(300px, 70%, 36rem);
+    margin: auto;
+}
+</style>

pages/index.vue

@@ -1,7 +1,16 @@
 <script setup lang="ts">
 import { marked } from "marked";
+import DOMPurify from "isomorphic-dompurify";
 import { EntryType, type NewsEntry } from "~/utils/types/news";
 import type { SlideEntry } from "~/utils/types/slide";
+import SiteInfo from "~/assets/siteinfo.json";
+
+const backgroundImageOptimization = useBackgroundImageOptimization();
+const backgroundImageOptimizer = (path: string) => {
+    backgroundImageOptimization.backgroundImageStyles.value = path;
+    const ret = backgroundImageOptimization.backgroundImageStyles.value;
+    return ret;
+};
 
 const { data } = await useFetch("/api/getNewsList");
 
@@ -31,7 +40,7 @@ const welcomeSlide: Array<SlideEntry> = [
     {
         imagePath: "/images/welcome.jpg",
         title: "ようこそ！",
-        content: "岐阜高専宇宙工学研究会【SERA】のホームページです。",
+        content: `岐阜高専宇宙工学研究会【${SiteInfo.clubNameAbbreviation}】のホームページです。`,
         link: undefined,
     },
 ];
@@ -57,6 +66,12 @@ const slidesForProjects: Array<SlideEntry> = [
     },
 ];
 
+let slideEntries = ref<Array<SlideEntry>>([
+    ...welcomeSlide,
+    ...getNewsEntriesForSlide(),
+    ...slidesForProjects,
+]);
+
 interface QuickLinkEntry {
     label: string;
     imagePath: string;
@@ -81,10 +96,6 @@ const quickLinkEntries: Array<QuickLinkEntry> = [
     },
 ];
 
-let slideEntries = ref<Array<SlideEntry>>(
-    welcomeSlide.concat(getNewsEntriesForSlide(), slidesForProjects)
-);
-
 onMounted(() => {
     const twitterScript = document.createElement("script");
     const twitterDivision = document.getElementById("twitter");
@@ -109,7 +120,7 @@ useSeoMeta(
             :entries="slideEntries"
             :duration="6000"
             width="100vw"
-            height="max(50svh, 30rem)"
+            height="max(50svh, 32rem)"
             id="slide"
         />
         <div id="quick-links-container">
@@ -118,7 +129,7 @@ useSeoMeta(
                     class="quick-link-entry"
                     v-for="entry in quickLinkEntries"
                     :key="quickLinkEntries.indexOf(entry)"
-                    :style="{ backgroundImage: `url('${entry.imagePath}')` }"
+                    :style="backgroundImageOptimizer(entry.imagePath)"
                 >
                     <NuxtLink :to="entry.link">
                         <h2>{{ entry.label }}</h2>
@@ -149,7 +160,13 @@ useSeoMeta(
                         </div>
                     </div>
                     <article
-                        v-html="marked.parse(entry.cardContent as string)"
+                        v-html="
+                            DOMPurify.sanitize(
+                                marked.parse(
+                                    entry.cardContent as string
+                                ) as string
+                            )
+                        "
                     ></article>
                     <NuxtLink
                         v-if="entry.entryType === EntryType.Article"
@@ -213,19 +230,20 @@ main:last-child {
 #quick-links {
     --quick-link-margin: 1rem;
     display: grid;
-    width: calc(100vw - 40 * var(--quick-link-margin));
-    height: calc(100vw / 3 * 1 / 3);
+    width: calc(100vw - 2 * var(--quick-link-margin));
+    height: calc(100vw / 9);
+    min-height: 10rem;
     grid-template-columns: repeat(3, 1fr);
     grid-template-rows: 1fr;
-    margin: var(--quick-link-margin) calc(20 * var(--quick-link-margin));
+    margin: var(--quick-link-margin);
     align-items: center;
 }
 
 .quick-link-entry {
     position: relative;
     width: 100%;
-    height: auto;
-    aspect-ratio: 3/1;
+    height: 100%;
+    min-height: 10rem;
     background-position: center;
     background-size: cover;
     background-color: #414141cb;
@@ -254,12 +272,15 @@ main:last-child {
     #quick-links {
         width: 100vw;
         height: 100vw;
+        min-height: calc(30rem + 2 * var(--quick-link-margin));
         grid-template-columns: 1fr;
         grid-template-rows: repeat(3, 1fr);
         margin-inline: 0;
     }
-    .quick-link-entry > a > h2 {
-        font-size: 7cqi;
+    .quick-link-entry {
+        & > a > h2 {
+            font-size: 7cqi;
+        }
     }
 }
 
@@ -334,6 +355,7 @@ main:last-child {
     max-width: 100%;
     overflow-x: hidden;
     grid-area: twitter;
+    margin-top: 1rem;
     & > .twitter-timeline {
         display: unset !important;
         width: unset !important;

pages/news/[article].vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import DOMPurify from "isomorphic-dompurify";
 import { marked } from "marked";
 
 const route = useRoute();
@@ -30,9 +31,10 @@ onMounted(() => {
     postedDateElement.textContent = "掲載日： " + postedDate;
     articleTitle?.insertAdjacentElement("afterend", postedDateElement);
     const cardContentConversion = document.createElement("div");
-    cardContentConversion.innerHTML = marked.parse(
-        data.value?.cardContent as string
-    ) as string;
+    const purifiedHTML = DOMPurify.sanitize(
+        marked.parse(data.value?.cardContent as string) as string
+    );
+    cardContentConversion.innerHTML = purifiedHTML;
     useSeoMeta(
         generateSeoMeta(
             articleTitle?.innerText as string,
@@ -48,11 +50,17 @@ onMounted(() => {
     <PageTop text="News" image-path="/images/news-top.jpg" />
     <PankuzuList :current-page-name="pankuzuListPageName()" />
     <main>
-        <img :src="(data?.coverImagePath as string) || '/sera-logo-text.svg'" />
+        <NuxtImg
+            :src="(data?.coverImagePath as string) || '/sera-logo-text.svg'"
+        />
         <div
             id="article"
             class="markdown"
-            v-html="marked.parse(data?.article as string)"
+            v-html="
+                DOMPurify.sanitize(
+                    marked.parse(data?.article as string) as string
+                )
+            "
         ></div>
     </main>
 </template>

pages/news/index.vue

@@ -34,15 +34,6 @@ useSeoMeta(
     margin: 1rem 0;
 }
 
-.news-list > div:has(a) {
-    transition: all 0.3s ease-in-out;
-    &:hover {
-        scale: 105%;
-        filter: grayscale(25%);
-        transition: all 0.3s ease-in-out;
-    }
-}
-
 @media screen and (max-width: 640px) {
     .news-list {
         grid-auto-flow: row;

pages/projects/cansat.vue

@@ -13,7 +13,7 @@ useSeoMeta(
     <PankuzuList current-page-name="CanSat開発チーム" />
     <main>
         <section>
-            <img
+            <NuxtImg
                 src="/images/cansat_top.jpg"
                 alt="CanSat top image"
                 class="float-left"
@@ -29,7 +29,7 @@ useSeoMeta(
 
         <section>
             <h2>CanSatとは</h2>
-            <img
+            <NuxtImg
                 src="/images/cansat/cansat_01.jpg"
                 alt="CanSat"
                 class="float-right"
@@ -52,7 +52,7 @@ useSeoMeta(
 
         <section>
             <h2>CanSat開発チームの活動</h2>
-            <img
+            <NuxtImg
                 src="/images/cansat/cansat_02.jpg"
                 alt="SERA自作ロケット"
                 class="float-left"
@@ -74,7 +74,7 @@ useSeoMeta(
 
         <section>
             <h3>缶サット甲子園</h3>
-            <img
+            <NuxtImg
                 src="/images/cansat/koshien2020.jpg"
                 alt="缶サット甲子園"
                 class="float-right"
@@ -92,7 +92,7 @@ useSeoMeta(
 
         <section>
             <h3>種子島ロケットコンテスト</h3>
-            <img
+            <NuxtImg
                 src="/images/cansat/seratank-1.png"
                 alt="SERATANK-1"
                 class="float-left"

pages/projects/education.vue

@@ -30,7 +30,7 @@ useSeoMeta(
 
         <section>
             <h3>AlphaⅢ</h3>
-            <img
+            <NuxtImg
                 src="/images/rocket/alpha3.jpg"
                 alt="Alpha III"
                 class="float-left"
@@ -44,7 +44,7 @@ useSeoMeta(
 
         <section>
             <h3>Raspberry Pi</h3>
-            <img
+            <NuxtImg
                 src="/images/education/raspberry-pi-4.jpg"
                 alt="Raspberry Pi 4"
                 class="float-right"
@@ -79,7 +79,7 @@ useSeoMeta(
 
         <section>
             <h2>教育用ローバーの開発</h2>
-            <img
+            <NuxtImg
                 src="/images/education/education-1.jpg"
                 alt="教育用ローバー"
                 class="float-left"

pages/projects/index.vue

@@ -1,4 +1,35 @@
 <script setup lang="ts">
+const linksList: Array<LinkCardProperty> = [
+    {
+        title: "Rocket開発チーム",
+        description:
+            "SERA Rocket開発チームです。モデルロケットの製作を中心に活動しており、ロケットに関する知識を高めることを目指しています。",
+        link: "/projects/rocket",
+        imagePath: "/images/rocket_top.jpg",
+    },
+    {
+        title: "CanSat開発チーム",
+        description:
+            "SERA CanSat開発チームです。缶サットの製作を中心に活動しており、人工衛星などに関する知識を高めることを目指しています。",
+        link: "/projects/cansat",
+        imagePath: "/images/cansat_top.jpg",
+    },
+    {
+        title: "教育プロジェクト",
+        description:
+            "SERAでは主に新入会員の教育を目的に、教育用ローバー(CanSat)の開発を行っています。外部でも使用できるようなキットを目指して開発中です。",
+        link: "/projects/education",
+        imagePath: "/images/education/education-1.jpg",
+    },
+    {
+        title: "CubeSat KOSEN-X",
+        description:
+            "高専連携による超小型衛星開発についてです。高専スペース連携が中心となって製作しているCubeSatのプロジェクトに一部の部員が参加させて頂いております。",
+        link: "/projects/kosen-x",
+        imagePath: "/images/kosen1_gunma-cgv5-a.JPG",
+    },
+];
+
 useSeoMeta(
     generateSeoMeta(
         "Projects",
@@ -12,60 +43,36 @@ useSeoMeta(
     <PageTop text="Projects" image-path="/images/page-top.jpg" />
     <PankuzuList />
     <main>
-        <ul class="cards-list">
-            <li>
-                <LinkCard
-                    title="Rocket開発チーム"
-                    description="SERA Rocket開発チームです。モデルロケットの製作を中心に活動しており、ロケットに関する知識を高めることを目指しています。"
-                    link="/projects/rocket"
-                    image-path="/images/rocket_top.jpg"
-                />
-            </li>
-            <li>
-                <LinkCard
-                    title="CanSat開発チーム"
-                    description="SERA CanSat開発チームです。缶サットの製作を中心に活動しており、人工衛星などに関する知識を高めることを目指しています。"
-                    link="/projects/cansat"
-                    image-path="/images/cansat_top.jpg"
-                />
-            </li>
-            <li>
-                <LinkCard
-                    title="教育プロジェクト"
-                    description="SERAでは主に新入会員の教育を目的に、教育用ローバー(CanSat)の開発を行っています。外部でも使用できるようなキットを目指して開発中です。"
-                    link="/projects/education"
-                    image-path="/images/education/education-1.jpg"
-                />
-            </li>
-            <li>
-                <LinkCard
-                    title="CubeSat KOSEN-X"
-                    description="高専連携による超小型衛星開発についてです。高専スペース連携が中心となって製作しているCubeSatのプロジェクトに一部の部員が参加させて頂いております。"
-                    link="/projects/kosen-x"
-                    image-path="/images/kosen1_gunma-cgv5-a.JPG"
-                />
-            </li>
-        </ul>
+        <LinksGrid class="cards-list" :links="linksList" />
     </main>
 </template>
 
 <style scoped>
-.cards-list {
-    list-style: none;
-    display: grid;
-    grid: repeat(2, auto) / repeat(2, auto);
-    gap: 2rem;
-    width: fit-content;
-    padding: 0;
-    margin: auto;
+main {
+    display: flex;
+    justify-content: center;
 }
 
-@media screen and (max-width: 1024px) {
+.cards-list {
+    width: 80%;
+    max-width: 64rem;
+}
+
+@media screen and (max-width: 1080px) {
     main {
         margin: var(--main-margin-top-bottom) 0;
     }
-    .cards-list {
-        grid: repeat(4, 1fr) / 1fr;
+}
+
+@media screen and (max-width: 960px) {
+    main {
+        margin: var(--main-margin-top-bottom) 0;
+    }
+}
+
+@media screen and (max-width: 640px) {
+    main {
+        margin: var(--main-margin-top-bottom) 0;
     }
 }
 </style>

pages/projects/kosen-x.vue

@@ -68,7 +68,7 @@ useSeoMeta(
         </section>
 
         <section>
-            <img src="/images/kosen1_gunma-cgv5-a.JPG" alt="KOSEN-1" />
+            <NuxtImg src="/images/kosen1_gunma-cgv5-a.JPG" alt="KOSEN-1" />
             <p>画像：菅原達弥(群馬高専)</p>
         </section>
     </main>
@@ -83,6 +83,6 @@ section:last-of-type {
 }
 
 img {
-    width: 60rem;
+    width: clamp(300px, 40vw, 60rem);
 }
 </style>

pages/projects/rocket.vue

@@ -13,7 +13,7 @@ useSeoMeta(
     <PankuzuList current-page-name="Rocket開発チーム" />
     <main>
         <section>
-            <img
+            <NuxtImg
                 src="/images/rocket_top.jpg"
                 alt="Rocket top image"
                 class="float-left"
@@ -29,7 +29,7 @@ useSeoMeta(
 
         <section>
             <h2>モデルロケットとは</h2>
-            <img
+            <NuxtImg
                 src="/images/rocket/alpha3.jpg"
                 alt="Alpha III"
                 class="float-right"
@@ -57,7 +57,7 @@ useSeoMeta(
 
         <section>
             <h2>Rocket開発チームの活動</h2>
-            <img
+            <NuxtImg
                 src="/images/rocket/rocket_02.jpg"
                 alt="2 staged rocket"
                 class="float-left"

src-manager/README.md

@@ -18,6 +18,7 @@ cd src-manager/ # このディレクトリーに移動
 npm install # 依存パッケージのインストール、まだ一度も実行していない場合
 npm start # サーバーを起動、ブラウザで http://localhost:3001 に入る
 npm run dev # JSファイル変更時に自動リロードが入る開発サーバーを起動する。同じく http://localhost:3001 でホストされる
+npm run documentation # ドキュメンテーションを生成, "./docs/manager/<バージョン>/" 内で `python -m http.server` 等でローカルでホストする
 ```
 
 ## データベース

src-manager/api/gallery-image.js

@@ -1,28 +1,46 @@
+/** @module api/gallery-image */
 import express from 'express';
 import sqlite3 from 'sqlite3';
 import path from 'path';
 import { fileURLToPath } from 'url';
 import { asyncDatabaseRead, asyncDatabaseWrite } from '../utils/asyncDatabase.js';
+import { wrapInTable } from '../utils/tableWrapper.js';
 
 const galleryImageAPI = express.Router();
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 const databasePath = path.join(__dirname, "../../assets/databases/gallery.db");
 
-galleryImageAPI.get('/list', async (request, response) => {
+function generateActionButtons(target) {
+    return `<button class='delete-button' hx-delete='/api/gallery-image?target=${target}'>Delete</button><a href='/update-gallery-image.html?target=${target}'><button class='edit-button' hx-confirm='unset'>Edit</button></a>`;
+}
+
+/**
+ * Gets list of gallery image entries in HTML table body tr+td
+ * @param {Object} request
+ * @param {Object} response
+ * @returns {string} HTML table body tr+td
+ * @example
+ * $ curl -X GET http://localhost:3001/api/gallery-image/list
+ * // <tr>
+ * //     <td>1</td>
+ * //     <td>/image/test.png</td>
+ * //     ...
+ * // </tr>
+ * // ...
+ */
+const getGalleryImageList = async (request, response) => {
     const database = new sqlite3.Database(databasePath);
     const sqlQuery = "SELECT * FROM gallery";
 
     try {
         const result = await asyncDatabaseRead(database, sqlQuery, (rows) => {
             let ret = "";
-            for (const entry of rows) {
-                ret = ret + "<tr>\n";
-                for (const data in entry) {
-                    ret = ret + `\t<td>${entry[data]}</td>\n`;
-                }
-                ret = ret + `\t<td>\n\t\t<button class='delete-button' hx-delete='/api/gallery-image?target=${entry["id"]}'>Delete</button>\n\t\t<a href='/update-gallery-image.html?target=${entry["id"]}'><button class='edit-button' hx-confirm='unset'>Edit</button></a>\n\t</td>\n</tr>\n`;
-            }
+            let rowsCopy = [...rows];
+            const withActionButtons = rowsCopy.map((entry) => {
+                return { ...entry, buttons: generateActionButtons(entry.id) };
+            });
+            ret = wrapInTable(withActionButtons);
             return ret;
         });
 
@@ -33,9 +51,20 @@ galleryImageAPI.get('/list', async (request, response) => {
         database.close();
         response.status(500).send(err);
     }
-});
+};
+galleryImageAPI.get('/list',getGalleryImageList);
 
-galleryImageAPI.get('/list-unwrapped', async (request, response) => {
+/**
+ * Gets list of gallery image entries in Unformatted JSON string
+ * @param {Object} request
+ * @param {Object} response
+ * @returns {string} Unformatted JSON string that contains gallery image entries
+ * @example
+ * $ curl -X GET \
+ *       http://localhost:3001/api/gallery-image/list-unwrapped
+ * // gets raw JSON containing gallery image entries
+ */
+const getGalleryImageListUnwrapped = async (request, response) => {
     const database = new sqlite3.Database(databasePath);
     const sqlQuery = "SELECT * FROM gallery";
 
@@ -49,9 +78,20 @@ galleryImageAPI.get('/list-unwrapped', async (request, response) => {
         database.close();
         response.status(500).send(err);
     }
-});
+};
+galleryImageAPI.get('/list-unwrapped', getGalleryImageListUnwrapped);
 
-galleryImageAPI.get('/', async (request, response) => {
+/**
+ * Get a gallery image information
+ * @param {Object} request
+ * @param {number} request.query.target - ID to specify gallery image entry
+ * @param {Object} response
+ * @returns {JSON} JSON that contains information about gallery image
+ * @example
+ * $ curl -X GET http://localhost:3001/api/gallery-image?target=1
+ * // gets gallery image information with ID of 1
+ */
+const getGalleryImage = async (request, response) => {
     const database = new sqlite3.Database(databasePath);
 
     const target = Number(request.query.target);
@@ -72,9 +112,24 @@ galleryImageAPI.get('/', async (request, response) => {
         database.close();
         response.status(500).send(err);
     }
-});
+};
+galleryImageAPI.get('/', getGalleryImage);
 
-galleryImageAPI.post('/', async (request, response) => {
+/**
+ * Posts gallery image
+ * @param {Object} request
+ * @param {string} request.body.imagePath - URL path to image
+ * @param {string} request.body.caption - Caption of image
+ * @param {Object} response
+ * @returns Result is logged into console
+ * @example
+ * $ curl -X POST \
+ *       -H 'Content-Type: application/x-www-form-urlencoded' \
+ *       --data-raw 'imagePath=/images/launch.png&caption=Launch of our new rocket' \
+ *       http://localhost:3001/api/gallery-image/
+ * // Posts gallery image with given information
+ */
+const postGalleryImage = async (request, response) => {
     const database = new sqlite3.Database(databasePath);
 
     const imagePath = request.body.imagePath;
@@ -93,9 +148,25 @@ galleryImageAPI.post('/', async (request, response) => {
 
     database.close();
     response.end();
-});
+};
+galleryImageAPI.post('/', postGalleryImage);
 
-galleryImageAPI.put('/', async (request, response) => {
+/**
+ * Updates gallery image
+ * @param {Object} request
+ * @param {number} request.body.target - ID to specify gallery image entry
+ * @param {string} request.body.imagePath - URL path to image
+ * @param {string} request.body.caption - Caption of image
+ * @param {Object} response
+ * @returns Result is logged into console
+ * @example
+ * $ curl -X PUT \
+ *       -H 'Content-Type: application/x-www-form-urlencoded' \
+ *       --data-raw 'imagePath=/images/launch.png&caption=Launch of our new rocket' \
+ *       http://localhost:3001/api/gallery-image/
+ * // Updates gallery image with given information
+ */
+const putGalleryImage = async (request, response) => {
     const database = new sqlite3.Database(databasePath);
 
     const target = Number(request.body.target);
@@ -121,9 +192,21 @@ galleryImageAPI.put('/', async (request, response) => {
 
     database.close();
     response.end();
-});
+};
+galleryImageAPI.put('/', putGalleryImage);
 
-galleryImageAPI.delete('/', async (request, response) => {
+/**
+ * Deletes specified gallery image
+ * @param {Object} request
+ * @param {string} request.query.target - ID to specify gallery image entry
+ * @param {Object} response
+ * @returns Result is logged into console
+ * @example
+ * $ curl -X DELETE \
+ *       http://localhost:3001/api/gallery-image?target=1
+ * // Deletes gallery image with ID of 1
+ */
+const deleteGalleryImage = async (request, response) => {
     const database = new sqlite3.Database(databasePath);
 
     const target = Number(request.query.target);
@@ -146,6 +229,7 @@ galleryImageAPI.delete('/', async (request, response) => {
 
     database.close();
     response.status(200).send();
-});
+};
+galleryImageAPI.delete('/', deleteGalleryImage);
 
 export default galleryImageAPI;

src-manager/api/news.js

@@ -1,15 +1,43 @@
+/** @module api/news */
 import express from 'express';
 import sqlite3 from 'sqlite3';
 import path from 'path';
 import { fileURLToPath } from 'url';
 import { asyncDatabaseRead, asyncDatabaseWrite } from '../utils/asyncDatabase.js';
+import { wrapInTable } from '../utils/tableWrapper.js';
 
 const newsAPI = express.Router();
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 const databasePath = path.join(__dirname, "../../assets/databases/news.db");
 
-newsAPI.get('/', async (request, response) => {
+function renameArticleType(entryType) {
+    return entryType == 0 ? "Article" : "Tweet";
+}
+
+function unixTimeToHumanreadableTime(unixTime) {
+    return (new Date(unixTime).toLocaleString());
+}
+
+function generateActionButtons(target) {
+    return `<button class='delete-button' hx-delete='/api/news?target=${target}'>Delete</button><a href='/update-news.html?target=${target}'><button class='edit-button' hx-confirm='unset'>Edit</button></a>`;
+}
+
+function modifyOrAppendProperty(targetObject, key, value) {
+    return { ...targetObject, [key]: value };
+}
+
+/**
+ * Get single news entry specified by Un*x Timestamp
+ * @param {Object} request
+ * @param {number} request.query.target - Un*x Timestamp to specify news entry
+ * @param {Object} response
+ * @returns {JSON} news entry data
+ * @example
+ * $ curl -X GET http://localhost:3001/api/news?target=0
+ * // gets news posted on Un*x epoch in JSON format
+ */
+const getNewsEntry = async (request, response) => {
     const database = new sqlite3.Database(databasePath);
 
     const target = Number(request.query.target);
@@ -23,16 +51,34 @@ newsAPI.get('/', async (request, response) => {
     const sqlQuery = `SELECT * FROM news WHERE date = ${target}`;
 
     try {
-        const result = await asyncDatabaseRead(database, sqlQuery, (rows) => {return rows[0]});
+        const result = await asyncDatabaseRead(database, sqlQuery, (rows) => { return rows[0] });
         database.close();
         response.send(result);
     } catch (err) {
         console.error(err);
         database.close();
     }
-});
+}
+newsAPI.get('/', getNewsEntry);
 
-newsAPI.post('/', async (request, response) => {
+/**
+ * Post news and write to database
+ * @param {Object} request
+ * @param {number} request.body.entryType - Number that represents type of news (0: article, 1: tweet)
+ * @param {string} request.body.cardContent - Content of news card, Markdown is allowed
+ * @param {string} request.body.article - Article written in Markdown
+ * @param {string} request.body.linkPath - Relative URL path to the article
+ * @param {string} request.body.coverImagePath - Relative URL path to the cover image
+ * @param {Object} response
+ * @returns result is logged into console
+ * @example
+ * $ curl -X POST \
+ *       -H 'Content-Type: application/x-www-form-urlencoded' \
+ *       --data-raw 'entryType=1&cardContent=Test&article=&linkPath=&coverImagePath=/default.png' \
+ *       http://localhost:3001/api/news
+ * // Posts Tweet style news with content "Test" and cover image "/default.png"
+ */
+const postNewsEntry = async (request, response) => {
     const database = new sqlite3.Database(databasePath);
 
     const currentDate = new Date();
@@ -55,9 +101,28 @@ newsAPI.post('/', async (request, response) => {
     }
     database.close();
     response.end();
-});
+};
+newsAPI.post('/', postNewsEntry);
 
-newsAPI.put('/', async (request, response) => {
+/**
+ * Update news entry
+ * @param {Object} request
+ * @param {number} request.body.target - Un*x timestamp to identify the entry
+ * @param {number} request.body.entryType - Number that represents type of news (0: article, 1: tweet)
+ * @param {string} request.body.cardContent - Content of news card, Markdown is allowed
+ * @param {string} request.body.article - Article written in Markdown
+ * @param {string} request.body.linkPath - Relative URL path to the article
+ * @param {string} request.body.coverImagePath - Relative URL path to the cover image
+ * @param {Object} response
+ * @returns result is logged into console
+ * @example
+ * $ curl -X PUT \
+ *       -H 'Content-Type: application/x-www-form-urlencoded' \
+ *       --data-raw 'target=0&entryType=1&cardContent=Test&article=&linkPath=&coverImagePath=default.png' \
+ *       http://localhost:3001/api/news
+ * // Update news posted on Un*x Epoch with given contents
+ */
+const putNewsEntry = async (request, response) => {
     const database = new sqlite3.Database(databasePath);
 
     const target = Number(request.body.target);
@@ -86,9 +151,21 @@ newsAPI.put('/', async (request, response) => {
 
     database.close();
     response.end();
-});
+};
+newsAPI.put('/', putNewsEntry);
 
-newsAPI.delete('/', async (request, response) => {
+/**
+ * Delete news specified by Un*x Timestamp
+ * @param {Object} request
+ * @param {number} request.query.target - Un*x timestamp to identify the entry
+ * @param {Object} response
+ * @returns result is logged into console
+ * @example
+ * $ curl -X DELETE \
+ *       http://localhost:3001/api/news?target=0
+ * // Delete news posted on Un*x Epoch
+ */
+const deleteNewsEntry = async (request, response) => {
     const database = new sqlite3.Database(databasePath);
 
     const target = Number(request.query.target);
@@ -113,30 +190,45 @@ newsAPI.delete('/', async (request, response) => {
     database.close();
 
     response.status(200).send();
-});
+};
+newsAPI.delete('/', deleteNewsEntry);
 
-newsAPI.get('/list', async (request, response) => {
+/**
+ * Get news list in HTML table body tr+td
+ * @param {Object} request
+ * @param {Object} response
+ * @returns {string} HTML table body tr+td
+ * @example
+ * $ curl -X GET \
+ *       http://localhost:3001/api/news/list
+ * // <tr>
+ * //     <td>1</td>
+ * //     <td>1970/1/1 0:0:0</td>
+ * //     ...
+ * // </tr>
+ * // ...
+ */
+const getNewsList = async (request, response) => {
     const database = new sqlite3.Database(databasePath);
     const sqlQuery = `SELECT id, date, entryType, cardContent FROM news ORDER BY date DESC;`;
     try {
         const result = await asyncDatabaseRead(database, sqlQuery, (rows) => {
             let ret = "";
-            for (const entry of rows) {
-                ret = ret + "<tr>\n";
-                for (const data in entry) {
-                    if (data == "entryType") {
-                        ret = ret + `\t<td>${entry[data] == 0 ? "Article" : "Tweet"}</td>\n`;
-                        continue;
-                    }
-                    if (data == "date") {
-                        ret = ret + `\t<td>${new Date(entry[data]).toLocaleString()}</td>\n`;
-                        continue;
-                    }
-                    ret = ret + `\t<td>${entry[data]}</td>\n`;
-                }
-                ret = ret + `\t<td>\n\t\t<button class='delete-button' hx-delete='/api/news?target=${entry["date"]}'>Delete</button>\n\t\t<a href='/update-news.html?target=${entry["date"]}'><button class='edit-button' hx-confirm='unset'>Edit</button></a>\n\t</td>\n</tr>\n`;
-            }
-            return ret
+            const rowsCopy = [...rows];
+            const rowsWithButtons = rowsCopy.map((entry) => {
+                const appendButtons = (value) => modifyOrAppendProperty(entry, "buttons", value);
+                return appendButtons(generateActionButtons(entry.date));
+            });
+            const renamedArticleTypeRows = rowsWithButtons.map((entry) => {
+                const modifyEntryType = (value) => modifyOrAppendProperty(entry, "entryType", value);
+                return modifyEntryType(renameArticleType(entry.entryType));
+            });
+            const convertedTimeRows = renamedArticleTypeRows.map((entry) => {
+                const modifyDate = (value) => modifyOrAppendProperty(entry, "date", value);
+                return modifyDate(unixTimeToHumanreadableTime(entry.date));
+            });
+            ret = wrapInTable(convertedTimeRows);
+            return ret;
         });
         database.close();
         response.send(result);
@@ -144,9 +236,20 @@ newsAPI.get('/list', async (request, response) => {
         console.error(err);
         database.close();
     }
-});
+};
+newsAPI.get('/list', getNewsList);
 
-newsAPI.get('/list-unwrapped', async (request, response) => {
+/**
+ * Get news list in unformated raw JSON string
+ * @param {Object} request
+ * @param {Object} response
+ * @returns {JSON} Unformatted JSON string that contains news entries
+ * @example
+ * $ curl -X GET \
+ *       http://localhost:3001/api/news/list-unwrapped
+ * // gets raw JSON containing news entries
+ */
+const getNewsListUnrwapped = async (request, response) => {
     const database = new sqlite3.Database(databasePath);
     const sqlQuery = `SELECT id, date, entryType, cardContent FROM news ORDER BY date DESC;`;
 
@@ -159,6 +262,7 @@ newsAPI.get('/list-unwrapped', async (request, response) => {
         console.error(err);
         database.close();
     }
-});
+};
+newsAPI.get('/list-unwrapped', getNewsListUnrwapped);
 
 export default newsAPI;

src-manager/docs/manager/1.0.0/api_gallery-image.js.html

@@ -0,0 +1,286 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <title>JSDoc: Source: api/gallery-image.js</title>
+
+    <script src="scripts/prettify/prettify.js"> </script>
+    <script src="scripts/prettify/lang-css.js"> </script>
+    <!--[if lt IE 9]>
+      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
+    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
+</head>
+
+<body>
+
+<div id="main">
+
+    <h1 class="page-title">Source: api/gallery-image.js</h1>
+
+    
+
+
+
+    
+    <section>
+        <article>
+            <pre class="prettyprint source linenums"><code>/** @module api/gallery-image */
+import express from 'express';
+import sqlite3 from 'sqlite3';
+import path from 'path';
+import { fileURLToPath } from 'url';
+import { asyncDatabaseRead, asyncDatabaseWrite } from '../utils/asyncDatabase.js';
+import { wrapInTable } from '../utils/tableWrapper.js';
+
+const galleryImageAPI = express.Router();
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const databasePath = path.join(__dirname, "../../assets/databases/gallery.db");
+
+function generateActionButtons(target) {
+    return `&lt;button class='delete-button' hx-delete='/api/gallery-image?target=${target}'>Delete&lt;/button>&lt;a href='/update-gallery-image.html?target=${target}'>&lt;button class='edit-button' hx-confirm='unset'>Edit&lt;/button>&lt;/a>`;
+}
+
+/**
+ * Gets list of gallery image entries in HTML table body tr+td
+ * @param {Object} request
+ * @param {Object} response
+ * @returns {string} HTML table body tr+td
+ * @example
+ * $ curl -X GET http://localhost:3001/api/gallery-image/list
+ * // &lt;tr>
+ * //     &lt;td>1&lt;/td>
+ * //     &lt;td>/image/test.png&lt;/td>
+ * //     ...
+ * // &lt;/tr>
+ * // ...
+ */
+const getGalleryImageList = async (request, response) => {
+    const database = new sqlite3.Database(databasePath);
+    const sqlQuery = "SELECT * FROM gallery";
+
+    try {
+        const result = await asyncDatabaseRead(database, sqlQuery, (rows) => {
+            let ret = "";
+            let rowsCopy = [...rows];
+            const withActionButtons = rowsCopy.map((entry) => {
+                return { ...entry, buttons: generateActionButtons(entry.id) };
+            });
+            ret = wrapInTable(withActionButtons);
+            return ret;
+        });
+
+        database.close()
+        response.send(result);
+    } catch (err) {
+        console.error(err);
+        database.close();
+        response.status(500).send(err);
+    }
+};
+galleryImageAPI.get('/list',getGalleryImageList);
+
+/**
+ * Gets list of gallery image entries in Unformatted JSON string
+ * @param {Object} request
+ * @param {Object} response
+ * @returns {string} Unformatted JSON string that contains gallery image entries
+ * @example
+ * $ curl -X GET \
+ *       http://localhost:3001/api/gallery-image/list-unwrapped
+ * // gets raw JSON containing gallery image entries
+ */
+const getGalleryImageListUnwrapped = async (request, response) => {
+    const database = new sqlite3.Database(databasePath);
+    const sqlQuery = "SELECT * FROM gallery";
+
+    try {
+        const result = await asyncDatabaseRead(database, sqlQuery, (rows) => { return rows; });
+
+        database.close();
+        response.send(result);
+    } catch (err) {
+        console.error(err);
+        database.close();
+        response.status(500).send(err);
+    }
+};
+galleryImageAPI.get('/list-unwrapped', getGalleryImageListUnwrapped);
+
+/**
+ * Get a gallery image information
+ * @param {Object} request
+ * @param {number} request.query.target - ID to specify gallery image entry
+ * @param {Object} response
+ * @returns {JSON} JSON that contains information about gallery image
+ * @example
+ * $ curl -X GET http://localhost:3001/api/gallery-image?target=1
+ * // gets gallery image information with ID of 1
+ */
+const getGalleryImage = async (request, response) => {
+    const database = new sqlite3.Database(databasePath);
+
+    const target = Number(request.query.target);
+
+    if (isNaN(target)) {
+        response.status(500).send("Query is not number");
+        return;
+    }
+
+    const sqlQuery = `SELECT * FROM gallery WHERE id = ${target}`;
+
+    try {
+        const result = await asyncDatabaseRead(database, sqlQuery, (rows) => {return rows[0]});
+        database.close();
+        response.send(result);
+    } catch (err) {
+        console.error(err);
+        database.close();
+        response.status(500).send(err);
+    }
+};
+galleryImageAPI.get('/', getGalleryImage);
+
+/**
+ * Posts gallery image
+ * @param {Object} request
+ * @param {string} request.body.imagePath - URL path to image
+ * @param {string} request.body.caption - Caption of image
+ * @param {Object} response
+ * @returns Result is logged into console
+ * @example
+ * $ curl -X POST \
+ *       -H 'Content-Type: application/x-www-form-urlencoded' \
+ *       --data-raw 'imagePath=/images/launch.png&amp;caption=Launch of our new rocket' \
+ *       http://localhost:3001/api/gallery-image/
+ * // Posts gallery image with given information
+ */
+const postGalleryImage = async (request, response) => {
+    const database = new sqlite3.Database(databasePath);
+
+    const imagePath = request.body.imagePath;
+    const caption = request.body.caption;
+
+    const sqlQuery = `INSERT INTO gallery (imagePath, caption) VALUES ("${imagePath}", "${caption}");`;
+
+    try {
+        await asyncDatabaseWrite(database, sqlQuery, () => {
+            console.log("Image added successfully.");
+        });
+    } catch (err) {
+        console.error(err);
+        response.status(500).send(err);
+    }
+
+    database.close();
+    response.end();
+};
+galleryImageAPI.post('/', postGalleryImage);
+
+/**
+ * Updates gallery image
+ * @param {Object} request
+ * @param {number} request.body.target - ID to specify gallery image entry
+ * @param {string} request.body.imagePath - URL path to image
+ * @param {string} request.body.caption - Caption of image
+ * @param {Object} response
+ * @returns Result is logged into console
+ * @example
+ * $ curl -X PUT \
+ *       -H 'Content-Type: application/x-www-form-urlencoded' \
+ *       --data-raw 'imagePath=/images/launch.png&amp;caption=Launch of our new rocket' \
+ *       http://localhost:3001/api/gallery-image/
+ * // Updates gallery image with given information
+ */
+const putGalleryImage = async (request, response) => {
+    const database = new sqlite3.Database(databasePath);
+
+    const target = Number(request.body.target);
+
+    if (isNaN(target)) {
+        response.status(500).send("Query is not number");
+        return;
+    }
+
+    const imagePath = request.body.imagePath;
+    const caption = request.body.caption;
+
+    const sqlQuery = `UPDATE gallery SET imagePath = "${imagePath}", caption = "${caption}" WHERE id = ${target};`;
+
+    try {
+        await asyncDatabaseWrite(database, sqlQuery, () => {
+            console.log("Image updated successfully.");
+        });
+    } catch (err) {
+        console.error(err);
+        response.status(500).send(err);
+    }
+
+    database.close();
+    response.end();
+};
+galleryImageAPI.put('/', putGalleryImage);
+
+/**
+ * Deletes specified gallery image
+ * @param {Object} request
+ * @param {string} request.query.target - ID to specify gallery image entry
+ * @param {Object} response
+ * @returns Result is logged into console
+ * @example
+ * $ curl -X DELETE \
+ *       http://localhost:3001/api/gallery-image?target=1
+ * // Deletes gallery image with ID of 1
+ */
+const deleteGalleryImage = async (request, response) => {
+    const database = new sqlite3.Database(databasePath);
+
+    const target = Number(request.query.target);
+
+    if (isNaN(target)) {
+        response.status(404).send('No Entry Found!');
+        return;
+    }
+
+    const sqlQuery = `DELETE FROM gallery WHERE id = ${target};`;
+
+    try {
+        await asyncDatabaseWrite(database, sqlQuery, () => {
+            console.log("Image deleted successfully.");
+        });
+    } catch (err) {
+        console.error(err);
+        response.status(500).send(err);
+    }
+
+    database.close();
+    response.status(200).send();
+};
+galleryImageAPI.delete('/', deleteGalleryImage);
+
+export default galleryImageAPI;
+</code></pre>
+        </article>
+    </section>
+
+
+
+
+</div>
+
+<nav>
+    <h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-api_gallery-image.html">api/gallery-image</a></li><li><a href="module-api_news.html">api/news</a></li><li><a href="module-utils_asyncDatabase.html">utils/asyncDatabase</a></li><li><a href="module-utils_tableWrapper.html">utils/tableWrapper</a></li></ul>
+</nav>
+
+<br class="clear">
+
+<footer>
+    Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.4</a> on Tue Nov 26 2024 23:18:12 GMT+0900 (日本標準時)
+</footer>
+
+<script> prettyPrint(); </script>
+<script src="scripts/linenumber.js"> </script>
+</body>
+</html>

src-manager/docs/manager/1.0.0/api_news.js.html

@@ -0,0 +1,319 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <title>JSDoc: Source: api/news.js</title>
+
+    <script src="scripts/prettify/prettify.js"> </script>
+    <script src="scripts/prettify/lang-css.js"> </script>
+    <!--[if lt IE 9]>
+      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
+    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
+</head>
+
+<body>
+
+<div id="main">
+
+    <h1 class="page-title">Source: api/news.js</h1>
+
+    
+
+
+
+    
+    <section>
+        <article>
+            <pre class="prettyprint source linenums"><code>/** @module api/news */
+import express from 'express';
+import sqlite3 from 'sqlite3';
+import path from 'path';
+import { fileURLToPath } from 'url';
+import { asyncDatabaseRead, asyncDatabaseWrite } from '../utils/asyncDatabase.js';
+import { wrapInTable } from '../utils/tableWrapper.js';
+
+const newsAPI = express.Router();
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const databasePath = path.join(__dirname, "../../assets/databases/news.db");
+
+function renameArticleType(entryType) {
+    return entryType == 0 ? "Article" : "Tweet";
+}
+
+function unixTimeToHumanreadableTime(unixTime) {
+    return (new Date(unixTime).toLocaleString());
+}
+
+function generateActionButtons(target) {
+    return `&lt;button class='delete-button' hx-delete='/api/news?target=${target}'>Delete&lt;/button>&lt;a href='/update-news.html?target=${target}'>&lt;button class='edit-button' hx-confirm='unset'>Edit&lt;/button>&lt;/a>`;
+}
+
+function modifyOrAppendProperty(targetObject, key, value) {
+    return { ...targetObject, [key]: value };
+}
+
+/**
+ * Get single news entry specified by Un*x Timestamp
+ * @param {Object} request
+ * @param {number} request.query.target - Un*x Timestamp to specify news entry
+ * @param {Object} response
+ * @returns {JSON} news entry data
+ * @example
+ * $ curl -X GET http://localhost:3001/api/news?target=0
+ * // gets news posted on Un*x epoch in JSON format
+ */
+const getNewsEntry = async (request, response) => {
+    const database = new sqlite3.Database(databasePath);
+
+    const target = Number(request.query.target);
+
+    if (isNaN(target)) {
+        console.error("Query is not number");
+        response.status(500).send("Query is not number");
+        return;
+    }
+
+    const sqlQuery = `SELECT * FROM news WHERE date = ${target}`;
+
+    try {
+        const result = await asyncDatabaseRead(database, sqlQuery, (rows) => { return rows[0] });
+        database.close();
+        response.send(result);
+    } catch (err) {
+        console.error(err);
+        database.close();
+    }
+}
+newsAPI.get('/', getNewsEntry);
+
+/**
+ * Post news and write to database
+ * @param {Object} request
+ * @param {number} request.body.entryType - Number that represents type of news (0: article, 1: tweet)
+ * @param {string} request.body.cardContent - Content of news card, Markdown is allowed
+ * @param {string} request.body.article - Article written in Markdown
+ * @param {string} request.body.linkPath - Relative URL path to the article
+ * @param {string} request.body.coverImagePath - Relative URL path to the cover image
+ * @param {Object} response
+ * @returns result is logged into console
+ * @example
+ * $ curl -X POST \
+ *       -H 'Content-Type: application/x-www-form-urlencoded' \
+ *       --data-raw 'entryType=1&amp;cardContent=Test&amp;article=&amp;linkPath=&amp;coverImagePath=/default.png' \
+ *       http://localhost:3001/api/news
+ * // Posts Tweet style news with content "Test" and cover image "/default.png"
+ */
+const postNewsEntry = async (request, response) => {
+    const database = new sqlite3.Database(databasePath);
+
+    const currentDate = new Date();
+    const currentUnixTime = currentDate.valueOf();
+    const entryType = request.body.entryType;
+    const cardContent = request.body.cardContent;
+    const article = request.body.article;
+    const linkPath = entryType == 0 ? `/news/${request.body.linkPath}` : "";
+    const coverImagePath = request.body.coverImagePath;
+
+    const sqlQuery = `INSERT INTO news (date, entryType, cardContent, article, linkPath, coverImagePath) VALUES (${currentUnixTime}, ${entryType}, "${cardContent}", "${article}", "${linkPath}", "${coverImagePath}");`;
+
+    try {
+        await asyncDatabaseWrite(database, sqlQuery, () => {
+            console.log("News added successfully.");
+        });
+    } catch (err) {
+        console.error(err);
+        response.status(500).send(err);
+    }
+    database.close();
+    response.end();
+};
+newsAPI.post('/', postNewsEntry);
+
+/**
+ * Update news entry
+ * @param {Object} request
+ * @param {number} request.body.target - Un*x timestamp to identify the entry
+ * @param {number} request.body.entryType - Number that represents type of news (0: article, 1: tweet)
+ * @param {string} request.body.cardContent - Content of news card, Markdown is allowed
+ * @param {string} request.body.article - Article written in Markdown
+ * @param {string} request.body.linkPath - Relative URL path to the article
+ * @param {string} request.body.coverImagePath - Relative URL path to the cover image
+ * @param {Object} response
+ * @returns result is logged into console
+ * @example
+ * $ curl -X PUT \
+ *       -H 'Content-Type: application/x-www-form-urlencoded' \
+ *       --data-raw 'target=0&amp;entryType=1&amp;cardContent=Test&amp;article=&amp;linkPath=&amp;coverImagePath=default.png' \
+ *       http://localhost:3001/api/news
+ * // Update news posted on Un*x Epoch with given contents
+ */
+const putNewsEntry = async (request, response) => {
+    const database = new sqlite3.Database(databasePath);
+
+    const target = Number(request.body.target);
+    const entryType = Number(request.body.entryType);
+    const cardContent = request.body.cardContent;
+    const article = request.body.article;
+    const linkPath = entryType == 0 ? `/news/${request.body.linkPath}` : "";
+    const coverImagePath = request.body.coverImagePath;
+
+    if (isNaN(target)) {
+        console.error('Target is not number');
+        response.status(500).send('Target is not number');
+        return;
+    }
+
+    const sqlQuery = `UPDATE news SET entryType = ${entryType}, cardContent = "${cardContent}", article = "${article}", linkPath = "${linkPath}", coverImagePath = "${coverImagePath}" WHERE date = ${target};`;
+
+    try {
+        await asyncDatabaseWrite(database, sqlQuery, () => {
+            console.log("News updated successfully.");
+        });
+    } catch (err) {
+        console.error(err);
+        response.status(500).send(err);
+    }
+
+    database.close();
+    response.end();
+};
+newsAPI.put('/', putNewsEntry);
+
+/**
+ * Delete news specified by Un*x Timestamp
+ * @param {Object} request
+ * @param {number} request.query.target - Un*x timestamp to identify the entry
+ * @param {Object} response
+ * @returns result is logged into console
+ * @example
+ * $ curl -X DELETE \
+ *       http://localhost:3001/api/news?target=0
+ * // Delete news posted on Un*x Epoch
+ */
+const deleteNewsEntry = async (request, response) => {
+    const database = new sqlite3.Database(databasePath);
+
+    const target = Number(request.query.target);
+
+    if (isNaN(target)) {
+        console.error('No Entry Found!');
+        response.status(404).send('No Entry Found!');
+        return;
+    }
+
+    const sqlQuery = `DELETE FROM news WHERE date = ${target}`;
+
+    try {
+        await asyncDatabaseWrite(database, sqlQuery, () => {
+            console.log("News deleted successfully.");
+        });
+    } catch (err) {
+        console.error(err);
+        response.status(500).send(err);
+    }
+
+    database.close();
+
+    response.status(200).send();
+};
+newsAPI.delete('/', deleteNewsEntry);
+
+/**
+ * Get news list in HTML table body tr+td
+ * @param {Object} request
+ * @param {Object} response
+ * @returns {string} HTML table body tr+td
+ * @example
+ * $ curl -X GET \
+ *       http://localhost:3001/api/news/list
+ * // &lt;tr>
+ * //     &lt;td>1&lt;/td>
+ * //     &lt;td>1970/1/1 0:0:0&lt;/td>
+ * //     ...
+ * // &lt;/tr>
+ * // ...
+ */
+const getNewsList = async (request, response) => {
+    const database = new sqlite3.Database(databasePath);
+    const sqlQuery = `SELECT id, date, entryType, cardContent FROM news ORDER BY date DESC;`;
+    try {
+        const result = await asyncDatabaseRead(database, sqlQuery, (rows) => {
+            let ret = "";
+            const rowsCopy = [...rows];
+            const rowsWithButtons = rowsCopy.map((entry) => {
+                const appendButtons = (value) => modifyOrAppendProperty(entry, "buttons", value);
+                return appendButtons(generateActionButtons(entry.date));
+            });
+            const renamedArticleTypeRows = rowsWithButtons.map((entry) => {
+                const modifyEntryType = (value) => modifyOrAppendProperty(entry, "entryType", value);
+                return modifyEntryType(renameArticleType(entry.entryType));
+            });
+            const convertedTimeRows = renamedArticleTypeRows.map((entry) => {
+                const modifyDate = (value) => modifyOrAppendProperty(entry, "date", value);
+                return modifyDate(unixTimeToHumanreadableTime(entry.date));
+            });
+            ret = wrapInTable(convertedTimeRows);
+            return ret;
+        });
+        database.close();
+        response.send(result);
+    } catch (err) {
+        console.error(err);
+        database.close();
+    }
+};
+newsAPI.get('/list', getNewsList);
+
+/**
+ * Get news list in unformated raw JSON string
+ * @param {Object} request
+ * @param {Object} response
+ * @returns {JSON} Unformatted JSON string that contains news entries
+ * @example
+ * $ curl -X GET \
+ *       http://localhost:3001/api/news/list-unwrapped
+ * // gets raw JSON containing news entries
+ */
+const getNewsListUnrwapped = async (request, response) => {
+    const database = new sqlite3.Database(databasePath);
+    const sqlQuery = `SELECT id, date, entryType, cardContent FROM news ORDER BY date DESC;`;
+
+    try {
+        const result = await asyncDatabaseRead(database, sqlQuery, (rows) => { return rows; });
+
+        database.close();
+        response.send(result);
+    } catch (err) {
+        console.error(err);
+        database.close();
+    }
+};
+newsAPI.get('/list-unwrapped', getNewsListUnrwapped);
+
+export default newsAPI;
+</code></pre>
+        </article>
+    </section>
+
+
+
+
+</div>
+
+<nav>
+    <h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-api_gallery-image.html">api/gallery-image</a></li><li><a href="module-api_news.html">api/news</a></li><li><a href="module-utils_asyncDatabase.html">utils/asyncDatabase</a></li><li><a href="module-utils_tableWrapper.html">utils/tableWrapper</a></li></ul>
+</nav>
+
+<br class="clear">
+
+<footer>
+    Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.4</a> on Tue Nov 26 2024 23:18:12 GMT+0900 (日本標準時)
+</footer>
+
+<script> prettyPrint(); </script>
+<script src="scripts/linenumber.js"> </script>
+</body>
+</html>

src-manager/docs/manager/1.0.0/index.html

@@ -0,0 +1,128 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <title>JSDoc: Home</title>
+
+    <script src="scripts/prettify/prettify.js"> </script>
+    <script src="scripts/prettify/lang-css.js"> </script>
+    <!--[if lt IE 9]>
+      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
+    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
+</head>
+
+<body>
+
+<div id="main">
+
+    <h1 class="page-title">Home</h1>
+
+    
+
+
+
+    
+
+
+    <h3>manager 1.0.0</h3>
+
+
+
+
+
+
+
+
+
+
+    
+
+
+
+
+    <section>
+        <article><h1 id="content-manager">Content Manager</h1>
+<p>SERA Websiteのニュース等のコンテンツを管理する</p>
+<h2 id="%E4%BD%BF%E7%94%A8%E8%A8%80%E8%AA%9E%E3%80%81%E3%83%A9%E3%82%A4%E3%83%96%E3%83%A9%E3%83%AA%E3%83%BC%E3%80%81%E3%83%95%E3%83%AC%E3%83%BC%E3%83%A0%E3%83%AF%E3%83%BC%E3%82%AF%E3%80%81%E3%83%84%E3%83%BC%E3%83%AB">使用言語、ライブラリー、フレームワーク、ツール</h2>
+<ul>
+<li>JavaScript</li>
+<li>express</li>
+<li>htmx</li>
+<li>axios</li>
+<li>node npm</li>
+<li>sqlite</li>
+</ul>
+<h2 id="%E4%BD%BF%E7%94%A8%E6%96%B9%E6%B3%95">使用方法</h2>
+<pre class="prettyprint source lang-bash"><code>cd src-manager/ # このディレクトリーに移動
+npm install # 依存パッケージのインストール、まだ一度も実行していない場合
+npm start # サーバーを起動、ブラウザで http://localhost:3001 に入る
+npm run dev # JSファイル変更時に自動リロードが入る開発サーバーを起動する。同じく http://localhost:3001 でホストされる
+npm run documentation # ドキュメンテーションを生成, &quot;./docs/manager/&lt;バージョン>/&quot; 内で `python -m http.server` 等でローカルでホストする
+</code></pre>
+<h2 id="%E3%83%87%E3%83%BC%E3%82%BF%E3%83%99%E3%83%BC%E3%82%B9">データベース</h2>
+<h3 id="%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%EF%BC%9A-news.db-%2F-%E3%83%86%E3%83%BC%E3%83%96%E3%83%AB%3A-news">ファイル： news.db / テーブル: news</h3>
+<ul>
+<li>id - PRIMARY KEY - 整数</li>
+<li>date - Unix時間 - 整数</li>
+<li>entryType - 記事(0) か ツイート風(1) - 整数</li>
+<li>cardContent - ニュースリストで表示されるコンテンツ、Markdown可 - 文字列(Markdown)</li>
+<li>article - Markdownで書かれた記事 - 文字列(Markdown)</li>
+<li>linkPath - ニュースリストで表示されるリンク先 - 文字列</li>
+<li>coverImagePath - ニュースリストで表示される画像へのパス - 文字列</li>
+</ul>
+<h3 id="%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%3A-gallery.db-%2F-%E3%83%86%E3%83%BC%E3%83%96%E3%83%AB%3A-gallery">ファイル: gallery.db / テーブル: gallery</h3>
+<ul>
+<li>id - PRIMARY KEY - 整数</li>
+<li>imagePath - 画像へのパス - 文字列</li>
+<li>caption - 画像の説明文 - 文字列</li>
+</ul>
+<h2 id="api(restful)">API(RESTful)</h2>
+<ul>
+<li>
+<p><code>/api/news</code></p>
+<ul>
+<li>GET(<code>/</code>): Unix時間で特定されたニュースの情報を取得する - <code>?target=&lt;Unix時間&gt;</code></li>
+<li>GET(<code>/list</code>): HTML/HTMX形式で全ニュースの情報を取得する</li>
+<li>GET(<code>/list-unwrapped</code>): JSON形式で全ニュースの情報を取得する</li>
+<li>POST: 新しいニュースを作成する</li>
+<li>PUT: ニュースの内容を更新する</li>
+<li>DELETE: Unix時間で特定されたニュースを削除する - <code>?target=&lt;Unix時間&gt;</code></li>
+</ul>
+</li>
+<li>
+<p><code>/api/gallery-image</code></p>
+<ul>
+<li>GET(<code>/</code>): IDで指定された画像へのパスと説明文を取得する - <code>?target=&lt;ID&gt;</code></li>
+<li>GET(<code>/list</code>): HTML/HTMX形式で全画像の情報を取得する</li>
+<li>GET(<code>/list-unwrapped</code>): JSON形式で全画像の情報を取得する</li>
+<li>POST: 新しい画像の情報を追加する</li>
+<li>PUT: 画像の情報を更新する</li>
+<li>DELETE: IDで指定された画像の情報を削除する - <code>?target=&lt;ID&gt;</code></li>
+</ul>
+</li>
+</ul></article>
+    </section>
+
+
+
+
+
+
+</div>
+
+<nav>
+    <h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-api_gallery-image.html">api/gallery-image</a></li><li><a href="module-api_news.html">api/news</a></li><li><a href="module-utils_asyncDatabase.html">utils/asyncDatabase</a></li><li><a href="module-utils_tableWrapper.html">utils/tableWrapper</a></li></ul>
+</nav>
+
+<br class="clear">
+
+<footer>
+    Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.4</a> on Tue Nov 26 2024 23:18:12 GMT+0900 (日本標準時)
+</footer>
+
+<script> prettyPrint(); </script>
+<script src="scripts/linenumber.js"> </script>
+</body>
+</html>

src-manager/docs/manager/1.0.0/module-utils_asyncDatabase.html

@@ -0,0 +1,506 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <title>JSDoc: Module: utils/asyncDatabase</title>
+
+    <script src="scripts/prettify/prettify.js"> </script>
+    <script src="scripts/prettify/lang-css.js"> </script>
+    <!--[if lt IE 9]>
+      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
+    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
+</head>
+
+<body>
+
+<div id="main">
+
+    <h1 class="page-title">Module: utils/asyncDatabase</h1>
+
+    
+
+
+
+
+<section>
+
+<header>
+    
+        
+    
+</header>
+
+<article>
+    <div class="container-overview">
+    
+        
+
+        
+    
+    </div>
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+        <h3 class="subsection-title">Methods</h3>
+
+        
+            
+
+    
+
+    
+    <h4 class="name" id="~asyncDatabaseRead"><span class="type-signature">(inner) </span>asyncDatabaseRead<span class="signature">(database, sqlQuery, callback)</span><span class="type-signature"> &rarr; {Promise.&lt;any>}</span></h4>
+    
+
+    
+
+
+
+
+
+
+
+
+
+
+
+    <h5>Parameters:</h5>
+    
+
+<table class="params">
+    <thead>
+    <tr>
+        
+        <th>Name</th>
+        
+
+        <th>Type</th>
+
+        
+
+        
+
+        <th class="last">Description</th>
+    </tr>
+    </thead>
+
+    <tbody>
+    
+
+        <tr>
+            
+                <td class="name"><code>database</code></td>
+            
+
+            <td class="type">
+            
+                
+<span class="param-type">sqlite3.Database</span>
+
+
+            
+            </td>
+
+            
+
+            
+
+            <td class="description last"></td>
+        </tr>
+
+    
+
+        <tr>
+            
+                <td class="name"><code>sqlQuery</code></td>
+            
+
+            <td class="type">
+            
+                
+<span class="param-type">string</span>
+
+
+            
+            </td>
+
+            
+
+            
+
+            <td class="description last"></td>
+        </tr>
+
+    
+
+        <tr>
+            
+                <td class="name"><code>callback</code></td>
+            
+
+            <td class="type">
+            
+                
+<span class="param-type">function</span>
+
+
+            
+            </td>
+
+            
+
+            
+
+            <td class="description last"><p>function (rows)</p></td>
+        </tr>
+
+    
+    </tbody>
+</table>
+
+
+
+
+
+
+<dl class="details">
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+    <dt class="tag-source">Source:</dt>
+    <dd class="tag-source"><ul class="dummy"><li>
+        <a href="utils_asyncDatabase.js.html">utils/asyncDatabase.js</a>, <a href="utils_asyncDatabase.js.html#line16">line 16</a>
+    </li></ul></dd>
+    
+
+    
+
+    
+
+    
+</dl>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<h5>Returns:</h5>
+
+        
+<div class="param-desc">
+    <p>Promise for database operation</p>
+</div>
+
+
+
+<dl>
+    <dt>
+        Type
+    </dt>
+    <dd>
+        
+<span class="param-type">Promise.&lt;any></span>
+
+
+    </dd>
+</dl>
+
+    
+
+
+
+
+    <h5>Example</h5>
+    
+    <pre class="prettyprint"><code>const result = await asyncDatabaseRead(userDatabase, `SELECT * FROM users`, (rows) => {
+    return wrapInTable(rows);
+});</code></pre>
+
+
+
+        
+            
+
+    
+
+    
+    <h4 class="name" id="~asyncDatabaseWrite"><span class="type-signature">(inner) </span>asyncDatabaseWrite<span class="signature">(database, sqlQuery, callback)</span><span class="type-signature"> &rarr; {Promise.&lt;any>}</span></h4>
+    
+
+    
+
+
+
+
+
+
+
+
+
+
+
+    <h5>Parameters:</h5>
+    
+
+<table class="params">
+    <thead>
+    <tr>
+        
+        <th>Name</th>
+        
+
+        <th>Type</th>
+
+        
+
+        
+
+        <th class="last">Description</th>
+    </tr>
+    </thead>
+
+    <tbody>
+    
+
+        <tr>
+            
+                <td class="name"><code>database</code></td>
+            
+
+            <td class="type">
+            
+                
+<span class="param-type">sqlite3.Database</span>
+
+
+            
+            </td>
+
+            
+
+            
+
+            <td class="description last"></td>
+        </tr>
+
+    
+
+        <tr>
+            
+                <td class="name"><code>sqlQuery</code></td>
+            
+
+            <td class="type">
+            
+                
+<span class="param-type">string</span>
+
+
+            
+            </td>
+
+            
+
+            
+
+            <td class="description last"></td>
+        </tr>
+
+    
+
+        <tr>
+            
+                <td class="name"><code>callback</code></td>
+            
+
+            <td class="type">
+            
+                
+<span class="param-type">function</span>
+
+
+            
+            </td>
+
+            
+
+            
+
+            <td class="description last"><p>function ()</p></td>
+        </tr>
+
+    
+    </tbody>
+</table>
+
+
+
+
+
+
+<dl class="details">
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+    <dt class="tag-source">Source:</dt>
+    <dd class="tag-source"><ul class="dummy"><li>
+        <a href="utils_asyncDatabase.js.html">utils/asyncDatabase.js</a>, <a href="utils_asyncDatabase.js.html#line41">line 41</a>
+    </li></ul></dd>
+    
+
+    
+
+    
+
+    
+</dl>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<h5>Returns:</h5>
+
+        
+<div class="param-desc">
+    <p>Promise for database operation</p>
+</div>
+
+
+
+<dl>
+    <dt>
+        Type
+    </dt>
+    <dd>
+        
+<span class="param-type">Promise.&lt;any></span>
+
+
+    </dd>
+</dl>
+
+    
+
+
+
+
+    <h5>Example</h5>
+    
+    <pre class="prettyprint"><code>let sqlQuery = `INSERT INTO users (id, name, age) VALUES (${genID()}, "${userName}", "${userAge}");`;
+await asyncDatabaseWrite(userDatabase, sqlQuery, () => {
+    console.log("Added User ", userName);
+});</code></pre>
+
+
+
+        
+    
+
+    
+
+    
+</article>
+
+</section>
+
+
+
+
+</div>
+
+<nav>
+    <h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-api_gallery-image.html">api/gallery-image</a></li><li><a href="module-api_news.html">api/news</a></li><li><a href="module-utils_asyncDatabase.html">utils/asyncDatabase</a></li><li><a href="module-utils_tableWrapper.html">utils/tableWrapper</a></li></ul>
+</nav>
+
+<br class="clear">
+
+<footer>
+    Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.4</a> on Tue Nov 26 2024 23:18:12 GMT+0900 (日本標準時)
+</footer>
+
+<script> prettyPrint(); </script>
+<script src="scripts/linenumber.js"> </script>
+</body>
+</html>

src-manager/docs/manager/1.0.0/module-utils_tableWrapper.html

@@ -0,0 +1,266 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <title>JSDoc: Module: utils/tableWrapper</title>
+
+    <script src="scripts/prettify/prettify.js"> </script>
+    <script src="scripts/prettify/lang-css.js"> </script>
+    <!--[if lt IE 9]>
+      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
+    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
+</head>
+
+<body>
+
+<div id="main">
+
+    <h1 class="page-title">Module: utils/tableWrapper</h1>
+
+    
+
+
+
+
+<section>
+
+<header>
+    
+        
+    
+</header>
+
+<article>
+    <div class="container-overview">
+    
+        
+
+        
+    
+    </div>
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+        <h3 class="subsection-title">Methods</h3>
+
+        
+            
+
+    
+
+    
+    <h4 class="name" id="~wrapInTable"><span class="type-signature">(inner) </span>wrapInTable<span class="signature">(target)</span><span class="type-signature"> &rarr; {string}</span></h4>
+    
+
+    
+
+
+
+<div class="description">
+    <p>Wrap object array into HTML table body tr+td's</p>
+</div>
+
+
+
+
+
+
+
+
+
+    <h5>Parameters:</h5>
+    
+
+<table class="params">
+    <thead>
+    <tr>
+        
+        <th>Name</th>
+        
+
+        <th>Type</th>
+
+        
+
+        
+
+        <th class="last">Description</th>
+    </tr>
+    </thead>
+
+    <tbody>
+    
+
+        <tr>
+            
+                <td class="name"><code>target</code></td>
+            
+
+            <td class="type">
+            
+                
+<span class="param-type">Array.&lt;Object></span>
+
+
+            
+            </td>
+
+            
+
+            
+
+            <td class="description last"><p>array of objects</p></td>
+        </tr>
+
+    
+    </tbody>
+</table>
+
+
+
+
+
+
+<dl class="details">
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+
+    
+    <dt class="tag-source">Source:</dt>
+    <dd class="tag-source"><ul class="dummy"><li>
+        <a href="utils_tableWrapper.js.html">utils/tableWrapper.js</a>, <a href="utils_tableWrapper.js.html#line25">line 25</a>
+    </li></ul></dd>
+    
+
+    
+
+    
+
+    
+</dl>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<h5>Returns:</h5>
+
+        
+<div class="param-desc">
+    <p>Stringed HTML table body tr+td's</p>
+</div>
+
+
+
+<dl>
+    <dt>
+        Type
+    </dt>
+    <dd>
+        
+<span class="param-type">string</span>
+
+
+    </dd>
+</dl>
+
+    
+
+
+
+
+    <h5>Example</h5>
+    
+    <pre class="prettyprint"><code>const data = [
+    {id: 1, name: "John"},
+    {id: 2, name: "Marry"},
+];
+const responseHTML = wrapInTable(data);
+// responseHTML =
+// &lt;tr>
+//     &lt;td>1&lt;/td>
+//     &lt;td>John&lt;/td>
+// &lt;/tr>
+// &lt;tr>
+//     &lt;td>2&lt;/td>
+//     &lt;td>Marry&lt;/td>
+// &lt;/tr></code></pre>
+
+
+
+        
+    
+
+    
+
+    
+</article>
+
+</section>
+
+
+
+
+</div>
+
+<nav>
+    <h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-api_gallery-image.html">api/gallery-image</a></li><li><a href="module-api_news.html">api/news</a></li><li><a href="module-utils_asyncDatabase.html">utils/asyncDatabase</a></li><li><a href="module-utils_tableWrapper.html">utils/tableWrapper</a></li></ul>
+</nav>
+
+<br class="clear">
+
+<footer>
+    Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.4</a> on Tue Nov 26 2024 23:18:12 GMT+0900 (日本標準時)
+</footer>
+
+<script> prettyPrint(); </script>
+<script src="scripts/linenumber.js"> </script>
+</body>
+</html>

src-manager/docs/manager/1.0.0/scripts/linenumber.js

@@ -0,0 +1,25 @@
+/*global document */
+(() => {
+    const source = document.getElementsByClassName('prettyprint source linenums');
+    let i = 0;
+    let lineNumber = 0;
+    let lineId;
+    let lines;
+    let totalLines;
+    let anchorHash;
+
+    if (source && source[0]) {
+        anchorHash = document.location.hash.substring(1);
+        lines = source[0].getElementsByTagName('li');
+        totalLines = lines.length;
+
+        for (; i < totalLines; i++) {
+            lineNumber++;
+            lineId = `line${lineNumber}`;
+            lines[i].id = lineId;
+            if (lineId === anchorHash) {
+                lines[i].className += ' selected';
+            }
+        }
+    }
+})();

src-manager/docs/manager/1.0.0/scripts/prettify/Apache-License-2.0.txt

@@ -0,0 +1,202 @@
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

src-manager/docs/manager/1.0.0/scripts/prettify/lang-css.js

@@ -0,0 +1,2 @@
+PR.registerLangHandler(PR.createSimpleLexer([["pln",/^[\t\n\f\r ]+/,null," \t\r\n"]],[["str",/^"(?:[^\n\f\r"\\]|\\(?:\r\n?|\n|\f)|\\[\S\s])*"/,null],["str",/^'(?:[^\n\f\r'\\]|\\(?:\r\n?|\n|\f)|\\[\S\s])*'/,null],["lang-css-str",/^url\(([^"')]*)\)/i],["kwd",/^(?:url|rgb|!important|@import|@page|@media|@charset|inherit)(?=[^\w-]|$)/i,null],["lang-css-kw",/^(-?(?:[_a-z]|\\[\da-f]+ ?)(?:[\w-]|\\\\[\da-f]+ ?)*)\s*:/i],["com",/^\/\*[^*]*\*+(?:[^*/][^*]*\*+)*\//],["com",
+/^(?:<\!--|--\>)/],["lit",/^(?:\d+|\d*\.\d+)(?:%|[a-z]+)?/i],["lit",/^#[\da-f]{3,6}/i],["pln",/^-?(?:[_a-z]|\\[\da-f]+ ?)(?:[\w-]|\\\\[\da-f]+ ?)*/i],["pun",/^[^\s\w"']+/]]),["css"]);PR.registerLangHandler(PR.createSimpleLexer([],[["kwd",/^-?(?:[_a-z]|\\[\da-f]+ ?)(?:[\w-]|\\\\[\da-f]+ ?)*/i]]),["css-kw"]);PR.registerLangHandler(PR.createSimpleLexer([],[["str",/^[^"')]+/]]),["css-str"]);

src-manager/docs/manager/1.0.0/scripts/prettify/prettify.js

@@ -0,0 +1,28 @@
+var q=null;window.PR_SHOULD_USE_CONTINUATION=!0;
+(function(){function L(a){function m(a){var f=a.charCodeAt(0);if(f!==92)return f;var b=a.charAt(1);return(f=r[b])?f:"0"<=b&&b<="7"?parseInt(a.substring(1),8):b==="u"||b==="x"?parseInt(a.substring(2),16):a.charCodeAt(1)}function e(a){if(a<32)return(a<16?"\\x0":"\\x")+a.toString(16);a=String.fromCharCode(a);if(a==="\\"||a==="-"||a==="["||a==="]")a="\\"+a;return a}function h(a){for(var f=a.substring(1,a.length-1).match(/\\u[\dA-Fa-f]{4}|\\x[\dA-Fa-f]{2}|\\[0-3][0-7]{0,2}|\\[0-7]{1,2}|\\[\S\s]|[^\\]/g),a=
+[],b=[],o=f[0]==="^",c=o?1:0,i=f.length;c<i;++c){var j=f[c];if(/\\[bdsw]/i.test(j))a.push(j);else{var j=m(j),d;c+2<i&&"-"===f[c+1]?(d=m(f[c+2]),c+=2):d=j;b.push([j,d]);d<65||j>122||(d<65||j>90||b.push([Math.max(65,j)|32,Math.min(d,90)|32]),d<97||j>122||b.push([Math.max(97,j)&-33,Math.min(d,122)&-33]))}}b.sort(function(a,f){return a[0]-f[0]||f[1]-a[1]});f=[];j=[NaN,NaN];for(c=0;c<b.length;++c)i=b[c],i[0]<=j[1]+1?j[1]=Math.max(j[1],i[1]):f.push(j=i);b=["["];o&&b.push("^");b.push.apply(b,a);for(c=0;c<
+f.length;++c)i=f[c],b.push(e(i[0])),i[1]>i[0]&&(i[1]+1>i[0]&&b.push("-"),b.push(e(i[1])));b.push("]");return b.join("")}function y(a){for(var f=a.source.match(/\[(?:[^\\\]]|\\[\S\s])*]|\\u[\dA-Fa-f]{4}|\\x[\dA-Fa-f]{2}|\\\d+|\\[^\dux]|\(\?[!:=]|[()^]|[^()[\\^]+/g),b=f.length,d=[],c=0,i=0;c<b;++c){var j=f[c];j==="("?++i:"\\"===j.charAt(0)&&(j=+j.substring(1))&&j<=i&&(d[j]=-1)}for(c=1;c<d.length;++c)-1===d[c]&&(d[c]=++t);for(i=c=0;c<b;++c)j=f[c],j==="("?(++i,d[i]===void 0&&(f[c]="(?:")):"\\"===j.charAt(0)&&
+(j=+j.substring(1))&&j<=i&&(f[c]="\\"+d[i]);for(i=c=0;c<b;++c)"^"===f[c]&&"^"!==f[c+1]&&(f[c]="");if(a.ignoreCase&&s)for(c=0;c<b;++c)j=f[c],a=j.charAt(0),j.length>=2&&a==="["?f[c]=h(j):a!=="\\"&&(f[c]=j.replace(/[A-Za-z]/g,function(a){a=a.charCodeAt(0);return"["+String.fromCharCode(a&-33,a|32)+"]"}));return f.join("")}for(var t=0,s=!1,l=!1,p=0,d=a.length;p<d;++p){var g=a[p];if(g.ignoreCase)l=!0;else if(/[a-z]/i.test(g.source.replace(/\\u[\da-f]{4}|\\x[\da-f]{2}|\\[^UXux]/gi,""))){s=!0;l=!1;break}}for(var r=
+{b:8,t:9,n:10,v:11,f:12,r:13},n=[],p=0,d=a.length;p<d;++p){g=a[p];if(g.global||g.multiline)throw Error(""+g);n.push("(?:"+y(g)+")")}return RegExp(n.join("|"),l?"gi":"g")}function M(a){function m(a){switch(a.nodeType){case 1:if(e.test(a.className))break;for(var g=a.firstChild;g;g=g.nextSibling)m(g);g=a.nodeName;if("BR"===g||"LI"===g)h[s]="\n",t[s<<1]=y++,t[s++<<1|1]=a;break;case 3:case 4:g=a.nodeValue,g.length&&(g=p?g.replace(/\r\n?/g,"\n"):g.replace(/[\t\n\r ]+/g," "),h[s]=g,t[s<<1]=y,y+=g.length,
+t[s++<<1|1]=a)}}var e=/(?:^|\s)nocode(?:\s|$)/,h=[],y=0,t=[],s=0,l;a.currentStyle?l=a.currentStyle.whiteSpace:window.getComputedStyle&&(l=document.defaultView.getComputedStyle(a,q).getPropertyValue("white-space"));var p=l&&"pre"===l.substring(0,3);m(a);return{a:h.join("").replace(/\n$/,""),c:t}}function B(a,m,e,h){m&&(a={a:m,d:a},e(a),h.push.apply(h,a.e))}function x(a,m){function e(a){for(var l=a.d,p=[l,"pln"],d=0,g=a.a.match(y)||[],r={},n=0,z=g.length;n<z;++n){var f=g[n],b=r[f],o=void 0,c;if(typeof b===
+"string")c=!1;else{var i=h[f.charAt(0)];if(i)o=f.match(i[1]),b=i[0];else{for(c=0;c<t;++c)if(i=m[c],o=f.match(i[1])){b=i[0];break}o||(b="pln")}if((c=b.length>=5&&"lang-"===b.substring(0,5))&&!(o&&typeof o[1]==="string"))c=!1,b="src";c||(r[f]=b)}i=d;d+=f.length;if(c){c=o[1];var j=f.indexOf(c),k=j+c.length;o[2]&&(k=f.length-o[2].length,j=k-c.length);b=b.substring(5);B(l+i,f.substring(0,j),e,p);B(l+i+j,c,C(b,c),p);B(l+i+k,f.substring(k),e,p)}else p.push(l+i,b)}a.e=p}var h={},y;(function(){for(var e=a.concat(m),
+l=[],p={},d=0,g=e.length;d<g;++d){var r=e[d],n=r[3];if(n)for(var k=n.length;--k>=0;)h[n.charAt(k)]=r;r=r[1];n=""+r;p.hasOwnProperty(n)||(l.push(r),p[n]=q)}l.push(/[\S\s]/);y=L(l)})();var t=m.length;return e}function u(a){var m=[],e=[];a.tripleQuotedStrings?m.push(["str",/^(?:'''(?:[^'\\]|\\[\S\s]|''?(?=[^']))*(?:'''|$)|"""(?:[^"\\]|\\[\S\s]|""?(?=[^"]))*(?:"""|$)|'(?:[^'\\]|\\[\S\s])*(?:'|$)|"(?:[^"\\]|\\[\S\s])*(?:"|$))/,q,"'\""]):a.multiLineStrings?m.push(["str",/^(?:'(?:[^'\\]|\\[\S\s])*(?:'|$)|"(?:[^"\\]|\\[\S\s])*(?:"|$)|`(?:[^\\`]|\\[\S\s])*(?:`|$))/,
+q,"'\"`"]):m.push(["str",/^(?:'(?:[^\n\r'\\]|\\.)*(?:'|$)|"(?:[^\n\r"\\]|\\.)*(?:"|$))/,q,"\"'"]);a.verbatimStrings&&e.push(["str",/^@"(?:[^"]|"")*(?:"|$)/,q]);var h=a.hashComments;h&&(a.cStyleComments?(h>1?m.push(["com",/^#(?:##(?:[^#]|#(?!##))*(?:###|$)|.*)/,q,"#"]):m.push(["com",/^#(?:(?:define|elif|else|endif|error|ifdef|include|ifndef|line|pragma|undef|warning)\b|[^\n\r]*)/,q,"#"]),e.push(["str",/^<(?:(?:(?:\.\.\/)*|\/?)(?:[\w-]+(?:\/[\w-]+)+)?[\w-]+\.h|[a-z]\w*)>/,q])):m.push(["com",/^#[^\n\r]*/,
+q,"#"]));a.cStyleComments&&(e.push(["com",/^\/\/[^\n\r]*/,q]),e.push(["com",/^\/\*[\S\s]*?(?:\*\/|$)/,q]));a.regexLiterals&&e.push(["lang-regex",/^(?:^^\.?|[!+-]|!=|!==|#|%|%=|&|&&|&&=|&=|\(|\*|\*=|\+=|,|-=|->|\/|\/=|:|::|;|<|<<|<<=|<=|=|==|===|>|>=|>>|>>=|>>>|>>>=|[?@[^]|\^=|\^\^|\^\^=|{|\||\|=|\|\||\|\|=|~|break|case|continue|delete|do|else|finally|instanceof|return|throw|try|typeof)\s*(\/(?=[^*/])(?:[^/[\\]|\\[\S\s]|\[(?:[^\\\]]|\\[\S\s])*(?:]|$))+\/)/]);(h=a.types)&&e.push(["typ",h]);a=(""+a.keywords).replace(/^ | $/g,
+"");a.length&&e.push(["kwd",RegExp("^(?:"+a.replace(/[\s,]+/g,"|")+")\\b"),q]);m.push(["pln",/^\s+/,q," \r\n\t\xa0"]);e.push(["lit",/^@[$_a-z][\w$@]*/i,q],["typ",/^(?:[@_]?[A-Z]+[a-z][\w$@]*|\w+_t\b)/,q],["pln",/^[$_a-z][\w$@]*/i,q],["lit",/^(?:0x[\da-f]+|(?:\d(?:_\d+)*\d*(?:\.\d*)?|\.\d\+)(?:e[+-]?\d+)?)[a-z]*/i,q,"0123456789"],["pln",/^\\[\S\s]?/,q],["pun",/^.[^\s\w"-$'./@\\`]*/,q]);return x(m,e)}function D(a,m){function e(a){switch(a.nodeType){case 1:if(k.test(a.className))break;if("BR"===a.nodeName)h(a),
+a.parentNode&&a.parentNode.removeChild(a);else for(a=a.firstChild;a;a=a.nextSibling)e(a);break;case 3:case 4:if(p){var b=a.nodeValue,d=b.match(t);if(d){var c=b.substring(0,d.index);a.nodeValue=c;(b=b.substring(d.index+d[0].length))&&a.parentNode.insertBefore(s.createTextNode(b),a.nextSibling);h(a);c||a.parentNode.removeChild(a)}}}}function h(a){function b(a,d){var e=d?a.cloneNode(!1):a,f=a.parentNode;if(f){var f=b(f,1),g=a.nextSibling;f.appendChild(e);for(var h=g;h;h=g)g=h.nextSibling,f.appendChild(h)}return e}
+for(;!a.nextSibling;)if(a=a.parentNode,!a)return;for(var a=b(a.nextSibling,0),e;(e=a.parentNode)&&e.nodeType===1;)a=e;d.push(a)}var k=/(?:^|\s)nocode(?:\s|$)/,t=/\r\n?|\n/,s=a.ownerDocument,l;a.currentStyle?l=a.currentStyle.whiteSpace:window.getComputedStyle&&(l=s.defaultView.getComputedStyle(a,q).getPropertyValue("white-space"));var p=l&&"pre"===l.substring(0,3);for(l=s.createElement("LI");a.firstChild;)l.appendChild(a.firstChild);for(var d=[l],g=0;g<d.length;++g)e(d[g]);m===(m|0)&&d[0].setAttribute("value",
+m);var r=s.createElement("OL");r.className="linenums";for(var n=Math.max(0,m-1|0)||0,g=0,z=d.length;g<z;++g)l=d[g],l.className="L"+(g+n)%10,l.firstChild||l.appendChild(s.createTextNode("\xa0")),r.appendChild(l);a.appendChild(r)}function k(a,m){for(var e=m.length;--e>=0;){var h=m[e];A.hasOwnProperty(h)?window.console&&console.warn("cannot override language handler %s",h):A[h]=a}}function C(a,m){if(!a||!A.hasOwnProperty(a))a=/^\s*</.test(m)?"default-markup":"default-code";return A[a]}function E(a){var m=
+a.g;try{var e=M(a.h),h=e.a;a.a=h;a.c=e.c;a.d=0;C(m,h)(a);var k=/\bMSIE\b/.test(navigator.userAgent),m=/\n/g,t=a.a,s=t.length,e=0,l=a.c,p=l.length,h=0,d=a.e,g=d.length,a=0;d[g]=s;var r,n;for(n=r=0;n<g;)d[n]!==d[n+2]?(d[r++]=d[n++],d[r++]=d[n++]):n+=2;g=r;for(n=r=0;n<g;){for(var z=d[n],f=d[n+1],b=n+2;b+2<=g&&d[b+1]===f;)b+=2;d[r++]=z;d[r++]=f;n=b}for(d.length=r;h<p;){var o=l[h+2]||s,c=d[a+2]||s,b=Math.min(o,c),i=l[h+1],j;if(i.nodeType!==1&&(j=t.substring(e,b))){k&&(j=j.replace(m,"\r"));i.nodeValue=
+j;var u=i.ownerDocument,v=u.createElement("SPAN");v.className=d[a+1];var x=i.parentNode;x.replaceChild(v,i);v.appendChild(i);e<o&&(l[h+1]=i=u.createTextNode(t.substring(b,o)),x.insertBefore(i,v.nextSibling))}e=b;e>=o&&(h+=2);e>=c&&(a+=2)}}catch(w){"console"in window&&console.log(w&&w.stack?w.stack:w)}}var v=["break,continue,do,else,for,if,return,while"],w=[[v,"auto,case,char,const,default,double,enum,extern,float,goto,int,long,register,short,signed,sizeof,static,struct,switch,typedef,union,unsigned,void,volatile"],
+"catch,class,delete,false,import,new,operator,private,protected,public,this,throw,true,try,typeof"],F=[w,"alignof,align_union,asm,axiom,bool,concept,concept_map,const_cast,constexpr,decltype,dynamic_cast,explicit,export,friend,inline,late_check,mutable,namespace,nullptr,reinterpret_cast,static_assert,static_cast,template,typeid,typename,using,virtual,where"],G=[w,"abstract,boolean,byte,extends,final,finally,implements,import,instanceof,null,native,package,strictfp,super,synchronized,throws,transient"],
+H=[G,"as,base,by,checked,decimal,delegate,descending,dynamic,event,fixed,foreach,from,group,implicit,in,interface,internal,into,is,lock,object,out,override,orderby,params,partial,readonly,ref,sbyte,sealed,stackalloc,string,select,uint,ulong,unchecked,unsafe,ushort,var"],w=[w,"debugger,eval,export,function,get,null,set,undefined,var,with,Infinity,NaN"],I=[v,"and,as,assert,class,def,del,elif,except,exec,finally,from,global,import,in,is,lambda,nonlocal,not,or,pass,print,raise,try,with,yield,False,True,None"],
+J=[v,"alias,and,begin,case,class,def,defined,elsif,end,ensure,false,in,module,next,nil,not,or,redo,rescue,retry,self,super,then,true,undef,unless,until,when,yield,BEGIN,END"],v=[v,"case,done,elif,esac,eval,fi,function,in,local,set,then,until"],K=/^(DIR|FILE|vector|(de|priority_)?queue|list|stack|(const_)?iterator|(multi)?(set|map)|bitset|u?(int|float)\d*)/,N=/\S/,O=u({keywords:[F,H,w,"caller,delete,die,do,dump,elsif,eval,exit,foreach,for,goto,if,import,last,local,my,next,no,our,print,package,redo,require,sub,undef,unless,until,use,wantarray,while,BEGIN,END"+
+I,J,v],hashComments:!0,cStyleComments:!0,multiLineStrings:!0,regexLiterals:!0}),A={};k(O,["default-code"]);k(x([],[["pln",/^[^<?]+/],["dec",/^<!\w[^>]*(?:>|$)/],["com",/^<\!--[\S\s]*?(?:--\>|$)/],["lang-",/^<\?([\S\s]+?)(?:\?>|$)/],["lang-",/^<%([\S\s]+?)(?:%>|$)/],["pun",/^(?:<[%?]|[%?]>)/],["lang-",/^<xmp\b[^>]*>([\S\s]+?)<\/xmp\b[^>]*>/i],["lang-js",/^<script\b[^>]*>([\S\s]*?)(<\/script\b[^>]*>)/i],["lang-css",/^<style\b[^>]*>([\S\s]*?)(<\/style\b[^>]*>)/i],["lang-in.tag",/^(<\/?[a-z][^<>]*>)/i]]),
+["default-markup","htm","html","mxml","xhtml","xml","xsl"]);k(x([["pln",/^\s+/,q," \t\r\n"],["atv",/^(?:"[^"]*"?|'[^']*'?)/,q,"\"'"]],[["tag",/^^<\/?[a-z](?:[\w-.:]*\w)?|\/?>$/i],["atn",/^(?!style[\s=]|on)[a-z](?:[\w:-]*\w)?/i],["lang-uq.val",/^=\s*([^\s"'>]*(?:[^\s"'/>]|\/(?=\s)))/],["pun",/^[/<->]+/],["lang-js",/^on\w+\s*=\s*"([^"]+)"/i],["lang-js",/^on\w+\s*=\s*'([^']+)'/i],["lang-js",/^on\w+\s*=\s*([^\s"'>]+)/i],["lang-css",/^style\s*=\s*"([^"]+)"/i],["lang-css",/^style\s*=\s*'([^']+)'/i],["lang-css",
+/^style\s*=\s*([^\s"'>]+)/i]]),["in.tag"]);k(x([],[["atv",/^[\S\s]+/]]),["uq.val"]);k(u({keywords:F,hashComments:!0,cStyleComments:!0,types:K}),["c","cc","cpp","cxx","cyc","m"]);k(u({keywords:"null,true,false"}),["json"]);k(u({keywords:H,hashComments:!0,cStyleComments:!0,verbatimStrings:!0,types:K}),["cs"]);k(u({keywords:G,cStyleComments:!0}),["java"]);k(u({keywords:v,hashComments:!0,multiLineStrings:!0}),["bsh","csh","sh"]);k(u({keywords:I,hashComments:!0,multiLineStrings:!0,tripleQuotedStrings:!0}),
+["cv","py"]);k(u({keywords:"caller,delete,die,do,dump,elsif,eval,exit,foreach,for,goto,if,import,last,local,my,next,no,our,print,package,redo,require,sub,undef,unless,until,use,wantarray,while,BEGIN,END",hashComments:!0,multiLineStrings:!0,regexLiterals:!0}),["perl","pl","pm"]);k(u({keywords:J,hashComments:!0,multiLineStrings:!0,regexLiterals:!0}),["rb"]);k(u({keywords:w,cStyleComments:!0,regexLiterals:!0}),["js"]);k(u({keywords:"all,and,by,catch,class,else,extends,false,finally,for,if,in,is,isnt,loop,new,no,not,null,of,off,on,or,return,super,then,true,try,unless,until,when,while,yes",
+hashComments:3,cStyleComments:!0,multilineStrings:!0,tripleQuotedStrings:!0,regexLiterals:!0}),["coffee"]);k(x([],[["str",/^[\S\s]+/]]),["regex"]);window.prettyPrintOne=function(a,m,e){var h=document.createElement("PRE");h.innerHTML=a;e&&D(h,e);E({g:m,i:e,h:h});return h.innerHTML};window.prettyPrint=function(a){function m(){for(var e=window.PR_SHOULD_USE_CONTINUATION?l.now()+250:Infinity;p<h.length&&l.now()<e;p++){var n=h[p],k=n.className;if(k.indexOf("prettyprint")>=0){var k=k.match(g),f,b;if(b=
+!k){b=n;for(var o=void 0,c=b.firstChild;c;c=c.nextSibling)var i=c.nodeType,o=i===1?o?b:c:i===3?N.test(c.nodeValue)?b:o:o;b=(f=o===b?void 0:o)&&"CODE"===f.tagName}b&&(k=f.className.match(g));k&&(k=k[1]);b=!1;for(o=n.parentNode;o;o=o.parentNode)if((o.tagName==="pre"||o.tagName==="code"||o.tagName==="xmp")&&o.className&&o.className.indexOf("prettyprint")>=0){b=!0;break}b||((b=(b=n.className.match(/\blinenums\b(?::(\d+))?/))?b[1]&&b[1].length?+b[1]:!0:!1)&&D(n,b),d={g:k,h:n,i:b},E(d))}}p<h.length?setTimeout(m,
+250):a&&a()}for(var e=[document.getElementsByTagName("pre"),document.getElementsByTagName("code"),document.getElementsByTagName("xmp")],h=[],k=0;k<e.length;++k)for(var t=0,s=e[k].length;t<s;++t)h.push(e[k][t]);var e=q,l=Date;l.now||(l={now:function(){return+new Date}});var p=0,d,g=/\blang(?:uage)?-([\w.]+)(?!\S)/;m()};window.PR={createSimpleLexer:x,registerLangHandler:k,sourceDecorator:u,PR_ATTRIB_NAME:"atn",PR_ATTRIB_VALUE:"atv",PR_COMMENT:"com",PR_DECLARATION:"dec",PR_KEYWORD:"kwd",PR_LITERAL:"lit",
+PR_NOCODE:"nocode",PR_PLAIN:"pln",PR_PUNCTUATION:"pun",PR_SOURCE:"src",PR_STRING:"str",PR_TAG:"tag",PR_TYPE:"typ"}})();

src-manager/docs/manager/1.0.0/styles/jsdoc-default.css

@@ -0,0 +1,358 @@
+@font-face {
+    font-family: 'Open Sans';
+    font-weight: normal;
+    font-style: normal;
+    src: url('../fonts/OpenSans-Regular-webfont.eot');
+    src:
+        local('Open Sans'),
+        local('OpenSans'),
+        url('../fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
+        url('../fonts/OpenSans-Regular-webfont.woff') format('woff'),
+        url('../fonts/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
+}
+
+@font-face {
+    font-family: 'Open Sans Light';
+    font-weight: normal;
+    font-style: normal;
+    src: url('../fonts/OpenSans-Light-webfont.eot');
+    src:
+        local('Open Sans Light'),
+        local('OpenSans Light'),
+        url('../fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
+        url('../fonts/OpenSans-Light-webfont.woff') format('woff'),
+        url('../fonts/OpenSans-Light-webfont.svg#open_sanslight') format('svg');
+}
+
+html
+{
+    overflow: auto;
+    background-color: #fff;
+    font-size: 14px;
+}
+
+body
+{
+    font-family: 'Open Sans', sans-serif;
+    line-height: 1.5;
+    color: #4d4e53;
+    background-color: white;
+}
+
+a, a:visited, a:active {
+    color: #0095dd;
+    text-decoration: none;
+}
+
+a:hover {
+    text-decoration: underline;
+}
+
+header
+{
+    display: block;
+    padding: 0px 4px;
+}
+
+tt, code, kbd, samp {
+    font-family: Consolas, Monaco, 'Andale Mono', monospace;
+}
+
+.class-description {
+    font-size: 130%;
+    line-height: 140%;
+    margin-bottom: 1em;
+    margin-top: 1em;
+}
+
+.class-description:empty {
+    margin: 0;
+}
+
+#main {
+    float: left;
+    width: 70%;
+}
+
+article dl {
+    margin-bottom: 40px;
+}
+
+article img {
+  max-width: 100%;
+}
+
+section
+{
+    display: block;
+    background-color: #fff;
+    padding: 12px 24px;
+    border-bottom: 1px solid #ccc;
+    margin-right: 30px;
+}
+
+.variation {
+    display: none;
+}
+
+.signature-attributes {
+    font-size: 60%;
+    color: #aaa;
+    font-style: italic;
+    font-weight: lighter;
+}
+
+nav
+{
+    display: block;
+    float: right;
+    margin-top: 28px;
+    width: 30%;
+    box-sizing: border-box;
+    border-left: 1px solid #ccc;
+    padding-left: 16px;
+}
+
+nav ul {
+    font-family: 'Lucida Grande', 'Lucida Sans Unicode', arial, sans-serif;
+    font-size: 100%;
+    line-height: 17px;
+    padding: 0;
+    margin: 0;
+    list-style-type: none;
+}
+
+nav ul a, nav ul a:visited, nav ul a:active {
+    font-family: Consolas, Monaco, 'Andale Mono', monospace;
+    line-height: 18px;
+    color: #4D4E53;
+}
+
+nav h3 {
+    margin-top: 12px;
+}
+
+nav li {
+    margin-top: 6px;
+}
+
+footer {
+    display: block;
+    padding: 6px;
+    margin-top: 12px;
+    font-style: italic;
+    font-size: 90%;
+}
+
+h1, h2, h3, h4 {
+    font-weight: 200;
+    margin: 0;
+}
+
+h1
+{
+    font-family: 'Open Sans Light', sans-serif;
+    font-size: 48px;
+    letter-spacing: -2px;
+    margin: 12px 24px 20px;
+}
+
+h2, h3.subsection-title
+{
+    font-size: 30px;
+    font-weight: 700;
+    letter-spacing: -1px;
+    margin-bottom: 12px;
+}
+
+h3
+{
+    font-size: 24px;
+    letter-spacing: -0.5px;
+    margin-bottom: 12px;
+}
+
+h4
+{
+    font-size: 18px;
+    letter-spacing: -0.33px;
+    margin-bottom: 12px;
+    color: #4d4e53;
+}
+
+h5, .container-overview .subsection-title
+{
+    font-size: 120%;
+    font-weight: bold;
+    letter-spacing: -0.01em;
+    margin: 8px 0 3px 0;
+}
+
+h6
+{
+    font-size: 100%;
+    letter-spacing: -0.01em;
+    margin: 6px 0 3px 0;
+    font-style: italic;
+}
+
+table
+{
+    border-spacing: 0;
+    border: 0;
+    border-collapse: collapse;
+}
+
+td, th
+{
+    border: 1px solid #ddd;
+    margin: 0px;
+    text-align: left;
+    vertical-align: top;
+    padding: 4px 6px;
+    display: table-cell;
+}
+
+thead tr
+{
+    background-color: #ddd;
+    font-weight: bold;
+}
+
+th { border-right: 1px solid #aaa; }
+tr > th:last-child { border-right: 1px solid #ddd; }
+
+.ancestors, .attribs { color: #999; }
+.ancestors a, .attribs a
+{
+    color: #999 !important;
+    text-decoration: none;
+}
+
+.clear
+{
+    clear: both;
+}
+
+.important
+{
+    font-weight: bold;
+    color: #950B02;
+}
+
+.yes-def {
+    text-indent: -1000px;
+}
+
+.type-signature {
+    color: #aaa;
+}
+
+.name, .signature {
+    font-family: Consolas, Monaco, 'Andale Mono', monospace;
+}
+
+.details { margin-top: 14px; border-left: 2px solid #DDD; }
+.details dt { width: 120px; float: left; padding-left: 10px;  padding-top: 6px; }
+.details dd { margin-left: 70px; }
+.details ul { margin: 0; }
+.details ul { list-style-type: none; }
+.details li { margin-left: 30px; padding-top: 6px; }
+.details pre.prettyprint { margin: 0 }
+.details .object-value { padding-top: 0; }
+
+.description {
+    margin-bottom: 1em;
+    margin-top: 1em;
+}
+
+.code-caption
+{
+    font-style: italic;
+    font-size: 107%;
+    margin: 0;
+}
+
+.source
+{
+    border: 1px solid #ddd;
+    width: 80%;
+    overflow: auto;
+}
+
+.prettyprint.source {
+    width: inherit;
+}
+
+.source code
+{
+    font-size: 100%;
+    line-height: 18px;
+    display: block;
+    padding: 4px 12px;
+    margin: 0;
+    background-color: #fff;
+    color: #4D4E53;
+}
+
+.prettyprint code span.line
+{
+  display: inline-block;
+}
+
+.prettyprint.linenums
+{
+  padding-left: 70px;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+.prettyprint.linenums ol
+{
+  padding-left: 0;
+}
+
+.prettyprint.linenums li
+{
+  border-left: 3px #ddd solid;
+}
+
+.prettyprint.linenums li.selected,
+.prettyprint.linenums li.selected *
+{
+  background-color: lightyellow;
+}
+
+.prettyprint.linenums li *
+{
+  -webkit-user-select: text;
+  -moz-user-select: text;
+  -ms-user-select: text;
+  user-select: text;
+}
+
+.params .name, .props .name, .name code {
+    color: #4D4E53;
+    font-family: Consolas, Monaco, 'Andale Mono', monospace;
+    font-size: 100%;
+}
+
+.params td.description > p:first-child,
+.props td.description > p:first-child
+{
+    margin-top: 0;
+    padding-top: 0;
+}
+
+.params td.description > p:last-child,
+.props td.description > p:last-child
+{
+    margin-bottom: 0;
+    padding-bottom: 0;
+}
+
+.disabled {
+    color: #454545;
+}

src-manager/docs/manager/1.0.0/styles/prettify-jsdoc.css

@@ -0,0 +1,111 @@
+/* JSDoc prettify.js theme */
+
+/* plain text */
+.pln {
+  color: #000000;
+  font-weight: normal;
+  font-style: normal;
+}
+
+/* string content */
+.str {
+  color: #006400;
+  font-weight: normal;
+  font-style: normal;
+}
+
+/* a keyword */
+.kwd {
+  color: #000000;
+  font-weight: bold;
+  font-style: normal;
+}
+
+/* a comment */
+.com {
+  font-weight: normal;
+  font-style: italic;
+}
+
+/* a type name */
+.typ {
+  color: #000000;
+  font-weight: normal;
+  font-style: normal;
+}
+
+/* a literal value */
+.lit {
+  color: #006400;
+  font-weight: normal;
+  font-style: normal;
+}
+
+/* punctuation */
+.pun {
+  color: #000000;
+  font-weight: bold;
+  font-style: normal;
+}
+
+/* lisp open bracket */
+.opn {
+  color: #000000;
+  font-weight: bold;
+  font-style: normal;
+}
+
+/* lisp close bracket */
+.clo {
+  color: #000000;
+  font-weight: bold;
+  font-style: normal;
+}
+
+/* a markup tag name */
+.tag {
+  color: #006400;
+  font-weight: normal;
+  font-style: normal;
+}
+
+/* a markup attribute name */
+.atn {
+  color: #006400;
+  font-weight: normal;
+  font-style: normal;
+}
+
+/* a markup attribute value */
+.atv {
+  color: #006400;
+  font-weight: normal;
+  font-style: normal;
+}
+
+/* a declaration */
+.dec {
+  color: #000000;
+  font-weight: bold;
+  font-style: normal;
+}
+
+/* a variable name */
+.var {
+  color: #000000;
+  font-weight: normal;
+  font-style: normal;
+}
+
+/* a function name */
+.fun {
+  color: #000000;
+  font-weight: bold;
+  font-style: normal;
+}
+
+/* Specify class=linenums on a pre to get line numbering */
+ol.linenums {
+  margin-top: 0;
+  margin-bottom: 0;
+}

src-manager/docs/manager/1.0.0/styles/prettify-tomorrow.css

@@ -0,0 +1,132 @@
+/* Tomorrow Theme */
+/* Original theme - https://github.com/chriskempson/tomorrow-theme */
+/* Pretty printing styles. Used with prettify.js. */
+/* SPAN elements with the classes below are added by prettyprint. */
+/* plain text */
+.pln {
+  color: #4d4d4c; }
+
+@media screen {
+  /* string content */
+  .str {
+    color: #718c00; }
+
+  /* a keyword */
+  .kwd {
+    color: #8959a8; }
+
+  /* a comment */
+  .com {
+    color: #8e908c; }
+
+  /* a type name */
+  .typ {
+    color: #4271ae; }
+
+  /* a literal value */
+  .lit {
+    color: #f5871f; }
+
+  /* punctuation */
+  .pun {
+    color: #4d4d4c; }
+
+  /* lisp open bracket */
+  .opn {
+    color: #4d4d4c; }
+
+  /* lisp close bracket */
+  .clo {
+    color: #4d4d4c; }
+
+  /* a markup tag name */
+  .tag {
+    color: #c82829; }
+
+  /* a markup attribute name */
+  .atn {
+    color: #f5871f; }
+
+  /* a markup attribute value */
+  .atv {
+    color: #3e999f; }
+
+  /* a declaration */
+  .dec {
+    color: #f5871f; }
+
+  /* a variable name */
+  .var {
+    color: #c82829; }
+
+  /* a function name */
+  .fun {
+    color: #4271ae; } }
+/* Use higher contrast and text-weight for printable form. */
+@media print, projection {
+  .str {
+    color: #060; }
+
+  .kwd {
+    color: #006;
+    font-weight: bold; }
+
+  .com {
+    color: #600;
+    font-style: italic; }
+
+  .typ {
+    color: #404;
+    font-weight: bold; }
+
+  .lit {
+    color: #044; }
+
+  .pun, .opn, .clo {
+    color: #440; }
+
+  .tag {
+    color: #006;
+    font-weight: bold; }
+
+  .atn {
+    color: #404; }
+
+  .atv {
+    color: #060; } }
+/* Style */
+/*
+pre.prettyprint {
+  background: white;
+  font-family: Consolas, Monaco, 'Andale Mono', monospace;
+  font-size: 12px;
+  line-height: 1.5;
+  border: 1px solid #ccc;
+  padding: 10px; }
+*/
+
+/* Specify class=linenums on a pre to get line numbering */
+ol.linenums {
+  margin-top: 0;
+  margin-bottom: 0; }
+
+/* IE indents via margin-left */
+li.L0,
+li.L1,
+li.L2,
+li.L3,
+li.L4,
+li.L5,
+li.L6,
+li.L7,
+li.L8,
+li.L9 {
+  /* */ }
+
+/* Alternate shading for lines */
+li.L1,
+li.L3,
+li.L5,
+li.L7,
+li.L9 {
+  /* */ }

src-manager/docs/manager/1.0.0/utils_asyncDatabase.js.html

@@ -0,0 +1,106 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <title>JSDoc: Source: utils/asyncDatabase.js</title>
+
+    <script src="scripts/prettify/prettify.js"> </script>
+    <script src="scripts/prettify/lang-css.js"> </script>
+    <!--[if lt IE 9]>
+      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
+    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
+</head>
+
+<body>
+
+<div id="main">
+
+    <h1 class="page-title">Source: utils/asyncDatabase.js</h1>
+
+    
+
+
+
+    
+    <section>
+        <article>
+            <pre class="prettyprint source linenums"><code>/**
+ * @module utils/asyncDatabase
+ */
+import sqlite3 from 'sqlite3';
+
+/**
+ * @param {sqlite3.Database} database
+ * @param {string} sqlQuery
+ * @param {function} callback - function (rows)
+ * @returns {Promise&lt;any>} Promise for database operation
+ * @example
+ * const result = await asyncDatabaseRead(userDatabase, `SELECT * FROM users`, (rows) => {
+ *     return wrapInTable(rows);
+ * });
+ */
+const asyncDatabaseRead = (database, sqlQuery, callback) => {
+    return new Promise((resolve, reject) => {
+        database.serialize(() => {
+            database.all(sqlQuery, (err, rows) => {
+                if (err) {
+                    reject(err);
+                } else {
+                    resolve(callback(rows));
+                }
+            });
+        });
+    });
+};
+
+/**
+ * @param {sqlite3.Database} database
+ * @param {string} sqlQuery
+ * @param {function} callback - function ()
+ * @returns {Promise&lt;any>} Promise for database operation
+ * @example
+ * let sqlQuery = `INSERT INTO users (id, name, age) VALUES (${genID()}, "${userName}", "${userAge}");`;
+ * await asyncDatabaseWrite(userDatabase, sqlQuery, () => {
+ *     console.log("Added User ", userName);
+ * });
+ */
+const asyncDatabaseWrite = (database, sqlQuery, callback) => {
+    return new Promise((resolve, reject) => {
+        database.serialize(() => {
+            database.run(sqlQuery, (err, rows) => {
+                if (err) {
+                    reject(err);
+                } else {
+                    resolve(callback(rows));
+                }
+            });
+        });
+    });
+};
+
+export { asyncDatabaseRead, asyncDatabaseWrite };
+</code></pre>
+        </article>
+    </section>
+
+
+
+
+</div>
+
+<nav>
+    <h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-api_gallery-image.html">api/gallery-image</a></li><li><a href="module-api_news.html">api/news</a></li><li><a href="module-utils_asyncDatabase.html">utils/asyncDatabase</a></li><li><a href="module-utils_tableWrapper.html">utils/tableWrapper</a></li></ul>
+</nav>
+
+<br class="clear">
+
+<footer>
+    Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.4</a> on Tue Nov 26 2024 23:18:12 GMT+0900 (日本標準時)
+</footer>
+
+<script> prettyPrint(); </script>
+<script src="scripts/linenumber.js"> </script>
+</body>
+</html>

src-manager/docs/manager/1.0.0/utils_tableWrapper.js.html

@@ -0,0 +1,90 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <title>JSDoc: Source: utils/tableWrapper.js</title>
+
+    <script src="scripts/prettify/prettify.js"> </script>
+    <script src="scripts/prettify/lang-css.js"> </script>
+    <!--[if lt IE 9]>
+      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+    <![endif]-->
+    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
+    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
+</head>
+
+<body>
+
+<div id="main">
+
+    <h1 class="page-title">Source: utils/tableWrapper.js</h1>
+
+    
+
+
+
+    
+    <section>
+        <article>
+            <pre class="prettyprint source linenums"><code>/**
+ * @module utils/tableWrapper
+ */
+
+/**
+ * Wrap object array into HTML table body tr+td's
+ * @param {Object[]} target - array of objects
+ * @returns {string} Stringed HTML table body tr+td's
+ * @example
+ * const data = [
+ *     {id: 1, name: "John"},
+ *     {id: 2, name: "Marry"},
+ * ];
+ * const responseHTML = wrapInTable(data);
+ * // responseHTML =
+ * // &lt;tr>
+ * //     &lt;td>1&lt;/td>
+ * //     &lt;td>John&lt;/td>
+ * // &lt;/tr>
+ * // &lt;tr>
+ * //     &lt;td>2&lt;/td>
+ * //     &lt;td>Marry&lt;/td>
+ * // &lt;/tr>
+ */
+const wrapInTable = (target) => {
+    let res = "";
+    for (const entry of target) {
+        let tableData = "&lt;tr>\n";
+        for (const data in entry) {
+            let dataEntry = `    &lt;td>${entry[data]}&lt;/td>\n`
+            tableData = tableData + dataEntry;
+        }
+        tableData = tableData + "&lt;/tr>\n";
+        res = res + tableData;
+    }
+    return res;
+};
+
+export { wrapInTable };
+</code></pre>
+        </article>
+    </section>
+
+
+
+
+</div>
+
+<nav>
+    <h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-api_gallery-image.html">api/gallery-image</a></li><li><a href="module-api_news.html">api/news</a></li><li><a href="module-utils_asyncDatabase.html">utils/asyncDatabase</a></li><li><a href="module-utils_tableWrapper.html">utils/tableWrapper</a></li></ul>
+</nav>
+
+<br class="clear">
+
+<footer>
+    Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 4.0.4</a> on Tue Nov 26 2024 23:18:12 GMT+0900 (日本標準時)
+</footer>
+
+<script> prettyPrint(); </script>
+<script src="scripts/linenumber.js"> </script>
+</body>
+</html>

src-manager/jsdoc-conf.json

@@ -0,0 +1,29 @@
+{
+    "plugins": ["plugins/markdown"],
+    "recurseDepth": 5,
+    "sourceType": "module",
+    "source": {
+        "include": ["./utils/", "./api/"],
+        "excludePattern": "(node_modules/|docs)"
+    },
+    "tags": {
+        "allowUnknownTags": false,
+        "dictionaries": ["jsdoc"]
+    },
+    "templates": {
+        "cleverLinks": true,
+        "monospaceLinks": true,
+        "disableSort": true
+    },
+    "opts": {
+        "encoding": "utf8",
+        "verbose": true,
+        "destination": "./docs/",
+        "readme": "./README.md",
+        "package": "./package.json"
+    },
+    "markdown": {
+        "hardwrap": false,
+        "idInHeadings": true
+    }
+}

src-manager/package-lock.json

@@ -38,13 +38,13 @@
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.26.2",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.26.2.tgz",
-      "integrity": "sha512-DWMCZH9WA4Maitz2q21SRKHo9QXZxkDsbNZoVD62gusNtNBBqDg9i7uOhASfTfIGNzW+O+r7+jAlM8dwphcJKQ==",
+      "version": "7.26.3",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.26.3.tgz",
+      "integrity": "sha512-WJ/CvmY8Mea8iDXo6a7RK2wbmJITT5fN3BEkRuFlxVyNx8jOKIIhmC4fSkTcPcf8JyavbBwIe6OpiCOBXt/IcA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@babel/types": "^7.26.0"
+        "@babel/types": "^7.26.3"
       },
       "bin": {
         "parser": "bin/babel-parser.js"
@@ -54,9 +54,9 @@
       }
     },
     "node_modules/@babel/types": {
-      "version": "7.26.0",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.26.0.tgz",
-      "integrity": "sha512-Z/yiTPj+lDVnF7lWeKCIJzaIkI0vYO87dMpZ4bg4TDrFe4XXLFWL1TbXU27gBP3QccxV9mZICCrnjnYlJjXHOA==",
+      "version": "7.26.3",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.26.3.tgz",
+      "integrity": "sha512-vN5p+1kl59GVKMvTHt55NzzmYVxprfJD+ql7U9NFIfKCBkYE55LYtS+WtPlaYOyzydrKI8Nezd+aZextrd+FMA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -182,9 +182,9 @@
       }
     },
     "node_modules/agent-base/node_modules/debug": {
-      "version": "4.3.7",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz",
-      "integrity": "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==",
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
+      "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==",
       "license": "MIT",
       "optional": true,
       "dependencies": {
@@ -471,16 +471,15 @@
       }
     },
     "node_modules/call-bind": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.7.tgz",
-      "integrity": "sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==",
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.8.tgz",
+      "integrity": "sha512-oKlSFMcMwpUg2ednkhQ454wfWiU/ul3CkJe/PEHcTKuiX6RpbehUiFMXu13HalGZxfUwCQzZG747YXBn1im9ww==",
       "license": "MIT",
       "dependencies": {
+        "call-bind-apply-helpers": "^1.0.0",
         "es-define-property": "^1.0.0",
-        "es-errors": "^1.3.0",
-        "function-bind": "^1.1.2",
         "get-intrinsic": "^1.2.4",
-        "set-function-length": "^1.2.1"
+        "set-function-length": "^1.2.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -489,6 +488,19 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/call-bind-apply-helpers": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.0.tgz",
+      "integrity": "sha512-CCKAP2tkPau7D3GE8+V8R6sQubA9R5foIzGp+85EXCVSCivuxBNAWqcpn72PKYiIcqoViv/kcUDpaEIMBVi1lQ==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/catharsis": {
       "version": "0.9.0",
       "resolved": "https://registry.npmjs.org/catharsis/-/catharsis-0.9.0.tgz",
@@ -691,6 +703,20 @@
         "node": ">=8"
       }
     },
+    "node_modules/dunder-proto": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.0.tgz",
+      "integrity": "sha512-9+Sj30DIu+4KvHqMfLUGLFYL2PkURSYMVXJyXe92nFRvlYq5hBjLEhblKB+vkd/WVlUYMWigiY07T91Fkk0+4A==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.0",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/ee-first": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@@ -776,13 +802,10 @@
       "optional": true
     },
     "node_modules/es-define-property": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.0.tgz",
-      "integrity": "sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
+      "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
       "license": "MIT",
-      "dependencies": {
-        "get-intrinsic": "^1.2.4"
-      },
       "engines": {
         "node": ">= 0.4"
       }
@@ -831,9 +854,9 @@
       }
     },
     "node_modules/express": {
-      "version": "4.21.1",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.21.1.tgz",
-      "integrity": "sha512-YSFlK1Ee0/GC8QaO91tHcDxJiE/X4FbpAyQWkxAvG6AXCuR65YzK8ua6D9hvi/TzUfZMpc+BwuM1IPw8fmQBiQ==",
+      "version": "4.21.2",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.21.2.tgz",
+      "integrity": "sha512-28HqgMZAmih1Czt9ny7qr6ek2qddF4FclbMzwhCREB6OFfH+rXAnuNCwo1/wFvrtbgsQDb4kSbX9de9lFbrXnA==",
       "license": "MIT",
       "dependencies": {
         "accepts": "~1.3.8",
@@ -855,7 +878,7 @@
         "methods": "~1.1.2",
         "on-finished": "2.4.1",
         "parseurl": "~1.3.3",
-        "path-to-regexp": "0.1.10",
+        "path-to-regexp": "0.1.12",
         "proxy-addr": "~2.0.7",
         "qs": "6.13.0",
         "range-parser": "~1.2.1",
@@ -870,6 +893,10 @@
       },
       "engines": {
         "node": ">= 0.10.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
       }
     },
     "node_modules/file-uri-to-path": {
@@ -998,16 +1025,19 @@
       }
     },
     "node_modules/get-intrinsic": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.4.tgz",
-      "integrity": "sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==",
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.5.tgz",
+      "integrity": "sha512-Y4+pKa7XeRUPWFNvOOYHkRYrfzW07oraURSvjDmRVOJ748OrVmeXtpE4+GCEHncjCjkTxPNRt8kEbxDhsn6VTg==",
       "license": "MIT",
       "dependencies": {
+        "call-bind-apply-helpers": "^1.0.0",
+        "dunder-proto": "^1.0.0",
+        "es-define-property": "^1.0.1",
         "es-errors": "^1.3.0",
         "function-bind": "^1.1.2",
-        "has-proto": "^1.0.1",
-        "has-symbols": "^1.0.3",
-        "hasown": "^2.0.0"
+        "gopd": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -1058,12 +1088,12 @@
       }
     },
     "node_modules/gopd": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz",
-      "integrity": "sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
+      "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
       "license": "MIT",
-      "dependencies": {
-        "get-intrinsic": "^1.1.3"
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -1098,22 +1128,10 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/has-proto": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.3.tgz",
-      "integrity": "sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 0.4"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/ljharb"
-      }
-    },
     "node_modules/has-symbols": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.3.tgz",
-      "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
+      "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
       "license": "MIT",
       "engines": {
         "node": ">= 0.4"
@@ -1180,9 +1198,9 @@
       }
     },
     "node_modules/http-proxy-agent/node_modules/debug": {
-      "version": "4.3.7",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz",
-      "integrity": "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==",
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
+      "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==",
       "license": "MIT",
       "optional": true,
       "dependencies": {
@@ -1219,9 +1237,9 @@
       }
     },
     "node_modules/https-proxy-agent/node_modules/debug": {
-      "version": "4.3.7",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz",
-      "integrity": "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==",
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
+      "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==",
       "license": "MIT",
       "optional": true,
       "dependencies": {
@@ -1901,9 +1919,9 @@
       }
     },
     "node_modules/nodemon/node_modules/debug": {
-      "version": "4.3.7",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz",
-      "integrity": "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==",
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
+      "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2037,9 +2055,9 @@
       }
     },
     "node_modules/path-to-regexp": {
-      "version": "0.1.10",
-      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.10.tgz",
-      "integrity": "sha512-7lf7qcQidTku0Gu3YDPc8DJ1q7OOucfa/BSsIwjuh56VU7katFvuM8hULfkwB3Fns/rsVF7PwPKVw1sl5KQS9w==",
+      "version": "0.1.12",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-0.1.12.tgz",
+      "integrity": "sha512-RA1GjUVMnvYFxuqovrEqZoxxW5NUZqbwKtYz/Tt7nXerk0LbLblQmrsgdeOxV5SFHf0UDggjS/bSeOZwt1pmEQ==",
       "license": "MIT"
     },
     "node_modules/picomatch": {
@@ -2516,9 +2534,9 @@
       }
     },
     "node_modules/socks-proxy-agent/node_modules/debug": {
-      "version": "4.3.7",
-      "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.7.tgz",
-      "integrity": "sha512-Er2nc/H7RrMXZBFCEim6TCmMk02Z8vLC2Rbi1KEBggpo0fS6l0S1nnapwmIi3yW/+GOJap1Krg4w0Hg80oCqgQ==",
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.0.tgz",
+      "integrity": "sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==",
       "license": "MIT",
       "optional": true,
       "dependencies": {

src-manager/package.json

@@ -5,7 +5,8 @@
   "main": "app.js",
   "scripts": {
     "start": "node app.js",
-    "dev": "nodemon --watch . --ignore pages"
+    "dev": "nodemon --watch . --ignore pages",
+    "documentation": "jsdoc -c ./jsdoc-conf.json"
   },
   "type": "module",
   "author": "kenryus",

src-manager/pages/new-gallery-image.html

@@ -3,7 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <title>Content Manager - new gallery image</title>
-    <script src="https://unpkg.com/htmx.org@2.0.2" integrity="sha384-Y7hw+L/jvKeWIRRkqWYfPcvVxHzVzn5REgzbawhxAuQGwX1XWe70vji+VSeHOThJ" crossorigin="anonymous"></script>
+    <script src="https://unpkg.com/htmx.org@2.0.3" crossorigin="anonymous"></script>
     <style>
         form fieldset {
             display: grid;
@@ -48,4 +48,4 @@
             window.location.href = "/index.html";
         });
     </script>
-</body>
+</body>

src-manager/pages/new-news.html

@@ -5,8 +5,11 @@
     <title>Content Manager - new news</title>
     <link rel="stylesheet" href="/styles/markdown.css">
     <link rel="stylesheet" href="/styles/color-pallet.css">
-    <script src="https://unpkg.com/htmx.org@2.0.2" integrity="sha384-Y7hw+L/jvKeWIRRkqWYfPcvVxHzVzn5REgzbawhxAuQGwX1XWe70vji+VSeHOThJ" crossorigin="anonymous"></script>
+    <script src="https://unpkg.com/htmx.org@2.0.3" crossorigin="anonymous"></script>
     <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
+    <script type="module">
+        import DOMPurify from "https://cdn.jsdelivr.net/npm/isomorphic-dompurify/+esm"
+    </script>
     <style>
         form fieldset {
             display: grid;
@@ -75,11 +78,13 @@
         const submitButton = document.getElementById('submit-button');
 
         articleEditor.addEventListener('input', () => {
-            markdownPreview.innerHTML = marked.parse(articleEditor.value);
+            const cleanHTML = DOMPurify.sanitize(marked.parse(articleEditor.value));
+            markdownPreview.innerHTML = cleanHTML;
         });
 
         cardContentInput.addEventListener('input', () => {
-            cardContentPreview.innerHTML = marked.parse(cardContentInput.value);
+            const cleanHTML = DOMPurify.sanitize(marked.parse(cardContentInput.value));
+            cardContentPreview.innerHTML = cleanHTML;
         });
 
         submitButton.addEventListener('click', () => {
@@ -87,4 +92,4 @@
         });
     </script>
 </body>
-</html>
+</html>

src-manager/pages/update-gallery-image.html

@@ -3,7 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <title>Content Manager - update gallery image</title>
-    <script src="https://unpkg.com/htmx.org@2.0.2" integrity="sha384-Y7hw+L/jvKeWIRRkqWYfPcvVxHzVzn5REgzbawhxAuQGwX1XWe70vji+VSeHOThJ" crossorigin="anonymous"></script>
+    <script src="https://unpkg.com/htmx.org@2.0.3" crossorigin="anonymous"></script>
     <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
     <style>
         form fieldset {
@@ -64,4 +64,4 @@
             window.location.href = "/index.html";
         });
     </script>
-</body>
+</body>

src-manager/pages/update-news.html

@@ -5,9 +5,12 @@
     <title>Content Manager - update news</title>
     <link rel="stylesheet" href="/styles/markdown.css">
     <link rel="stylesheet" href="/styles/color-pallet.css">
-    <script src="https://unpkg.com/htmx.org@2.0.2" integrity="sha384-Y7hw+L/jvKeWIRRkqWYfPcvVxHzVzn5REgzbawhxAuQGwX1XWe70vji+VSeHOThJ" crossorigin="anonymous"></script>
+    <script src="https://unpkg.com/htmx.org@2.0.3" crossorigin="anonymous"></script>
     <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
+    <script type="module">
+        import DOMPurify from "https://cdn.jsdelivr.net/npm/isomorphic-dompurify/+esm"
+    </script>
     <style>
         form fieldset {
             display: grid;
@@ -101,11 +104,13 @@
             .catch((err) => {console.error(err)});
 
         articleEditor.addEventListener('input', () => {
-            markdownPreview.innerHTML = marked.parse(articleEditor.value);
+            const cleanHTML = DOMPurify.sanitize(marked.parse(articleEditor.value));
+            markdownPreview.innerHTML = cleanHTML;
         });
 
         cardContentInput.addEventListener('input', () => {
-            cardContentPreview.innerHTML = marked.parse(cardContentInput.value);
+            const cleanHTML = DOMPurify.sanitize(marked.parse(cardContentInput.value));
+            cardContentPreview.innerHTML = cleanHTML;
         });
 
         submitButton.addEventListener('click', () => {
@@ -113,4 +118,4 @@
         });
     </script>
 </body>
-</html>
+</html>

src-manager/utils/asyncDatabase.js

@@ -1,10 +1,17 @@
+/**
+ * @module utils/asyncDatabase
+ */
 import sqlite3 from 'sqlite3';
 
 /**
- * @param database
- * @param sqlQuery
- * @param callback - (rows) => {}
- * @returns - Promise for database operation
+ * @param {sqlite3.Database} database
+ * @param {string} sqlQuery
+ * @param {function} callback - function (rows)
+ * @returns {Promise<any>} Promise for database operation
+ * @example
+ * const result = await asyncDatabaseRead(userDatabase, `SELECT * FROM users`, (rows) => {
+ *     return wrapInTable(rows);
+ * });
  */
 const asyncDatabaseRead = (database, sqlQuery, callback) => {
     return new Promise((resolve, reject) => {
@@ -21,10 +28,15 @@ const asyncDatabaseRead = (database, sqlQuery, callback) => {
 };
 
 /**
- * @param database
- * @param sqlQuery
- * @param callback - () => {}
- * @returns - Promise for database operation
+ * @param {sqlite3.Database} database
+ * @param {string} sqlQuery
+ * @param {function} callback - function ()
+ * @returns {Promise<any>} Promise for database operation
+ * @example
+ * let sqlQuery = `INSERT INTO users (id, name, age) VALUES (${genID()}, "${userName}", "${userAge}");`;
+ * await asyncDatabaseWrite(userDatabase, sqlQuery, () => {
+ *     console.log("Added User ", userName);
+ * });
  */
 const asyncDatabaseWrite = (database, sqlQuery, callback) => {
     return new Promise((resolve, reject) => {
@@ -40,4 +52,4 @@ const asyncDatabaseWrite = (database, sqlQuery, callback) => {
     });
 };
 
-export { asyncDatabaseRead, asyncDatabaseWrite };
+export { asyncDatabaseRead, asyncDatabaseWrite };

src-manager/utils/tableWrapper.js

@@ -0,0 +1,39 @@
+/**
+ * @module utils/tableWrapper
+ */
+
+/**
+ * Wrap object array into HTML table body tr+td's
+ * @param {Object[]} target - array of objects
+ * @returns {string} Stringed HTML table body tr+td's
+ * @example
+ * const data = [
+ *     {id: 1, name: "John"},
+ *     {id: 2, name: "Marry"},
+ * ];
+ * const responseHTML = wrapInTable(data);
+ * // responseHTML =
+ * // <tr>
+ * //     <td>1</td>
+ * //     <td>John</td>
+ * // </tr>
+ * // <tr>
+ * //     <td>2</td>
+ * //     <td>Marry</td>
+ * // </tr>
+ */
+const wrapInTable = (target) => {
+    let res = "";
+    for (const entry of target) {
+        let tableData = "<tr>\n";
+        for (const data in entry) {
+            let dataEntry = `    <td>${entry[data]}</td>\n`
+            tableData = tableData + dataEntry;
+        }
+        tableData = tableData + "</tr>\n";
+        res = res + tableData;
+    }
+    return res;
+};
+
+export { wrapInTable };

utils/asyncDatabase.ts

@@ -31,12 +31,14 @@ const asyncDatabaseRead = async <Type>(
     callback: asyncDatabaseRowsCallbackFunction
 ): Promise<Type> => {
     return new Promise((resolve, reject) => {
-        database.all(sqlQuery, (error: Error, rows: any) => {
-            if (error !== null) {
-                reject(error);
-            } else {
-                resolve(callback(rows));
-            }
+        database.serialize(() => {
+            database.all(sqlQuery, (error: Error, rows: any) => {
+                if (error !== null) {
+                    reject(error);
+                } else {
+                    resolve(callback(rows));
+                }
+            });
         });
     });
 };
@@ -57,12 +59,14 @@ const asyncDatabaseWrite = async <Type>(
     callback: asyncDatabaseVoidCallbackFunction
 ): Promise<Type> => {
     return new Promise((resolve, reject) => {
-        database.run(sqlQuery, (error: Error) => {
-            if (error !== null) {
-                reject(error);
-            } else {
-                resolve(callback());
-            }
+        database.serialize(() => {
+            database.run(sqlQuery, (error: Error) => {
+                if (error !== null) {
+                    reject(error);
+                } else {
+                    resolve(callback());
+                }
+            });
         });
     });
 };

utils/types/linksGrid.ts

@@ -0,0 +1,33 @@
+/**
+ * Types for LinksGrid component
+ * @module utils/types/linksGrid
+ */
+
+import type { LinkCardProperty } from "./linkCard";
+
+/**
+ * Interface that defines property for LinksGrid component
+ * @property {Array<LinkCardProperty>} links Array of property of LinkCard components
+ * @example
+ * const linksList = [
+ *     {
+ *         title: "test 1",
+ *         description: "Test Page #1",
+ *         link: "/test/1",
+ *         imagePath: "/images/test-1.png",
+ *     },
+ *     ...
+ *     {
+ *         title: "test n",
+ *         description: "Test Page #n",
+ *         link: "/test/n",
+ *         imagePath: "/images/test-n.png",
+ *     },
+ * ];
+ * <LinksGrid :links="linksList" />
+ */
+interface LinksGridProperty {
+    links: Array<LinkCardProperty>;
+}
+
+export type { LinksGridProperty };

utils/types/slide.ts

@@ -1,6 +1,6 @@
 /**
  * Types for Slide component
- * @module utils/types/slide.ts
+ * @module utils/types/slide
  */
 
 /**