diff --git a/.github/images/group-mobile.png b/.github/images/group-mobile.png new file mode 100644 index 0000000..1c6cf26 Binary files /dev/null and b/.github/images/group-mobile.png differ diff --git a/.github/images/group.png b/.github/images/group.png new file mode 100644 index 0000000..6add5b0 Binary files /dev/null and b/.github/images/group.png differ diff --git a/.github/images/homepage.png b/.github/images/homepage.png index ad8e9e6..b48204f 100644 Binary files a/.github/images/homepage.png and b/.github/images/homepage.png differ diff --git a/.github/images/imageview.png b/.github/images/imageview.png deleted file mode 100644 index df368e8..0000000 Binary files a/.github/images/imageview.png and /dev/null differ diff --git a/.github/images/photo-mobile.png b/.github/images/photo-mobile.png new file mode 100644 index 0000000..a80f539 Binary files /dev/null and b/.github/images/photo-mobile.png differ diff --git a/.github/images/photo.png b/.github/images/photo.png new file mode 100644 index 0000000..8c93579 Binary files /dev/null and b/.github/images/photo.png differ diff --git a/README.md b/README.md index 7602331..20f5d0e 100644 --- a/README.md +++ b/README.md @@ -32,13 +32,27 @@ And many more planned things! -## screenshots +

Screenshots

+ +
Home Screen -Home-screen ![screenshot](.github/images/homepage.png) -Image view -![screenshot](.github/images/imageview.png) +
+ +
Photo View + +![screenshot](.github/images/photo.png) +![screenshot](.github/images/photo-mobile.png) + +
+
Photo Group + +![screenshot](.github/images/group.png) +![screenshot](.github/images/group-mobile.png) + +
+ ## Running diff --git a/gallery/__init__.py b/gallery/__init__.py index a330404..80f403b 100644 --- a/gallery/__init__.py +++ b/gallery/__init__.py @@ -11,6 +11,7 @@ import logging from flask_compress import Compress from flask_caching import Cache from flask_assets import Environment, Bundle +from flask_login import LoginManager from flask import Flask, render_template, abort from werkzeug.exceptions import HTTPException @@ -19,35 +20,41 @@ import platformdirs from dotenv import load_dotenv from yaml import safe_load -# Utils -from gallery.utils import theme_manager +# Import database +from sqlalchemy.orm import sessionmaker +from gallery import db USER_DIR = platformdirs.user_config_dir('onlylegs') +db_session = sessionmaker(bind=db.engine) +db_session = db_session() +login_manager = LoginManager() +assets = Environment() +cache = Cache(config={'CACHE_TYPE': 'SimpleCache', 'CACHE_DEFAULT_TIMEOUT': 300}) +compress = Compress() + + def create_app(test_config=None): """ Create and configure the main app """ app = Flask(__name__, instance_path=os.path.join(USER_DIR, 'instance')) - assets = Environment() - cache = Cache(config={'CACHE_TYPE': 'SimpleCache', 'CACHE_DEFAULT_TIMEOUT': 300}) - compress = Compress() # Get environment variables load_dotenv(os.path.join(USER_DIR, '.env')) print("Loaded environment variables") # Get config file - with open(os.path.join(USER_DIR, 'conf.yml'), encoding='utf-8') as file: + with open(os.path.join(USER_DIR, 'conf.yml'), encoding='utf-8', mode='r') as file: conf = safe_load(file) - print("Loaded gallery config") + print("Loaded config") # App configuration app.config.from_mapping( SECRET_KEY=os.environ.get('FLASK_SECRET'), - DATABASE=os.path.join(app.instance_path, 'gallery.sqlite'), + DATABASE=os.path.join(app.instance_path, 'gallery.sqlite3'), UPLOAD_FOLDER=os.path.join(USER_DIR, 'uploads'), ALLOWED_EXTENSIONS=conf['upload']['allowed-extensions'], MAX_CONTENT_LENGTH=1024 * 1024 * conf['upload']['max-size'], @@ -59,28 +66,54 @@ def create_app(test_config=None): else: app.config.from_mapping(test_config) - # Load theme - theme_manager.compile_theme('default', app.root_path) + login_manager.init_app(app) + login_manager.login_view = 'gallery.index' + login_manager.session_protection = 'strong' - # Bundle JS files - js_scripts = Bundle('js/*.js', output='gen/packed.js') - assets.register('js_all', js_scripts) + @login_manager.user_loader + def load_user(user_id): + return db_session.query(db.Users).filter_by(alt_id=user_id).first() + + @login_manager.unauthorized_handler + def unauthorized(): + error = 401 + msg = 'You are not authorized to view this page!!!!' + return render_template('error.html', error=error, msg=msg), error + + js_pre = Bundle( + 'js/pre/*.js', + output='gen/pre_packed.js', + depends='js/pre/*.js' + ) + js_post = Bundle( + 'js/post/*.js', + output='gen/post_packed.js', + depends='js/post/*.js' + ) + styles = Bundle( + 'sass/*.sass', + filters='libsass', + output='gen/styles.css', + depends='sass/**/*.sass' + ) + + assets.register('js_pre', js_pre) + assets.register('js_post', js_post) + assets.register('styles', styles) # Error handlers, if the error is not a HTTP error, return 500 @app.errorhandler(Exception) def error_page(err): # noqa if not isinstance(err, HTTPException): abort(500) - return render_template('error.html', - error=err.code, - msg=err.description), err.code + return render_template('error.html', error=err.code, msg=err.description), err.code # Load login, registration and logout manager from gallery import auth app.register_blueprint(auth.blueprint) # Load the different routes - from gallery.routes import api, groups, routing, settings + from gallery.views import api, groups, routing, settings app.register_blueprint(api.blueprint) app.register_blueprint(groups.blueprint) app.register_blueprint(routing.blueprint) diff --git a/gallery/auth.py b/gallery/auth.py index 0518a60..36e1bc7 100644 --- a/gallery/auth.py +++ b/gallery/auth.py @@ -3,17 +3,14 @@ OnlyLegs - Authentication User registration, login and logout and locking access to pages behind a login """ import re -import uuid import logging -from datetime import datetime as dt -import functools -from flask import Blueprint, flash, g, redirect, request, session, url_for, abort, jsonify +from flask import Blueprint, flash, redirect, request, url_for, abort, jsonify from werkzeug.security import check_password_hash, generate_password_hash -from sqlalchemy.orm import sessionmaker -from sqlalchemy import exc +from flask_login import login_user, logout_user, login_required +from sqlalchemy.orm import sessionmaker from gallery import db @@ -22,42 +19,31 @@ db_session = sessionmaker(bind=db.engine) db_session = db_session() -def login_required(view): +@blueprint.route('/login', methods=['POST']) +def login(): """ - Decorator to check if a user is logged in before accessing a page + Log in a registered user by adding the user id to the session """ - @functools.wraps(view) - def wrapped_view(**kwargs): - if g.user is None or session.get('uuid') is None: - logging.error('Authentication failed') - session.clear() - return redirect(url_for('gallery.index')) + error = [] - return view(**kwargs) + username = request.form['username'].strip() + password = request.form['password'].strip() + remember = bool(request.form['remember-me']) - return wrapped_view + user = db_session.query(db.Users).filter_by(username=username).first() + if not user or not check_password_hash(user.password, password): + logging.error('Login attempt from %s', request.remote_addr) + error.append('Username or Password is incorrect!') -@blueprint.before_app_request -def load_logged_in_user(): - """ - Runs before every request and checks if a user is logged in - """ - user_id = session.get('user_id') - user_uuid = session.get('uuid') + if error: + abort(403) - if user_id is None or user_uuid is None: - g.user = None - session.clear() - else: - is_alive = db_session.query(db.Sessions).filter_by(session_uuid=user_uuid).first() + login_user(user, remember=remember) - if is_alive is None: - logging.info('Session expired') - flash(['Session expired!', '3']) - session.clear() - else: - g.user = db_session.query(db.Users).filter_by(id=user_id).first() + logging.info('User %s logged in from %s', username, request.remote_addr) + flash(['Logged in successfully!', '4']) + return 'ok', 200 @blueprint.route('/register', methods=['POST']) @@ -65,17 +51,18 @@ def register(): """ Register a new user """ + error = [] + # Thanks Fennec for reminding me to strip out the whitespace lol username = request.form['username'].strip() email = request.form['email'].strip() password = request.form['password'].strip() password_repeat = request.form['password-repeat'].strip() - error = [] - email_regex = re.compile(r'\b[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Z|a-z]{2,}\b') username_regex = re.compile(r'\b[A-Za-z0-9._-]+\b') + # Validate the form if not username or not username_regex.match(username): error.append('Username is invalid!') @@ -92,77 +79,30 @@ def register(): elif password_repeat != password: error.append('Passwords do not match!') - if error: - return jsonify(error) + user_exists = db_session.query(db.Users).filter_by(username=username).first() + if user_exists: + error.append('User already exists!') - try: - register_user = db.Users(username=username, - email=email, - password=generate_password_hash(password), - created_at=dt.utcnow()) - db_session.add(register_user) - db_session.commit() - except exc.IntegrityError: - return f'User {username} is already registered!' - except Exception as err: - logging.error('User %s could not be registered: %s', username, err) - return 'Something went wrong!' + # If there are errors, return them + if error: + print(error) + return jsonify(error), 400 + + register_user = db.Users(username=username, email=email, + password=generate_password_hash(password, method='sha256')) + db_session.add(register_user) + db_session.commit() logging.info('User %s registered', username) - return 'gwa gwa' - - -@blueprint.route('/login', methods=['POST']) -def login(): - """ - Log in a registered user by adding the user id to the session - """ - username = request.form['username'].strip() - password = request.form['password'].strip() - - user = db_session.query(db.Users).filter_by(username=username).first() - error = [] - - if user is None: - logging.error('User %s does not exist. Login attempt from %s', - username, request.remote_addr) - error.append('Username or Password is incorrect!') - elif not check_password_hash(user.password, password): - logging.error('User %s entered wrong password. Login attempt from %s', - username, request.remote_addr) - error.append('Username or Password is incorrect!') - - if error: - abort(403) - - try: - session.clear() - session['user_id'] = user.id - session['uuid'] = str(uuid.uuid4()) - - session_query = db.Sessions(user_id=user.id, - session_uuid=session.get('uuid'), - ip_address=request.remote_addr, - user_agent=request.user_agent.string, - active=True, - created_at=dt.utcnow()) - - db_session.add(session_query) - db_session.commit() - except Exception as err: - logging.error('User %s could not be logged in: %s', username, err) - abort(500) - - logging.info('User %s logged in from %s', username, request.remote_addr) - flash(['Logged in successfully!', '4']) - return 'gwa gwa' + return 'ok', 200 @blueprint.route('/logout') +@login_required def logout(): """ Clear the current session, including the stored user id """ - logging.info('User (%s) %s logged out', session.get('user_id'), g.user.username) - session.clear() + logout_user() + flash(['Goodbye!!!', '4']) return redirect(url_for('gallery.index')) diff --git a/gallery/db.py b/gallery/db.py index bb85dc6..d916bd7 100644 --- a/gallery/db.py +++ b/gallery/db.py @@ -1,16 +1,18 @@ """ -OnlyLegs - Database models and functions for SQLAlchemy +OnlyLegs - Database models and ions for SQLAlchemy """ +from uuid import uuid4 import os import platformdirs -from sqlalchemy import ( - create_engine, Column, Integer, String, Boolean, DateTime, ForeignKey, PickleType) +from sqlalchemy import (create_engine, Column, Integer, String, + DateTime, ForeignKey, PickleType, func) from sqlalchemy.orm import declarative_base, relationship +from flask_login import UserMixin USER_DIR = platformdirs.user_config_dir('onlylegs') -DB_PATH = os.path.join(USER_DIR, 'gallery.sqlite') +DB_PATH = os.path.join(USER_DIR, 'instance', 'gallery.sqlite3') # In the future, I want to add support for other databases @@ -18,24 +20,29 @@ engine = create_engine(f'sqlite:///{DB_PATH}', echo=False) base = declarative_base() -class Users (base): # pylint: disable=too-few-public-methods, C0103 +class Users (base, UserMixin): # pylint: disable=too-few-public-methods, C0103 """ User table Joins with post, groups, session and log """ __tablename__ = 'users' + # Gallery used information id = Column(Integer, primary_key=True) + alt_id = Column(String, unique=True, nullable=False, default=str(uuid4())) + profile_picture = Column(String, nullable=True, default=None) username = Column(String, unique=True, nullable=False) email = Column(String, unique=True, nullable=False) password = Column(String, nullable=False) - created_at = Column(DateTime, nullable=False) + joined_at = Column(DateTime, nullable=False, server_default=func.now()) # pylint: disable=E1102 posts = relationship('Posts', backref='users') groups = relationship('Groups', backref='users') - session = relationship('Sessions', backref='users') log = relationship('Logs', backref='users') + def get_id(self): + return str(self.alt_id) + class Posts (base): # pylint: disable=too-few-public-methods, C0103 """ @@ -46,20 +53,16 @@ class Posts (base): # pylint: disable=too-few-public-methods, C0103 id = Column(Integer, primary_key=True) author_id = Column(Integer, ForeignKey('users.id')) - created_at = Column(DateTime, nullable=False) - - file_name = Column(String, unique=True, nullable=False) - file_type = Column(String, nullable=False) - - image_exif = Column(PickleType, nullable=False) - image_colours = Column(PickleType, nullable=False) - - post_description = Column(String, nullable=False) - post_alt = Column(String, nullable=False) + created_at = Column(DateTime, nullable=False, server_default=func.now()) # pylint: disable=E1102 + filename = Column(String, unique=True, nullable=False) + mimetype = Column(String, nullable=False) + exif = Column(PickleType, nullable=False) + colours = Column(PickleType, nullable=False) + description = Column(String, nullable=False) + alt = Column(String, nullable=False) junction = relationship('GroupJunction', backref='posts') - class Groups (base): # pylint: disable=too-few-public-methods, C0103 """ Group table @@ -71,7 +74,7 @@ class Groups (base): # pylint: disable=too-few-public-methods, C0103 name = Column(String, nullable=False) description = Column(String, nullable=False) author_id = Column(Integer, ForeignKey('users.id')) - created_at = Column(DateTime, nullable=False) + created_at = Column(DateTime, nullable=False, server_default=func.now()) # pylint: disable=E1102 junction = relationship('GroupJunction', backref='groups') @@ -84,27 +87,11 @@ class GroupJunction (base): # pylint: disable=too-few-public-methods, C0103 __tablename__ = 'group_junction' id = Column(Integer, primary_key=True) - date_added = Column(DateTime, nullable=False) + date_added = Column(DateTime, nullable=False, server_default=func.now()) # pylint: disable=E1102 group_id = Column(Integer, ForeignKey('groups.id')) post_id = Column(Integer, ForeignKey('posts.id')) -class Sessions (base): # pylint: disable=too-few-public-methods, C0103 - """ - Session table - Joins with user - """ - __tablename__ = 'sessions' - - id = Column(Integer, primary_key=True) - user_id = Column(Integer, ForeignKey('users.id')) - session_uuid = Column(String, nullable=False) - ip_address = Column(String, nullable=False) - user_agent = Column(String, nullable=False) - active = Column(Boolean, nullable=False) - created_at = Column(DateTime, nullable=False) - - class Logs (base): # pylint: disable=too-few-public-methods, C0103 """ Log table @@ -116,8 +103,8 @@ class Logs (base): # pylint: disable=too-few-public-methods, C0103 user_id = Column(Integer, ForeignKey('users.id')) ip_address = Column(String, nullable=False) code = Column(Integer, nullable=False) - msg = Column(String, nullable=False) - created_at = Column(DateTime, nullable=False) + note = Column(String, nullable=False) + created_at = Column(DateTime, nullable=False, server_default=func.now()) # pylint: disable=E1102 class Bans (base): # pylint: disable=too-few-public-methods, C0103 @@ -129,8 +116,8 @@ class Bans (base): # pylint: disable=too-few-public-methods, C0103 id = Column(Integer, primary_key=True) ip_address = Column(String, nullable=False) code = Column(Integer, nullable=False) - msg = Column(String, nullable=False) - created_at = Column(DateTime, nullable=False) + note = Column(String, nullable=False) + banned_at = Column(DateTime, nullable=False, server_default=func.now()) # pylint: disable=E1102 # check if database file exists, if not create it diff --git a/gallery/routes/__init__.py b/gallery/routes/__init__.py deleted file mode 100644 index e69de29..0000000 diff --git a/gallery/static/error.png b/gallery/static/error.png index 8f7cc08..2b1b27c 100644 Binary files a/gallery/static/error.png and b/gallery/static/error.png differ diff --git a/gallery/themes/default/fonts/Manrope[wght].ttf b/gallery/static/fonts/Manrope[wght].ttf similarity index 100% rename from gallery/themes/default/fonts/Manrope[wght].ttf rename to gallery/static/fonts/Manrope[wght].ttf diff --git a/gallery/themes/default/fonts/Manrope[wght].woff2 b/gallery/static/fonts/Manrope[wght].woff2 similarity index 100% rename from gallery/themes/default/fonts/Manrope[wght].woff2 rename to gallery/static/fonts/Manrope[wght].woff2 diff --git a/gallery/static/js/jquery-3.6.3.min.js b/gallery/static/js/jquery-3.6.3.min.js deleted file mode 100644 index b5329e9..0000000 --- a/gallery/static/js/jquery-3.6.3.min.js +++ /dev/null @@ -1,2 +0,0 @@ -/*! jQuery v3.6.3 | (c) OpenJS Foundation and other contributors | jquery.org/license */ -!function(e,t){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=e.document?t(e,!0):function(e){if(!e.document)throw new Error("jQuery requires a window with a document");return t(e)}:t(e)}("undefined"!=typeof window?window:this,function(C,e){"use strict";var t=[],r=Object.getPrototypeOf,s=t.slice,g=t.flat?function(e){return t.flat.call(e)}:function(e){return t.concat.apply([],e)},u=t.push,i=t.indexOf,n={},o=n.toString,y=n.hasOwnProperty,a=y.toString,l=a.call(Object),v={},m=function(e){return"function"==typeof e&&"number"!=typeof e.nodeType&&"function"!=typeof e.item},x=function(e){return null!=e&&e===e.window},S=C.document,c={type:!0,src:!0,nonce:!0,noModule:!0};function b(e,t,n){var r,i,o=(n=n||S).createElement("script");if(o.text=e,t)for(r in c)(i=t[r]||t.getAttribute&&t.getAttribute(r))&&o.setAttribute(r,i);n.head.appendChild(o).parentNode.removeChild(o)}function w(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?n[o.call(e)]||"object":typeof e}var f="3.6.3",E=function(e,t){return new E.fn.init(e,t)};function p(e){var t=!!e&&"length"in e&&e.length,n=w(e);return!m(e)&&!x(e)&&("array"===n||0===t||"number"==typeof t&&0+~]|"+M+")"+M+"*"),U=new RegExp(M+"|>"),X=new RegExp(F),V=new RegExp("^"+I+"$"),G={ID:new RegExp("^#("+I+")"),CLASS:new RegExp("^\\.("+I+")"),TAG:new RegExp("^("+I+"|[*])"),ATTR:new RegExp("^"+W),PSEUDO:new RegExp("^"+F),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+M+"*(even|odd|(([+-]|)(\\d*)n|)"+M+"*(?:([+-]|)"+M+"*(\\d+)|))"+M+"*\\)|)","i"),bool:new RegExp("^(?:"+R+")$","i"),needsContext:new RegExp("^"+M+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+M+"*((?:-\\d)?\\d*)"+M+"*\\)|)(?=[^-]|$)","i")},Y=/HTML$/i,Q=/^(?:input|select|textarea|button)$/i,J=/^h\d$/i,K=/^[^{]+\{\s*\[native \w/,Z=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,ee=/[+~]/,te=new RegExp("\\\\[\\da-fA-F]{1,6}"+M+"?|\\\\([^\\r\\n\\f])","g"),ne=function(e,t){var n="0x"+e.slice(1)-65536;return t||(n<0?String.fromCharCode(n+65536):String.fromCharCode(n>>10|55296,1023&n|56320))},re=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,ie=function(e,t){return t?"\0"===e?"\ufffd":e.slice(0,-1)+"\\"+e.charCodeAt(e.length-1).toString(16)+" ":"\\"+e},oe=function(){T()},ae=be(function(e){return!0===e.disabled&&"fieldset"===e.nodeName.toLowerCase()},{dir:"parentNode",next:"legend"});try{H.apply(t=O.call(p.childNodes),p.childNodes),t[p.childNodes.length].nodeType}catch(e){H={apply:t.length?function(e,t){L.apply(e,O.call(t))}:function(e,t){var n=e.length,r=0;while(e[n++]=t[r++]);e.length=n-1}}}function se(t,e,n,r){var i,o,a,s,u,l,c,f=e&&e.ownerDocument,p=e?e.nodeType:9;if(n=n||[],"string"!=typeof t||!t||1!==p&&9!==p&&11!==p)return n;if(!r&&(T(e),e=e||C,S)){if(11!==p&&(u=Z.exec(t)))if(i=u[1]){if(9===p){if(!(a=e.getElementById(i)))return n;if(a.id===i)return n.push(a),n}else if(f&&(a=f.getElementById(i))&&v(e,a)&&a.id===i)return n.push(a),n}else{if(u[2])return H.apply(n,e.getElementsByTagName(t)),n;if((i=u[3])&&d.getElementsByClassName&&e.getElementsByClassName)return H.apply(n,e.getElementsByClassName(i)),n}if(d.qsa&&!N[t+" "]&&(!y||!y.test(t))&&(1!==p||"object"!==e.nodeName.toLowerCase())){if(c=t,f=e,1===p&&(U.test(t)||z.test(t))){(f=ee.test(t)&&ve(e.parentNode)||e)===e&&d.scope||((s=e.getAttribute("id"))?s=s.replace(re,ie):e.setAttribute("id",s=E)),o=(l=h(t)).length;while(o--)l[o]=(s?"#"+s:":scope")+" "+xe(l[o]);c=l.join(",")}try{if(d.cssSupportsSelector&&!CSS.supports("selector(:is("+c+"))"))throw new Error;return H.apply(n,f.querySelectorAll(c)),n}catch(e){N(t,!0)}finally{s===E&&e.removeAttribute("id")}}}return g(t.replace(B,"$1"),e,n,r)}function ue(){var r=[];return function e(t,n){return r.push(t+" ")>b.cacheLength&&delete e[r.shift()],e[t+" "]=n}}function le(e){return e[E]=!0,e}function ce(e){var t=C.createElement("fieldset");try{return!!e(t)}catch(e){return!1}finally{t.parentNode&&t.parentNode.removeChild(t),t=null}}function fe(e,t){var n=e.split("|"),r=n.length;while(r--)b.attrHandle[n[r]]=t}function pe(e,t){var n=t&&e,r=n&&1===e.nodeType&&1===t.nodeType&&e.sourceIndex-t.sourceIndex;if(r)return r;if(n)while(n=n.nextSibling)if(n===t)return-1;return e?1:-1}function de(t){return function(e){return"input"===e.nodeName.toLowerCase()&&e.type===t}}function he(n){return function(e){var t=e.nodeName.toLowerCase();return("input"===t||"button"===t)&&e.type===n}}function ge(t){return function(e){return"form"in e?e.parentNode&&!1===e.disabled?"label"in e?"label"in e.parentNode?e.parentNode.disabled===t:e.disabled===t:e.isDisabled===t||e.isDisabled!==!t&&ae(e)===t:e.disabled===t:"label"in e&&e.disabled===t}}function ye(a){return le(function(o){return o=+o,le(function(e,t){var n,r=a([],e.length,o),i=r.length;while(i--)e[n=r[i]]&&(e[n]=!(t[n]=e[n]))})})}function ve(e){return e&&"undefined"!=typeof e.getElementsByTagName&&e}for(e in d=se.support={},i=se.isXML=function(e){var t=e&&e.namespaceURI,n=e&&(e.ownerDocument||e).documentElement;return!Y.test(t||n&&n.nodeName||"HTML")},T=se.setDocument=function(e){var t,n,r=e?e.ownerDocument||e:p;return r!=C&&9===r.nodeType&&r.documentElement&&(a=(C=r).documentElement,S=!i(C),p!=C&&(n=C.defaultView)&&n.top!==n&&(n.addEventListener?n.addEventListener("unload",oe,!1):n.attachEvent&&n.attachEvent("onunload",oe)),d.scope=ce(function(e){return a.appendChild(e).appendChild(C.createElement("div")),"undefined"!=typeof e.querySelectorAll&&!e.querySelectorAll(":scope fieldset div").length}),d.cssSupportsSelector=ce(function(){return CSS.supports("selector(*)")&&C.querySelectorAll(":is(:jqfake)")&&!CSS.supports("selector(:is(*,:jqfake))")}),d.attributes=ce(function(e){return e.className="i",!e.getAttribute("className")}),d.getElementsByTagName=ce(function(e){return e.appendChild(C.createComment("")),!e.getElementsByTagName("*").length}),d.getElementsByClassName=K.test(C.getElementsByClassName),d.getById=ce(function(e){return a.appendChild(e).id=E,!C.getElementsByName||!C.getElementsByName(E).length}),d.getById?(b.filter.ID=function(e){var t=e.replace(te,ne);return function(e){return e.getAttribute("id")===t}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&S){var n=t.getElementById(e);return n?[n]:[]}}):(b.filter.ID=function(e){var n=e.replace(te,ne);return function(e){var t="undefined"!=typeof e.getAttributeNode&&e.getAttributeNode("id");return t&&t.value===n}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&S){var n,r,i,o=t.getElementById(e);if(o){if((n=o.getAttributeNode("id"))&&n.value===e)return[o];i=t.getElementsByName(e),r=0;while(o=i[r++])if((n=o.getAttributeNode("id"))&&n.value===e)return[o]}return[]}}),b.find.TAG=d.getElementsByTagName?function(e,t){return"undefined"!=typeof t.getElementsByTagName?t.getElementsByTagName(e):d.qsa?t.querySelectorAll(e):void 0}:function(e,t){var n,r=[],i=0,o=t.getElementsByTagName(e);if("*"===e){while(n=o[i++])1===n.nodeType&&r.push(n);return r}return o},b.find.CLASS=d.getElementsByClassName&&function(e,t){if("undefined"!=typeof t.getElementsByClassName&&S)return t.getElementsByClassName(e)},s=[],y=[],(d.qsa=K.test(C.querySelectorAll))&&(ce(function(e){var t;a.appendChild(e).innerHTML="",e.querySelectorAll("[msallowcapture^='']").length&&y.push("[*^$]="+M+"*(?:''|\"\")"),e.querySelectorAll("[selected]").length||y.push("\\["+M+"*(?:value|"+R+")"),e.querySelectorAll("[id~="+E+"-]").length||y.push("~="),(t=C.createElement("input")).setAttribute("name",""),e.appendChild(t),e.querySelectorAll("[name='']").length||y.push("\\["+M+"*name"+M+"*="+M+"*(?:''|\"\")"),e.querySelectorAll(":checked").length||y.push(":checked"),e.querySelectorAll("a#"+E+"+*").length||y.push(".#.+[+~]"),e.querySelectorAll("\\\f"),y.push("[\\r\\n\\f]")}),ce(function(e){e.innerHTML="";var t=C.createElement("input");t.setAttribute("type","hidden"),e.appendChild(t).setAttribute("name","D"),e.querySelectorAll("[name=d]").length&&y.push("name"+M+"*[*^$|!~]?="),2!==e.querySelectorAll(":enabled").length&&y.push(":enabled",":disabled"),a.appendChild(e).disabled=!0,2!==e.querySelectorAll(":disabled").length&&y.push(":enabled",":disabled"),e.querySelectorAll("*,:x"),y.push(",.*:")})),(d.matchesSelector=K.test(c=a.matches||a.webkitMatchesSelector||a.mozMatchesSelector||a.oMatchesSelector||a.msMatchesSelector))&&ce(function(e){d.disconnectedMatch=c.call(e,"*"),c.call(e,"[s!='']:x"),s.push("!=",F)}),d.cssSupportsSelector||y.push(":has"),y=y.length&&new RegExp(y.join("|")),s=s.length&&new RegExp(s.join("|")),t=K.test(a.compareDocumentPosition),v=t||K.test(a.contains)?function(e,t){var n=9===e.nodeType&&e.documentElement||e,r=t&&t.parentNode;return e===r||!(!r||1!==r.nodeType||!(n.contains?n.contains(r):e.compareDocumentPosition&&16&e.compareDocumentPosition(r)))}:function(e,t){if(t)while(t=t.parentNode)if(t===e)return!0;return!1},j=t?function(e,t){if(e===t)return l=!0,0;var n=!e.compareDocumentPosition-!t.compareDocumentPosition;return n||(1&(n=(e.ownerDocument||e)==(t.ownerDocument||t)?e.compareDocumentPosition(t):1)||!d.sortDetached&&t.compareDocumentPosition(e)===n?e==C||e.ownerDocument==p&&v(p,e)?-1:t==C||t.ownerDocument==p&&v(p,t)?1:u?P(u,e)-P(u,t):0:4&n?-1:1)}:function(e,t){if(e===t)return l=!0,0;var n,r=0,i=e.parentNode,o=t.parentNode,a=[e],s=[t];if(!i||!o)return e==C?-1:t==C?1:i?-1:o?1:u?P(u,e)-P(u,t):0;if(i===o)return pe(e,t);n=e;while(n=n.parentNode)a.unshift(n);n=t;while(n=n.parentNode)s.unshift(n);while(a[r]===s[r])r++;return r?pe(a[r],s[r]):a[r]==p?-1:s[r]==p?1:0}),C},se.matches=function(e,t){return se(e,null,null,t)},se.matchesSelector=function(e,t){if(T(e),d.matchesSelector&&S&&!N[t+" "]&&(!s||!s.test(t))&&(!y||!y.test(t)))try{var n=c.call(e,t);if(n||d.disconnectedMatch||e.document&&11!==e.document.nodeType)return n}catch(e){N(t,!0)}return 0":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(e){return e[1]=e[1].replace(te,ne),e[3]=(e[3]||e[4]||e[5]||"").replace(te,ne),"~="===e[2]&&(e[3]=" "+e[3]+" "),e.slice(0,4)},CHILD:function(e){return e[1]=e[1].toLowerCase(),"nth"===e[1].slice(0,3)?(e[3]||se.error(e[0]),e[4]=+(e[4]?e[5]+(e[6]||1):2*("even"===e[3]||"odd"===e[3])),e[5]=+(e[7]+e[8]||"odd"===e[3])):e[3]&&se.error(e[0]),e},PSEUDO:function(e){var t,n=!e[6]&&e[2];return G.CHILD.test(e[0])?null:(e[3]?e[2]=e[4]||e[5]||"":n&&X.test(n)&&(t=h(n,!0))&&(t=n.indexOf(")",n.length-t)-n.length)&&(e[0]=e[0].slice(0,t),e[2]=n.slice(0,t)),e.slice(0,3))}},filter:{TAG:function(e){var t=e.replace(te,ne).toLowerCase();return"*"===e?function(){return!0}:function(e){return e.nodeName&&e.nodeName.toLowerCase()===t}},CLASS:function(e){var t=m[e+" "];return t||(t=new RegExp("(^|"+M+")"+e+"("+M+"|$)"))&&m(e,function(e){return t.test("string"==typeof e.className&&e.className||"undefined"!=typeof e.getAttribute&&e.getAttribute("class")||"")})},ATTR:function(n,r,i){return function(e){var t=se.attr(e,n);return null==t?"!="===r:!r||(t+="","="===r?t===i:"!="===r?t!==i:"^="===r?i&&0===t.indexOf(i):"*="===r?i&&-1:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i;function j(e,n,r){return m(n)?E.grep(e,function(e,t){return!!n.call(e,t,e)!==r}):n.nodeType?E.grep(e,function(e){return e===n!==r}):"string"!=typeof n?E.grep(e,function(e){return-1)[^>]*|#([\w-]+))$/;(E.fn.init=function(e,t,n){var r,i;if(!e)return this;if(n=n||D,"string"==typeof e){if(!(r="<"===e[0]&&">"===e[e.length-1]&&3<=e.length?[null,e,null]:q.exec(e))||!r[1]&&t)return!t||t.jquery?(t||n).find(e):this.constructor(t).find(e);if(r[1]){if(t=t instanceof E?t[0]:t,E.merge(this,E.parseHTML(r[1],t&&t.nodeType?t.ownerDocument||t:S,!0)),N.test(r[1])&&E.isPlainObject(t))for(r in t)m(this[r])?this[r](t[r]):this.attr(r,t[r]);return this}return(i=S.getElementById(r[2]))&&(this[0]=i,this.length=1),this}return e.nodeType?(this[0]=e,this.length=1,this):m(e)?void 0!==n.ready?n.ready(e):e(E):E.makeArray(e,this)}).prototype=E.fn,D=E(S);var L=/^(?:parents|prev(?:Until|All))/,H={children:!0,contents:!0,next:!0,prev:!0};function O(e,t){while((e=e[t])&&1!==e.nodeType);return e}E.fn.extend({has:function(e){var t=E(e,this),n=t.length;return this.filter(function(){for(var e=0;e\x20\t\r\n\f]*)/i,he=/^$|^module$|\/(?:java|ecma)script/i;ce=S.createDocumentFragment().appendChild(S.createElement("div")),(fe=S.createElement("input")).setAttribute("type","radio"),fe.setAttribute("checked","checked"),fe.setAttribute("name","t"),ce.appendChild(fe),v.checkClone=ce.cloneNode(!0).cloneNode(!0).lastChild.checked,ce.innerHTML="",v.noCloneChecked=!!ce.cloneNode(!0).lastChild.defaultValue,ce.innerHTML="",v.option=!!ce.lastChild;var ge={thead:[1,"","
"],col:[2,"","
"],tr:[2,"","
"],td:[3,"","
"],_default:[0,"",""]};function ye(e,t){var n;return n="undefined"!=typeof e.getElementsByTagName?e.getElementsByTagName(t||"*"):"undefined"!=typeof e.querySelectorAll?e.querySelectorAll(t||"*"):[],void 0===t||t&&A(e,t)?E.merge([e],n):n}function ve(e,t){for(var n=0,r=e.length;n",""]);var me=/<|&#?\w+;/;function xe(e,t,n,r,i){for(var o,a,s,u,l,c,f=t.createDocumentFragment(),p=[],d=0,h=e.length;d\s*$/g;function je(e,t){return A(e,"table")&&A(11!==t.nodeType?t:t.firstChild,"tr")&&E(e).children("tbody")[0]||e}function De(e){return e.type=(null!==e.getAttribute("type"))+"/"+e.type,e}function qe(e){return"true/"===(e.type||"").slice(0,5)?e.type=e.type.slice(5):e.removeAttribute("type"),e}function Le(e,t){var n,r,i,o,a,s;if(1===t.nodeType){if(Y.hasData(e)&&(s=Y.get(e).events))for(i in Y.remove(t,"handle events"),s)for(n=0,r=s[i].length;n").attr(n.scriptAttrs||{}).prop({charset:n.scriptCharset,src:n.url}).on("load error",i=function(e){r.remove(),i=null,e&&t("error"===e.type?404:200,e.type)}),S.head.appendChild(r[0])},abort:function(){i&&i()}}});var Ut,Xt=[],Vt=/(=)\?(?=&|$)|\?\?/;E.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var e=Xt.pop()||E.expando+"_"+Ct.guid++;return this[e]=!0,e}}),E.ajaxPrefilter("json jsonp",function(e,t,n){var r,i,o,a=!1!==e.jsonp&&(Vt.test(e.url)?"url":"string"==typeof e.data&&0===(e.contentType||"").indexOf("application/x-www-form-urlencoded")&&Vt.test(e.data)&&"data");if(a||"jsonp"===e.dataTypes[0])return r=e.jsonpCallback=m(e.jsonpCallback)?e.jsonpCallback():e.jsonpCallback,a?e[a]=e[a].replace(Vt,"$1"+r):!1!==e.jsonp&&(e.url+=(St.test(e.url)?"&":"?")+e.jsonp+"="+r),e.converters["script json"]=function(){return o||E.error(r+" was not called"),o[0]},e.dataTypes[0]="json",i=C[r],C[r]=function(){o=arguments},n.always(function(){void 0===i?E(C).removeProp(r):C[r]=i,e[r]&&(e.jsonpCallback=t.jsonpCallback,Xt.push(r)),o&&m(i)&&i(o[0]),o=i=void 0}),"script"}),v.createHTMLDocument=((Ut=S.implementation.createHTMLDocument("").body).innerHTML="
",2===Ut.childNodes.length),E.parseHTML=function(e,t,n){return"string"!=typeof e?[]:("boolean"==typeof t&&(n=t,t=!1),t||(v.createHTMLDocument?((r=(t=S.implementation.createHTMLDocument("")).createElement("base")).href=S.location.href,t.head.appendChild(r)):t=S),o=!n&&[],(i=N.exec(e))?[t.createElement(i[1])]:(i=xe([e],t,o),o&&o.length&&E(o).remove(),E.merge([],i.childNodes)));var r,i,o},E.fn.load=function(e,t,n){var r,i,o,a=this,s=e.indexOf(" ");return-1").append(E.parseHTML(e)).find(r):e)}).always(n&&function(e,t){a.each(function(){n.apply(this,o||[e.responseText,t,e])})}),this},E.expr.pseudos.animated=function(t){return E.grep(E.timers,function(e){return t===e.elem}).length},E.offset={setOffset:function(e,t,n){var r,i,o,a,s,u,l=E.css(e,"position"),c=E(e),f={};"static"===l&&(e.style.position="relative"),s=c.offset(),o=E.css(e,"top"),u=E.css(e,"left"),("absolute"===l||"fixed"===l)&&-1<(o+u).indexOf("auto")?(a=(r=c.position()).top,i=r.left):(a=parseFloat(o)||0,i=parseFloat(u)||0),m(t)&&(t=t.call(e,n,E.extend({},s))),null!=t.top&&(f.top=t.top-s.top+a),null!=t.left&&(f.left=t.left-s.left+i),"using"in t?t.using.call(e,f):c.css(f)}},E.fn.extend({offset:function(t){if(arguments.length)return void 0===t?this:this.each(function(e){E.offset.setOffset(this,t,e)});var e,n,r=this[0];return r?r.getClientRects().length?(e=r.getBoundingClientRect(),n=r.ownerDocument.defaultView,{top:e.top+n.pageYOffset,left:e.left+n.pageXOffset}):{top:0,left:0}:void 0},position:function(){if(this[0]){var e,t,n,r=this[0],i={top:0,left:0};if("fixed"===E.css(r,"position"))t=r.getBoundingClientRect();else{t=this.offset(),n=r.ownerDocument,e=r.offsetParent||n.documentElement;while(e&&(e===n.body||e===n.documentElement)&&"static"===E.css(e,"position"))e=e.parentNode;e&&e!==r&&1===e.nodeType&&((i=E(e).offset()).top+=E.css(e,"borderTopWidth",!0),i.left+=E.css(e,"borderLeftWidth",!0))}return{top:t.top-i.top-E.css(r,"marginTop",!0),left:t.left-i.left-E.css(r,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){var e=this.offsetParent;while(e&&"static"===E.css(e,"position"))e=e.offsetParent;return e||re})}}),E.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(t,i){var o="pageYOffset"===i;E.fn[t]=function(e){return B(this,function(e,t,n){var r;if(x(e)?r=e:9===e.nodeType&&(r=e.defaultView),void 0===n)return r?r[i]:e[t];r?r.scrollTo(o?r.pageXOffset:n,o?n:r.pageYOffset):e[t]=n},t,e,arguments.length)}}),E.each(["top","left"],function(e,n){E.cssHooks[n]=_e(v.pixelPosition,function(e,t){if(t)return t=Be(e,n),Pe.test(t)?E(e).position()[n]+"px":t})}),E.each({Height:"height",Width:"width"},function(a,s){E.each({padding:"inner"+a,content:s,"":"outer"+a},function(r,o){E.fn[o]=function(e,t){var n=arguments.length&&(r||"boolean"!=typeof e),i=r||(!0===e||!0===t?"margin":"border");return B(this,function(e,t,n){var r;return x(e)?0===o.indexOf("outer")?e["inner"+a]:e.document.documentElement["client"+a]:9===e.nodeType?(r=e.documentElement,Math.max(e.body["scroll"+a],r["scroll"+a],e.body["offset"+a],r["offset"+a],r["client"+a])):void 0===n?E.css(e,t,i):E.style(e,t,n,i)},s,n?e:void 0,n)}})}),E.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(e,t){E.fn[t]=function(e){return this.on(t,e)}}),E.fn.extend({bind:function(e,t,n){return this.on(e,null,t,n)},unbind:function(e,t){return this.off(e,null,t)},delegate:function(e,t,n,r){return this.on(t,e,n,r)},undelegate:function(e,t,n){return 1===arguments.length?this.off(e,"**"):this.off(t,e||"**",n)},hover:function(e,t){return this.mouseenter(e).mouseleave(t||e)}}),E.each("blur focus focusin focusout resize scroll click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup contextmenu".split(" "),function(e,n){E.fn[n]=function(e,t){return 0 { - if (response.status === 200) { + if (response.ok) { location.reload(); } else { - switch (response.status) { - case 500: - addNotification('Server exploded, F\'s in chat', 2); - break; - case 403: - addNotification('None but devils play past here... Wrong information', 2); - break; - default: - addNotification('Error logging in, blame someone', 2); - break; + if (response.status === 403) { + addNotification('None but devils play past here... Wrong information', 2); + } else if (response.status === 500) { + addNotification('Server exploded, F\'s in chat', 2); + } else { + addNotification('Error logging in, blame someone', 2); } } }).catch(error => { @@ -129,7 +143,7 @@ function showRegister() { registerForm.appendChild(emailInput); registerForm.appendChild(passwordInput); registerForm.appendChild(passwordInputRepeat); - + popUpShow( 'Who are you?', 'Already have an account? Login!', @@ -153,37 +167,33 @@ function register(event) { } // Make form - var formData = new FormData(); + const formData = new FormData(); formData.append("username", formUsername); formData.append("email", formEmail); formData.append("password", formPassword); formData.append("password-repeat", formPasswordRepeat); // Send form to server - fetch('/auth/login', { + fetch('/auth/register', { method: 'POST', body: formData }).then(response => { - if (response.status === 200) { - if (response === "gwa gwa") { - addNotification('Registered successfully! Now please login to continue', 1); - showLogin(); - } else { - for (let i = 0; i < response.length; i++) { - addNotification(response[i], 2); - } - } + if (response.ok) { + addNotification('Registered successfully! Now please login to continue', 1); + showLogin(); } else { - switch (response.status) { - case 500: - addNotification('Server exploded, F\'s in chat', 2); - break; - case 403: - addNotification('None but devils play past here... Wrong information', 2); - break; - default: - addNotification('Error logging in, blame someone', 2); - break; + if (response.status === 400) { + response.json().then(data => { + for (let i = 0; i < data.length; i++) { + addNotification(data[i], 2); + } + }); + } else if (response.status === 403) { + addNotification('None but devils play past here... Wrong information', 2); + } else if (response.status === 500) { + addNotification('Server exploded, F\'s in chat', 2); + } else { + addNotification('Error logging in, blame someone', 2); } } }).catch(error => { diff --git a/gallery/static/js/uploadTab.js b/gallery/static/js/post/uploadTab.js similarity index 61% rename from gallery/static/js/uploadTab.js rename to gallery/static/js/post/uploadTab.js index 3b02eed..6cf4016 100644 --- a/gallery/static/js/uploadTab.js +++ b/gallery/static/js/post/uploadTab.js @@ -141,38 +141,41 @@ function clearUpload() { } -function createJob(file) { - jobContainer = document.createElement("div"); - jobContainer.classList.add("job"); +// function createJob(file) { +// jobContainer = document.createElement("div"); +// jobContainer.classList.add("job"); - jobStatus = document.createElement("span"); - jobStatus.classList.add("job__status"); - jobStatus.innerHTML = "Uploading..."; +// jobStatus = document.createElement("span"); +// jobStatus.classList.add("job__status"); +// jobStatus.innerHTML = "Uploading..."; - jobProgress = document.createElement("span"); - jobProgress.classList.add("progress"); +// jobProgress = document.createElement("span"); +// jobProgress.classList.add("progress"); - jobImg = document.createElement("img"); - jobImg.src = URL.createObjectURL(file); +// jobImg = document.createElement("img"); +// jobImg.src = URL.createObjectURL(file); - jobImgFilter = document.createElement("span"); - jobImgFilter.classList.add("img-filter"); +// jobImgFilter = document.createElement("span"); +// jobImgFilter.classList.add("img-filter"); - jobContainer.appendChild(jobStatus); - jobContainer.appendChild(jobProgress); - jobContainer.appendChild(jobImg); - jobContainer.appendChild(jobImgFilter); +// jobContainer.appendChild(jobStatus); +// jobContainer.appendChild(jobProgress); +// jobContainer.appendChild(jobImg); +// jobContainer.appendChild(jobImgFilter); - return jobContainer; -} +// return jobContainer; +// } -document.addEventListener('DOMContentLoaded', function() { +document.addEventListener('DOMContentLoaded', () => { // Function to upload images let uploadTab = document.querySelector(".upload-panel"); + + if (!uploadTab) { return; } // If upload tab doesn't exist, don't run this code :3 + let uploadTabDrag = uploadTab.querySelector("#dragIndicator"); let uploadForm = uploadTab.querySelector('#uploadForm'); - let jobList = document.querySelector(".upload-jobs"); + // let jobList = document.querySelector(".upload-jobs"); let fileDrop = uploadForm.querySelector('.fileDrop-block'); let fileDropTitle = fileDrop.querySelector('.status'); @@ -225,53 +228,82 @@ document.addEventListener('DOMContentLoaded', function() { formData.append("description", fileDescription.value); formData.append("tags", fileTags.value); - jobItem = createJob(fileUpload.files[0]); - jobStatus = jobItem.querySelector(".job__status"); + // jobItem = createJob(fileUpload.files[0]); + // jobStatus = jobItem.querySelector(".job__status"); // Upload the information - $.ajax({ - url: '/api/upload', - type: 'post', - data: formData, - contentType: false, - processData: false, - beforeSend: function () { - // Add job to list - jobList.appendChild(jobItem); - }, - success: function (response) { - jobItem.classList.add("success"); - jobStatus.innerHTML = "Uploaded successfully"; - if (!document.querySelector(".upload-panel").classList.contains("open")) { - addNotification("Image uploaded successfully", 1); - } - }, - error: function (response) { - jobItem.classList.add("critical"); - switch (response.status) { - case 500: - jobStatus.innerHTML = "Server exploded, F's in chat"; - break; - case 400: - case 404: - jobStatus.innerHTML = "Error uploading. Blame yourself"; - break; - case 403: - jobStatus.innerHTML = "None but devils play past here..."; - break; - case 413: - jobStatus.innerHTML = "File too large!!!!!!"; - break; - default: - jobStatus.innerHTML = "Error uploading file, blame someone"; - break; - } - if (!document.querySelector(".upload-panel").classList.contains("open")) { - addNotification("Error uploading file", 2); - } - }, + // $.ajax({ + // url: '/api/upload', + // type: 'post', + // data: formData, + // contentType: false, + // processData: false, + // beforeSend: function () { + // // Add job to list + // jobList.appendChild(jobItem); + // }, + // success: function (response) { + // jobItem.classList.add("success"); + // jobStatus.innerHTML = "Uploaded successfully"; + // if (!document.querySelector(".upload-panel").classList.contains("open")) { + // addNotification("Image uploaded successfully", 1); + // } + // }, + // error: function (response) { + // jobItem.classList.add("critical"); + // switch (response.status) { + // case 500: + // jobStatus.innerHTML = "Server exploded, F's in chat"; + // break; + // case 400: + // case 404: + // jobStatus.innerHTML = "Error uploading. Blame yourself"; + // break; + // case 403: + // jobStatus.innerHTML = "None but devils play past here..."; + // break; + // case 413: + // jobStatus.innerHTML = "File too large!!!!!!"; + // break; + // default: + // jobStatus.innerHTML = "Error uploading file, blame someone"; + // break; + // } + // if (!document.querySelector(".upload-panel").classList.contains("open")) { + // addNotification("Error uploading file", 2); + // } + // }, + // }); + + + fetch('/api/upload', { + method: 'POST', + body: formData + }) + // .then(response => response.json()) + .then(data => { addNotification("Image uploaded successfully", 1); }) + .catch(error => { + switch (response.status) { + case 500: + addNotification("Server exploded, F's in chat", 2) + break; + case 400: + case 404: + addNotification("Error uploading. Blame yourself", 2) + break; + case 403: + addNotification("None but devils play past here...", 2) + break; + case 413: + addNotification("File too large!!!!!!", 2); + break; + default: + addNotification("Error uploading file, blame someone", 2) + break; + } }); + clearUpload(); // Reset drop diff --git a/gallery/static/js/main.js b/gallery/static/js/pre/main.js similarity index 83% rename from gallery/static/js/main.js rename to gallery/static/js/pre/main.js index d974947..2c75b9e 100644 --- a/gallery/static/js/main.js +++ b/gallery/static/js/pre/main.js @@ -1,16 +1,27 @@ +let webpSupport = false; +try { + new Image().src = 'data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoBAAEAAwA0JaQAA3AA/vuUAAA='; + webpSupport = true; +} catch (e) { + webpSupport = false; +} + // fade in images function imgFade(obj, time = 250) { - $(obj).animate({ opacity: 1 }, time); + obj.style.transition = `opacity ${time}ms`; + obj.style.opacity = 1; } // Lazy load images when they are in view function loadOnView() { - let lazyLoad = document.querySelectorAll('#lazy-load'); + const lazyLoad = document.querySelectorAll('#lazy-load'); for (let i = 0; i < lazyLoad.length; i++) { let image = lazyLoad[i]; if (image.getBoundingClientRect().top < window.innerHeight && image.getBoundingClientRect().bottom > 0) { - if (!image.src) { - image.src = `/api/file/${image.getAttribute('data-src')}?r=thumb` // e=webp + if (!image.src && webpSupport) { + image.src = image.getAttribute('data-src') + '&e=webp' + } else if (!image.src) { + image.src = image.getAttribute('data-src') } } } @@ -64,7 +75,7 @@ window.onload = function () { 'Using Phosphoricons and ' + 'Manrope
' + 'Made by Fluffy and others with ❤️
' + - 'V23.03.30'); + 'V23.04.05'); } } }; diff --git a/gallery/static/js/notifications.js b/gallery/static/js/pre/notifications.js similarity index 97% rename from gallery/static/js/notifications.js rename to gallery/static/js/pre/notifications.js index 80d75eb..6b4f9d7 100644 --- a/gallery/static/js/notifications.js +++ b/gallery/static/js/pre/notifications.js @@ -25,13 +25,13 @@ function addNotification(notificationText, notificationLevel) { iconElement.classList.add('sniffle__notification-icon'); notification.appendChild(iconElement); // Set the icon based on the notification level, not pretty but it works :3 - if (notificationLevel == 1) { + if (notificationLevel === 1) { notification.classList.add('success'); iconElement.innerHTML = successIcon; - } else if (notificationLevel == 2) { + } else if (notificationLevel === 2) { notification.classList.add('critical'); iconElement.innerHTML = criticalIcon; - } else if (notificationLevel == 3) { + } else if (notificationLevel === 3) { notification.classList.add('warning'); iconElement.innerHTML = warningIcon; } else { diff --git a/gallery/static/js/popup.js b/gallery/static/js/pre/popup.js similarity index 100% rename from gallery/static/js/popup.js rename to gallery/static/js/pre/popup.js diff --git a/gallery/themes/default/animations.sass b/gallery/static/sass/animations.sass similarity index 100% rename from gallery/themes/default/animations.sass rename to gallery/static/sass/animations.sass diff --git a/gallery/static/sass/components/banner.sass b/gallery/static/sass/components/banner.sass new file mode 100644 index 0000000..4ab9c9e --- /dev/null +++ b/gallery/static/sass/components/banner.sass @@ -0,0 +1,181 @@ +.banner, +.banner-small + width: 100% + position: relative + color: RGB($fg-white) + + &::after + content: '' + + width: $rad + height: calc(#{$rad} * 2) + + position: absolute + bottom: calc(#{$rad} * -2) + left: 0 + + background-color: RGB($bg-bright) + border-radius: $rad 0 0 0 + box-shadow: 0 calc(#{$rad} * -1) 0 0 RGB($bg-100) + +.banner + height: 30rem + background-color: RGB($bg-300) + + img + position: absolute + inset: 0 + + width: 100% + height: 100% + + background-color: inherit + + object-fit: cover + object-position: center center + + .banner-filter + position: absolute + inset: 0 + + width: 100% + height: 100% + + background: linear-gradient(to right, RGB($primary), transparent) + + z-index: +1 + + .banner-content + padding: 0.5rem + + width: 100% + height: auto + + position: absolute + left: 0 + bottom: 0 + + display: grid + grid-template-columns: 1fr auto + grid-template-rows: 1fr auto auto + grid-template-areas: 'info info' 'header header' 'subtitle options' + gap: 0.5rem + + z-index: +2 + + .banner-header, + .banner-info, + .banner-subtitle + margin: 0 + padding: 0 + width: 100% + + .banner-header + grid-area: header + + white-space: nowrap + text-overflow: ellipsis + overflow: hidden + text-align: left + font-size: 6.9rem + font-weight: 800 + + color: RGB($primary) + + .banner-info + grid-area: info + font-size: 1rem + font-weight: 600 + .banner-subtitle + grid-area: subtitle + font-size: 1rem + font-weight: 600 + + .pill-row + margin-top: auto + grid-area: options + +.banner-small + height: 3.5rem + background-color: RGB($bg-100) + + .banner-content + padding: 0.5rem + + width: 100% + height: 100% + + position: absolute + inset: 0 + + display: flex + flex-direction: row + justify-content: flex-start + gap: 1rem + + z-index: +2 + + .banner-header, + .banner-info + margin: auto 0 + padding: 0 + width: auto + height: auto + justify-self: flex-start + + .banner-header + padding-bottom: 0.25rem + + white-space: nowrap + text-overflow: ellipsis + overflow: hidden + text-align: left + font-weight: 800 + font-size: 1.5rem + + color: RGB($primary) + + .banner-info + font-size: 0.9rem + font-weight: 600 + + .pill-row + margin-left: auto + width: auto + +@media (max-width: $breakpoint) + .banner, + .banner-small + &::after + display: none + + .banner + min-height: 17rem + height: auto + + .banner-content + padding: 0.5rem + height: 100% + + display: flex + flex-direction: column + justify-content: center + align-items: center + gap: 0.25rem + + .banner-header + font-size: 3rem + text-align: center + + .banner-info, + .banner-subtitle + font-size: 1.1rem + text-align: center + + .pill-row + margin-top: 1rem + + .banner-small + .banner-content + .banner-info + display: none diff --git a/gallery/themes/default/components/buttons/block.sass b/gallery/static/sass/components/buttons/block.sass similarity index 87% rename from gallery/themes/default/components/buttons/block.sass rename to gallery/static/sass/components/buttons/block.sass index 78e92c6..15be087 100644 --- a/gallery/themes/default/components/buttons/block.sass +++ b/gallery/static/sass/components/buttons/block.sass @@ -57,6 +57,21 @@ &.black @include btn-block($black) +.input-checkbox + padding: 0 + display: flex + justify-content: flex-start + align-items: center + gap: 0.5rem + + position: relative + + label + font-size: 1rem + font-weight: 600 + text-align: left + + color: RGB($fg-white) .input-block padding: 0.5rem 1rem @@ -122,6 +137,7 @@ border-radius: $rad-inner cursor: pointer + overflow: hidden transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out input @@ -130,6 +146,13 @@ opacity: 0 cursor: pointer + .status + width: 100% + white-space: nowrap + text-overflow: ellipsis + text-align: center + overflow: hidden + &:hover background-color: RGBA($white, 0.2) color: RGB($white) diff --git a/gallery/themes/default/components/buttons/info-button.sass b/gallery/static/sass/components/buttons/info-button.sass similarity index 100% rename from gallery/themes/default/components/buttons/info-button.sass rename to gallery/static/sass/components/buttons/info-button.sass diff --git a/gallery/themes/default/components/buttons/pill.sass b/gallery/static/sass/components/buttons/pill.sass similarity index 100% rename from gallery/themes/default/components/buttons/pill.sass rename to gallery/static/sass/components/buttons/pill.sass diff --git a/gallery/themes/default/components/buttons/top-of-page.sass b/gallery/static/sass/components/buttons/top-of-page.sass similarity index 100% rename from gallery/themes/default/components/buttons/top-of-page.sass rename to gallery/static/sass/components/buttons/top-of-page.sass diff --git a/gallery/themes/default/components/elements/notification.sass b/gallery/static/sass/components/elements/notification.sass similarity index 100% rename from gallery/themes/default/components/elements/notification.sass rename to gallery/static/sass/components/elements/notification.sass diff --git a/gallery/themes/default/components/elements/pop-up.sass b/gallery/static/sass/components/elements/pop-up.sass similarity index 100% rename from gallery/themes/default/components/elements/pop-up.sass rename to gallery/static/sass/components/elements/pop-up.sass diff --git a/gallery/themes/default/components/elements/tags.sass b/gallery/static/sass/components/elements/tags.sass similarity index 100% rename from gallery/themes/default/components/elements/tags.sass rename to gallery/static/sass/components/elements/tags.sass diff --git a/gallery/themes/default/components/elements/upload-panel.sass b/gallery/static/sass/components/elements/upload-panel.sass similarity index 98% rename from gallery/themes/default/components/elements/upload-panel.sass rename to gallery/static/sass/components/elements/upload-panel.sass index d92ad51..05e9824 100644 --- a/gallery/themes/default/components/elements/upload-panel.sass +++ b/gallery/static/sass/components/elements/upload-panel.sass @@ -9,6 +9,7 @@ height: 100vh background-color: transparent + color: RGB($fg-white) overflow: hidden z-index: 68 @@ -20,9 +21,6 @@ font-size: 1.5rem font-weight: 700 - - color: RGB($primary) - p margin: 0 padding: 0 @@ -30,8 +28,6 @@ font-size: 1rem font-weight: 500 - color: RGB($fg-white) - form margin: 0 padding: 0 diff --git a/gallery/themes/default/components/gallery.sass b/gallery/static/sass/components/gallery.sass similarity index 97% rename from gallery/themes/default/components/gallery.sass rename to gallery/static/sass/components/gallery.sass index ee6a18d..63a832e 100644 --- a/gallery/themes/default/components/gallery.sass +++ b/gallery/static/sass/components/gallery.sass @@ -16,7 +16,7 @@ position: relative - border-radius: $rad + border-radius: $rad-inner box-sizing: border-box overflow: hidden @@ -26,7 +26,8 @@ padding: 0.5rem width: 100% - height: 30% + min-height: 30% + height: auto position: absolute left: 0 @@ -104,7 +105,7 @@ position: relative - border-radius: $rad + border-radius: $rad-inner box-sizing: border-box overflow: hidden @@ -114,7 +115,8 @@ padding: 0.5rem width: 100% - height: 30% + min-height: 30% + height: auto position: absolute left: 0 @@ -205,7 +207,7 @@ transform: scale(0.6) rotate(-5deg) translate(25%, 10%) z-index: +2 .data-3 - transform: scale(0.6) rotate(-1deg) translate(-15%, -25%) + transform: scale(0.6) rotate(-1deg) translate(-15%, -23%) z-index: +1 &:after diff --git a/gallery/themes/default/components/image-view/background.sass b/gallery/static/sass/components/image-view/background.sass similarity index 100% rename from gallery/themes/default/components/image-view/background.sass rename to gallery/static/sass/components/image-view/background.sass diff --git a/gallery/themes/default/components/image-view/fullscreen.sass b/gallery/static/sass/components/image-view/fullscreen.sass similarity index 100% rename from gallery/themes/default/components/image-view/fullscreen.sass rename to gallery/static/sass/components/image-view/fullscreen.sass diff --git a/gallery/themes/default/components/image-view/image.sass b/gallery/static/sass/components/image-view/image.sass similarity index 100% rename from gallery/themes/default/components/image-view/image.sass rename to gallery/static/sass/components/image-view/image.sass diff --git a/gallery/themes/default/components/image-view/info-tab.sass b/gallery/static/sass/components/image-view/info-tab.sass similarity index 100% rename from gallery/themes/default/components/image-view/info-tab.sass rename to gallery/static/sass/components/image-view/info-tab.sass diff --git a/gallery/themes/default/components/image-view/view.sass b/gallery/static/sass/components/image-view/view.sass similarity index 100% rename from gallery/themes/default/components/image-view/view.sass rename to gallery/static/sass/components/image-view/view.sass diff --git a/gallery/themes/default/components/navigation.sass b/gallery/static/sass/components/navigation.sass similarity index 93% rename from gallery/themes/default/components/navigation.sass rename to gallery/static/sass/components/navigation.sass index 07c8ce1..718c351 100644 --- a/gallery/themes/default/components/navigation.sass +++ b/gallery/static/sass/components/navigation.sass @@ -61,12 +61,12 @@ width: 2.5rem height: 2.5rem - color: RGB($fg-white) border-radius: $rad-inner + color: RGB($fg-white) transition: color 0.2s ease-out, transform 0.2s ease-out - span + .tool-tip margin: 0 padding: 0.35rem 0.7rem @@ -89,7 +89,7 @@ pointer-events: none - svg + > svg margin: 0 font-size: 1rem @@ -107,7 +107,7 @@ &:hover > svg - background: RGB($bg-300) + background: RGBA($fg-white, 0.1) span opacity: 1 @@ -129,7 +129,7 @@ height: calc(100% - 6px) background-color: RGB($primary) - border-radius: 0 $rad-inner $rad-inner 0 + border-radius: $rad-inner @media (max-width: $breakpoint) .navigation @@ -158,7 +158,7 @@ height: 3rem min-height: 3rem - span + .tool-tip display: none &.selected::before @@ -167,6 +167,4 @@ left: 0 width: 100% - height: 3px - - border-radius: $rad-inner \ No newline at end of file + height: 3px \ No newline at end of file diff --git a/gallery/themes/default/style.sass b/gallery/static/sass/style.sass similarity index 98% rename from gallery/themes/default/style.sass rename to gallery/static/sass/style.sass index 2f2b4bd..4b12d56 100644 --- a/gallery/themes/default/style.sass +++ b/gallery/static/sass/style.sass @@ -8,7 +8,6 @@ @import "components/elements/pop-up" @import "components/elements/upload-panel" @import "components/elements/tags" -@import "components/elements/labels" @import "components/navigation" @import "components/banner" diff --git a/gallery/themes/default/variables.sass b/gallery/static/sass/variables.sass similarity index 86% rename from gallery/themes/default/variables.sass rename to gallery/static/sass/variables.sass index 17aeb5e..d77effa 100644 --- a/gallery/themes/default/variables.sass +++ b/gallery/static/sass/variables.sass @@ -74,24 +74,11 @@ $breakpoint: 800px --breakpoint: 800px - -@font-face - font-family: 'Work Sans' - src: url('fonts/worksans-regular.woff2') - font-weight: 400 - -@font-face - font-family: 'Work Sans' - src: url('fonts/worksans-bold.woff2') - font-weight: 600 - -@font-face - font-family: 'Work Sans' - src: url('fonts/worksans-black.woff2') - font-weight: 900 - +// I have no clue if its webassets or libsass thats doing this shit +// But one of them is trying to "correct" the path, and 404-ing the +// font, so enjoy this path fuckery @font-face font-family: 'Manrope' - src: url('fonts/Manrope[wght].woff2') format('woff2') + src: url('../../../../static/fonts/Manrope[wght].woff2') format('woff2') font-style: normal font-display: swap diff --git a/gallery/templates/groups/group.html b/gallery/templates/groups/group.html index 9556124..11638ab 100644 --- a/gallery/templates/groups/group.html +++ b/gallery/templates/groups/group.html @@ -1,8 +1,182 @@ {% extends 'layout.html' %} {% block nav_groups %}selected{% endblock %} {% block head %} + {% if images %} + + {% endif %} + + + {% endblock %} {% block content %} - + {% else %} + + {% endif %} {% if images %} {% else %}

*crickets chirping*

- {% if g.user %} + {% if current_user.is_authenticated %}

Add some images to the group!

{% else %}

Login to start managing this image group!

@@ -69,32 +283,3 @@
{% endif %} {% endblock %} - -{% block script %} - -{% endblock %} \ No newline at end of file diff --git a/gallery/templates/groups/list.html b/gallery/templates/groups/list.html index 62cb3e6..ec9467e 100644 --- a/gallery/templates/groups/list.html +++ b/gallery/templates/groups/list.html @@ -1,25 +1,121 @@ {% extends 'layout.html' %} {% block nav_groups %}selected{% endblock %} +{% block head %} + {% if images %} + + {% endif %} + + {% if current_user.is_authenticated %} + + {% endif %} +{% endblock %} {% block content %} -