Merge pull request #13 from effektivnayarabota1/develop

Develop
kirill-ivanovvv · Nov 6, 2023 · d8e0207 · d8e0207
2 parents 262cce2 + deab42f
commit d8e0207
Show file tree

Hide file tree

Showing 15 changed files with 66 additions and 35 deletions.
diff --git a/controllers/auth.controller.js b/controllers/auth.controller.js
@@ -34,11 +34,12 @@ export default class Auth {
 
     const jwt = await new jose.SignJWT({ user_id: user.user_id, username })
       .setProtectedHeader({ alg: "HS256" })
-      .setExpirationTime("7d")
+      .setExpirationTime("168h")
       .sign(secret);
 
     c.headers["Set-Cookie"] = `auth=${jwt}`;
-    return Response.redirect("/", { headers: c.headers });
+
+    return Response.redirect(`/${username}`, { headers: c.headers });
   }
 
   static async logout(c) {

diff --git a/controllers/element.controller.js b/controllers/element.controller.js
@@ -25,7 +25,7 @@ export default class Element {
     sql("connections").update({ page_id }).where({ element_id }).run();
     DateMiddleware.update({ element_id });
 
-    return Response.redirect(`/element/${element_id}`);
+    return Response.redirect(`/element/${element_id}?mode=editor`);
   }
 
   static async update(req) {
@@ -48,12 +48,12 @@ export default class Element {
       await File.remove(dir, "cover");
       await File.write(cover, dir, `cover.${extention}`);
 
-      const webp190 = await sharp(buf, { animated: true })
+      const webp288 = await sharp(buf, { animated: true })
         .webp()
         // .resize(190, 288, { fit: "cover", withoutEnlargement: true })
-        .resize(288, 288, { fit: "inside" })
+        .resize(288, 288, { fit: "inside", withoutEnlargement: true })
         .toBuffer();
-      await File.write(webp190, dir, "cover@webp190.webp");
+      await File.write(webp288, dir, "cover@webp288.webp");
     }
 
     if (style.size) {

diff --git a/controllers/page.controller.js b/controllers/page.controller.js
@@ -27,7 +27,7 @@ export default class Page {
     sql("authors").update({ user_id, type: "owner" }).where({ page_id }).run();
     DateMiddleware.update({ page_id });
 
-    return Response.redirect(`/page/${page_id}`);
+    return Response.redirect(`/page/${page_id}?mode=editor`);
   }
 
   static async update(req) {
@@ -51,12 +51,12 @@ export default class Page {
       await File.remove(dir, "cover");
       await File.write(cover, dir, `cover.${extention}`);
 
-      const webp190 = await sharp(buf, { animated: true })
+      const webp288 = await sharp(buf, { animated: true })
         .webp()
         // .resize(190, 288, { fit: "cover", withoutEnlargement: true })
-        .resize(288, 288, { fit: "inside" })
+        .resize(288, 288, { fit: "inside", withoutEnlargement: true })
         .toBuffer();
-      await File.write(webp190, dir, "cover@webp190.webp");
+      await File.write(webp288, dir, "cover@webp288.webp");
     }
 
     if (style.size) {

diff --git a/controllers/profile.controller.js b/controllers/profile.controller.js
@@ -33,12 +33,6 @@ export default class Profile {
         .resize(64, 64, { fit: "cover", withoutEnlargement: true })
         .toBuffer();
       await File.write(webp64, dir, "avatar@webp64.webp");
-
-      const webp190 = await sharp(buf, { animated: true })
-        .webp()
-        .resize(190, 190, { fit: "cover", withoutEnlargement: true })
-        .toBuffer();
-      await File.write(webp190, dir, "avatar@webp190.webp");
     }
 
     if (style.size) {

diff --git a/public/style/font.css b/public/style/font.css
@@ -14,6 +14,7 @@ p {
   font-style: normal;
   font-weight: 400;
   line-height: 2.4rem;
+  margin-bottom: 1.2rem;
 }
 h1 {
   margin-bottom: 4.8rem;

diff --git a/src/index.js b/src/index.js
@@ -2,6 +2,8 @@ import sql from "../lib/sql.ts";
 import Router from "./router.js";
 await sql().init();
 
+if (!process.env.JWT_SECRET) throw new Error("need some secret");
+
 const server = Bun.serve({
   port: 8080,
   async fetch(req) {

diff --git a/templates/About.css b/templates/About.css
@@ -1,5 +1,5 @@
-.about-text {
-  color: var(--grey-dark);
+.about__text-container {
+  grid-column: 1 / span 2;
 }
 
 .autograph-container {
@@ -17,6 +17,11 @@ a.about__me {
 .autograph-container * {
   /* color: var(--red); */
 }
+@media screen and (max-width: 858px) {
+  .about__text-container {
+    grid-column: 1 / -1;
+  }
+}
 
 @media screen and (max-width: 360px) {
   .autograph-container {

diff --git a/templates/About.eta b/templates/About.eta
@@ -1,11 +1,29 @@
 <% layout("LO") %>
 
 <div class="grid">
-	<div>
-		<h2 class="about-text">Открытая multimedia библиотека.</h2>
-		<h4><a href="https://github.com/effektivnayarabota1/owwo">github</a></h4>
+	<div class="about__text-container">
+		<h2>Открытая multimedia библиотека.</h2>
+		<p>Введу некоторые пояснения.<br> На данный момент на платформе можно публиковать лишь изображения.
+			В профиле создаются
+			страницы, страницы собираются из элементов, все сортируется по дате изменения.
+		<p>
+			Текстовые инпуты поддерживают формат <a href="https://ru.wikipedia.org/wiki/Markdown"
+				 target="_blank">MARKDOWN</a>.
+		</p>
+		<p>
+			На каждую страницу можно разместить собственные скрипты и стили.
+		</p>
+		<p>На домашней странице собирается случайный контент со всего сайта, в оптимизированых превью. На всех остальных
+			страницах изображения загружаются в оригинальном размере, поэтому думайте над весом ваших изображений.<br>
+			Скорость ваших страниц зависит от вас лишь.</p>
+		<div style="display: flex; gap: 16px;">
+			<h5><a href="https://github.com/effektivnayarabota1/owwo" target="_blank">GitHub</a></h5>
+			<h5><a href="https://t.me/owwomoscow_channel" target="_blank">TelegramChannel</a></h5>
+			<h5><a href="https://t.me/iwwwanowww" target="_blank">Связь</a></h5>
+		</div>
 	</div>
 
+
 	<div class="autograph-container">
 		<h5>Иванов Кирилл</h5>
 		<h5>Москва</h5>

diff --git a/templates/Index.eta b/templates/Index.eta
@@ -1,6 +1,7 @@
 <% layout("LO") %>
 
 <div class="grid">
+	<h5 style="grid-column: 1/-1;">Все пользователи:</h5>
 	<% if (it.data.users && it.data.users.length) { %>
 	<div class="avatars-container">
 		<% data.users.forEach((user) => { %>
@@ -16,6 +17,11 @@
 </div>
 
 <div class="grid">
+	<hr>
+</div>
+
+<div class="grid">
+	<h5 style="grid-column: 1/-1;">Случайные страницы:</h5>
 	<% if (data.pages && !!data.pages.length) { %>
 	<% data.pages.forEach(function (page) { %>
 	<%~ include("card/cardPage", { page }) %>
@@ -30,6 +36,7 @@
 </div>
 
 <div class="grid">
+	<h5 style="grid-column: 1/-1;">Случайные элементы:</h5>
 	<%if (data.elements && data.elements.length) { %>
 	<% data.elements.forEach(function (element) { %>
 	<%~ include("card/cardElement", { element }) %>

diff --git a/templates/Profile.eta b/templates/Profile.eta
@@ -4,7 +4,7 @@
 
 	<%~ include("avatar/avatar", {
 	url: data.username,
-	src: data.src.avatar && data.src.avatar.webp190
+	src: data.src.avatar && data.src.avatar.original
 	}) %>
 
 	<div class="profile_username">

diff --git a/templates/avatar/avatar.css b/templates/avatar/avatar.css
@@ -1,6 +1,8 @@
 .avatar {
   display: block;
   height: fit-content;
+  min-width: 64px;
+  min-height: 64px;
   text-decoration: none !important;
   grid-column: auto;
 }

diff --git a/templates/button/button.css b/templates/button/button.css
@@ -15,6 +15,9 @@
   color: var(--color);
   border-color: var(--color);
 }
+.button * {
+  margin: 0;
+}
 .button_delete {
   --color: var(--red);
 }

diff --git a/templates/card/card.css b/templates/card/card.css
@@ -2,6 +2,7 @@
   position: relative;
 
   width: 100%;
+  min-height: 80px;
   /* overflow: hidden; */
 
   display: flex;
@@ -41,22 +42,20 @@
 
 /* TEXT-WRAPPER */
 .card-page__text-wrapper {
-  /* FIX добавь скролл */
+  display: flex;
   overflow-y: hidden;
   position: absolute;
   width: 100%;
   height: 100%;
-  display: none;
 
   align-items: flex-end;
   padding: 4px 2px;
 }
 .grid .card-page__text-wrapper {
-  align-items: flex-start;
+  align-items: flex-end;
   overflow: auto;
 }
 .list .card-page__text-wrapper {
-  position: absolute;
   padding: 8px 6px;
   max-width: 600px;
 }
@@ -65,6 +64,8 @@
 .card-page__text-container {
   width: 100%;
   height: min-content;
+  max-height: 100%;
+  overflow: hidden;
 
   display: flex;
   flex-direction: column;
@@ -75,6 +76,9 @@
 .grid .card-page__text-container {
   padding: 2px;
 }
+.grid .card-page__desc {
+  display: none;
+}
 .list .card-page__text-container {
   padding: 12px 8px;
   width: fit-content;
@@ -83,11 +87,6 @@
   width: fit-content;
 }
 
-/* HOVER */
-.card-page:hover .card-page__text-wrapper {
-  display: flex;
-}
-
 /* CARD-ELEMENT */
 .card-element__img-container {
   text-decoration: none !important;
@@ -163,8 +162,7 @@
   height: fit-content;
 }
 .grid .card-element__text {
-  opacity: 0.4;
-  color: var(--grey-light);
+  opacity: 0.2;
   /* mix-blend-mode: luminosity; */
 }
 

diff --git a/templates/card/cardElement.eta b/templates/card/cardElement.eta
@@ -1,4 +1,4 @@
-<% const mode = it.mode || 'webp190' %>
+<% const mode = it.mode || 'webp288' %>
 
 <div
 		 class="card card-element">

diff --git a/templates/card/cardPage.eta b/templates/card/cardPage.eta
@@ -1,4 +1,4 @@
-<% const mode = it.mode || 'webp190' %>
+<% const mode = it.mode || 'webp288' %>
 
 <a
 	 href="/page/<%= page.page_id %>"