Skip to content

Commit

Permalink
minor ui change
Browse files Browse the repository at this point in the history
  • Loading branch information
@Young-Lord
Young-Lord committed Oct 6, 2024
1 parent e17b0d4 commit 3fd53cf
Show file tree
Hide file tree
Showing 4 changed files with 73 additions and 25 deletions.
10 changes: 5 additions & 5 deletions .env.development
View file
Original file line number Diff line number Diff line change
@@ -1,21 +1,21 @@
APP_SECRET=""
FLASK_SERVER_NAME="localhost:5000"
BIND_HOST="127.0.0.1"
BIND_PORT="5001"
FLASK_SERVER_NAME="localhost:${BIND_PORT}"
FLASK_APPLICATION_ROOT="/"
FLASK_PREFERRED_URL_SCHEME="http"
VITE_BASE_DOMAIN="http://localhost:53000"
VITE_BASE_PATH="" # example: "/service/clip"
VITE_API_BASE_DOMAIN="http://localhost:5000"
VITE_API_BASE_DOMAIN="http://localhost:${BIND_PORT}"
VITE_API_BASE_PATH="${VITE_BASE_PATH}"
CORS_ORIGINS="http://localhost:53000" # delim by single space
MAIL_SERVER="localhost"
WEBSOCKET_ENDPOINT="ws://localhost:5000" # leave empty to disable; should NOT include path here, as it represents namespace ( https://socket.io/docs/v4/client-options/#path )
WEBSOCKET_ENDPOINT="ws://localhost:${BIND_PORT}" # leave empty to disable; should NOT include path here, as it represents namespace ( https://socket.io/docs/v4/client-options/#path )
WEBSOCKET_PATH="/socket.io/"
WEBSOCKET_PATH_FOR_SERVER="${WEBSOCKET_PATH}" # should match with WEBSOCKET_PATH, except for the path removed by reverse proxy
BEHIND_REVERSE_PROXY="false"
# set to "true" if your app is behind a proxy, this helps to get real IP address
# see: https://werkzeug.palletsprojects.com/en/latest/middleware/proxy_fix/#werkzeug.middleware.proxy_fix.ProxyFix
PROXYFIX_EXTRA_KWARGS='{}'
# e.g., {"x_prefix": 1, "x_host": 1} to make url_for work behind reverse proxy (like `URL Rewrite`)
BIND_HOST="127.0.0.1"
BIND_PORT="5000"
SQLALCHEMY_DATABASE_URI="sqlite:///main.db"
19 changes: 19 additions & 0 deletions frontend/src/components/SidebarDelimLine.vue
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
<template>
<div class="SidebarDelimLine"></div>
</template>

<script setup lang="ts"></script>
<style>
.SidebarDelimLine {
border-color: currentColor;
border-style: solid;
border-width: 0 0 1px;
opacity: 0.38;
content: "";
/* position: absolute; */
top: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>
68 changes: 49 additions & 19 deletions frontend/src/views/Clip.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -115,6 +115,7 @@
v-model="selected_timeout"
:prepend-inner-icon="mdiClock"
v-if="!is_new && !is_readonly"
hide-details="auto"
>
</v-select>
<!-- current url, click to copy-->
Expand All @@ -126,6 +127,7 @@
@click="copyString(current_url)"
class="cursor-pointer"
v-if="!is_readonly"
hide-details="auto"
>
</v-text-field>
<!-- readonly url, click to copy-->
Expand All @@ -151,6 +153,7 @@
: mdiPlusCircleOutline
"
@click:append-inner.stop="toggleReadonlyUrl()"
hide-details="auto"
>
</v-text-field>
<v-list
Expand Down Expand Up @@ -179,6 +182,7 @@
"
></v-list-item>
</template>
<SideBarDelimLine></SideBarDelimLine>
<!--prepend single line message-->
<v-text-field
v-model="combine_content"
Expand All @@ -199,6 +203,7 @@
combinePushContent()
"
v-if="!is_readonly"
hide-details="auto"
>
</v-text-field>
<!-- save interval -->
Expand All @@ -210,6 +215,7 @@
type="number"
@keyup="onUpdateSaveInterval()"
v-if="!is_readonly"
hide-details="auto"
>
</v-text-field>
<!-- auto fetch remote content interval -->
Expand All @@ -220,6 +226,7 @@
dense
type="number"
@keyup="onUpdateFetchInterval()"
hide-details="auto"
>
</v-text-field>
<!-- checkbox for encrypt text content / file -->
Expand All @@ -228,16 +235,20 @@
:label="$t('clip.encrypt_content')"
v-if="!is_readonly"
@change="updateEncryptText()"
hide-details="auto"
>
</v-checkbox>
<SideBarDelimLine></SideBarDelimLine>
<v-checkbox
v-model="encrypt_file"
:label="$t('clip.encrypt_file')"
v-if="!is_readonly && allow_file"
:disabled="uploading"
@change="updateEncryptFile()"
hide-details="auto"
>
</v-checkbox>
<SideBarDelimLine></SideBarDelimLine>
<!--send by mail-->
<v-text-field
v-model="mail_address"
Expand All @@ -249,17 +260,9 @@
@click:append-inner="sendToMail()"
type="email"
v-if="allow_mail"
hide-details="auto"
>
</v-text-field>
<!--report clip-->
<v-list-item
:prepend-icon="mdiAlertOctagon"
@click="reportClip()"
>
<v-list-item-title>{{
$t("clip.report.report_clip")
}}</v-list-item-title>
</v-list-item>
<!--Instant sync (WebSocket)-->
<v-checkbox
v-model="instant_sync"
Expand All @@ -271,7 +274,18 @@
!is_readonly && allow_instant_sync
"
:disabled="!instant_sync_code_ready"
hide-details="auto"
></v-checkbox>
<SideBarDelimLine></SideBarDelimLine>
<!--report clip-->
<v-list-item
:prepend-icon="mdiAlertOctagon"
@click="reportClip()"
>
<v-list-item-title>{{
$t("clip.report.report_clip")
}}</v-list-item-title>
</v-list-item>
</v-list-group>
</v-list>
</v-card>
Expand Down Expand Up @@ -506,6 +520,7 @@ import {
mdiEye,
} from "@mdi/js"
import AppBarHomeButton from "@/components/AppBarHomeButton.vue"
import SideBarDelimLine from "@/components/SidebarDelimLine.vue"
import { useDisplay } from "vuetify"
const { smAndUp } = useDisplay()
const should_wrap_appbar_to_slot = computed(() => {
Expand Down Expand Up @@ -640,7 +655,6 @@ function processFetchedFiles(files: FileDataRaw[]) {
file.user_property = JSON.parse(file.user_property)
file.filename = mayDecryptFilename(file as FileData)
})
console.log(files)
remote_files.value = files as FileData[]
}
async function processFetchedContent(
Expand Down Expand Up @@ -937,9 +951,9 @@ function getTotalSize(...file_arrays: (File[] | FileData[])[]): number {
}
function arrayBufferToWordArray(ab: ArrayBuffer): WordArray {
// https://stackoverflow.com/questions/33914764/how-to-read-a-binary-file-with-filereader-in-order-to-hash-it-with-sha-256-in-cr
var i8a = new Uint8Array(ab)
var a = []
for (var i = 0; i < i8a.length; i += 4) {
let i8a = new Uint8Array(ab)
let a = []
for (let i = 0; i < i8a.length; i += 4) {
a.push(
(i8a[i] << 24) | (i8a[i + 1] << 16) | (i8a[i + 2] << 8) | i8a[i + 3]
)
Expand Down Expand Up @@ -1108,10 +1122,10 @@ function canPreviewFile(file: FileData): boolean {
// Instant Sync
import { onBeforeRouteLeave } from "vue-router"
import type { io as ioType } from "socket.io-client"
var io: null | typeof ioType = null
let io: null | typeof ioType = null
import type { diff_match_patch as DiffMatchPatchType } from "@dmsnell/diff-match-patch"
type patch_obj = DiffMatchPatchType.patch_obj
var diff_match_patch: null | DiffMatchPatchType = null
let diff_match_patch: null | DiffMatchPatchType = null
const instant_sync_code_ready = ref(false)
watch(first_fetched, async (new_first_fetched, old_first_fetched) => {
if (new_first_fetched && !old_first_fetched) {
Expand Down Expand Up @@ -1531,20 +1545,36 @@ async function reportClip() {
}
/* remove useless padding in sidebar */
#sidebar .v-input__details {
/* #sidebar .v-input__details {
display: none;
}
} */
#sidebar .v-list {
/* #sidebar .v-list {
padding: 0;
} */
.v-select__selection-text {
/* make Expiration text pure black*/
color: #000000;
}
#sidebar .v-list-group__items .v-list-item {
/* fix indent for Report Clip */
padding-inline-start: 16px !important;
}
/* add better padding in file card */
#sidebar .v-input.v-checkbox {
/* make checkbox look better */
background-color: #f6f6f6;
}
/* Disable the tranisition animation when changing files. */
/* .v-messages__message {
transition: none !important;
} */
#file-card div.v-input__prepend {
/* add better padding in file card */
margin-inline-start: 16px !important;
margin-inline-end: 16px !important;
}
Expand Down
1 change: 0 additions & 1 deletion server/app/config.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,6 @@ class Config:
)

# endpoint
# check if a WSGI server is required. If not, remove unused imports & monkey patches
API_SUFFIX = "/api"
HOMEPAGE_URL: str = environ["VITE_HOMEPAGE_URL"]
API_URL: str = environ["VITE_API_URL"]
Expand Down

0 comments on commit 3fd53cf

Please sign in to comment.