adding ui sharing
This commit is contained in:
Executable
+62
@@ -0,0 +1,62 @@
|
||||
#!/bin/bash
|
||||
|
||||
# This script is used to apply all migrations in order
|
||||
# It can be run manually or as part of container initialization
|
||||
|
||||
# Determine run mode
|
||||
if [ -z "$POSTGRES_DB" ]; then
|
||||
# Manual mode - script was run from command line
|
||||
|
||||
# Verify we are in the right environment
|
||||
if [ ! -f "Cargo.toml" ]; then
|
||||
echo "Error: This script must be run from the OxiCloud project root directory"
|
||||
exit 1
|
||||
fi
|
||||
|
||||
# Check if postgres container is running
|
||||
POSTGRES_ID=$(docker-compose ps -q postgres 2>/dev/null)
|
||||
if [ -z "$POSTGRES_ID" ]; then
|
||||
echo "Error: PostgreSQL container is not running. Start it with 'docker-compose up -d postgres'"
|
||||
exit 1
|
||||
fi
|
||||
|
||||
# Set parameters for manual mode
|
||||
DB_NAME="oxicloud"
|
||||
MIGRATIONS_DIR="./migrations"
|
||||
MIGRATIONS_CMD="docker-compose exec -T postgres psql -U postgres"
|
||||
else
|
||||
# Auto mode - script is running inside postgres container during initialization
|
||||
echo "Running in PostgreSQL container initialization mode"
|
||||
|
||||
# Set parameters for auto mode
|
||||
DB_NAME="$POSTGRES_DB"
|
||||
MIGRATIONS_DIR="/docker-entrypoint-initdb.d/migrations"
|
||||
MIGRATIONS_CMD="psql -U $POSTGRES_USER"
|
||||
fi
|
||||
|
||||
echo "Applying migrations from $MIGRATIONS_DIR to database $DB_NAME"
|
||||
|
||||
# Ensure schema is created (fallback)
|
||||
$MIGRATIONS_CMD -d "$DB_NAME" -c "CREATE SCHEMA IF NOT EXISTS auth;" 2>/dev/null
|
||||
|
||||
# Get each SQL file from migrations directory in alphabetical order
|
||||
for sql_file in $(find $MIGRATIONS_DIR -name "*.sql" | sort); do
|
||||
echo "Applying migration: $(basename $sql_file)"
|
||||
|
||||
# Run the migration
|
||||
if [ -z "$POSTGRES_DB" ]; then
|
||||
# Manual mode - run through docker-compose
|
||||
docker-compose exec -T postgres psql -U postgres -d "$DB_NAME" -f "/docker-entrypoint-initdb.d/migrations/$(basename $sql_file)"
|
||||
else
|
||||
# Auto mode - run directly
|
||||
psql -U "$POSTGRES_USER" -d "$DB_NAME" -f "$sql_file"
|
||||
fi
|
||||
|
||||
# Check if migration was successful
|
||||
if [ $? -ne 0 ]; then
|
||||
echo "Error: Failed to apply migration $sql_file"
|
||||
exit 1
|
||||
fi
|
||||
done
|
||||
|
||||
echo "All migrations applied successfully"
|
||||
+67
-24
@@ -1,12 +1,27 @@
|
||||
-- OxiCloud Authentication Database Schema
|
||||
|
||||
-- Create schema for auth-related tables
|
||||
CREATE SCHEMA IF NOT EXISTS auth;
|
||||
|
||||
-- Create UserRole enum type
|
||||
DO $BODY$
|
||||
BEGIN
|
||||
IF NOT EXISTS (
|
||||
SELECT 1 FROM pg_type t
|
||||
JOIN pg_catalog.pg_namespace n ON n.oid = t.typnamespace
|
||||
WHERE t.typname = 'userrole' AND n.nspname = 'auth'
|
||||
) THEN
|
||||
CREATE TYPE auth.userrole AS ENUM ('admin', 'user');
|
||||
END IF;
|
||||
END $BODY$;
|
||||
|
||||
-- Users table
|
||||
CREATE TABLE IF NOT EXISTS users (
|
||||
CREATE TABLE IF NOT EXISTS auth.users (
|
||||
id VARCHAR(36) PRIMARY KEY,
|
||||
username VARCHAR(32) UNIQUE NOT NULL,
|
||||
email VARCHAR(255) UNIQUE NOT NULL,
|
||||
password_hash VARCHAR(255) NOT NULL,
|
||||
role VARCHAR(10) NOT NULL CHECK (role IN ('admin', 'user')),
|
||||
password_hash TEXT NOT NULL,
|
||||
role auth.userrole NOT NULL,
|
||||
storage_quota_bytes BIGINT NOT NULL DEFAULT 10737418240, -- 10GB default
|
||||
storage_used_bytes BIGINT NOT NULL DEFAULT 0,
|
||||
created_at TIMESTAMP WITH TIME ZONE NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
@@ -15,40 +30,47 @@ CREATE TABLE IF NOT EXISTS users (
|
||||
active BOOLEAN NOT NULL DEFAULT TRUE
|
||||
);
|
||||
|
||||
-- Create indexes for users table
|
||||
CREATE INDEX IF NOT EXISTS idx_users_username ON auth.users(username);
|
||||
CREATE INDEX IF NOT EXISTS idx_users_email ON auth.users(email);
|
||||
|
||||
-- Sessions table for refresh tokens
|
||||
CREATE TABLE IF NOT EXISTS sessions (
|
||||
CREATE TABLE IF NOT EXISTS auth.sessions (
|
||||
id VARCHAR(36) PRIMARY KEY,
|
||||
user_id VARCHAR(36) NOT NULL REFERENCES users(id) ON DELETE CASCADE,
|
||||
refresh_token VARCHAR(255) NOT NULL,
|
||||
user_id VARCHAR(36) NOT NULL REFERENCES auth.users(id) ON DELETE CASCADE,
|
||||
refresh_token VARCHAR(255) NOT NULL UNIQUE,
|
||||
expires_at TIMESTAMP WITH TIME ZONE NOT NULL,
|
||||
ip_address VARCHAR(45), -- to support IPv6
|
||||
user_agent TEXT,
|
||||
created_at TIMESTAMP WITH TIME ZONE NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
revoked BOOLEAN NOT NULL DEFAULT FALSE,
|
||||
UNIQUE (user_id, refresh_token)
|
||||
revoked BOOLEAN NOT NULL DEFAULT FALSE
|
||||
);
|
||||
|
||||
-- Create indexes for sessions table
|
||||
CREATE INDEX IF NOT EXISTS idx_sessions_user_id ON auth.sessions(user_id);
|
||||
CREATE INDEX IF NOT EXISTS idx_sessions_refresh_token ON auth.sessions(refresh_token);
|
||||
CREATE INDEX IF NOT EXISTS idx_sessions_expires_at ON auth.sessions(expires_at);
|
||||
CREATE INDEX IF NOT EXISTS idx_sessions_active ON auth.sessions(user_id, revoked, expires_at)
|
||||
WHERE NOT revoked AND expires_at > NOW();
|
||||
|
||||
-- File ownership tracking
|
||||
CREATE TABLE IF NOT EXISTS file_ownership (
|
||||
file_id VARCHAR(36) PRIMARY KEY,
|
||||
user_id VARCHAR(36) NOT NULL REFERENCES users(id) ON DELETE CASCADE,
|
||||
path VARCHAR(1024) NOT NULL,
|
||||
CREATE TABLE IF NOT EXISTS auth.user_files (
|
||||
id SERIAL PRIMARY KEY,
|
||||
user_id VARCHAR(36) NOT NULL REFERENCES auth.users(id) ON DELETE CASCADE,
|
||||
file_path TEXT NOT NULL,
|
||||
file_id VARCHAR(255) NOT NULL,
|
||||
size_bytes BIGINT NOT NULL DEFAULT 0,
|
||||
created_at TIMESTAMP WITH TIME ZONE NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
updated_at TIMESTAMP WITH TIME ZONE NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
UNIQUE (user_id, path)
|
||||
UNIQUE(user_id, file_path)
|
||||
);
|
||||
|
||||
-- Folder ownership tracking
|
||||
CREATE TABLE IF NOT EXISTS folder_ownership (
|
||||
folder_id VARCHAR(36) PRIMARY KEY,
|
||||
user_id VARCHAR(36) NOT NULL REFERENCES users(id) ON DELETE CASCADE,
|
||||
path VARCHAR(1024) NOT NULL,
|
||||
created_at TIMESTAMP WITH TIME ZONE NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
updated_at TIMESTAMP WITH TIME ZONE NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
UNIQUE (user_id, path)
|
||||
);
|
||||
-- Create indexes for user_files
|
||||
CREATE INDEX IF NOT EXISTS idx_user_files_user_id ON auth.user_files(user_id);
|
||||
CREATE INDEX IF NOT EXISTS idx_user_files_file_id ON auth.user_files(file_id);
|
||||
|
||||
-- Create admin user (password: Admin123!)
|
||||
INSERT INTO users (
|
||||
INSERT INTO auth.users (
|
||||
id,
|
||||
username,
|
||||
email,
|
||||
@@ -62,4 +84,25 @@ INSERT INTO users (
|
||||
'$argon2id$v=19$m=65536,t=3,p=4$c2FsdHNhbHRzYWx0c2FsdA$H3VxE8LL2qPT31DM3loTg6D+O4MSc2sD7GjlQ5h7Jkw', -- Admin123!
|
||||
'admin',
|
||||
107374182400 -- 100GB for admin
|
||||
) ON CONFLICT (id) DO NOTHING;
|
||||
) ON CONFLICT (id) DO NOTHING;
|
||||
|
||||
-- Create test user (password: test123)
|
||||
INSERT INTO auth.users (
|
||||
id,
|
||||
username,
|
||||
email,
|
||||
password_hash,
|
||||
role,
|
||||
storage_quota_bytes
|
||||
) VALUES (
|
||||
'11111111-1111-1111-1111-111111111111',
|
||||
'test',
|
||||
'test@oxicloud.local',
|
||||
'$argon2id$v=19$m=65536,t=3,p=4$c2FsdHNhbHRzYWx0c2FsdA$ZG17Z7SFKhs9zWYbuk08CkHpyiznnZapYnxN5Vi62R4', -- test123
|
||||
'user',
|
||||
10737418240 -- 10GB for test user
|
||||
) ON CONFLICT (id) DO NOTHING;
|
||||
|
||||
COMMENT ON TABLE auth.users IS 'Stores user account information';
|
||||
COMMENT ON TABLE auth.sessions IS 'Stores user session information for refresh tokens';
|
||||
COMMENT ON TABLE auth.user_files IS 'Tracks file ownership and storage utilization by users';
|
||||
+1
-1
@@ -10,7 +10,7 @@ services:
|
||||
- "5432:5432"
|
||||
volumes:
|
||||
- pg_data:/var/lib/postgresql/data
|
||||
- ./migrations:/docker-entrypoint-initdb.d
|
||||
- ./db/schema.sql:/docker-entrypoint-initdb.d/10-schema.sql
|
||||
healthcheck:
|
||||
test: ["CMD-SHELL", "pg_isready -U postgres"]
|
||||
interval: 5s
|
||||
|
||||
@@ -1,69 +0,0 @@
|
||||
-- First create the schema if it doesn't exist
|
||||
CREATE SCHEMA IF NOT EXISTS auth;
|
||||
|
||||
-- Output diagnostic information
|
||||
\echo 'Starting migration fix for auth.userrole'
|
||||
\echo 'Current schemas:'
|
||||
\dt auth.*
|
||||
\echo 'Current types:'
|
||||
SELECT n.nspname AS schema, t.typname AS type
|
||||
FROM pg_type t
|
||||
JOIN pg_catalog.pg_namespace n ON n.oid = t.typnamespace
|
||||
WHERE n.nspname = 'auth';
|
||||
\echo '==============================='
|
||||
|
||||
-- Check if the type already exists and create it if not
|
||||
DO $$
|
||||
BEGIN
|
||||
IF NOT EXISTS (
|
||||
SELECT 1 FROM pg_type t
|
||||
JOIN pg_catalog.pg_namespace n ON n.oid = t.typnamespace
|
||||
WHERE t.typname = 'userrole' AND n.nspname = 'auth'
|
||||
) THEN
|
||||
-- Create the type
|
||||
CREATE TYPE auth.userrole AS ENUM ('admin', 'user');
|
||||
END IF;
|
||||
END
|
||||
$$;
|
||||
|
||||
-- Check if the users table exists and create it if not
|
||||
DO $$
|
||||
BEGIN
|
||||
IF NOT EXISTS (
|
||||
SELECT FROM information_schema.tables
|
||||
WHERE table_schema = 'auth' AND table_name = 'users'
|
||||
) THEN
|
||||
-- Create the users table with the proper enum type
|
||||
CREATE TABLE auth.users (
|
||||
id VARCHAR(36) PRIMARY KEY,
|
||||
username VARCHAR(32) NOT NULL UNIQUE,
|
||||
email VARCHAR(255) NOT NULL UNIQUE,
|
||||
password_hash TEXT NOT NULL,
|
||||
role auth.userrole NOT NULL,
|
||||
storage_quota_bytes BIGINT NOT NULL,
|
||||
storage_used_bytes BIGINT NOT NULL DEFAULT 0,
|
||||
created_at TIMESTAMPTZ NOT NULL,
|
||||
updated_at TIMESTAMPTZ NOT NULL,
|
||||
last_login_at TIMESTAMPTZ,
|
||||
active BOOLEAN NOT NULL DEFAULT TRUE
|
||||
);
|
||||
ELSE
|
||||
-- Check if the role column is already auth.userrole type
|
||||
IF EXISTS (
|
||||
SELECT FROM information_schema.columns
|
||||
WHERE table_schema = 'auth' AND table_name = 'users'
|
||||
AND column_name = 'role' AND data_type <> 'USER-DEFINED'
|
||||
) THEN
|
||||
-- Try to convert the role column to the new enum type
|
||||
BEGIN
|
||||
ALTER TABLE auth.users ALTER COLUMN role TYPE auth.userrole USING
|
||||
CASE WHEN role = 'admin' THEN 'admin'::auth.userrole
|
||||
WHEN role = 'user' THEN 'user'::auth.userrole
|
||||
ELSE 'user'::auth.userrole END;
|
||||
EXCEPTION WHEN OTHERS THEN
|
||||
RAISE NOTICE 'Error converting role column: %', SQLERRM;
|
||||
END;
|
||||
END IF;
|
||||
END IF;
|
||||
END
|
||||
$$;
|
||||
@@ -1,65 +0,0 @@
|
||||
-- Create the auth schema
|
||||
CREATE SCHEMA IF NOT EXISTS auth;
|
||||
|
||||
-- Create UserRole enum type
|
||||
CREATE TYPE auth.userrole AS ENUM ('admin', 'user');
|
||||
|
||||
-- Create the users table
|
||||
CREATE TABLE IF NOT EXISTS auth.users (
|
||||
id VARCHAR(36) PRIMARY KEY,
|
||||
username VARCHAR(32) NOT NULL UNIQUE,
|
||||
email VARCHAR(255) NOT NULL UNIQUE,
|
||||
password_hash TEXT NOT NULL,
|
||||
role auth.userrole NOT NULL,
|
||||
storage_quota_bytes BIGINT NOT NULL,
|
||||
storage_used_bytes BIGINT NOT NULL DEFAULT 0,
|
||||
created_at TIMESTAMPTZ NOT NULL,
|
||||
updated_at TIMESTAMPTZ NOT NULL,
|
||||
last_login_at TIMESTAMPTZ,
|
||||
active BOOLEAN NOT NULL DEFAULT TRUE
|
||||
);
|
||||
|
||||
-- Create an index on username and email for fast lookups
|
||||
CREATE INDEX IF NOT EXISTS idx_users_username ON auth.users(username);
|
||||
CREATE INDEX IF NOT EXISTS idx_users_email ON auth.users(email);
|
||||
|
||||
-- Create the sessions table
|
||||
CREATE TABLE IF NOT EXISTS auth.sessions (
|
||||
id VARCHAR(36) PRIMARY KEY,
|
||||
user_id VARCHAR(36) NOT NULL REFERENCES auth.users(id) ON DELETE CASCADE,
|
||||
refresh_token VARCHAR(255) NOT NULL UNIQUE,
|
||||
expires_at TIMESTAMPTZ NOT NULL,
|
||||
ip_address VARCHAR(45), -- to support IPv6
|
||||
user_agent TEXT,
|
||||
created_at TIMESTAMPTZ NOT NULL,
|
||||
revoked BOOLEAN NOT NULL DEFAULT FALSE
|
||||
);
|
||||
|
||||
-- Create indexes on user_id and refresh_token for fast lookups
|
||||
CREATE INDEX IF NOT EXISTS idx_sessions_user_id ON auth.sessions(user_id);
|
||||
CREATE INDEX IF NOT EXISTS idx_sessions_refresh_token ON auth.sessions(refresh_token);
|
||||
CREATE INDEX IF NOT EXISTS idx_sessions_expires_at ON auth.sessions(expires_at);
|
||||
|
||||
-- Create an index for getting active sessions
|
||||
CREATE INDEX IF NOT EXISTS idx_sessions_active ON auth.sessions(user_id, revoked, expires_at)
|
||||
WHERE NOT revoked AND expires_at > NOW();
|
||||
|
||||
-- Create the user_files table to track ownership of files
|
||||
CREATE TABLE IF NOT EXISTS auth.user_files (
|
||||
id SERIAL PRIMARY KEY,
|
||||
user_id VARCHAR(36) NOT NULL REFERENCES auth.users(id) ON DELETE CASCADE,
|
||||
file_path TEXT NOT NULL,
|
||||
file_id VARCHAR(255) NOT NULL,
|
||||
size_bytes BIGINT NOT NULL DEFAULT 0,
|
||||
created_at TIMESTAMPTZ NOT NULL,
|
||||
updated_at TIMESTAMPTZ NOT NULL,
|
||||
UNIQUE(user_id, file_path)
|
||||
);
|
||||
|
||||
-- Create indexes for user_files
|
||||
CREATE INDEX IF NOT EXISTS idx_user_files_user_id ON auth.user_files(user_id);
|
||||
CREATE INDEX IF NOT EXISTS idx_user_files_file_id ON auth.user_files(file_id);
|
||||
|
||||
COMMENT ON TABLE auth.users IS 'Stores user account information';
|
||||
COMMENT ON TABLE auth.sessions IS 'Stores user session information for refresh tokens';
|
||||
COMMENT ON TABLE auth.user_files IS 'Tracks file ownership and storage utilization by users';
|
||||
@@ -1,37 +0,0 @@
|
||||
-- Fix the missing UserRole enum type
|
||||
DO $$
|
||||
BEGIN
|
||||
-- Check if the type already exists
|
||||
IF NOT EXISTS (
|
||||
SELECT 1 FROM pg_type t
|
||||
JOIN pg_catalog.pg_namespace n ON n.oid = t.typnamespace
|
||||
WHERE t.typname = 'userrole' AND n.nspname = 'auth'
|
||||
) THEN
|
||||
-- Create the type if it doesn't exist
|
||||
CREATE TYPE auth.userrole AS ENUM ('admin', 'user');
|
||||
END IF;
|
||||
END
|
||||
$$;
|
||||
|
||||
-- If the table already exists but has a different role column type,
|
||||
-- we need to update it to use the new enum type
|
||||
DO $$
|
||||
BEGIN
|
||||
-- Check if the users table exists
|
||||
IF EXISTS (
|
||||
SELECT FROM information_schema.tables
|
||||
WHERE table_schema = 'auth' AND table_name = 'users'
|
||||
) THEN
|
||||
-- Try to convert the role column to the new enum type
|
||||
-- This will work if the column currently contains 'admin' or 'user' values
|
||||
BEGIN
|
||||
ALTER TABLE auth.users ALTER COLUMN role TYPE auth.userrole USING
|
||||
CASE WHEN role = 'admin' THEN 'admin'::auth.userrole
|
||||
WHEN role = 'user' THEN 'user'::auth.userrole
|
||||
ELSE 'user'::auth.userrole END;
|
||||
EXCEPTION WHEN OTHERS THEN
|
||||
RAISE NOTICE 'Error converting role column: %', SQLERRM;
|
||||
END;
|
||||
END IF;
|
||||
END
|
||||
$$;
|
||||
@@ -85,7 +85,7 @@ impl UserRepository for UserPgRepository {
|
||||
let row = sqlx::query(
|
||||
r#"
|
||||
SELECT
|
||||
id, username, email, password_hash, role,
|
||||
id, username, email, password_hash, role::text as role_text,
|
||||
storage_quota_bytes, storage_used_bytes,
|
||||
created_at, updated_at, last_login_at, active
|
||||
FROM auth.users
|
||||
@@ -98,9 +98,9 @@ impl UserRepository for UserPgRepository {
|
||||
.map_err(Self::map_sqlx_error)?;
|
||||
|
||||
// Convert role string to UserRole enum
|
||||
let role_str: String = row.get("role");
|
||||
let role = match role_str.as_str() {
|
||||
"admin" => UserRole::Admin,
|
||||
let role_str: Option<String> = row.try_get("role_text").unwrap_or(None);
|
||||
let role = match role_str.as_deref() {
|
||||
Some("admin") => UserRole::Admin,
|
||||
_ => UserRole::User,
|
||||
};
|
||||
|
||||
@@ -124,7 +124,7 @@ impl UserRepository for UserPgRepository {
|
||||
let row = sqlx::query(
|
||||
r#"
|
||||
SELECT
|
||||
id, username, email, password_hash, role,
|
||||
id, username, email, password_hash, role::text as role_text,
|
||||
storage_quota_bytes, storage_used_bytes,
|
||||
created_at, updated_at, last_login_at, active
|
||||
FROM auth.users
|
||||
@@ -137,9 +137,9 @@ impl UserRepository for UserPgRepository {
|
||||
.map_err(Self::map_sqlx_error)?;
|
||||
|
||||
// Convert role string to UserRole enum
|
||||
let role_str: String = row.get("role");
|
||||
let role = match role_str.as_str() {
|
||||
"admin" => UserRole::Admin,
|
||||
let role_str: Option<String> = row.try_get("role_text").unwrap_or(None);
|
||||
let role = match role_str.as_deref() {
|
||||
Some("admin") => UserRole::Admin,
|
||||
_ => UserRole::User,
|
||||
};
|
||||
|
||||
@@ -163,7 +163,7 @@ impl UserRepository for UserPgRepository {
|
||||
let row = sqlx::query(
|
||||
r#"
|
||||
SELECT
|
||||
id, username, email, password_hash, role,
|
||||
id, username, email, password_hash, role::text as role_text,
|
||||
storage_quota_bytes, storage_used_bytes,
|
||||
created_at, updated_at, last_login_at, active
|
||||
FROM auth.users
|
||||
@@ -176,9 +176,9 @@ impl UserRepository for UserPgRepository {
|
||||
.map_err(Self::map_sqlx_error)?;
|
||||
|
||||
// Convert role string to UserRole enum
|
||||
let role_str: String = row.get("role");
|
||||
let role = match role_str.as_str() {
|
||||
"admin" => UserRole::Admin,
|
||||
let role_str: Option<String> = row.try_get("role_text").unwrap_or(None);
|
||||
let role = match role_str.as_deref() {
|
||||
Some("admin") => UserRole::Admin,
|
||||
_ => UserRole::User,
|
||||
};
|
||||
|
||||
@@ -276,7 +276,7 @@ impl UserRepository for UserPgRepository {
|
||||
let rows = sqlx::query(
|
||||
r#"
|
||||
SELECT
|
||||
id, username, email, password_hash, role,
|
||||
id, username, email, password_hash, role::text as role_text,
|
||||
storage_quota_bytes, storage_used_bytes,
|
||||
created_at, updated_at, last_login_at, active
|
||||
FROM auth.users
|
||||
@@ -293,9 +293,9 @@ impl UserRepository for UserPgRepository {
|
||||
let users = rows.into_iter()
|
||||
.map(|row| {
|
||||
// Convert role string to UserRole enum for each row
|
||||
let role_str: String = row.get("role");
|
||||
let role = match role_str.as_str() {
|
||||
"admin" => UserRole::Admin,
|
||||
let role_str: Option<String> = row.try_get("role_text").unwrap_or(None);
|
||||
let role = match role_str.as_deref() {
|
||||
Some("admin") => UserRole::Admin,
|
||||
_ => UserRole::User,
|
||||
};
|
||||
|
||||
|
||||
+609
-33
@@ -888,61 +888,620 @@ body {
|
||||
color: #718096;
|
||||
}
|
||||
|
||||
/* Compartir diálogo */
|
||||
.share-dialog {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 50px;
|
||||
width: 250px;
|
||||
background-color: white;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 5px 20px rgba(0,0,0,0.15);
|
||||
z-index: 1000;
|
||||
padding: 15px;
|
||||
/* Dialogs (Rename, Move, Share) */
|
||||
.rename-dialog, .share-dialog {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
display: none;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 2000;
|
||||
}
|
||||
|
||||
.share-title {
|
||||
.rename-dialog-content, .share-dialog-content {
|
||||
background-color: white;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
width: 400px;
|
||||
max-width: 90%;
|
||||
}
|
||||
|
||||
.share-dialog-content {
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
.rename-dialog-header, .share-dialog-header {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 15px;
|
||||
color: #2d3748;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid #e0e6ed;
|
||||
}
|
||||
|
||||
.share-user {
|
||||
.rename-dialog input, .share-dialog input {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
margin-bottom: 15px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.rename-dialog-buttons, .share-dialog-buttons {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
/* Share dialog specific styles */
|
||||
.shared-item-info {
|
||||
padding: 10px 0;
|
||||
margin-bottom: 15px;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
.share-options h3, #existing-shares-section h3, #new-share-section h3 {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
margin-bottom: 10px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: block;
|
||||
margin-bottom: 5px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.permission-options {
|
||||
display: flex;
|
||||
gap: 15px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.permission-option {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.existing-share-item {
|
||||
background-color: #f8f9fa;
|
||||
border-radius: 4px;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.user-avatar-small {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border-radius: 50%;
|
||||
background-color: #dfe4ea;
|
||||
.share-url {
|
||||
font-size: 12px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-bottom: 5px;
|
||||
color: #1565c0;
|
||||
}
|
||||
|
||||
.share-info {
|
||||
font-size: 11px;
|
||||
display: flex;
|
||||
gap: 15px;
|
||||
margin-bottom: 10px;
|
||||
color: #757575;
|
||||
}
|
||||
|
||||
.share-protected {
|
||||
color: #1565c0;
|
||||
}
|
||||
|
||||
.share-expiration {
|
||||
color: #b71c1c;
|
||||
}
|
||||
|
||||
.share-actions {
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.share-link-actions {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.btn-small {
|
||||
font-size: 12px;
|
||||
padding: 5px 10px;
|
||||
}
|
||||
|
||||
#notification-message {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
/* Shared Resources Page Styles */
|
||||
/* Header styles for shared page */
|
||||
header {
|
||||
background-color: white;
|
||||
border-bottom: 1px solid #e6e6e6;
|
||||
padding: 15px 20px;
|
||||
}
|
||||
|
||||
.header-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.header-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.header-button {
|
||||
padding: 8px 15px;
|
||||
background-color: #f0f3f7;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
transition: background-color 0.2s;
|
||||
}
|
||||
|
||||
.header-button:hover {
|
||||
background-color: #e6e9ed;
|
||||
}
|
||||
|
||||
/* Shared page container */
|
||||
.shared-page-container {
|
||||
max-width: 1280px;
|
||||
margin: 20px auto;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.shared-header {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.shared-header h2 {
|
||||
font-size: 24px;
|
||||
color: #2d3748;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.shared-header p {
|
||||
color: #718096;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
/* Filters and search */
|
||||
.shared-filters {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 25px;
|
||||
flex-wrap: wrap;
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.filter-group {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.filter-group label {
|
||||
font-size: 14px;
|
||||
color: #4a5568;
|
||||
}
|
||||
|
||||
.filter-group select {
|
||||
padding: 8px 12px;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 6px;
|
||||
background-color: white;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.search-box {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.search-box input {
|
||||
padding: 8px 15px;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
.search-box button {
|
||||
padding: 8px 15px;
|
||||
background-color: #ff5e3a;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.2s;
|
||||
}
|
||||
|
||||
.search-box button:hover {
|
||||
background-color: #e64a29;
|
||||
}
|
||||
|
||||
/* Shared items list */
|
||||
.shared-list-container {
|
||||
background-color: white;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.05);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.shared-list {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.shared-list thead th {
|
||||
padding: 15px;
|
||||
text-align: left;
|
||||
font-weight: 600;
|
||||
color: #2d3748;
|
||||
background-color: #f8f9fa;
|
||||
border-bottom: 1px solid #e0e6ed;
|
||||
}
|
||||
|
||||
.shared-list tbody td {
|
||||
padding: 15px;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.shared-item-name {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.shared-item-actions {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.action-btn {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 6px;
|
||||
background-color: white;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 12px;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.user-name {
|
||||
font-size: 13px;
|
||||
.action-btn:hover {
|
||||
background-color: #f0f8ff;
|
||||
border-color: #90cdf4;
|
||||
}
|
||||
|
||||
.action-icon {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/* Empty state */
|
||||
.empty-state {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 60px 20px;
|
||||
background-color: white;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.05);
|
||||
}
|
||||
|
||||
.empty-state-icon {
|
||||
font-size: 40px;
|
||||
margin-bottom: 20px;
|
||||
color: #a0aec0;
|
||||
}
|
||||
|
||||
.empty-state h3 {
|
||||
font-size: 18px;
|
||||
color: #2d3748;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.empty-state p {
|
||||
color: #718096;
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* Dialog styles */
|
||||
.dialog {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
display: none;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.dialog.active {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.dialog-content {
|
||||
background-color: white;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 10px 25px rgba(0,0,0,0.1);
|
||||
width: 500px;
|
||||
max-width: 90%;
|
||||
max-height: 90vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.dialog-header {
|
||||
padding: 15px 20px;
|
||||
border-bottom: 1px solid #e2e8f0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.dialog-header h3 {
|
||||
font-size: 18px;
|
||||
color: #2d3748;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.close-dialog-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: 24px;
|
||||
cursor: pointer;
|
||||
color: #a0aec0;
|
||||
}
|
||||
|
||||
.dialog-body {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
/* Share dialog specific styles */
|
||||
.share-item-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.item-icon {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #2d3748;
|
||||
}
|
||||
|
||||
.add-user {
|
||||
.share-link-section {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.share-link-container {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.share-link-container input {
|
||||
flex-grow: 1;
|
||||
padding: 10px;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.share-link-container button {
|
||||
padding: 0 15px;
|
||||
background-color: #4a5568;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.2s;
|
||||
}
|
||||
|
||||
.share-link-container button:hover {
|
||||
background-color: #2d3748;
|
||||
}
|
||||
|
||||
.share-settings {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.share-setting {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.share-setting label {
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
font-weight: 500;
|
||||
color: #4a5568;
|
||||
}
|
||||
|
||||
.permissions-options {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.permissions-options label {
|
||||
font-weight: normal;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 8px;
|
||||
margin-top: 10px;
|
||||
background-color: #f0f3f7;
|
||||
border-radius: 50px;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.password-setting, .expiration-setting {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.password-setting input[type="checkbox"], .expiration-setting input[type="checkbox"] {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.password-setting input[type="password"], .expiration-setting input[type="date"] {
|
||||
flex-grow: 1;
|
||||
padding: 8px 10px;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.password-setting button {
|
||||
padding: 8px 12px;
|
||||
background-color: #4a5568;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
font-size: 13px;
|
||||
color: #718096;
|
||||
font-size: 12px;
|
||||
transition: background-color 0.2s;
|
||||
}
|
||||
|
||||
.password-setting button:hover {
|
||||
background-color: #2d3748;
|
||||
}
|
||||
|
||||
.share-actions {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
/* Form styles */
|
||||
.form-group {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.form-group label {
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
font-weight: 500;
|
||||
color: #4a5568;
|
||||
}
|
||||
|
||||
.form-group input, .form-group textarea {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.form-group textarea {
|
||||
resize: vertical;
|
||||
min-height: 80px;
|
||||
}
|
||||
|
||||
/* Button styles */
|
||||
.button {
|
||||
padding: 8px 16px;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
transition: background-color 0.2s;
|
||||
}
|
||||
|
||||
.primary {
|
||||
background-color: #ff5e3a;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.primary:hover {
|
||||
background-color: #e64a29;
|
||||
}
|
||||
|
||||
.secondary {
|
||||
background-color: #e2e8f0;
|
||||
color: #4a5568;
|
||||
}
|
||||
|
||||
.secondary:hover {
|
||||
background-color: #cbd5e0;
|
||||
}
|
||||
|
||||
.danger {
|
||||
background-color: #f56565;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.danger:hover {
|
||||
background-color: #e53e3e;
|
||||
}
|
||||
|
||||
/* Notification banner */
|
||||
.notification-banner {
|
||||
position: fixed;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
padding: 15px 20px;
|
||||
background-color: white;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
max-width: 400px;
|
||||
z-index: 2000;
|
||||
transform: translateY(-100px);
|
||||
opacity: 0;
|
||||
transition: transform 0.3s, opacity 0.3s;
|
||||
}
|
||||
|
||||
.notification-banner.active {
|
||||
transform: translateY(0);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.notification-banner.success {
|
||||
border-left: 4px solid #48bb78;
|
||||
}
|
||||
|
||||
.notification-banner.error {
|
||||
border-left: 4px solid #f56565;
|
||||
}
|
||||
|
||||
.close-notification-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: 18px;
|
||||
cursor: pointer;
|
||||
color: #a0aec0;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
/* Responsive */
|
||||
@@ -968,6 +1527,23 @@ body {
|
||||
.nav-item span {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Responsive styles for shared page */
|
||||
.shared-filters {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.shared-list thead th:nth-child(4),
|
||||
.shared-list thead th:nth-child(5),
|
||||
.shared-list tbody td:nth-child(4),
|
||||
.shared-list tbody td:nth-child(5) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.dialog-content {
|
||||
width: 95%;
|
||||
}
|
||||
}
|
||||
|
||||
/* Folder selection for move dialog */
|
||||
|
||||
+2
-1
@@ -14,6 +14,7 @@
|
||||
<script src="/js/i18n.js"></script>
|
||||
<script src="/js/languageSelector.js"></script>
|
||||
<script src="/js/fileRenderer.js"></script>
|
||||
<script src="/js/fileSharing.js"></script>
|
||||
<script src="/js/contextMenus.js"></script>
|
||||
<script src="/js/fileOperations.js"></script>
|
||||
<script src="/js/search.js"></script>
|
||||
@@ -49,7 +50,7 @@
|
||||
<i class="fas fa-folder"></i>
|
||||
<span data-i18n="nav.files">Files</span>
|
||||
</div>
|
||||
<div class="nav-item">
|
||||
<div class="nav-item" id="nav-shared">
|
||||
<i class="fas fa-share-alt"></i>
|
||||
<span data-i18n="nav.shared">Shared</span>
|
||||
</div>
|
||||
|
||||
+22
-2
@@ -15,6 +15,10 @@ const app = {
|
||||
isTrashView: false, // Whether we're in trash view
|
||||
currentSection: 'files', // Current section: 'files' or 'trash'
|
||||
isSearchMode: false, // Whether we're in search mode
|
||||
// File sharing related properties
|
||||
shareDialogItem: null, // Item being shared in share dialog
|
||||
shareDialogItemType: null, // Type of item being shared ('file' or 'folder')
|
||||
notificationShareUrl: null // URL for notification dialog
|
||||
};
|
||||
|
||||
// DOM elements
|
||||
@@ -29,8 +33,17 @@ function initApp() {
|
||||
// Cache DOM elements
|
||||
cacheElements();
|
||||
|
||||
// Create menus and dialogs
|
||||
ui.initializeContextMenus();
|
||||
// Initialize file sharing module first
|
||||
if (window.fileSharing && window.fileSharing.init) {
|
||||
window.fileSharing.init();
|
||||
} else {
|
||||
console.warn('fileSharing module not fully initialized');
|
||||
}
|
||||
|
||||
// Then create menus and dialogs after modules have initialized
|
||||
setTimeout(() => {
|
||||
ui.initializeContextMenus();
|
||||
}, 100);
|
||||
|
||||
// Setup event listeners
|
||||
setupEventListeners();
|
||||
@@ -152,6 +165,13 @@ function setupEventListeners() {
|
||||
// Add active class to clicked item
|
||||
item.classList.add('active');
|
||||
|
||||
// Check if this is the shared item
|
||||
if (item.querySelector('span').getAttribute('data-i18n') === 'nav.shared') {
|
||||
// Navigate to the shared page
|
||||
window.location.href = '/shared.html';
|
||||
return;
|
||||
}
|
||||
|
||||
// Check if this is the trash item
|
||||
if (item === elements.trashBtn) {
|
||||
// Show trash view
|
||||
|
||||
+81
-42
@@ -17,46 +17,78 @@ const TOKEN_EXPIRY_KEY = 'oxicloud_token_expiry';
|
||||
const USER_DATA_KEY = 'oxicloud_user';
|
||||
|
||||
// DOM elements
|
||||
const loginPanel = document.getElementById('login-panel');
|
||||
const registerPanel = document.getElementById('register-panel');
|
||||
const adminSetupPanel = document.getElementById('admin-setup-panel');
|
||||
let loginPanel, registerPanel, adminSetupPanel;
|
||||
let loginForm, registerForm, adminSetupForm;
|
||||
let loginError, registerError, registerSuccess, adminSetupError;
|
||||
|
||||
const loginForm = document.getElementById('login-form');
|
||||
const registerForm = document.getElementById('register-form');
|
||||
const adminSetupForm = document.getElementById('admin-setup-form');
|
||||
// Initialize DOM elements only if we're on the login page
|
||||
function initLoginElements() {
|
||||
// Check if we're on the login page
|
||||
if (!document.getElementById('login-form')) {
|
||||
console.log('Not on login page, skipping element initialization');
|
||||
return false;
|
||||
}
|
||||
|
||||
loginPanel = document.getElementById('login-panel');
|
||||
registerPanel = document.getElementById('register-panel');
|
||||
adminSetupPanel = document.getElementById('admin-setup-panel');
|
||||
|
||||
const loginError = document.getElementById('login-error');
|
||||
const registerError = document.getElementById('register-error');
|
||||
const registerSuccess = document.getElementById('register-success');
|
||||
const adminSetupError = document.getElementById('admin-setup-error');
|
||||
loginForm = document.getElementById('login-form');
|
||||
registerForm = document.getElementById('register-form');
|
||||
adminSetupForm = document.getElementById('admin-setup-form');
|
||||
|
||||
// Panel toggles
|
||||
document.getElementById('show-register').addEventListener('click', () => {
|
||||
loginPanel.style.display = 'none';
|
||||
registerPanel.style.display = 'block';
|
||||
adminSetupPanel.style.display = 'none';
|
||||
});
|
||||
loginError = document.getElementById('login-error');
|
||||
registerError = document.getElementById('register-error');
|
||||
registerSuccess = document.getElementById('register-success');
|
||||
adminSetupError = document.getElementById('admin-setup-error');
|
||||
|
||||
document.getElementById('show-login').addEventListener('click', () => {
|
||||
loginPanel.style.display = 'block';
|
||||
registerPanel.style.display = 'none';
|
||||
adminSetupPanel.style.display = 'none';
|
||||
});
|
||||
// Panel toggles
|
||||
document.getElementById('show-register').addEventListener('click', () => {
|
||||
loginPanel.style.display = 'none';
|
||||
registerPanel.style.display = 'block';
|
||||
adminSetupPanel.style.display = 'none';
|
||||
});
|
||||
|
||||
document.getElementById('show-admin-setup').addEventListener('click', () => {
|
||||
loginPanel.style.display = 'none';
|
||||
registerPanel.style.display = 'none';
|
||||
adminSetupPanel.style.display = 'block';
|
||||
});
|
||||
document.getElementById('show-login').addEventListener('click', () => {
|
||||
loginPanel.style.display = 'block';
|
||||
registerPanel.style.display = 'none';
|
||||
adminSetupPanel.style.display = 'none';
|
||||
});
|
||||
|
||||
document.getElementById('back-to-login').addEventListener('click', () => {
|
||||
loginPanel.style.display = 'block';
|
||||
registerPanel.style.display = 'none';
|
||||
adminSetupPanel.style.display = 'none';
|
||||
});
|
||||
document.getElementById('show-admin-setup').addEventListener('click', () => {
|
||||
loginPanel.style.display = 'none';
|
||||
registerPanel.style.display = 'none';
|
||||
adminSetupPanel.style.display = 'block';
|
||||
});
|
||||
|
||||
document.getElementById('back-to-login').addEventListener('click', () => {
|
||||
loginPanel.style.display = 'block';
|
||||
registerPanel.style.display = 'none';
|
||||
adminSetupPanel.style.display = 'none';
|
||||
});
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
// Initialize login elements if on login page
|
||||
const isLoginPage = initLoginElements();
|
||||
|
||||
// Check if we already have a valid token
|
||||
document.addEventListener('DOMContentLoaded', async () => {
|
||||
let authInitialized = false;
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
// Check if we're on the login page
|
||||
if (!document.getElementById('login-form')) {
|
||||
console.log('Not on login page, skipping auth check');
|
||||
return;
|
||||
}
|
||||
|
||||
if (authInitialized) {
|
||||
console.log('Auth already initialized, skipping');
|
||||
return;
|
||||
}
|
||||
authInitialized = true;
|
||||
|
||||
(async () => {
|
||||
try {
|
||||
const tokenExpiry = localStorage.getItem(TOKEN_EXPIRY_KEY);
|
||||
if (tokenExpiry && new Date(tokenExpiry) > new Date()) {
|
||||
@@ -87,17 +119,19 @@ document.addEventListener('DOMContentLoaded', async () => {
|
||||
} catch (error) {
|
||||
console.error('Authentication check failed:', error);
|
||||
}
|
||||
})();
|
||||
});
|
||||
|
||||
// Login form submission
|
||||
loginForm.addEventListener('submit', async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
// Clear previous errors
|
||||
loginError.style.display = 'none';
|
||||
|
||||
const username = document.getElementById('login-username').value;
|
||||
const password = document.getElementById('login-password').value;
|
||||
if (isLoginPage && loginForm) {
|
||||
loginForm.addEventListener('submit', async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
// Clear previous errors
|
||||
loginError.style.display = 'none';
|
||||
|
||||
const username = document.getElementById('login-username').value;
|
||||
const password = document.getElementById('login-password').value;
|
||||
|
||||
try {
|
||||
const data = await login(username, password);
|
||||
@@ -161,9 +195,11 @@ loginForm.addEventListener('submit', async (e) => {
|
||||
loginError.style.display = 'block';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Register form submission
|
||||
registerForm.addEventListener('submit', async (e) => {
|
||||
if (isLoginPage && registerForm) {
|
||||
registerForm.addEventListener('submit', async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
// Clear previous messages
|
||||
@@ -202,9 +238,11 @@ registerForm.addEventListener('submit', async (e) => {
|
||||
registerError.style.display = 'block';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Admin setup form submission
|
||||
adminSetupForm.addEventListener('submit', async (e) => {
|
||||
if (isLoginPage && adminSetupForm) {
|
||||
adminSetupForm.addEventListener('submit', async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
// Clear previous errors
|
||||
@@ -235,6 +273,7 @@ adminSetupForm.addEventListener('submit', async (e) => {
|
||||
adminSetupError.style.display = 'block';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// API Functions
|
||||
|
||||
|
||||
@@ -23,6 +23,13 @@ const contextMenus = {
|
||||
}
|
||||
window.ui.closeContextMenu();
|
||||
});
|
||||
|
||||
document.getElementById('share-folder-option').addEventListener('click', () => {
|
||||
if (window.app.contextMenuTargetFolder) {
|
||||
this.showShareDialog(window.app.contextMenuTargetFolder, 'folder');
|
||||
}
|
||||
window.ui.closeContextMenu();
|
||||
});
|
||||
|
||||
document.getElementById('delete-folder-option').addEventListener('click', async () => {
|
||||
if (window.app.contextMenuTargetFolder) {
|
||||
@@ -42,6 +49,13 @@ const contextMenus = {
|
||||
window.ui.closeFileContextMenu();
|
||||
});
|
||||
|
||||
document.getElementById('share-file-option').addEventListener('click', () => {
|
||||
if (window.app.contextMenuTargetFile) {
|
||||
this.showShareDialog(window.app.contextMenuTargetFile, 'file');
|
||||
}
|
||||
window.ui.closeFileContextMenu();
|
||||
});
|
||||
|
||||
document.getElementById('delete-file-option').addEventListener('click', async () => {
|
||||
if (window.app.contextMenuTargetFile) {
|
||||
await window.fileOps.deleteFile(
|
||||
@@ -249,6 +263,226 @@ const contextMenus = {
|
||||
} catch (error) {
|
||||
console.error('Error loading folders:', error);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* Show share dialog for files or folders
|
||||
* @param {Object} item - File or folder object
|
||||
* @param {string} itemType - 'file' or 'folder'
|
||||
*/
|
||||
showShareDialog(item, itemType) {
|
||||
// Update dialog title based on item type
|
||||
const dialogHeader = document.getElementById('share-dialog').querySelector('.share-dialog-header');
|
||||
const itemName = document.getElementById('shared-item-name');
|
||||
|
||||
// Update dialog content
|
||||
dialogHeader.textContent = itemType === 'file' ?
|
||||
(window.i18n ? window.i18n.t('dialogs.share_file') : 'Compartir archivo') :
|
||||
(window.i18n ? window.i18n.t('dialogs.share_folder') : 'Compartir carpeta');
|
||||
|
||||
itemName.textContent = item.name;
|
||||
|
||||
// Reset form
|
||||
document.getElementById('share-password').value = '';
|
||||
document.getElementById('share-expiration').value = '';
|
||||
document.getElementById('share-permission-read').checked = true;
|
||||
document.getElementById('share-permission-write').checked = false;
|
||||
document.getElementById('share-permission-reshare').checked = false;
|
||||
|
||||
// Store the current item and type for use when creating the share
|
||||
window.app.shareDialogItem = item;
|
||||
window.app.shareDialogItemType = itemType;
|
||||
|
||||
// Check if item already has shares
|
||||
const existingShares = window.fileSharing.getSharedLinksForItem(item.id, itemType);
|
||||
const existingSharesContainer = document.getElementById('existing-shares-container');
|
||||
|
||||
// Clear existing shares container
|
||||
existingSharesContainer.innerHTML = '';
|
||||
|
||||
if (existingShares.length > 0) {
|
||||
document.getElementById('existing-shares-section').style.display = 'block';
|
||||
|
||||
// Create elements for each existing share
|
||||
existingShares.forEach(share => {
|
||||
const shareEl = document.createElement('div');
|
||||
shareEl.className = 'existing-share-item';
|
||||
|
||||
const expiresText = share.expires_at ?
|
||||
`Vence: ${window.fileSharing.formatExpirationDate(share.expires_at)}` :
|
||||
'Sin vencimiento';
|
||||
|
||||
shareEl.innerHTML = `
|
||||
<div class="share-url">${share.url}</div>
|
||||
<div class="share-info">
|
||||
${share.password_protected ? '<span class="share-protected"><i class="fas fa-lock"></i> Con contraseña</span>' : ''}
|
||||
<span class="share-expiration">${expiresText}</span>
|
||||
</div>
|
||||
<div class="share-actions">
|
||||
<button class="btn btn-small copy-link-btn" data-share-url="${share.url}">
|
||||
<i class="fas fa-copy"></i> Copiar
|
||||
</button>
|
||||
<button class="btn btn-small btn-danger delete-link-btn" data-share-id="${share.id}">
|
||||
<i class="fas fa-trash"></i> Eliminar
|
||||
</button>
|
||||
</div>
|
||||
`;
|
||||
|
||||
existingSharesContainer.appendChild(shareEl);
|
||||
});
|
||||
|
||||
// Add event listeners for copy and delete buttons
|
||||
document.querySelectorAll('.copy-link-btn').forEach(btn => {
|
||||
btn.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
const url = btn.getAttribute('data-share-url');
|
||||
window.fileSharing.copyLinkToClipboard(url);
|
||||
});
|
||||
});
|
||||
|
||||
document.querySelectorAll('.delete-link-btn').forEach(btn => {
|
||||
btn.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
const shareId = btn.getAttribute('data-share-id');
|
||||
|
||||
if (confirm('¿Estás seguro de que quieres eliminar este enlace compartido?')) {
|
||||
window.fileSharing.removeSharedLink(shareId);
|
||||
btn.closest('.existing-share-item').remove();
|
||||
|
||||
// Check if we still have shares
|
||||
if (existingSharesContainer.children.length === 0) {
|
||||
document.getElementById('existing-shares-section').style.display = 'none';
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
document.getElementById('existing-shares-section').style.display = 'none';
|
||||
}
|
||||
|
||||
// Show dialog
|
||||
document.getElementById('share-dialog').style.display = 'flex';
|
||||
},
|
||||
|
||||
/**
|
||||
* Create a shared link with the configured options
|
||||
*/
|
||||
createSharedLink() {
|
||||
if (!window.app.shareDialogItem || !window.app.shareDialogItemType) {
|
||||
window.ui.showNotification('Error', 'No se pudo compartir el elemento');
|
||||
return;
|
||||
}
|
||||
|
||||
// Get values from form
|
||||
const password = document.getElementById('share-password').value;
|
||||
const expirationDate = document.getElementById('share-expiration').value;
|
||||
const permissionRead = document.getElementById('share-permission-read').checked;
|
||||
const permissionWrite = document.getElementById('share-permission-write').checked;
|
||||
const permissionReshare = document.getElementById('share-permission-reshare').checked;
|
||||
|
||||
// Prepare options
|
||||
const options = {
|
||||
password: password || null,
|
||||
expirationDate: expirationDate || null,
|
||||
permissions: {
|
||||
read: permissionRead,
|
||||
write: permissionWrite,
|
||||
reshare: permissionReshare
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
const item = window.app.shareDialogItem;
|
||||
const itemType = window.app.shareDialogItemType;
|
||||
|
||||
// Create share
|
||||
const shareInfo = window.fileSharing.generateSharedLink(
|
||||
item.id,
|
||||
itemType,
|
||||
options
|
||||
);
|
||||
|
||||
// Update UI with new share
|
||||
const shareUrl = document.getElementById('generated-share-url');
|
||||
shareUrl.value = shareInfo.url;
|
||||
document.getElementById('new-share-section').style.display = 'block';
|
||||
|
||||
// Focus and select for easy copying
|
||||
shareUrl.focus();
|
||||
shareUrl.select();
|
||||
|
||||
// Show success message
|
||||
window.ui.showNotification('Enlace creado', 'Enlace compartido creado correctamente');
|
||||
|
||||
// Reload existing shares
|
||||
this.showShareDialog(item, itemType);
|
||||
|
||||
} catch (error) {
|
||||
console.error('Error creating shared link:', error);
|
||||
window.ui.showNotification('Error', 'No se pudo crear el enlace compartido');
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Show email notification dialog
|
||||
* @param {string} shareUrl - URL to share
|
||||
*/
|
||||
showEmailNotificationDialog(shareUrl) {
|
||||
// Update dialog content
|
||||
document.getElementById('notification-share-url').textContent = shareUrl;
|
||||
document.getElementById('notification-email').value = '';
|
||||
document.getElementById('notification-message').value = '';
|
||||
|
||||
// Store the URL for later use
|
||||
window.app.notificationShareUrl = shareUrl;
|
||||
|
||||
// Show dialog
|
||||
document.getElementById('notification-dialog').style.display = 'flex';
|
||||
},
|
||||
|
||||
/**
|
||||
* Send share notification email
|
||||
*/
|
||||
sendShareNotification() {
|
||||
const email = document.getElementById('notification-email').value.trim();
|
||||
const message = document.getElementById('notification-message').value.trim();
|
||||
const shareUrl = window.app.notificationShareUrl;
|
||||
|
||||
if (!email || !shareUrl) {
|
||||
window.ui.showNotification('Error', 'Por favor, ingresa un correo electrónico válido');
|
||||
return;
|
||||
}
|
||||
|
||||
// Validate email format
|
||||
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
||||
if (!emailRegex.test(email)) {
|
||||
window.ui.showNotification('Error', 'Por favor, ingresa un correo electrónico válido');
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
window.fileSharing.sendShareNotification(shareUrl, email, message);
|
||||
document.getElementById('notification-dialog').style.display = 'none';
|
||||
} catch (error) {
|
||||
console.error('Error sending notification:', error);
|
||||
window.ui.showNotification('Error', 'No se pudo enviar la notificación');
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Close share dialog
|
||||
*/
|
||||
closeShareDialog() {
|
||||
document.getElementById('share-dialog').style.display = 'none';
|
||||
window.app.shareDialogItem = null;
|
||||
window.app.shareDialogItemType = null;
|
||||
},
|
||||
|
||||
/**
|
||||
* Close notification dialog
|
||||
*/
|
||||
closeNotificationDialog() {
|
||||
document.getElementById('notification-dialog').style.display = 'none';
|
||||
window.app.notificationShareUrl = null;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@@ -0,0 +1,379 @@
|
||||
/**
|
||||
* OxiCloud - File Sharing Module
|
||||
* This file handles file sharing functionality (shared links, permissions, etc.)
|
||||
*/
|
||||
|
||||
// File Sharing Module
|
||||
const fileSharing = {
|
||||
/**
|
||||
* Generate a shared link for a file or folder
|
||||
* @param {string} itemId - ID of the file or folder
|
||||
* @param {string} itemType - Type ('file' or 'folder')
|
||||
* @param {Object} options - Sharing options (password, expiration, etc.)
|
||||
* @returns {Object} - Shared link information
|
||||
*/
|
||||
generateSharedLink(itemId, itemType, options = {}) {
|
||||
try {
|
||||
// In a real implementation, this would be a call to the backend
|
||||
// But for now, we'll simulate it with a mock response
|
||||
|
||||
// Default options
|
||||
const defaultOptions = {
|
||||
password: null,
|
||||
expirationDate: null,
|
||||
permissions: {
|
||||
read: true,
|
||||
write: false,
|
||||
reshare: false
|
||||
}
|
||||
};
|
||||
|
||||
// Merge options
|
||||
const finalOptions = { ...defaultOptions, ...options };
|
||||
|
||||
// Generate a mock link (would normally come from server)
|
||||
const linkId = Math.random().toString(36).substring(2, 15);
|
||||
const shareToken = Math.random().toString(36).substring(2, 20);
|
||||
const baseUrl = window.location.origin;
|
||||
const sharedUrl = `${baseUrl}/s/${shareToken}`;
|
||||
|
||||
// Create expiration date if set
|
||||
let expiresAt = null;
|
||||
if (finalOptions.expirationDate) {
|
||||
expiresAt = new Date(finalOptions.expirationDate);
|
||||
}
|
||||
|
||||
// Create a mock response that matches what we'd expect from the server
|
||||
const response = {
|
||||
id: linkId,
|
||||
type: itemType,
|
||||
itemId: itemId,
|
||||
url: sharedUrl,
|
||||
token: shareToken,
|
||||
password_protected: !!finalOptions.password,
|
||||
expires_at: expiresAt ? expiresAt.toISOString() : null,
|
||||
permissions: finalOptions.permissions,
|
||||
created_at: new Date().toISOString(),
|
||||
created_by: {
|
||||
id: "current-user-id", // Would be the actual user ID
|
||||
username: "current-user" // Would be the actual username
|
||||
},
|
||||
access_count: 0,
|
||||
// Add some UI friendly properties for shared.js compatibility
|
||||
name: options.name || "Shared Item",
|
||||
dateShared: new Date().toISOString(),
|
||||
expiration: expiresAt ? expiresAt.toISOString() : null,
|
||||
password: finalOptions.password
|
||||
};
|
||||
|
||||
// In a real implementation, we would store this link in localStorage for now
|
||||
// until backend implementation is ready
|
||||
this.saveSharedLink(response);
|
||||
|
||||
// Return the "response" as if it came from the server
|
||||
return response;
|
||||
} catch (error) {
|
||||
console.error('Error generating shared link:', error);
|
||||
throw error;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Save a shared link to localStorage (temporary storage until backend is ready)
|
||||
* @param {Object} linkData - Shared link data
|
||||
*/
|
||||
saveSharedLink(linkData) {
|
||||
try {
|
||||
// Get existing shared links
|
||||
const existingLinks = JSON.parse(localStorage.getItem('oxicloud_shared_links') || '[]');
|
||||
|
||||
// Add new link
|
||||
existingLinks.push(linkData);
|
||||
|
||||
// Save back to localStorage
|
||||
localStorage.setItem('oxicloud_shared_links', JSON.stringify(existingLinks));
|
||||
} catch (error) {
|
||||
console.error('Error saving shared link to local storage:', error);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Remove a shared link
|
||||
* @param {string} linkId - ID of the shared link to remove
|
||||
* @returns {Promise<boolean>} - Success status
|
||||
*/
|
||||
removeSharedLink(linkId) {
|
||||
try {
|
||||
// Get existing shared links
|
||||
const existingLinks = JSON.parse(localStorage.getItem('oxicloud_shared_links') || '[]');
|
||||
|
||||
// Filter out the link to remove
|
||||
const updatedLinks = existingLinks.filter(link => link.id !== linkId);
|
||||
|
||||
// Save back to localStorage
|
||||
localStorage.setItem('oxicloud_shared_links', JSON.stringify(updatedLinks));
|
||||
|
||||
// Removed network delay simulation
|
||||
|
||||
return true;
|
||||
} catch (error) {
|
||||
console.error('Error removing shared link:', error);
|
||||
return false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Update a shared link's properties
|
||||
* @param {string} linkId - ID of the shared link to update
|
||||
* @param {Object} updateData - Properties to update
|
||||
* @returns {Promise<Object>} - Updated shared link
|
||||
*/
|
||||
updateSharedLink(linkId, updateData) {
|
||||
try {
|
||||
// Get existing shared links
|
||||
const existingLinks = JSON.parse(localStorage.getItem('oxicloud_shared_links') || '[]');
|
||||
|
||||
// Find the link to update
|
||||
const linkIndex = existingLinks.findIndex(link => link.id === linkId);
|
||||
if (linkIndex === -1) {
|
||||
throw new Error('Shared link not found');
|
||||
}
|
||||
|
||||
// Update link data
|
||||
existingLinks[linkIndex] = {
|
||||
...existingLinks[linkIndex],
|
||||
...updateData,
|
||||
updated_at: new Date().toISOString()
|
||||
};
|
||||
|
||||
// Save back to localStorage
|
||||
localStorage.setItem('oxicloud_shared_links', JSON.stringify(existingLinks));
|
||||
|
||||
// Removed network delay simulation
|
||||
|
||||
return existingLinks[linkIndex];
|
||||
} catch (error) {
|
||||
console.error('Error updating shared link:', error);
|
||||
throw error;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Get all shared links for the current user
|
||||
* @returns {Promise<Array>} - Array of shared links
|
||||
*/
|
||||
getSharedLinks() {
|
||||
try {
|
||||
// Get shared links from localStorage
|
||||
const links = JSON.parse(localStorage.getItem('oxicloud_shared_links') || '[]');
|
||||
|
||||
// Removed network delay simulation
|
||||
|
||||
return links;
|
||||
} catch (error) {
|
||||
console.error('Error getting shared links:', error);
|
||||
return [];
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Get shared links for a specific item
|
||||
* @param {string} itemId - ID of the file or folder
|
||||
* @param {string} itemType - Type ('file' or 'folder')
|
||||
* @returns {Promise<Array>} - Array of shared links for the item
|
||||
*/
|
||||
getSharedLinksForItem(itemId, itemType) {
|
||||
try {
|
||||
// Get all shared links
|
||||
const allLinks = this.getSharedLinks();
|
||||
|
||||
// Filter by item ID and type
|
||||
return allLinks.filter(link => link.itemId === itemId && link.type === itemType);
|
||||
} catch (error) {
|
||||
console.error('Error getting shared links for item:', error);
|
||||
return [];
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Check if an item has any shared links
|
||||
* @param {string} itemId - ID of the file or folder
|
||||
* @param {string} itemType - Type ('file' or 'folder')
|
||||
* @returns {Promise<boolean>} - True if the item has shared links
|
||||
*/
|
||||
hasSharedLinks(itemId, itemType) {
|
||||
const links = this.getSharedLinksForItem(itemId, itemType);
|
||||
return links.length > 0;
|
||||
},
|
||||
|
||||
/**
|
||||
* Copy a shared link to clipboard
|
||||
* @param {string} url - URL to copy
|
||||
* @returns {boolean} - Success status
|
||||
*/
|
||||
copyLinkToClipboard(url) {
|
||||
try {
|
||||
navigator.clipboard.writeText(url);
|
||||
window.ui.showNotification('Enlace copiado', 'Enlace copiado al portapapeles');
|
||||
return true;
|
||||
} catch (error) {
|
||||
console.error('Error copying to clipboard:', error);
|
||||
window.ui.showNotification('Error', 'No se pudo copiar el enlace');
|
||||
return false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Format expiration date for display
|
||||
* @param {string} dateString - ISO date string
|
||||
* @returns {string} - Formatted date string
|
||||
*/
|
||||
formatExpirationDate(dateString) {
|
||||
if (!dateString) return 'Sin vencimiento';
|
||||
|
||||
const date = new Date(dateString);
|
||||
return date.toLocaleDateString() + ' ' + date.toLocaleTimeString([], {hour: '2-digit', minute:'2-digit'});
|
||||
},
|
||||
|
||||
/**
|
||||
* Send a notification about a shared resource
|
||||
* @param {string} shareUrl - The URL of the shared resource
|
||||
* @param {string} recipientEmail - Email of the recipient
|
||||
* @param {string} message - Optional message to include
|
||||
* @returns {boolean} - Success status
|
||||
*/
|
||||
sendShareNotification(shareUrl, recipientEmail, message = '') {
|
||||
try {
|
||||
// In a real implementation, this would call the backend
|
||||
// For now, we'll just simulate a successful notification
|
||||
console.log(`Share notification for ${shareUrl} sent to ${recipientEmail}`);
|
||||
console.log(`Message: ${message || 'No message included'}`);
|
||||
|
||||
// Simulate network delay
|
||||
//await new Promise(resolve => setTimeout(resolve, 800));
|
||||
|
||||
window.ui.showNotification('Notificación enviada', `Se envió notificación a ${recipientEmail}`);
|
||||
return true;
|
||||
} catch (error) {
|
||||
console.error('Error sending share notification:', error);
|
||||
window.ui.showNotification('Error', 'No se pudo enviar la notificación');
|
||||
return false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Initialize file sharing event listeners and UI elements
|
||||
*/
|
||||
init() {
|
||||
// This will be called by the app.js initialization
|
||||
console.log('File sharing module initialized');
|
||||
|
||||
// Add "Shared" view event listeners
|
||||
document.querySelectorAll('.nav-item').forEach(item => {
|
||||
if (item.querySelector('span').getAttribute('data-i18n') === 'nav.shared') {
|
||||
item.addEventListener('click', () => {
|
||||
window.location.href = '/shared.html';
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Get all shared links
|
||||
* @returns {Array} Array of shared links
|
||||
*/
|
||||
function getSharedLinks() {
|
||||
try {
|
||||
return JSON.parse(localStorage.getItem('oxicloud_shared_links') || '[]');
|
||||
} catch (error) {
|
||||
console.error('Error getting shared links:', error);
|
||||
return [];
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Update a shared link
|
||||
* @param {string} linkId - ID of the link to update
|
||||
* @param {Object} updateData - Data to update
|
||||
* @returns {boolean} Success status
|
||||
*/
|
||||
function updateSharedLink(linkId, updateData) {
|
||||
try {
|
||||
const links = getSharedLinks();
|
||||
const index = links.findIndex(link => link.id === linkId);
|
||||
if (index === -1) return false;
|
||||
|
||||
links[index] = {...links[index], ...updateData};
|
||||
localStorage.setItem('oxicloud_shared_links', JSON.stringify(links));
|
||||
return true;
|
||||
} catch (error) {
|
||||
console.error('Error updating shared link:', error);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove a shared link
|
||||
* @param {string} linkId - ID of the link to remove
|
||||
* @returns {boolean} Success status
|
||||
*/
|
||||
function removeSharedLink(linkId) {
|
||||
try {
|
||||
const links = getSharedLinks();
|
||||
const filteredLinks = links.filter(link => link.id !== linkId);
|
||||
localStorage.setItem('oxicloud_shared_links', JSON.stringify(filteredLinks));
|
||||
return true;
|
||||
} catch (error) {
|
||||
console.error('Error removing shared link:', error);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Send a notification about a shared link
|
||||
* @param {string} linkId - ID of the link
|
||||
* @param {string} email - Recipient email
|
||||
* @param {string} message - Optional message
|
||||
* @returns {Promise<boolean>} Success status
|
||||
*/
|
||||
function sendShareNotification(linkId, email, message = '') {
|
||||
return new Promise((resolve) => {
|
||||
console.log(`Notification for link ${linkId} sent to ${email}`);
|
||||
console.log(`Message: ${message || 'No message'}`);
|
||||
setTimeout(() => resolve(true), 500);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Translate text using i18n if available
|
||||
* @param {string} key - Translation key
|
||||
* @param {string} defaultText - Default text if translation not found
|
||||
* @returns {string} Translated text
|
||||
*/
|
||||
function translate(key, defaultText) {
|
||||
if (window.i18n && window.i18n.t) {
|
||||
return window.i18n.t(key, defaultText);
|
||||
}
|
||||
return defaultText;
|
||||
}
|
||||
|
||||
/**
|
||||
* Initialize i18n module
|
||||
*/
|
||||
function initializeI18n() {
|
||||
if (window.i18n && window.i18n.init) {
|
||||
window.i18n.init();
|
||||
}
|
||||
}
|
||||
|
||||
// Expose functions globally
|
||||
window.getSharedLinks = getSharedLinks;
|
||||
window.updateSharedLink = updateSharedLink;
|
||||
window.removeSharedLink = removeSharedLink;
|
||||
window.sendShareNotification = sendShareNotification;
|
||||
window.translate = translate;
|
||||
window.initializeI18n = initializeI18n;
|
||||
|
||||
// Expose file sharing module globally
|
||||
window.fileSharing = fileSharing;
|
||||
@@ -0,0 +1,469 @@
|
||||
/**
|
||||
* OxiCloud Shared Resources Page
|
||||
* Manages the display and interaction with shared files and folders
|
||||
*/
|
||||
|
||||
// Authentication check function
|
||||
function checkAuthentication() {
|
||||
// Names of variables from auth.js
|
||||
const TOKEN_KEY = 'oxicloud_token';
|
||||
const TOKEN_EXPIRY_KEY = 'oxicloud_token_expiry';
|
||||
const USER_DATA_KEY = 'oxicloud_user';
|
||||
|
||||
const token = localStorage.getItem(TOKEN_KEY);
|
||||
const tokenExpiry = localStorage.getItem(TOKEN_EXPIRY_KEY);
|
||||
|
||||
if (!token || !tokenExpiry || new Date(tokenExpiry) < new Date()) {
|
||||
// No token or expired token
|
||||
window.location.href = '/login.html';
|
||||
return;
|
||||
}
|
||||
|
||||
// Display username in notification if available
|
||||
const userData = JSON.parse(localStorage.getItem(USER_DATA_KEY) || '{}');
|
||||
if (userData.username) {
|
||||
console.log(`Authenticated as ${userData.username}`);
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
// Initialize i18n
|
||||
initializeI18n();
|
||||
|
||||
// Elements
|
||||
const sharedItemsList = document.getElementById('shared-items-list');
|
||||
const emptySharedState = document.getElementById('empty-shared-state');
|
||||
const filterType = document.getElementById('filter-type');
|
||||
const sortBy = document.getElementById('sort-by');
|
||||
const sharedSearch = document.getElementById('shared-search');
|
||||
const sharedSearchBtn = document.getElementById('shared-search-btn');
|
||||
const goToFilesBtn = document.getElementById('go-to-files');
|
||||
|
||||
// Share dialog elements
|
||||
const shareDialog = document.getElementById('share-dialog');
|
||||
const shareDialogCloseBtn = shareDialog.querySelector('.close-dialog-btn');
|
||||
const shareDialogIcon = document.getElementById('share-dialog-icon');
|
||||
const shareDialogName = document.getElementById('share-dialog-name');
|
||||
const shareLinkUrl = document.getElementById('share-link-url');
|
||||
const copyLinkBtn = document.getElementById('copy-link-btn');
|
||||
const enablePassword = document.getElementById('enable-password');
|
||||
const sharePassword = document.getElementById('share-password');
|
||||
const generatePasswordBtn = document.getElementById('generate-password');
|
||||
const enableExpiration = document.getElementById('enable-expiration');
|
||||
const shareExpiration = document.getElementById('share-expiration');
|
||||
const permissionRead = document.getElementById('permission-read');
|
||||
const permissionWrite = document.getElementById('permission-write');
|
||||
const permissionReshare = document.getElementById('permission-reshare');
|
||||
const updateShareBtn = document.getElementById('update-share-btn');
|
||||
const removeShareBtn = document.getElementById('remove-share-btn');
|
||||
|
||||
// Notification dialog elements
|
||||
const notificationDialog = document.getElementById('share-notification-dialog');
|
||||
const notificationCloseBtn = notificationDialog.querySelector('.close-dialog-btn');
|
||||
const notifyDialogIcon = document.getElementById('notify-dialog-icon');
|
||||
const notifyDialogName = document.getElementById('notify-dialog-name');
|
||||
const notificationEmail = document.getElementById('notification-email');
|
||||
const notificationMessage = document.getElementById('notification-message');
|
||||
const sendNotificationBtn = document.getElementById('send-notification-btn');
|
||||
|
||||
// Notification banner
|
||||
const notificationBanner = document.getElementById('notification-banner');
|
||||
const notificationBannerMessage = document.getElementById('notification-message');
|
||||
const closeNotificationBtn = document.getElementById('close-notification');
|
||||
|
||||
// Current state
|
||||
let currentSharedItem = null;
|
||||
let allSharedItems = [];
|
||||
let filteredItems = [];
|
||||
|
||||
// Initialize the page
|
||||
loadSharedItems();
|
||||
|
||||
// Event listeners
|
||||
filterType.addEventListener('change', filterAndSortItems);
|
||||
sortBy.addEventListener('change', filterAndSortItems);
|
||||
sharedSearchBtn.addEventListener('click', filterAndSortItems);
|
||||
sharedSearch.addEventListener('keyup', (e) => {
|
||||
if (e.key === 'Enter') filterAndSortItems();
|
||||
});
|
||||
goToFilesBtn.addEventListener('click', () => window.location.href = '/');
|
||||
|
||||
// Check authentication before loading
|
||||
checkAuthentication();
|
||||
|
||||
// Share dialog event listeners
|
||||
shareDialogCloseBtn.addEventListener('click', () => closeShareDialog());
|
||||
copyLinkBtn.addEventListener('click', copyShareLink);
|
||||
enablePassword.addEventListener('change', () => {
|
||||
sharePassword.disabled = !enablePassword.checked;
|
||||
if (enablePassword.checked) sharePassword.focus();
|
||||
});
|
||||
generatePasswordBtn.addEventListener('click', generatePassword);
|
||||
enableExpiration.addEventListener('change', () => {
|
||||
shareExpiration.disabled = !enableExpiration.checked;
|
||||
if (enableExpiration.checked) shareExpiration.focus();
|
||||
});
|
||||
updateShareBtn.addEventListener('click', updateSharedItem);
|
||||
removeShareBtn.addEventListener('click', removeSharedItem);
|
||||
|
||||
// Notification dialog event listeners
|
||||
notificationCloseBtn.addEventListener('click', () => closeNotificationDialog());
|
||||
sendNotificationBtn.addEventListener('click', sendNotification);
|
||||
|
||||
// Notification banner event listeners
|
||||
closeNotificationBtn.addEventListener('click', () => {
|
||||
notificationBanner.classList.remove('active');
|
||||
});
|
||||
|
||||
/**
|
||||
* Loads all shared items and displays them
|
||||
*/
|
||||
function loadSharedItems() {
|
||||
// Get shared links from storage
|
||||
allSharedItems = getSharedLinks();
|
||||
|
||||
// Display items
|
||||
filterAndSortItems();
|
||||
}
|
||||
|
||||
/**
|
||||
* Filters and sorts the shared items based on current filters
|
||||
*/
|
||||
function filterAndSortItems() {
|
||||
const type = filterType.value;
|
||||
const sort = sortBy.value;
|
||||
const searchTerm = sharedSearch.value.toLowerCase();
|
||||
|
||||
// Filter items
|
||||
filteredItems = allSharedItems.filter(item => {
|
||||
// Filter by type
|
||||
if (type !== 'all' && item.type !== type) return false;
|
||||
|
||||
// Filter by search term
|
||||
const nameMatch = item.name.toLowerCase().includes(searchTerm);
|
||||
return nameMatch;
|
||||
});
|
||||
|
||||
// Sort items
|
||||
filteredItems.sort((a, b) => {
|
||||
if (sort === 'name') {
|
||||
return a.name.localeCompare(b.name);
|
||||
} else if (sort === 'date') {
|
||||
return new Date(b.dateShared) - new Date(a.dateShared);
|
||||
} else if (sort === 'expiration') {
|
||||
// Handle null expiration dates (items without expiration come last)
|
||||
if (!a.expiration && !b.expiration) return 0;
|
||||
if (!a.expiration) return 1;
|
||||
if (!b.expiration) return -1;
|
||||
return new Date(a.expiration) - new Date(b.expiration);
|
||||
}
|
||||
return 0;
|
||||
});
|
||||
|
||||
// Display filtered and sorted items
|
||||
displaySharedItems();
|
||||
}
|
||||
|
||||
/**
|
||||
* Displays the filtered and sorted shared items
|
||||
*/
|
||||
function displaySharedItems() {
|
||||
// Clear the list
|
||||
sharedItemsList.innerHTML = '';
|
||||
|
||||
// Show empty state if no items
|
||||
if (filteredItems.length === 0) {
|
||||
emptySharedState.style.display = 'flex';
|
||||
document.querySelector('.shared-list-container').style.display = 'none';
|
||||
return;
|
||||
}
|
||||
|
||||
// Hide empty state and show table
|
||||
emptySharedState.style.display = 'none';
|
||||
document.querySelector('.shared-list-container').style.display = 'block';
|
||||
|
||||
// Add items to the list
|
||||
filteredItems.forEach(item => {
|
||||
const row = document.createElement('tr');
|
||||
|
||||
// Icon and name
|
||||
const nameCell = document.createElement('td');
|
||||
nameCell.className = 'shared-item-name';
|
||||
const icon = document.createElement('span');
|
||||
icon.className = 'item-icon';
|
||||
icon.textContent = item.type === 'file' ? '📄' : '📁';
|
||||
const name = document.createElement('span');
|
||||
name.textContent = item.name;
|
||||
nameCell.appendChild(icon);
|
||||
nameCell.appendChild(name);
|
||||
|
||||
// Type
|
||||
const typeCell = document.createElement('td');
|
||||
typeCell.textContent = item.type === 'file' ? translate('shared_typeFile', 'File') : translate('shared_typeFolder', 'Folder');
|
||||
|
||||
// Date shared
|
||||
const dateCell = document.createElement('td');
|
||||
dateCell.textContent = formatDate(item.dateShared);
|
||||
|
||||
// Expiration
|
||||
const expirationCell = document.createElement('td');
|
||||
expirationCell.textContent = item.expiration ? formatDate(item.expiration) : translate('shared_noExpiration', 'No expiration');
|
||||
|
||||
// Permissions
|
||||
const permissionsCell = document.createElement('td');
|
||||
const permissions = [];
|
||||
if (item.permissions.read) permissions.push(translate('share_permissionRead', 'Read'));
|
||||
if (item.permissions.write) permissions.push(translate('share_permissionWrite', 'Write'));
|
||||
if (item.permissions.reshare) permissions.push(translate('share_permissionReshare', 'Reshare'));
|
||||
permissionsCell.textContent = permissions.join(', ');
|
||||
|
||||
// Password
|
||||
const passwordCell = document.createElement('td');
|
||||
passwordCell.textContent = item.password ? translate('shared_hasPassword', 'Yes') : translate('shared_noPassword', 'No');
|
||||
|
||||
// Actions
|
||||
const actionsCell = document.createElement('td');
|
||||
actionsCell.className = 'shared-item-actions';
|
||||
|
||||
// Edit button
|
||||
const editBtn = document.createElement('button');
|
||||
editBtn.className = 'action-btn edit-btn';
|
||||
editBtn.innerHTML = '<span class="action-icon">✏️</span>';
|
||||
editBtn.title = translate('shared_editShare', 'Edit Share');
|
||||
editBtn.addEventListener('click', () => openShareDialog(item));
|
||||
|
||||
// Notify button
|
||||
const notifyBtn = document.createElement('button');
|
||||
notifyBtn.className = 'action-btn notify-btn';
|
||||
notifyBtn.innerHTML = '<span class="action-icon">📧</span>';
|
||||
notifyBtn.title = translate('shared_notifyShare', 'Notify Someone');
|
||||
notifyBtn.addEventListener('click', () => openNotificationDialog(item));
|
||||
|
||||
// Copy link button
|
||||
const copyBtn = document.createElement('button');
|
||||
copyBtn.className = 'action-btn copy-btn';
|
||||
copyBtn.innerHTML = '<span class="action-icon">📋</span>';
|
||||
copyBtn.title = translate('shared_copyLink', 'Copy Link');
|
||||
copyBtn.addEventListener('click', () => {
|
||||
navigator.clipboard.writeText(item.url)
|
||||
.then(() => showNotification(translate('shared_linkCopied', 'Link copied to clipboard!')))
|
||||
.catch(err => showNotification(translate('shared_linkCopyFailed', 'Failed to copy link'), 'error'));
|
||||
});
|
||||
|
||||
// Remove button
|
||||
const removeBtn = document.createElement('button');
|
||||
removeBtn.className = 'action-btn remove-btn';
|
||||
removeBtn.innerHTML = '<span class="action-icon">🗑️</span>';
|
||||
removeBtn.title = translate('shared_removeShare', 'Remove Share');
|
||||
removeBtn.addEventListener('click', () => {
|
||||
currentSharedItem = item;
|
||||
removeSharedItem();
|
||||
});
|
||||
|
||||
actionsCell.appendChild(editBtn);
|
||||
actionsCell.appendChild(notifyBtn);
|
||||
actionsCell.appendChild(copyBtn);
|
||||
actionsCell.appendChild(removeBtn);
|
||||
|
||||
// Add cells to row
|
||||
row.appendChild(nameCell);
|
||||
row.appendChild(typeCell);
|
||||
row.appendChild(dateCell);
|
||||
row.appendChild(expirationCell);
|
||||
row.appendChild(permissionsCell);
|
||||
row.appendChild(passwordCell);
|
||||
row.appendChild(actionsCell);
|
||||
|
||||
// Add row to table
|
||||
sharedItemsList.appendChild(row);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Opens the share dialog for the given item
|
||||
*/
|
||||
function openShareDialog(item) {
|
||||
currentSharedItem = item;
|
||||
|
||||
// Set dialog content
|
||||
shareDialogIcon.textContent = item.type === 'file' ? '📄' : '📁';
|
||||
shareDialogName.textContent = item.name;
|
||||
shareLinkUrl.value = item.url;
|
||||
|
||||
// Set permissions
|
||||
permissionRead.checked = item.permissions.read;
|
||||
permissionWrite.checked = item.permissions.write;
|
||||
permissionReshare.checked = item.permissions.reshare;
|
||||
|
||||
// Set password
|
||||
enablePassword.checked = !!item.password;
|
||||
sharePassword.disabled = !enablePassword.checked;
|
||||
sharePassword.value = item.password || '';
|
||||
|
||||
// Set expiration
|
||||
enableExpiration.checked = !!item.expiration;
|
||||
shareExpiration.disabled = !enableExpiration.checked;
|
||||
shareExpiration.value = item.expiration ? new Date(item.expiration).toISOString().split('T')[0] : '';
|
||||
|
||||
// Show dialog
|
||||
shareDialog.classList.add('active');
|
||||
}
|
||||
|
||||
/**
|
||||
* Closes the share dialog
|
||||
*/
|
||||
function closeShareDialog() {
|
||||
shareDialog.classList.remove('active');
|
||||
currentSharedItem = null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Opens the notification dialog for the given item
|
||||
*/
|
||||
function openNotificationDialog(item) {
|
||||
currentSharedItem = item;
|
||||
|
||||
// Set dialog content
|
||||
notifyDialogIcon.textContent = item.type === 'file' ? '📄' : '📁';
|
||||
notifyDialogName.textContent = item.name;
|
||||
notificationEmail.value = '';
|
||||
notificationMessage.value = '';
|
||||
|
||||
// Show dialog
|
||||
notificationDialog.classList.add('active');
|
||||
}
|
||||
|
||||
/**
|
||||
* Closes the notification dialog
|
||||
*/
|
||||
function closeNotificationDialog() {
|
||||
notificationDialog.classList.remove('active');
|
||||
currentSharedItem = null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Copies the current share link to clipboard
|
||||
*/
|
||||
function copyShareLink() {
|
||||
navigator.clipboard.writeText(shareLinkUrl.value)
|
||||
.then(() => showNotification(translate('shared_linkCopied', 'Link copied to clipboard!')))
|
||||
.catch(err => showNotification(translate('shared_linkCopyFailed', 'Failed to copy link'), 'error'));
|
||||
}
|
||||
|
||||
/**
|
||||
* Generates a random password for the share
|
||||
*/
|
||||
function generatePassword() {
|
||||
const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*';
|
||||
let password = '';
|
||||
for (let i = 0; i < 12; i++) {
|
||||
password += chars.charAt(Math.floor(Math.random() * chars.length));
|
||||
}
|
||||
sharePassword.value = password;
|
||||
enablePassword.checked = true;
|
||||
sharePassword.disabled = false;
|
||||
}
|
||||
|
||||
/**
|
||||
* Updates the current shared item with new settings
|
||||
*/
|
||||
function updateSharedItem() {
|
||||
if (!currentSharedItem) return;
|
||||
|
||||
// Get updated settings
|
||||
const permissions = {
|
||||
read: permissionRead.checked,
|
||||
write: permissionWrite.checked,
|
||||
reshare: permissionReshare.checked
|
||||
};
|
||||
|
||||
const password = enablePassword.checked ? sharePassword.value : null;
|
||||
const expiration = enableExpiration.checked ? shareExpiration.value : null;
|
||||
|
||||
// Update the shared link
|
||||
updateSharedLink(currentSharedItem.id, {
|
||||
permissions,
|
||||
password,
|
||||
expiration: expiration ? new Date(expiration).toISOString() : null
|
||||
});
|
||||
|
||||
// Reload items and close dialog
|
||||
loadSharedItems();
|
||||
closeShareDialog();
|
||||
|
||||
// Show notification
|
||||
showNotification(translate('shared_itemUpdated', 'Share settings updated successfully'));
|
||||
}
|
||||
|
||||
/**
|
||||
* Removes the current shared item
|
||||
*/
|
||||
function removeSharedItem() {
|
||||
if (!currentSharedItem) return;
|
||||
|
||||
// Remove the shared link
|
||||
removeSharedLink(currentSharedItem.id);
|
||||
|
||||
// Reload items and close dialog if open
|
||||
loadSharedItems();
|
||||
closeShareDialog();
|
||||
|
||||
// Show notification
|
||||
showNotification(translate('shared_itemRemoved', 'Share removed successfully'));
|
||||
}
|
||||
|
||||
/**
|
||||
* Sends a notification email for the current shared item
|
||||
*/
|
||||
function sendNotification() {
|
||||
if (!currentSharedItem) return;
|
||||
|
||||
const email = notificationEmail.value.trim();
|
||||
const message = notificationMessage.value.trim();
|
||||
|
||||
// Validate email
|
||||
if (!email || !validateEmail(email)) {
|
||||
showNotification(translate('shared_invalidEmail', 'Please enter a valid email address'), 'error');
|
||||
return;
|
||||
}
|
||||
|
||||
// Send notification
|
||||
sendShareNotification(currentSharedItem.id, email, message)
|
||||
.then(() => {
|
||||
closeNotificationDialog();
|
||||
showNotification(translate('shared_notificationSent', 'Notification sent successfully'));
|
||||
})
|
||||
.catch(error => {
|
||||
showNotification(translate('shared_notificationFailed', 'Failed to send notification'), 'error');
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Shows a notification banner with the given message
|
||||
*/
|
||||
function showNotification(message, type = 'success') {
|
||||
notificationBannerMessage.textContent = message;
|
||||
notificationBanner.className = 'notification-banner active ' + type;
|
||||
|
||||
// Auto-hide after 5 seconds
|
||||
setTimeout(() => {
|
||||
notificationBanner.classList.remove('active');
|
||||
}, 5000);
|
||||
}
|
||||
|
||||
/**
|
||||
* Validates an email address
|
||||
*/
|
||||
function validateEmail(email) {
|
||||
const re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
||||
return re.test(email);
|
||||
}
|
||||
|
||||
/**
|
||||
* Formats a date string to a user-friendly format
|
||||
*/
|
||||
function formatDate(dateString) {
|
||||
const options = { year: 'numeric', month: 'short', day: 'numeric' };
|
||||
return new Date(dateString).toLocaleDateString(undefined, options);
|
||||
}
|
||||
});
|
||||
+142
-1
@@ -21,6 +21,9 @@ const ui = {
|
||||
<div class="context-menu-item" id="move-folder-option">
|
||||
<i class="fas fa-exchange-alt"></i> <span data-i18n="actions.move">Mover a...</span>
|
||||
</div>
|
||||
<div class="context-menu-item" id="share-folder-option">
|
||||
<i class="fas fa-share-alt"></i> <span data-i18n="actions.share">Compartir</span>
|
||||
</div>
|
||||
<div class="context-menu-item" id="delete-folder-option">
|
||||
<i class="fas fa-trash"></i> <span data-i18n="actions.delete">Eliminar</span>
|
||||
</div>
|
||||
@@ -34,6 +37,9 @@ const ui = {
|
||||
fileMenu.className = 'context-menu';
|
||||
fileMenu.id = 'file-context-menu';
|
||||
fileMenu.innerHTML = `
|
||||
<div class="context-menu-item" id="share-file-option">
|
||||
<i class="fas fa-share-alt"></i> <span data-i18n="actions.share">Compartir</span>
|
||||
</div>
|
||||
<div class="context-menu-item" id="move-file-option">
|
||||
<i class="fas fa-exchange-alt"></i> <span data-i18n="actions.move">Mover a...</span>
|
||||
</div>
|
||||
@@ -85,9 +91,144 @@ const ui = {
|
||||
`;
|
||||
document.body.appendChild(moveDialog);
|
||||
}
|
||||
|
||||
// Share dialog
|
||||
if (!document.getElementById('share-dialog')) {
|
||||
const shareDialog = document.createElement('div');
|
||||
shareDialog.className = 'share-dialog';
|
||||
shareDialog.id = 'share-dialog';
|
||||
shareDialog.innerHTML = `
|
||||
<div class="share-dialog-content">
|
||||
<div class="share-dialog-header" data-i18n="dialogs.share_file">Compartir archivo</div>
|
||||
<div class="shared-item-info">
|
||||
<strong>Elemento:</strong> <span id="shared-item-name"></span>
|
||||
</div>
|
||||
|
||||
<div id="existing-shares-section" style="display:none; margin: 15px 0;">
|
||||
<h3 data-i18n="dialogs.existing_shares">Enlaces compartidos existentes</h3>
|
||||
<div id="existing-shares-container"></div>
|
||||
</div>
|
||||
|
||||
<div class="share-options">
|
||||
<h3 data-i18n="dialogs.share_options">Opciones de compartición</h3>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="share-password" data-i18n="dialogs.password">Contraseña (opcional):</label>
|
||||
<input type="password" id="share-password" placeholder="Proteger con contraseña">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="share-expiration" data-i18n="dialogs.expiration">Fecha de vencimiento (opcional):</label>
|
||||
<input type="date" id="share-expiration">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label data-i18n="dialogs.permissions">Permisos:</label>
|
||||
<div class="permission-options">
|
||||
<div class="permission-option">
|
||||
<input type="checkbox" id="share-permission-read" checked>
|
||||
<label for="share-permission-read" data-i18n="permissions.read">Lectura</label>
|
||||
</div>
|
||||
<div class="permission-option">
|
||||
<input type="checkbox" id="share-permission-write">
|
||||
<label for="share-permission-write" data-i18n="permissions.write">Escritura</label>
|
||||
</div>
|
||||
<div class="permission-option">
|
||||
<input type="checkbox" id="share-permission-reshare">
|
||||
<label for="share-permission-reshare" data-i18n="permissions.reshare">Permitir compartir</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="new-share-section" style="display:none; margin: 15px 0;">
|
||||
<h3 data-i18n="dialogs.generated_link">Enlace generado</h3>
|
||||
<div class="form-group">
|
||||
<input type="text" id="generated-share-url" readonly>
|
||||
<div class="share-link-actions">
|
||||
<button class="btn btn-small" id="copy-share-btn">
|
||||
<i class="fas fa-copy"></i> <span data-i18n="actions.copy">Copiar</span>
|
||||
</button>
|
||||
<button class="btn btn-small" id="notify-share-btn">
|
||||
<i class="fas fa-envelope"></i> <span data-i18n="actions.notify">Notificar</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="share-dialog-buttons">
|
||||
<button class="btn" id="share-cancel-btn" data-i18n="actions.cancel">Cancelar</button>
|
||||
<button class="btn btn-primary" id="share-confirm-btn" data-i18n="actions.share">Compartir</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
document.body.appendChild(shareDialog);
|
||||
|
||||
// Add event listeners for share dialog
|
||||
document.getElementById('share-cancel-btn').addEventListener('click', () => {
|
||||
contextMenus.closeShareDialog();
|
||||
});
|
||||
|
||||
document.getElementById('share-confirm-btn').addEventListener('click', () => {
|
||||
contextMenus.createSharedLink();
|
||||
});
|
||||
|
||||
document.getElementById('copy-share-btn').addEventListener('click', async () => {
|
||||
const shareUrl = document.getElementById('generated-share-url').value;
|
||||
await fileSharing.copyLinkToClipboard(shareUrl);
|
||||
});
|
||||
|
||||
document.getElementById('notify-share-btn').addEventListener('click', () => {
|
||||
const shareUrl = document.getElementById('generated-share-url').value;
|
||||
contextMenus.showEmailNotificationDialog(shareUrl);
|
||||
});
|
||||
}
|
||||
|
||||
// Notification dialog
|
||||
if (!document.getElementById('notification-dialog')) {
|
||||
const notificationDialog = document.createElement('div');
|
||||
notificationDialog.className = 'share-dialog';
|
||||
notificationDialog.id = 'notification-dialog';
|
||||
notificationDialog.innerHTML = `
|
||||
<div class="share-dialog-content">
|
||||
<div class="share-dialog-header" data-i18n="dialogs.notify">Notificar enlace compartido</div>
|
||||
|
||||
<p><strong>URL:</strong> <span id="notification-share-url"></span></p>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="notification-email" data-i18n="dialogs.recipient">Destinatario:</label>
|
||||
<input type="email" id="notification-email" placeholder="Correo electrónico">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="notification-message" data-i18n="dialogs.message">Mensaje (opcional):</label>
|
||||
<textarea id="notification-message" rows="3"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="share-dialog-buttons">
|
||||
<button class="btn" id="notification-cancel-btn" data-i18n="actions.cancel">Cancelar</button>
|
||||
<button class="btn btn-primary" id="notification-send-btn" data-i18n="actions.send">Enviar</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
document.body.appendChild(notificationDialog);
|
||||
|
||||
// Add event listeners for notification dialog
|
||||
document.getElementById('notification-cancel-btn').addEventListener('click', () => {
|
||||
contextMenus.closeNotificationDialog();
|
||||
});
|
||||
|
||||
document.getElementById('notification-send-btn').addEventListener('click', () => {
|
||||
contextMenus.sendShareNotification();
|
||||
});
|
||||
}
|
||||
|
||||
// Assign events to menu items
|
||||
contextMenus.assignMenuEvents();
|
||||
if (window.contextMenus) {
|
||||
window.contextMenus.assignMenuEvents();
|
||||
} else {
|
||||
console.warn('contextMenus module not loaded');
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
|
||||
+86
-2
@@ -19,7 +19,76 @@
|
||||
"move_to": "Move to",
|
||||
"delete": "Delete",
|
||||
"cancel": "Cancel",
|
||||
"confirm": "Confirm"
|
||||
"confirm": "Confirm",
|
||||
"share": "Share",
|
||||
"copy": "Copy",
|
||||
"notify": "Notify",
|
||||
"send": "Send"
|
||||
},
|
||||
"share": {
|
||||
"dialogTitle": "Share Link",
|
||||
"linkLabel": "Share Link:",
|
||||
"copyLink": "Copy",
|
||||
"permissions": "Permissions:",
|
||||
"permissionRead": "Read",
|
||||
"permissionWrite": "Write",
|
||||
"permissionReshare": "Reshare",
|
||||
"password": "Password Protection:",
|
||||
"generatePassword": "Generate",
|
||||
"expiration": "Expiration Date:",
|
||||
"update": "Update Share",
|
||||
"remove": "Remove Share",
|
||||
"notifyTitle": "Send Notification",
|
||||
"notifyEmailLabel": "Email Address:",
|
||||
"notifyMessageLabel": "Message (optional):",
|
||||
"notifySend": "Send Notification",
|
||||
"shareWithOthers": "Share with others",
|
||||
"sharePublicly": "Share publicly",
|
||||
"shareSettings": "Sharing settings",
|
||||
"shareCopied": "Link copied to clipboard",
|
||||
"shareCreated": "Share link created successfully",
|
||||
"shareUpdated": "Share settings updated successfully",
|
||||
"shareRemoved": "Share removed successfully"
|
||||
},
|
||||
"shared": {
|
||||
"backToFiles": "Back to Files",
|
||||
"pageTitle": "Shared Resources",
|
||||
"pageDescription": "Manage your shared files and folders",
|
||||
"filterType": "Type:",
|
||||
"filterAll": "All",
|
||||
"filterFiles": "Files",
|
||||
"filterFolders": "Folders",
|
||||
"sortBy": "Sort by:",
|
||||
"sortByName": "Name",
|
||||
"sortByDate": "Date shared",
|
||||
"sortByExpiration": "Expiration",
|
||||
"search": "Search",
|
||||
"colName": "Name",
|
||||
"colType": "Type",
|
||||
"colDateShared": "Date Shared",
|
||||
"colExpiration": "Expiration",
|
||||
"colPermissions": "Permissions",
|
||||
"colPassword": "Password",
|
||||
"colActions": "Actions",
|
||||
"emptyStateTitle": "No shared resources yet",
|
||||
"emptyStateDesc": "When you share files or folders, they will appear here",
|
||||
"goToFiles": "Go to Files",
|
||||
"typeFile": "File",
|
||||
"typeFolder": "Folder",
|
||||
"noExpiration": "No expiration",
|
||||
"hasPassword": "Yes",
|
||||
"noPassword": "No",
|
||||
"editShare": "Edit Share",
|
||||
"notifyShare": "Notify Someone",
|
||||
"copyLink": "Copy Link",
|
||||
"removeShare": "Remove Share",
|
||||
"linkCopied": "Link copied to clipboard!",
|
||||
"linkCopyFailed": "Failed to copy link",
|
||||
"itemUpdated": "Share settings updated successfully",
|
||||
"itemRemoved": "Share removed successfully",
|
||||
"invalidEmail": "Please enter a valid email address",
|
||||
"notificationSent": "Notification sent successfully",
|
||||
"notificationFailed": "Failed to send notification"
|
||||
},
|
||||
"files": {
|
||||
"name": "Name",
|
||||
@@ -47,12 +116,27 @@
|
||||
"root": "Root",
|
||||
"delete_confirmation": "Are you sure you want to delete",
|
||||
"and_contents": "and all its contents",
|
||||
"no_undo": "This action cannot be undone"
|
||||
"no_undo": "This action cannot be undone",
|
||||
"share_file": "Share File",
|
||||
"existing_shares": "Existing Shares",
|
||||
"share_options": "Share Options",
|
||||
"password": "Password",
|
||||
"expiration": "Expiration",
|
||||
"permissions": "Permissions",
|
||||
"generated_link": "Generated Link",
|
||||
"notify": "Send Notification",
|
||||
"recipient": "Recipient",
|
||||
"message": "Message"
|
||||
},
|
||||
"dropzone": {
|
||||
"drag_files": "Drag files here or click to select",
|
||||
"drop_files": "Drop files to upload"
|
||||
},
|
||||
"permissions": {
|
||||
"read": "Read",
|
||||
"write": "Write",
|
||||
"reshare": "Reshare"
|
||||
},
|
||||
"errors": {
|
||||
"file_not_found": "File not found",
|
||||
"folder_not_found": "Folder not found",
|
||||
|
||||
+86
-2
@@ -10,6 +10,71 @@
|
||||
"favorites": "Favoritos",
|
||||
"trash": "Papelera"
|
||||
},
|
||||
"share": {
|
||||
"dialogTitle": "Compartir Enlace",
|
||||
"linkLabel": "Enlace compartido:",
|
||||
"copyLink": "Copiar",
|
||||
"permissions": "Permisos:",
|
||||
"permissionRead": "Lectura",
|
||||
"permissionWrite": "Escritura",
|
||||
"permissionReshare": "Recompartir",
|
||||
"password": "Protección con contraseña:",
|
||||
"generatePassword": "Generar",
|
||||
"expiration": "Fecha de caducidad:",
|
||||
"update": "Actualizar compartido",
|
||||
"remove": "Eliminar compartido",
|
||||
"notifyTitle": "Enviar notificación",
|
||||
"notifyEmailLabel": "Dirección de correo:",
|
||||
"notifyMessageLabel": "Mensaje (opcional):",
|
||||
"notifySend": "Enviar notificación",
|
||||
"shareWithOthers": "Compartir con otros",
|
||||
"sharePublicly": "Compartir públicamente",
|
||||
"shareSettings": "Configuración de compartido",
|
||||
"shareCopied": "Enlace copiado al portapapeles",
|
||||
"shareCreated": "Enlace compartido creado correctamente",
|
||||
"shareUpdated": "Configuración de compartido actualizada",
|
||||
"shareRemoved": "Compartido eliminado correctamente"
|
||||
},
|
||||
"shared": {
|
||||
"backToFiles": "Volver a Archivos",
|
||||
"pageTitle": "Recursos Compartidos",
|
||||
"pageDescription": "Administra tus archivos y carpetas compartidos",
|
||||
"filterType": "Tipo:",
|
||||
"filterAll": "Todos",
|
||||
"filterFiles": "Archivos",
|
||||
"filterFolders": "Carpetas",
|
||||
"sortBy": "Ordenar por:",
|
||||
"sortByName": "Nombre",
|
||||
"sortByDate": "Fecha compartido",
|
||||
"sortByExpiration": "Caducidad",
|
||||
"search": "Buscar",
|
||||
"colName": "Nombre",
|
||||
"colType": "Tipo",
|
||||
"colDateShared": "Fecha compartido",
|
||||
"colExpiration": "Caducidad",
|
||||
"colPermissions": "Permisos",
|
||||
"colPassword": "Contraseña",
|
||||
"colActions": "Acciones",
|
||||
"emptyStateTitle": "Aún no hay recursos compartidos",
|
||||
"emptyStateDesc": "Cuando compartas archivos o carpetas, aparecerán aquí",
|
||||
"goToFiles": "Ir a Archivos",
|
||||
"typeFile": "Archivo",
|
||||
"typeFolder": "Carpeta",
|
||||
"noExpiration": "Sin caducidad",
|
||||
"hasPassword": "Sí",
|
||||
"noPassword": "No",
|
||||
"editShare": "Editar compartido",
|
||||
"notifyShare": "Notificar a alguien",
|
||||
"copyLink": "Copiar enlace",
|
||||
"removeShare": "Eliminar compartido",
|
||||
"linkCopied": "¡Enlace copiado al portapapeles!",
|
||||
"linkCopyFailed": "Error al copiar el enlace",
|
||||
"itemUpdated": "Configuración de compartido actualizada",
|
||||
"itemRemoved": "Compartido eliminado correctamente",
|
||||
"invalidEmail": "Por favor, introduce una dirección de correo válida",
|
||||
"notificationSent": "Notificación enviada correctamente",
|
||||
"notificationFailed": "Error al enviar la notificación"
|
||||
},
|
||||
"actions": {
|
||||
"search": "Buscar archivos...",
|
||||
"new_folder": "Nueva carpeta",
|
||||
@@ -19,7 +84,11 @@
|
||||
"move_to": "Mover a",
|
||||
"delete": "Eliminar",
|
||||
"cancel": "Cancelar",
|
||||
"confirm": "Confirmar"
|
||||
"confirm": "Confirmar",
|
||||
"share": "Compartir",
|
||||
"copy": "Copiar",
|
||||
"notify": "Notificar",
|
||||
"send": "Enviar"
|
||||
},
|
||||
"files": {
|
||||
"name": "Nombre",
|
||||
@@ -47,12 +116,27 @@
|
||||
"root": "Raíz",
|
||||
"delete_confirmation": "¿Estás seguro de que quieres eliminar",
|
||||
"and_contents": "y todo su contenido",
|
||||
"no_undo": "Esta acción no se puede deshacer"
|
||||
"no_undo": "Esta acción no se puede deshacer",
|
||||
"share_file": "Compartir Archivo",
|
||||
"existing_shares": "Compartidos Existentes",
|
||||
"share_options": "Opciones de Compartición",
|
||||
"password": "Contraseña",
|
||||
"expiration": "Caducidad",
|
||||
"permissions": "Permisos",
|
||||
"generated_link": "Enlace Generado",
|
||||
"notify": "Enviar Notificación",
|
||||
"recipient": "Destinatario",
|
||||
"message": "Mensaje"
|
||||
},
|
||||
"dropzone": {
|
||||
"drag_files": "Arrastra archivos aquí o haz clic para seleccionar",
|
||||
"drop_files": "Suelta los archivos para subirlos"
|
||||
},
|
||||
"permissions": {
|
||||
"read": "Lectura",
|
||||
"write": "Escritura",
|
||||
"reshare": "Recompartir"
|
||||
},
|
||||
"errors": {
|
||||
"file_not_found": "Archivo no encontrado",
|
||||
"folder_not_found": "Carpeta no encontrada",
|
||||
|
||||
@@ -0,0 +1,196 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>OxiCloud - Shared Resources</title>
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
<link rel="icon" href="/favicon.ico" type="image/x-icon">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<div class="header-container">
|
||||
<a href="/" class="logo-container">
|
||||
<img src="/oxicloud-logo.svg" alt="OxiCloud Logo" class="logo">
|
||||
<h1>OxiCloud</h1>
|
||||
</a>
|
||||
<div class="header-actions">
|
||||
<div class="language-selector">
|
||||
<select id="language-selector">
|
||||
<option value="en">English</option>
|
||||
<option value="es">Español</option>
|
||||
</select>
|
||||
</div>
|
||||
<button id="go-to-files" class="header-button">
|
||||
<span data-i18n="shared_backToFiles">Back to Files</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="shared-page-container">
|
||||
<div class="shared-header">
|
||||
<h2 data-i18n="shared_pageTitle">Shared Resources</h2>
|
||||
<p data-i18n="shared_pageDescription">Manage your shared files and folders</p>
|
||||
</div>
|
||||
|
||||
<div class="shared-filters">
|
||||
<div class="filter-group">
|
||||
<label for="filter-type" data-i18n="shared_filterType">Type:</label>
|
||||
<select id="filter-type">
|
||||
<option value="all" data-i18n="shared_filterAll">All</option>
|
||||
<option value="file" data-i18n="shared_filterFiles">Files</option>
|
||||
<option value="folder" data-i18n="shared_filterFolders">Folders</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="filter-group">
|
||||
<label for="sort-by" data-i18n="shared_sortBy">Sort by:</label>
|
||||
<select id="sort-by">
|
||||
<option value="name" data-i18n="shared_sortByName">Name</option>
|
||||
<option value="date" data-i18n="shared_sortByDate">Date shared</option>
|
||||
<option value="expiration" data-i18n="shared_sortByExpiration">Expiration</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="search-box">
|
||||
<input type="text" id="shared-search" placeholder="Search shared items...">
|
||||
<button id="shared-search-btn"><span data-i18n="shared_search">Search</span></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="shared-list-container">
|
||||
<table class="shared-list">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-i18n="shared_colName">Name</th>
|
||||
<th data-i18n="shared_colType">Type</th>
|
||||
<th data-i18n="shared_colDateShared">Date Shared</th>
|
||||
<th data-i18n="shared_colExpiration">Expiration</th>
|
||||
<th data-i18n="shared_colPermissions">Permissions</th>
|
||||
<th data-i18n="shared_colPassword">Password</th>
|
||||
<th data-i18n="shared_colActions">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="shared-items-list">
|
||||
<!-- Shared items will be loaded here dynamically -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div id="empty-shared-state" class="empty-state" style="display:none;">
|
||||
<div class="empty-state-icon">📂</div>
|
||||
<h3 data-i18n="shared_emptyStateTitle">No shared resources yet</h3>
|
||||
<p data-i18n="shared_emptyStateDesc">When you share files or folders, they will appear here</p>
|
||||
<a href="/" class="button primary" data-i18n="shared_goToFiles">Go to Files</a>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- Share Link Dialog (for editing existing shares) -->
|
||||
<div id="share-dialog" class="dialog">
|
||||
<div class="dialog-content">
|
||||
<div class="dialog-header">
|
||||
<h3 data-i18n="share_dialogTitle">Share Link</h3>
|
||||
<button class="close-dialog-btn">×</button>
|
||||
</div>
|
||||
<div class="dialog-body">
|
||||
<div class="share-item-info">
|
||||
<span id="share-dialog-icon" class="item-icon">📄</span>
|
||||
<span id="share-dialog-name" class="item-name">filename.ext</span>
|
||||
</div>
|
||||
|
||||
<div class="share-link-section">
|
||||
<label for="share-link-url" data-i18n="share_linkLabel">Share Link:</label>
|
||||
<div class="share-link-container">
|
||||
<input type="text" id="share-link-url" readonly>
|
||||
<button id="copy-link-btn" data-i18n="share_copyLink">Copy</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="share-settings">
|
||||
<div class="share-setting">
|
||||
<label data-i18n="share_permissions">Permissions:</label>
|
||||
<div class="permissions-options">
|
||||
<label>
|
||||
<input type="checkbox" id="permission-read" checked>
|
||||
<span data-i18n="share_permissionRead">Read</span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="checkbox" id="permission-write">
|
||||
<span data-i18n="share_permissionWrite">Write</span>
|
||||
</label>
|
||||
<label>
|
||||
<input type="checkbox" id="permission-reshare">
|
||||
<span data-i18n="share_permissionReshare">Reshare</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="share-setting">
|
||||
<label for="share-password" data-i18n="share_password">Password Protection:</label>
|
||||
<div class="password-setting">
|
||||
<input type="checkbox" id="enable-password">
|
||||
<input type="password" id="share-password" placeholder="Enter password" disabled>
|
||||
<button id="generate-password" data-i18n="share_generatePassword">Generate</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="share-setting">
|
||||
<label for="share-expiration" data-i18n="share_expiration">Expiration Date:</label>
|
||||
<div class="expiration-setting">
|
||||
<input type="checkbox" id="enable-expiration">
|
||||
<input type="date" id="share-expiration" disabled>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="share-actions">
|
||||
<button id="update-share-btn" class="button primary" data-i18n="share_update">Update Share</button>
|
||||
<button id="remove-share-btn" class="button danger" data-i18n="share_remove">Remove Share</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Email Notification Dialog -->
|
||||
<div id="share-notification-dialog" class="dialog">
|
||||
<div class="dialog-content">
|
||||
<div class="dialog-header">
|
||||
<h3 data-i18n="share_notifyTitle">Send Notification</h3>
|
||||
<button class="close-dialog-btn">×</button>
|
||||
</div>
|
||||
<div class="dialog-body">
|
||||
<div class="share-item-info">
|
||||
<span id="notify-dialog-icon" class="item-icon">📄</span>
|
||||
<span id="notify-dialog-name" class="item-name">filename.ext</span>
|
||||
</div>
|
||||
|
||||
<div class="notification-form">
|
||||
<div class="form-group">
|
||||
<label for="notification-email" data-i18n="share_notifyEmailLabel">Email Address:</label>
|
||||
<input type="email" id="notification-email" placeholder="Enter recipient email">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="notification-message" data-i18n="share_notifyMessageLabel">Message (optional):</label>
|
||||
<textarea id="notification-message" placeholder="Add a personal message" rows="3"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="notification-actions">
|
||||
<button id="send-notification-btn" class="button primary" data-i18n="share_notifySend">Send Notification</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Notification Banner -->
|
||||
<div id="notification-banner" class="notification-banner">
|
||||
<span id="notification-message"></span>
|
||||
<button id="close-notification" class="close-notification-btn">×</button>
|
||||
</div>
|
||||
|
||||
<script src="/js/i18n.js"></script>
|
||||
<script src="/js/languageSelector.js"></script>
|
||||
<script src="/js/fileSharing.js"></script>
|
||||
<script src="/js/shared.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user