pixeldrain/fnx_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge files and albums pages into user dashboard

Browse Source
This commit is contained in:
Wim Brand
2025-03-26 00:16:36 +01:00
parent 3fe0b43372
commit 61ed63d458
13 changed files with 73 additions and 354 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
res/template/user_file_manager.html
View File

@@ -1,19 +0,0 @@
{{define "file_manager"}}<!DOCTYPE html>
<html lang="en">
<head>
{{template "meta_tags" "File Manager"}}
<script>
window.api_endpoint = '{{.APIEndpoint}}';
window.user = {{.User}};
</script>
<script defer src='/res/svelte/user_file_manager.js?v{{cacheID}}'></script>
</head>
<body>
{{template "menu" .}}
<div id="page_body" class="page_body"></div>
{{template "analytics"}}
</body>
</html>
{{end}}

1
svelte/rollup.config.js
View File

@@ -14,7 +14,6 @@ export default [
"file_viewer", "file_viewer",
"filesystem", "filesystem",
"user_home", "user_home",
"user_file_manager",
"admin_panel", "admin_panel",
"home_page", "home_page",
"text_upload", "text_upload",

2
svelte/src/file_viewer/FilePicker.svelte
View File

@@ -1,7 +1,7 @@
<script> <script>
import { createEventDispatcher, tick } from "svelte"; import { createEventDispatcher, tick } from "svelte";
import { formatDataVolume } from "../util/Formatting.svelte"; import { formatDataVolume } from "../util/Formatting.svelte";
import DirectoryElement from "../user_file_manager/DirectoryElement.svelte"; import DirectoryElement from "../user_home/filemanager/DirectoryElement.svelte";
import Modal from "../util/Modal.svelte"; import Modal from "../util/Modal.svelte";
let dispatch = createEventDispatcher() let dispatch = createEventDispatcher()

8
svelte/src/user_file_manager.js
View File

@@ -1,8 +0,0 @@
import App from './user_file_manager/FileManager.svelte';
const app = new App({
target: document.getElementById("page_body"),
props: {}
});
export default app;

23
svelte/src/user_home/Router.svelte
View File

@@ -1,4 +1,4 @@
<script> <script lang="ts">
import AccountSettings from "./AccountSettings.svelte"; import AccountSettings from "./AccountSettings.svelte";
import APIKeys from "./APIKeys.svelte"; import APIKeys from "./APIKeys.svelte";
import Transactions from "./Transactions.svelte"; import Transactions from "./Transactions.svelte";
@@ -6,20 +6,30 @@ import Subscription from "./Subscription.svelte";
import ConnectApp from "./ConnectApp.svelte"; import ConnectApp from "./ConnectApp.svelte";
import ActivityLog from "./ActivityLog.svelte"; import ActivityLog from "./ActivityLog.svelte";
import DepositCredit from "./DepositCredit.svelte"; import DepositCredit from "./DepositCredit.svelte";
import TabMenu from "../util/TabMenu.svelte"; import TabMenu, { type Tab } from "../util/TabMenu.svelte";
import BandwidthSharing from "./BandwidthSharing.svelte"; import BandwidthSharing from "./BandwidthSharing.svelte";
import EmbeddingControls from "./EmbeddingControls.svelte"; import EmbeddingControls from "./EmbeddingControls.svelte";
import PageBranding from "./PageBranding.svelte"; import PageBranding from "./PageBranding.svelte";
import Dashboard from "./dashboard/Dashboard.svelte"; import Dashboard from "./dashboard/Dashboard.svelte";
import AffiliatePrompt from "./AffiliatePrompt.svelte"; import AffiliatePrompt from "./AffiliatePrompt.svelte";
import FileManager from "./filemanager/FileManager.svelte";
import { onMount } from "svelte";
import { get_user, type User } from "../lib/PixeldrainAPI.mjs";
let pages = [ let pages: Tab[] = [
{ {
path: "/user", path: "/user",
title: "Dashboard", title: "Dashboard",
icon: "dashboard", icon: "dashboard",
component: Dashboard, component: Dashboard,
hide_background: true, hide_background: true,
}, {
path: "/user/filemanager",
title: "My Files",
icon: "",
component: FileManager,
hidden: true,
hide_frame: true,
}, { }, {
path: "/user/settings", path: "/user/settings",
title: "Settings", title: "Settings",
@@ -86,8 +96,13 @@ let pages = [
component: ActivityLog, component: ActivityLog,
}, },
] ]
let user = {} as User
onMount(async () => {
user = await get_user()
})
</script> </script>
<TabMenu pages={pages} title="Welcome, {window.user.username}!"/> <TabMenu pages={pages} title="Welcome, {user.username}!"/>
<AffiliatePrompt always/> <AffiliatePrompt always/>

4
svelte/src/user_home/dashboard/CardAccount.svelte
View File

@@ -43,11 +43,11 @@
<h3>Exports</h3> <h3>Exports</h3>
<div class="button_row"> <div class="button_row">
<a href="/user/export/files" class="button"> <a href="/api/user/files?format=csv" class="button">
<i class="icon">list</i> <i class="icon">list</i>
Export files to CSV Export files to CSV
</a> </a>
<a href="/user/export/lists" class="button"> <a href="/api/user/lists?format=csv" class="button">
<i class="icon">list</i> <i class="icon">list</i>
Export albums to CSV Export albums to CSV
</a> </a>

2
svelte/src/user_file_manager/DirectoryElement.svelte → svelte/src/user_home/filemanager/DirectoryElement.svelte
View File

@@ -1,5 +1,5 @@
<script> <script>
import { formatDataVolume, formatDate } from "../util/Formatting.svelte"; import { formatDataVolume, formatDate } from "../../util/Formatting.svelte";
// Main elements // Main elements
let directoryArea let directoryArea

12
svelte/src/user_file_manager/FileManager.svelte → svelte/src/user_home/filemanager/FileManager.svelte
View File

@@ -1,9 +1,9 @@
<script> <script>
import { onMount } from "svelte"; import { onMount } from "svelte";
import { formatDataVolume } from "../util/Formatting.svelte"; import { formatDataVolume } from "../../util/Formatting.svelte";
import Modal from "../util/Modal.svelte"; import Modal from "../../util/Modal.svelte";
import Spinner from "../util/Spinner.svelte"; import Spinner from "../../util/Spinner.svelte";
import UploadWidget from "../util/upload_widget/UploadWidget.svelte"; import UploadWidget from "../../util/upload_widget/UploadWidget.svelte";
import DirectoryElement from "./DirectoryElement.svelte" import DirectoryElement from "./DirectoryElement.svelte"
let loading = true let loading = true
@@ -97,7 +97,7 @@ let hashChange = () => {
} }
if (window.location.hash === "#lists") { if (window.location.hash === "#lists") {
contentType = "lists" contentType = "lists"
document.title = "My Lists" document.title = "My Albums"
getUserLists() getUserLists()
resetMenu() resetMenu()
} else { } else {
@@ -286,7 +286,7 @@ onMount(() => {
{#if selecting} {#if selecting}
<div class="nav_bar"> <div class="nav_bar">
{#if contentType === "files"} {#if contentType === "files"}
<button on:click={createList}><i class="icon">list</i> Make list</button> <button on:click={createList}><i class="icon">list</i> Make album</button>
<button on:click={downloadFiles}><i class="icon">download</i> Download</button> <button on:click={downloadFiles}><i class="icon">download</i> Download</button>
{/if} {/if}
<button on:click={bulkDelete}><i class="icon">delete</i> Delete</button> <button on:click={bulkDelete}><i class="icon">delete</i> Delete</button>

36
svelte/src/util/TabMenu.svelte
View File

@@ -1,11 +1,23 @@
<script> <script lang="ts" context="module">
import { onMount } from "svelte"; export type Tab = {
path: string,
title: string,
icon: string,
component?: ComponentType,
hidden?: boolean,
hide_background?: boolean,
hide_frame?: boolean,
subpages?: Tab[],
}
</script>
<script lang="ts">
import { onMount, type ComponentType } from "svelte";
import Footer from "../layout/Footer.svelte"; import Footer from "../layout/Footer.svelte";
export let title = "" export let title = ""
export let pages = [] export let pages: Tab[] = []
let navigate = (path, title) => { let navigate = (path: string, title: string) => {
window.document.title = title+" ~ pixeldrain" window.document.title = title+" ~ pixeldrain"
window.history.pushState({}, window.document.title, path) window.history.pushState({}, window.document.title, path)
@@ -46,15 +58,16 @@ let get_page = () => {
pages = pages pages = pages
} }
let current_page = null let current_page: Tab = null
let current_subpage = null let current_subpage: Tab = null
onMount(() => get_page()) onMount(() => get_page())
</script> </script>
<svelte:window on:popstate={get_page} /> <svelte:window on:popstate={get_page} />
<header> {#if current_page !== null && current_page.hide_frame !== true}
<header>
<h1>{title}</h1> <h1>{title}</h1>
<div class="tab_bar"> <div class="tab_bar">
@@ -70,9 +83,10 @@ onMount(() => get_page())
{/if} {/if}
{/each} {/each}
</div> </div>
</header> </header>
{/if}
{#if current_page} {#if current_page !== null}
<div id="page_content" class:page_content={current_page.hide_background !== true}> <div id="page_content" class:page_content={current_page.hide_background !== true}>
{#if current_page.subpages} {#if current_page.subpages}
<div class="tab_bar submenu"> <div class="tab_bar submenu">
@@ -98,7 +112,9 @@ onMount(() => get_page())
</div> </div>
{/if} {/if}
<Footer/> {#if current_page !== null && current_page.hide_frame !== true}
<Footer/>
{/if}
<style> <style>
.submenu { .submenu {

1
svelte/tsconfig.json
View File

@@ -1,5 +1,6 @@
{ {
"compilerOptions": { "compilerOptions": {
"baseUrl": "./",
"verbatimModuleSyntax": true, "verbatimModuleSyntax": true,
"target": "ES2017", "target": "ES2017",
}, },

158
webcontroller/user_account.go
View File

@@ -1,59 +1,12 @@
package webcontroller package webcontroller
import ( import (
"fmt"
"html/template"
"net/http" "net/http"
"fornaxian.tech/log" "fornaxian.tech/log"
"fornaxian.tech/pixeldrain_api_client/pixelapi"
"github.com/julienschmidt/httprouter" "github.com/julienschmidt/httprouter"
) )
// formAPIError makes it easier to display errors returned by the pixeldrain
// API. TO make use of this function the form fields should be named exactly the
// same as the API parameters
func formAPIError(err error, f *Form) {
fieldLabel := func(name string) string {
for _, v := range f.Fields {
if v.Name == name {
return v.Label
}
}
return name
}
if apierr, ok := err.(pixelapi.Error); ok {
if apierr.StatusCode == "multiple_errors" {
for _, err := range apierr.Errors {
// Modify the message to make it more user-friendly
if err.StatusCode == "string_out_of_range" {
err.Message = fmt.Sprintf(
"%s is too long or too short. Should be between %v and %v characters. Current length: %v",
fieldLabel(err.Extra["field"].(string)),
err.Extra["min_len"],
err.Extra["max_len"],
err.Extra["len"],
)
} else if err.StatusCode == "field_contains_illegal_character" {
err.Message = fmt.Sprintf(
"Character '%v' is not allowed in %s",
err.Extra["char"],
fieldLabel(err.Extra["field"].(string)),
)
}
f.SubmitMessages = append(f.SubmitMessages, template.HTML(err.Message))
}
} else {
f.SubmitMessages = append(f.SubmitMessages, template.HTML(apierr.Message))
}
} else {
log.Error("Error submitting form: %s", err)
f.SubmitMessages = []template.HTML{"Internal Server Error"}
}
}
func (wc *WebController) serveLogout( func (wc *WebController) serveLogout(
w http.ResponseWriter, w http.ResponseWriter,
r *http.Request, r *http.Request,
@@ -68,114 +21,3 @@ func (wc *WebController) serveLogout(
http.Redirect(w, r, "/", http.StatusSeeOther) http.Redirect(w, r, "/", http.StatusSeeOther)
} }
func (wc *WebController) passwordResetForm(td *TemplateData, r *http.Request) (f Form) {
f = Form{
Name: "password_reset",
Title: "Recover lost password",
Fields: []Field{
{
Name: "email",
Label: "E-mail address",
Description: `we will send a password reset link to this e-mail
address`,
Type: FieldTypeEmail,
}, {
Name: "recaptcha_response",
Label: "Turing test (click the white box)",
Description: "the reCaptcha turing test verifies that you " +
"are not an evil robot that is trying hijack accounts",
Type: FieldTypeCaptcha,
CaptchaSiteKey: wc.captchaKey(),
},
},
SubmitLabel: "Submit",
}
if f.ReadInput(r) {
if err := td.PixelAPI.PutUserPasswordReset(
f.FieldVal("email"),
f.FieldVal("recaptcha_response"),
); err != nil {
formAPIError(err, &f)
} else {
f.SubmitSuccess = true
f.SubmitMessages = []template.HTML{
"Success! Check your inbox for instructions to reset your password",
}
}
}
return f
}
func (wc *WebController) passwordResetConfirmForm(td *TemplateData, r *http.Request) (f Form) {
f = Form{
Name: "password_reset_confirm",
Title: "Reset lost password",
Fields: []Field{
{
Name: "new_password",
Label: "Password",
Type: FieldTypeNewPassword,
}, {
Name: "new_password2",
Label: "Password again",
Description: "you need to enter your password twice so we " +
"can verify that no typing errors were made, which would " +
"prevent you from logging into your new account",
Type: FieldTypeNewPassword,
},
},
SubmitLabel: "Submit",
}
var resetKey = r.FormValue("key")
if resetKey == "" {
f.SubmitSuccess = false
f.SubmitMessages = []template.HTML{"Password reset key required"}
return f
}
if f.ReadInput(r) {
if f.FieldVal("new_password") != f.FieldVal("new_password2") {
f.SubmitMessages = []template.HTML{
"Password verification failed. Please enter the same " +
"password in both password fields"}
return f
}
if err := td.PixelAPI.PutUserPasswordResetConfirm(resetKey, f.FieldVal("new_password")); err != nil {
formAPIError(err, &f)
} else {
f.SubmitSuccess = true
f.SubmitMessages = []template.HTML{
`Success! You can now <a href="/login">log in</a> with your new password`,
}
}
}
return f
}
func (wc *WebController) serveEmailConfirm(
w http.ResponseWriter,
r *http.Request,
p httprouter.Params,
) {
var err error
var status string
err = wc.api.PutUserEmailResetConfirm(r.FormValue("key"))
if err != nil && err.Error() == "not_found" {
status = "not_found"
} else if err != nil {
log.Debug("E-mail reset fail: %s", err)
status = "internal_error"
} else {
status = "success"
}
td := wc.newTemplateData(w, r)
td.Other = status
wc.templates.Run(w, r, "email_confirm", td)
}

107
webcontroller/user_export.go
View File

@@ -1,107 +0,0 @@
package webcontroller
import (
"io"
"net/http"
"sort"
"strconv"
"strings"
"time"
"fornaxian.tech/log"
"github.com/julienschmidt/httprouter"
)
func writeCSVLine(w io.Writer, fields ...interface{}) {
for i, field := range fields {
if i != 0 {
w.Write([]byte(","))
}
switch val := field.(type) {
case string:
// In CSV files quotes are escaped by replacing them with double quotes
w.Write([]byte(`"` + strings.ReplaceAll(val, `"`, `""`) + `"`))
case int:
w.Write([]byte(strconv.Itoa(val)))
case int64:
w.Write([]byte(strconv.FormatInt(val, 10)))
case time.Time:
w.Write([]byte(`"` + val.Format(time.RFC3339) + `"`))
default:
panic("unknown CSV field type")
}
}
w.Write([]byte("\n"))
}
func (wc *WebController) serveUserExportFiles(
w http.ResponseWriter,
r *http.Request,
p httprouter.Params,
) {
td := wc.newTemplateData(w, r)
if !td.Authenticated {
http.Redirect(w, r, "/login", http.StatusSeeOther)
return
}
files, err := td.PixelAPI.GetUserFiles()
if err != nil {
log.Error("Failed to get user files: %s", err)
return
}
sort.Slice(files.Files, func(i, j int) (less bool) {
return files.Files[i].DateUpload.Before(files.Files[j].DateUpload)
})
w.Header().Add("Content-Description", "File Transfer")
w.Header().Add("Content-Disposition", `attachment; filename=pixeldrain_user_files.csv`)
w.Header().Add("Content-Type", "text/csv")
w.Header().Add("Transfer-Encoding", "chunked") // Replacement for Content-Length
writeCSVLine(
w, "id", "name", "size", "type", "date_upload", "date_last_view",
"views", "downloads", "bandwidth_used", "bandwidth_used_paid",
)
for _, file := range files.Files {
writeCSVLine(
w, file.ID, file.Name, file.Size, file.MimeType, file.DateUpload,
file.DateLastView, file.Views, file.Downloads, file.BandwidthUsed,
file.BandwidthUsedPaid,
)
}
}
func (wc *WebController) serveUserExportLists(
w http.ResponseWriter,
r *http.Request,
p httprouter.Params,
) {
td := wc.newTemplateData(w, r)
if !td.Authenticated {
http.Redirect(w, r, "/login", http.StatusSeeOther)
return
}
lists, err := td.PixelAPI.GetUserLists()
if err != nil {
log.Error("Failed to get user lists: %s", err)
return
}
sort.Slice(lists.Lists, func(i, j int) (less bool) {
return lists.Lists[i].DateCreated.Before(lists.Lists[j].DateCreated)
})
w.Header().Add("Content-Description", "File Transfer")
w.Header().Add("Content-Disposition", `attachment; filename=pixeldrain_user_lists.csv`)
w.Header().Add("Content-Type", "text/csv")
w.Header().Add("Transfer-Encoding", "chunked") // Replacement for Content-Length
writeCSVLine(w, "id", "title", "date_created", "file_count")
for _, list := range lists.Lists {
writeCSVLine(w, list.ID, list.Title, list.DateCreated, list.FileCount)
}
}

22
webcontroller/web_controller.go
View File

@@ -158,31 +158,11 @@ func New(r *httprouter.Router, prefix string, conf Config) (wc *WebController) {
// User account pages // User account pages
{GET, "login" /* */, wc.serveTemplate("login", handlerOpts{NoEmbed: true})}, {GET, "login" /* */, wc.serveTemplate("login", handlerOpts{NoEmbed: true})},
{GET, "register" /* */, wc.serveTemplate("login", handlerOpts{NoEmbed: true})}, {GET, "register" /* */, wc.serveTemplate("login", handlerOpts{NoEmbed: true})},
{GET, "password_reset" /* */, wc.serveForm(wc.passwordResetForm, handlerOpts{NoEmbed: true})},
{PST, "password_reset" /* */, wc.serveForm(wc.passwordResetForm, handlerOpts{NoEmbed: true})},
{GET, "logout" /* */, wc.serveTemplate("logout", handlerOpts{Auth: true, NoEmbed: true})}, {GET, "logout" /* */, wc.serveTemplate("logout", handlerOpts{Auth: true, NoEmbed: true})},
{PST, "logout" /* */, wc.serveLogout}, {PST, "logout" /* */, wc.serveLogout},
{GET, "user/filemanager" /* */, wc.serveTemplate("file_manager", handlerOpts{Auth: true})},
{GET, "user/export/files" /**/, wc.serveUserExportFiles},
{GET, "user/export/lists" /**/, wc.serveUserExportLists},
// User account settings // User account settings
{GET, "user" /* */, wc.serveTemplate("user_home", handlerOpts{Auth: true, NoEmbed: true})}, {GET, "user/*p", wc.serveTemplate("user_home", handlerOpts{Auth: true, NoEmbed: true})},
{GET, "user/home" /* */, wc.serveTemplate("user_home", handlerOpts{Auth: true, NoEmbed: true})},
{GET, "user/settings" /* */, wc.serveTemplate("user_home", handlerOpts{Auth: true, NoEmbed: true})},
{GET, "user/sharing" /* */, wc.serveTemplate("user_home", handlerOpts{Auth: true, NoEmbed: true})},
{GET, "user/sharing/*p" /* */, wc.serveTemplate("user_home", handlerOpts{Auth: true, NoEmbed: true})},
{GET, "user/api_keys" /* */, wc.serveTemplate("user_home", handlerOpts{Auth: true, NoEmbed: true})},
{GET, "user/activity" /* */, wc.serveTemplate("user_home", handlerOpts{Auth: true, NoEmbed: true})},
{GET, "user/connect_app" /* */, wc.serveTemplate("user_home", handlerOpts{Auth: true, NoEmbed: true})},
{GET, "user/transactions" /* */, wc.serveTemplate("user_home", handlerOpts{Auth: true, NoEmbed: true})},
{GET, "user/subscription" /* */, wc.serveTemplate("user_home", handlerOpts{Auth: true, NoEmbed: true})},
{GET, "user/prepaid" /* */, wc.serveTemplate("user_home", handlerOpts{Auth: true, NoEmbed: true})},
{GET, "user/prepaid/*p" /* */, wc.serveTemplate("user_home", handlerOpts{Auth: true, NoEmbed: true})},
{GET, "user/confirm_email" /* */, wc.serveEmailConfirm},
{GET, "user/password_reset_confirm" /**/, wc.serveForm(wc.passwordResetConfirmForm, handlerOpts{NoEmbed: true})},
{PST, "user/password_reset_confirm" /**/, wc.serveForm(wc.passwordResetConfirmForm, handlerOpts{NoEmbed: true})},
// Admin settings // Admin settings
{GET, "admin" /* */, wc.serveTemplate("admin", handlerOpts{Auth: true})}, {GET, "admin" /* */, wc.serveTemplate("admin", handlerOpts{Auth: true})},