From fb0bc57542a44dcc94149f393d8a4ff0c2e7902b Mon Sep 17 00:00:00 2001 From: Zephyrrus Date: Tue, 7 Jul 2020 02:02:59 +0300 Subject: feat: try fixing THE SHITTY WATERFALL --- nuxt.config.js | 27 ++- src/api/routes/albums/albumFullGET.js | 3 +- src/api/routes/albums/albumGET.js | 1 + src/setup.js | 49 ++-- src/site/components/grid/Grid.vue | 28 +-- src/site/components/grid/waterfall/Waterfall.vue | 47 +++- .../components/grid/waterfall/WaterfallItem.vue | 12 +- src/site/components/imageInfo/ImageInfo.vue | 0 src/site/pages/a/_identifier.vue | 38 +-- src/site/pages/dashboard/account.vue | 78 +++--- src/site/pages/dashboard/admin/user/_id.vue | 45 ++-- src/site/pages/dashboard/admin/users.vue | 270 +++++++++++---------- src/site/pages/dashboard/albums/_id.vue | 17 +- src/site/pages/dashboard/index.vue | 42 ++-- src/site/pages/login.vue | 46 ++-- src/site/plugins/notifier.js | 4 +- 16 files changed, 404 insertions(+), 303 deletions(-) create mode 100644 src/site/components/imageInfo/ImageInfo.vue diff --git a/nuxt.config.js b/nuxt.config.js index a45c7f1..9720e71 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -11,14 +11,14 @@ const clientConfig = { maxFileSize: parseInt(process.env.MAX_SIZE, 10), chunkSize: parseInt(process.env.CHUNK_SIZE, 10), maxLinksPerAlbum: parseInt(process.env.MAX_LINKS_PER_ALBUM, 10), - publicMode: process.env.PUBLIC_MODE === 'true' ? true : false, - userAccounts: process.env.USER_ACCOUNTS === 'true' ? true : false + publicMode: process.env.PUBLIC_MODE === 'true', + userAccounts: process.env.USER_ACCOUNTS === 'true', }; export default { mode: 'spa', server: { - port: process.env.WEBSITE_PORT + port: process.env.WEBSITE_PORT, }, srcDir: 'src/site/', head: { @@ -34,7 +34,7 @@ export default { { hid: 'apple-mobile-web-app-title', name: 'apple-mobile-web-app-title', - content: `${process.env.SERVICE_NAME}` + content: `${process.env.SERVICE_NAME}`, }, { hid: 'application-name', name: 'application-name', content: `${process.env.SERVICE_NAME}` }, // { hid: 'msapplication-config', name: 'msapplication-config', content: `${process.env.DOMAIN}/browserconfig.xml` }, @@ -50,14 +50,14 @@ export default { { hid: 'og:description', property: 'og:description', content: `${process.env.META_DESCRIPTION}` }, { hid: 'og:image', property: 'og:image', content: `${process.env.DOMAIN}/share.jpg` }, { hid: 'og:image:secure_url', property: 'og:image:secure_url', content: `${process.env.DOMAIN}/share.jpg` }, - { hid: 'og:site_name', property: 'og:site_name', content: `${process.env.SERVICE_NAME}` } + { hid: 'og:site_name', property: 'og:site_name', content: `${process.env.SERVICE_NAME}` }, ], link: [ { rel: 'stylesheet', href: 'https://fonts.googleapis.com/css?family=Nunito:300,400,600,700' }, // This one is a pain in the ass to make it customizable, so you should edit it manually - { type: 'application/json+oembed', href: `${process.env.DOMAIN}/oembed.json` } - ] + { type: 'application/json+oembed', href: `${process.env.DOMAIN}/oembed.json` }, + ], }, plugins: [ '~/plugins/axios', @@ -67,19 +67,20 @@ export default { '~/plugins/vue-timeago', '~/plugins/flexsearch', '~/plugins/vuebar', - '~/plugins/nuxt-client-init' + '~/plugins/nuxt-client-init', + '~/plugins/notifier', ], css: [], modules: ['@nuxtjs/axios', 'cookie-universal-nuxt'], axios: { - baseURL: `${process.env.DOMAIN}${process.env.ROUTE_PREFIX}` + baseURL: `${process.env.DOMAIN}${process.env.ROUTE_PREFIX}`, }, build: { extractCSS: true, postcss: { preset: { - autoprefixer - } + autoprefixer, + }, }, extend(config, { isClient, isDev }) { // Extend only webpack config for client-bundle @@ -89,6 +90,6 @@ export default { if (isDev) { config.devtool = isClient ? 'source-map' : 'inline-source-map'; } - } - } + }, + }, }; diff --git a/src/api/routes/albums/albumFullGET.js b/src/api/routes/albums/albumFullGET.js index a5c9707..2c3a790 100644 --- a/src/api/routes/albums/albumFullGET.js +++ b/src/api/routes/albums/albumFullGET.js @@ -41,6 +41,7 @@ class albumGET extends Route { count = files.length; } + // eslint-disable-next-line no-restricted-syntax for (let file of files) { file = Util.constructFilePublicLink(file); } @@ -49,7 +50,7 @@ class albumGET extends Route { message: 'Successfully retrieved album', name: album.name, files, - count + count, }); } } diff --git a/src/api/routes/albums/albumGET.js b/src/api/routes/albums/albumGET.js index f40750b..81edc95 100644 --- a/src/api/routes/albums/albumGET.js +++ b/src/api/routes/albums/albumGET.js @@ -25,6 +25,7 @@ class albumGET extends Route { .orderBy('files.id', 'desc'); // Create the links for each file + // eslint-disable-next-line no-restricted-syntax for (let file of files) { file = Util.constructFilePublicLink(file); } diff --git a/src/setup.js b/src/setup.js index 080320f..91eaa1c 100644 --- a/src/setup.js +++ b/src/setup.js @@ -1,9 +1,11 @@ +/* eslint-disable no-console */ const randomstring = require('randomstring'); const jetpack = require('fs-jetpack'); const qoa = require('qoa'); + qoa.config({ prefix: '>', - underlineQuery: false + underlineQuery: false, }); async function start() { @@ -15,82 +17,82 @@ async function start() { { type: 'input', query: 'Port to run the API in:', - handle: 'SERVER_PORT' + handle: 'SERVER_PORT', }, { type: 'input', query: 'Port to run the Website in when in dev mode:', - handle: 'WEBSITE_PORT' + handle: 'WEBSITE_PORT', }, { type: 'input', query: 'Full domain this instance is gonna be running on (Ex: https://lolisafe.moe):', - handle: 'DOMAIN' + handle: 'DOMAIN', }, { type: 'input', query: 'Name of the service? (Ex: lolisafe):', - handle: 'SERVICE_NAME' + handle: 'SERVICE_NAME', }, { type: 'input', query: 'Maximum allowed upload file size in MB (Ex: 100):', - handle: 'MAX_SIZE' + handle: 'MAX_SIZE', }, { type: 'confirm', query: 'Generate thumbnails for images/videos? (Requires ffmpeg installed and in your PATH)', handle: 'GENERATE_THUMBNAILS', accept: 'y', - deny: 'n' + deny: 'n', }, { type: 'confirm', query: 'Allow users to download entire albums in ZIP format?', handle: 'GENERATE_ZIPS', accept: 'y', - deny: 'n' + deny: 'n', }, { type: 'confirm', query: 'Serve files with node?', handle: 'SERVE_WITH_NODE', accept: 'y', - deny: 'n' + deny: 'n', }, { type: 'input', query: 'Base number of characters for generated file URLs (12 should be good enough):', - handle: 'GENERATED_FILENAME_LENGTH' + handle: 'GENERATED_FILENAME_LENGTH', }, { type: 'input', query: 'Base number of characters for generated album URLs (6 should be enough):', - handle: 'GENERATED_ALBUM_LENGTH' + handle: 'GENERATED_ALBUM_LENGTH', }, { type: 'confirm', query: 'Run lolisafe in public mode? (People will be able to upload without an account)', handle: 'PUBLIC_MODE', accept: 'y', - deny: 'n' + deny: 'n', }, { type: 'confirm', query: 'Enable user signup for new accounts?', handle: 'USER_ACCOUNTS', accept: 'y', - deny: 'n' + deny: 'n', }, { type: 'input', query: 'Name of the admin account?', - handle: 'ADMIN_ACCOUNT' + handle: 'ADMIN_ACCOUNT', }, { type: 'secure', query: 'Type a secure password for the admin account:', - handle: 'ADMIN_PASSWORD' + handle: 'ADMIN_PASSWORD', }, { type: 'interactive', @@ -100,29 +102,29 @@ async function start() { menu: [ 'sqlite3', 'pg', - 'mysql' - ] + 'mysql', + ], }, { type: 'input', query: 'Database host (Ignore if you selected sqlite3):', - handle: 'DB_HOST' + handle: 'DB_HOST', }, { type: 'input', query: 'Database user (Ignore if you selected sqlite3):', - handle: 'DB_USER' + handle: 'DB_USER', }, { type: 'input', query: 'Database password (Ignore if you selected sqlite3):', - handle: 'DB_PASSWORD' + handle: 'DB_PASSWORD', }, { type: 'input', query: 'Database name (Ignore if you selected sqlite3):', - handle: 'DB_DATABASE' - } + handle: 'DB_DATABASE', + }, ]; const response = await qoa.prompt(wizard); @@ -140,12 +142,13 @@ async function start() { META_THEME_COLOR: '#20222b', META_DESCRIPTION: 'Blazing fast file uploader and bunker written in node! 🚀', META_KEYWORDS: 'lolisafe,upload,uploader,file,vue,images,ssr,file uploader,free', - META_TWITTER_HANDLE: '@its_pitu' + META_TWITTER_HANDLE: '@its_pitu', }; const allSettings = Object.assign(defaultSettings, response); const keys = Object.keys(allSettings); + // eslint-disable-next-line no-restricted-syntax for (const item of keys) { envfile += `${item}=${allSettings[item]}\n`; } diff --git a/src/site/components/grid/Grid.vue b/src/site/components/grid/Grid.vue index d4fe067..e6a8c64 100644 --- a/src/site/components/grid/Grid.vue +++ b/src/site/components/grid/Grid.vue @@ -24,12 +24,10 @@ - + :gutterHeight="4" + :itemWidth="width" + :items="gridFiles"> +
@@ -185,12 +183,10 @@ import { mapState } from 'vuex'; import Waterfall from './waterfall/Waterfall.vue'; -import WaterfallItem from './waterfall/WaterfallItem.vue'; export default { components: { Waterfall, - WaterfallItem, }, props: { files: { @@ -253,13 +249,13 @@ export default { const data = await this.$search.do(this.searchTerm, ['name', 'original', 'type', 'albums:name']); console.log('> Search result data', data); }, - deleteFile(file, index) { - this.$buefy.dialog.confirm({ + deleteFile(file) { + this.$emit('delete', file); + /* this.$buefy.dialog.confirm({ title: 'Deleting file', message: 'Are you sure you want to delete this file?', confirmText: 'Delete File', type: 'is-danger', - hasIcon: true, onConfirm: async () => { const response = await this.$axios.$delete(`file/${file.id}`); if (this.showList) { @@ -274,7 +270,7 @@ export default { } return this.$buefy.toast.open(response.message); }, - }); + }); */ }, isAlbumSelected(id) { if (!this.showingModalForFile) return false; @@ -311,10 +307,6 @@ export default { const foundIndex = this.hoveredItems.indexOf(id); if (foundIndex > -1) return; this.hoveredItems.push(id); - /// XXX: THIS IS NOT OK! - this.$nextTick(() => { - this.$refs.video.forEach((e) => e.play().catch(() => {})); - }); }, mouseOut(id) { console.log('out', id); diff --git a/src/site/components/grid/waterfall/Waterfall.vue b/src/site/components/grid/waterfall/Waterfall.vue index cccc3ac..a83a275 100644 --- a/src/site/components/grid/waterfall/Waterfall.vue +++ b/src/site/components/grid/waterfall/Waterfall.vue @@ -1,14 +1,14 @@ - + + + diff --git a/src/site/components/grid/waterfall/WaterfallItem.vue b/src/site/components/grid/waterfall/WaterfallItem.vue index 2a5c69a..a49c58c 100644 --- a/src/site/components/grid/waterfall/WaterfallItem.vue +++ b/src/site/components/grid/waterfall/WaterfallItem.vue @@ -1,9 +1,3 @@ - -