From 944b6b0526032ad8c1b4a2612d6723bec75e0e4c Mon Sep 17 00:00:00 2001 From: Freya Murphy Date: Fri, 29 Mar 2024 22:29:56 -0400 Subject: start database (user and post), and initial barebones home page --- web/core/aesthetic.php | 55 ++++ web/core/controller.php | 55 ++++ web/core/database.php | 173 +++++++++++++ web/core/error.php | 12 + web/core/helper.php | 0 web/core/loader.php | 38 +++ web/core/main.php | 123 +++++++++ web/core/model.php | 29 +++ web/core/router.php | 127 ++++++++++ web/index.php | 122 +++++++++ web/lang/en_US/common_lang.php | 42 ++++ web/lang/en_US/error_lang.php | 8 + web/lang/en_US/routes/home.php | 14 ++ web/public/css/common.css | 404 ++++++++++++++++++++++++++++++ web/public/css/error.css | 16 ++ web/public/css/home.css | 26 ++ web/public/css/post.css | 12 + web/public/favicon.ico | Bin 0 -> 38078 bytes web/public/font/MaterialIcons-Regular.ttf | Bin 0 -> 356840 bytes web/public/font/facebook.otf | Bin 0 -> 25740 bytes web/public/font/sfpro.otf | Bin 0 -> 2230364 bytes web/public/font/sfprobold.otf | Bin 0 -> 2298456 bytes web/public/js/jquery-3.7.1.min.js | 2 + web/public/js/lib.js | 45 ++++ web/public/js/modal.js | 64 +++++ web/public/js/post.js | 38 +++ web/routes/error/controller.php | 20 ++ web/routes/error/model.php | 31 +++ web/routes/error/views/error.php | 4 + web/routes/home/controller.php | 84 +++++++ web/routes/home/model.php | 19 ++ web/routes/home/views/main.php | 29 +++ web/views/footer.php | 2 + web/views/header.php | 74 ++++++ web/views/modal/new-post.php | 28 +++ web/views/template/comment.php | 10 + web/views/template/modal.php | 12 + web/views/template/pfp.php | 6 + web/views/template/post.php | 58 +++++ 39 files changed, 1782 insertions(+) create mode 100644 web/core/aesthetic.php create mode 100644 web/core/controller.php create mode 100644 web/core/database.php create mode 100644 web/core/error.php create mode 100644 web/core/helper.php create mode 100644 web/core/loader.php create mode 100644 web/core/main.php create mode 100644 web/core/model.php create mode 100644 web/core/router.php create mode 100644 web/index.php create mode 100644 web/lang/en_US/common_lang.php create mode 100644 web/lang/en_US/error_lang.php create mode 100644 web/lang/en_US/routes/home.php create mode 100644 web/public/css/common.css create mode 100644 web/public/css/error.css create mode 100644 web/public/css/home.css create mode 100644 web/public/css/post.css create mode 100644 web/public/favicon.ico create mode 100644 web/public/font/MaterialIcons-Regular.ttf create mode 100644 web/public/font/facebook.otf create mode 100644 web/public/font/sfpro.otf create mode 100644 web/public/font/sfprobold.otf create mode 100644 web/public/js/jquery-3.7.1.min.js create mode 100644 web/public/js/lib.js create mode 100644 web/public/js/modal.js create mode 100644 web/public/js/post.js create mode 100644 web/routes/error/controller.php create mode 100644 web/routes/error/model.php create mode 100644 web/routes/error/views/error.php create mode 100644 web/routes/home/controller.php create mode 100644 web/routes/home/model.php create mode 100644 web/routes/home/views/main.php create mode 100644 web/views/footer.php create mode 100644 web/views/header.php create mode 100644 web/views/modal/new-post.php create mode 100644 web/views/template/comment.php create mode 100644 web/views/template/modal.php create mode 100644 web/views/template/pfp.php create mode 100644 web/views/template/post.php (limited to 'web') diff --git a/web/core/aesthetic.php b/web/core/aesthetic.php new file mode 100644 index 0000000..1180ad1 --- /dev/null +++ b/web/core/aesthetic.php @@ -0,0 +1,55 @@ +config = array( + '_common' => array( + 'js' => [ + 'js/jquery-3.7.1.min.js', + 'js/lib.js', + 'js/modal.js', + ], + 'css' => [ + 'css/common.css' + ], + ), + 'error' => array( + 'css' => [ + 'css/error.css' + ], + ), + 'home' => array( + 'js' => [ + 'js/post.js', + ], + 'css' => [ + 'css/home.css', + 'css/post.css' + ], + ), + ); + } + + function get_files($route) { + $js_files = $this->config['_common']['js']; + $css_files = $this->config['_common']['css']; + + if (array_key_exists($route, $this->config)) { + $config = $this->config[$route]; + if (array_key_exists('js', $config)) { + $js_files = array_merge($js_files, $config['js']); + } + if (array_key_exists('css', $config)) { + $css_files = array_merge($css_files, $config['css']); + } + } + + return array( + 'js_files' => $js_files, + 'css_files' => $css_files, + ); + } + +} diff --git a/web/core/controller.php b/web/core/controller.php new file mode 100644 index 0000000..946b460 --- /dev/null +++ b/web/core/controller.php @@ -0,0 +1,55 @@ +main = $GLOBALS['__vars']['main']; + $this->load = $GLOBALS['__vars']['load']; + $this->db = $this->main->db; + + $info = $this->main->info; + $lang_code = $info['lang']; + $route_name = $info['route']; + $this->load->lang($lang_code); + $this->load->route_lang($lang_code, $route_name); + } + + public function index() {} + + protected function view($__name, $data = array()) { + $__root = $GLOBALS['webroot']; + $__path = $__root . '/views/' . $__name . '.php'; + if (is_file($__path)) { + extract($data); + require($__path); + return; + } + } + + protected function app_view($__name, $data = array()) { + $__root = $GLOBALS['webroot']; + $__route = $this->main->info['route']; + $__path = $__root . '/routes/' . $__route . '/views/' . $__name . '.php'; + if (is_file($__path)) { + extract($data); + require($__path); + return; + } + } + + protected function modal($title, $content, $data = array()) { + $data['title'] = $title; + $data['content'] = $content; + $this->view('template/modal', $data); + } + +} +?> diff --git a/web/core/database.php b/web/core/database.php new file mode 100644 index 0000000..b3a597b --- /dev/null +++ b/web/core/database.php @@ -0,0 +1,173 @@ +conn = $conn; + $this->query = ''; + + $this->set = FALSE; + $this->where = FALSE; + $this->param = array(); + } + + private function in($array) { + $in = 'IN ('; + foreach ($array as $idx => $item) { + if ($idx != 0) { + $in .= ","; + } + $in .= "?"; + array_push($this->param, $item); + } + $in .= ")"; + return $in; + } + + public function select($select) { + $this->query .= "SELECT $select\n"; + return $this; + } + + public function from($from) { + $this->query .= "FROM $from\n"; + return $this; + } + + public function where($cond) { + if (!$this->where) { + $this->where = TRUE; + $this->query .= "WHERE "; + } + $this->query .= "$cond "; + return $this; + } + + public function like($item) { + $this->query .= "LIKE ?\n"; + array_push($this->param, $item); + return $this; + } + + public function eq($item) { + $this->query .= "= ?\n"; + array_push($this->param, $item); + return $this; + } + + public function ne($item) { + $this->query .= "<> ?\n"; + array_push($this->param, $item); + return $this; + } + + public function where_in($column, $array) { + if (!$this->where) { + $this->where = TRUE; + $this->query .= "WHERE "; + } + if (empty($array)) { + $this->query .= "FALSE\n"; + return $this; + } + $in = $this->in($array); + $this->query .= "$column $in\n"; + return $this; + } + + public function and() { + $this->query .= "AND "; + return $this; + } + + public function or() { + $this->query .= "OR "; + return $this; + } + + public function join($table, $on, $type = 'LEFT') { + $this->query .= "$type JOIN $table ON $on\n"; + return $this; + } + + public function limit($limit) { + $this->query .= "LIMIT ?\n"; + array_push($this->param, $limit); + return $this; + } + + public function offset($offset) { + $this->query .= "OFFSET ?\n"; + array_push($this->param, $offset); + return $this; + } + + public function rows() { + $stmt = $this->conn->prepare($this->query); + try { + $stmt->execute($this->param); + } catch (Exception $ex) { + echo $ex; + echo '
>> caused by <<
'; + echo str_replace("\n", "
", $this->query); + } + return $stmt->fetchAll(PDO::FETCH_ASSOC); + } + + public function row() { + $stmt = $this->conn->prepare($this->query); + $stmt->execute($this->param); + return $stmt->fetch(PDO::FETCH_ASSOC); + } +} + +/** + * DatabaseHelper + * allows queries on the + * xssbook postgres database + */ +class DatabaseHelper { + + private $conn; + + function __construct() { + $this->conn = NULL; + } + + private function connect() { + if ($this->conn === NULL) { + $user = getenv("POSTGRES_USER"); + $pass = getenv("POSTGRES_PASSWORD"); + $db = getenv("POSTGRES_DB"); + $host = 'db'; + $port = '5432'; + + $conn_str = sprintf("pgsql:host=%s;port=%d;dbname=%s;user=%s;password=%s", + $host, + $port, + $db, + $user, + $pass + ); + $this->conn = new \PDO($conn_str); + $this->conn->setAttribute(\PDO::ATTR_ERRMODE, \PDO::ERRMODE_EXCEPTION); + } + return $this->conn; + } + + public function select($select) { + $conn = $this->connect(); + $query = new DatabaseQuery($conn); + return $query->select($select); + } + +} +?> diff --git a/web/core/error.php b/web/core/error.php new file mode 100644 index 0000000..2e02cb1 --- /dev/null +++ b/web/core/error.php @@ -0,0 +1,12 @@ + + + + <?=$code . ' - ' . $msg?> + + +
+

+
+
+ + diff --git a/web/core/helper.php b/web/core/helper.php new file mode 100644 index 0000000..e69de29 diff --git a/web/core/loader.php b/web/core/loader.php new file mode 100644 index 0000000..4d4526c --- /dev/null +++ b/web/core/loader.php @@ -0,0 +1,38 @@ +info = NULL; + $this->db = new DatabaseHelper(); + $this->users = array(); + $_SESSION['jwt'] = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyb2xlIjoicmVzdF91c2VyIiwidXNlcl9pZCI6MSwiZXhwIjoxNzExODUxMDUzfQ.FUcFO44SWV--YtVOy7NftTF8OeeOYGZDaDHigygQxsY'; + if (array_key_exists('jwt', $_SESSION)) { + $this->get_session($_SESSION['jwt']); + } else { + $this->user_id = NULL; + }; + } + + private function get_session($jwt) { + $query = $this->db + ->select("_api.verify_jwt('" . $jwt . "') AS user_id;"); + $result = $query->row(); + $user_id = $result['user_id']; + if ($user_id) { + $this->user_id = $user_id; + } + } + + public function link_css($path) { + return ''; + } + + public function link_js($path) { + return ''; + } + + public function user() { + if ($this->user_id) { + return $this->db + ->select('*') + ->from('api.user') + ->where('id') + ->eq($this->user_id) + ->row(); + } else { + return NULL; + } + } + + public function get_num($key, $default = NULL) { + if (!array_key_exists($key, $_GET)) { + if ($default !== NULL) { + return $default; + } else { + error_page(400, lang('error_400')); + } + } else { + $val = $_GET[$key]; + $val = intval($val); + if ($val < 0) { + return 0; + } else { + return $val; + } + } + } + + public function get_users($objs) { + $ids = array(); + foreach ($objs as $obj) { + $id = $obj['user_id']; + if (!array_key_exists($id, $this->users)) { + array_push($ids, intval($id)); + } + } + if (!empty($ids)) { + $result = $this->db + ->select('*') + ->from('api.user') + ->where_in('id', $ids) + ->rows(); + foreach ($result as $user) { + $id = $user['id']; + $this->users[$id] = $user; + } + } + return $this->users; + } + + public function display_name($user) { + $name = ''; + if ($user['first_name']) { + $name .= $user['first_name']; + } + if ($user['middle_name']) { + if ($name != '') { + $name .= ' '; + } + $name .= $user['middle_name']; + } + if ($user['last_name']) { + if ($name != '') { + $name .= ' '; + } + $name .= $user['last_name']; + } + if ($name == '') { + $name = '@' . $user['username']; + } + return $name; + } + + public function display_date($date) { + return $date; + } + +} + +?> diff --git a/web/core/model.php b/web/core/model.php new file mode 100644 index 0000000..039b138 --- /dev/null +++ b/web/core/model.php @@ -0,0 +1,29 @@ +main = $GLOBALS['__vars']['main']; + $this->load = $GLOBALS['__vars']['load']; + $this->db = $this->main->db; + $this->config = new Aesthetic(); + } + + public function get_data() { + $data = array(); + $route = $this->main->info['route']; + $files = $this->config->get_files($route); + $data = array_merge($data, $files); + $data['self'] = $this->main->user(); + return $data; + } +} +?> diff --git a/web/core/router.php b/web/core/router.php new file mode 100644 index 0000000..6ee28a9 --- /dev/null +++ b/web/core/router.php @@ -0,0 +1,127 @@ +newInstance(); + + $controller_ref = new ReflectionClass($controller_cls); + $controller = $controller_ref->newInstance($model); + + return $controller; + } + + function __construct($main, $load) { + + $routes = array( + 'home' => array( + 'slugs' => ['', 'home'], + 'model' => 'HomeModel', + 'controller' => 'HomeController', + ), + ); + + $this->routes = array(); + foreach ($routes as $name => $route) { + foreach ($route['slugs'] as $slug) { + $this->routes[$slug] = $route; + $this->routes[$slug]['name'] = $name; + } + } + + $this->main = $main; + $this->load = $load; + } + + function get_info() { + $uri = parse_url($_SERVER['REQUEST_URI']); + $method = $_SERVER['REQUEST_METHOD']; + $parts = explode('/', $uri['path']); + + $slug = sizeof($parts) > 1 ? $parts[1] : ''; + $path = sizeof($parts) > 2 ? $parts[2] : 'index'; + + if (sizeof($parts) > 3) { + return NULL; + } + + return array( + 'method' => $method, + 'uri' => $uri, + + 'slug' => $slug, + 'path' => $path + ); + } + + function handle_error($code) { + $route = array( + 'name' => 'error', + 'model' => 'ErrorModel', + 'controller' => 'ErrorController' + ); + $this->main->info = array( + 'slug' => 'error', + 'lang' => 'en_US', + 'route' => 'error' + ); + $controller = $this->load_route($route); + $_GET['code'] = $code; + http_response_code($code); + $controller->index(); + } + + public function handle_request() { + $request = $this->get_info(); + + if ($request === NULL) { + $this->handle_error(404); + return; + } + + $slug = $request['slug']; + if (!array_key_exists($slug, $this->routes)) { + $this->handle_error(404); + return; + } + + $route = $this->routes[$slug]; + $this->main->info = array( + 'lang' => 'en_US', + 'slug' => $slug, + 'route' => $route['name'], + ); + + $controller = $this->load_route($route); + + $path = $request['path']; + $ref = NULL; + + try { + $ref = new ReflectionMethod($controller, $path); + } catch (Exception $_e) {} + + if ($ref === NULL || !$ref->isPublic()) { + $this->handle_error(404); + return; + + } + + $ref->invoke($controller); + + } + +} diff --git a/web/index.php b/web/index.php new file mode 100644 index 0000000..1032b7f --- /dev/null +++ b/web/index.php @@ -0,0 +1,122 @@ + $attr) { + echo $key . '="' . $attr . '" '; + } + echo '> '; + if ($icon) { + echo ''; + if ($content) { + echo $content; + } + echo ''; + } + if ($text) { + echo '' . $text . ''; + } + if ($click) { + echo ''; + } else { + echo ''; + } +} + +function __init() { + + $root = $GLOBALS['webroot']; + + // load all core files + require($root . '/core/database.php'); + require($root . '/core/aesthetic.php'); + require($root . '/core/controller.php'); + require($root . '/core/model.php'); + require($root . '/core/loader.php'); + require($root . '/core/main.php'); + require($root . '/core/router.php'); + + $main = new MainModel(); + $load = new Loader(); + $router = new Router($main, $load); + + $GLOBALS['__vars']['main'] = $main; + $GLOBALS['__vars']['load'] = $load; + $GLOBALS['__vars']['router'] = $router; + + $router->handle_request(); +}; + +if (!file_exists('/status/ready')) { + error_page(503, 'Service Unavailable'); +} + +__init(); + +?> diff --git a/web/lang/en_US/common_lang.php b/web/lang/en_US/common_lang.php new file mode 100644 index 0000000..3ce2fdb --- /dev/null +++ b/web/lang/en_US/common_lang.php @@ -0,0 +1,42 @@ + diff --git a/web/lang/en_US/error_lang.php b/web/lang/en_US/error_lang.php new file mode 100644 index 0000000..42ade65 --- /dev/null +++ b/web/lang/en_US/error_lang.php @@ -0,0 +1,8 @@ + diff --git a/web/lang/en_US/routes/home.php b/web/lang/en_US/routes/home.php new file mode 100644 index 0000000..051eff2 --- /dev/null +++ b/web/lang/en_US/routes/home.php @@ -0,0 +1,14 @@ + diff --git a/web/public/css/common.css b/web/public/css/common.css new file mode 100644 index 0000000..05f429f --- /dev/null +++ b/web/public/css/common.css @@ -0,0 +1,404 @@ +:root { + --primary: #242424 !important; + --secondary: #181818 !important; + --hover: #1b1b1b !important; + --light: #3e4042 !important; + --mild: #1b1b1b !important; + --medium: #e2ded6 !important; + --extreme: #e2ded6 !important; + --logo: #1778f2 !important; + --error: #f02849 !important; + --success: #30ab5a !important; + --text: #ffffff !important; + --banner: #6b6b6b !important; + --popup: #242424cc !important; +} + +@font-face { + font-family: 'Material Icons'; + font-style: normal; + font-weight: 400; + src: url("/public/font/MaterialIcons-Regular.ttf") format('truetype'); +} + +@font-face { + font-family: facebook; + src: url("/public/font/facebook.otf") format("opentype"); + font-display: swap; +} + +@font-face { + font-family: sfpro; + src: url("/public/font/sfpro.otf") format("opentype"); + font-display: swap; +} + +@font-face { + font-family: sfprobold; + src: url("/public/font/sfprobold.otf") format("opentype"); + font-display: swap; +} + +body { + background-color: var(--secondary); + width: 100%; + height: 100%; + margin: 0; + padding: 0; + display: flex; + flex-direction: column; + color: var(--text); + font-family: sfpro; +} + +header { + height: 3.5rem; + background-color: var(--primary); + display: flex; + flex-direction: row; + align-items: center; + padding: 0 1rem; +} + +header .logo { + font-family: facebook; + color: var(--logo); + font-size: 2.25rem; + height: 100%; + line-height: 2rem; + margin-top: .75rem; +} + +a, button, input { + background: none; + border: none; + display: flex; + flex-direction: row; + align-items: center; + font-family: sfprobold; + color: inherit; + text-decoration: none; + font-size: 1rem; +} + +a, button { + cursor: pointer; +} + +form button { + padding: .5rem; + border-radius: .5rem; +} + +input:focus { + border: none; + outline: none; +} + +.header-entry { + display: flex; + flex-direction: row; + text-decoration: none; + align-items: center; + color: var(--text); +} + +.nav .header-entry { + height: 100%; +} + +.nav-center .header-entry:hover { + background-color: var(--hover); +} + +.btn-action { + justify-content: center; + align-items: center; + padding: .35rem; + margin: .25rem; + border-radius: .25rem; +} + +.btn-action:hover { + background-color: var(--hover); +} + +.btn-blue:hover { + color: var(--logo); +} + +.header .btn-blue { + border-bottom: 1px solid var(--logo); +} + +.btn-line:hover { + text-decoration: underline; +} + +.nav, +.nav-left, +.nav-center, +.nav-right { + position: relative; + display: flex; + flex-direction: row; + align-items: center; +} + +.nav-right { + flex: 1; + justify-content: flex-end; +} + +.nav-center { + position: absolute; + left: 50%; + transform: translateX(-50%); + flex: 1; + justify-content: center; + height: 100%; + z-index: 2; +} + +@media (min-width: 800px) { + .header-entry > span { + display: none; + } + + .nav-center .header-entry { + padding: 0 3rem; + } + + #action-hamburger { + display: none; + } +} + +@media (max-width: 800px) { + .nav-center { + display: none; + position: absolute; + flex-direction: column; + top: 100%; + height: fit-content; + background-color: var(--primary); + width: 100%; + left: 0; + transform: translateX(0%); + justify-content: flex-start; + } + + .nav-center.visible { + display: inherit !important; + } + + .nav-center .header-entry { + width: calc(100% - 3rem); + padding: .75rem 0rem !important; + padding-left: 3rem !important; + justify-content: flex-start; + } + + .nav-center .header-entry > span { + margin-left: 1rem; + } + + .nav-center .header-entry.active { + border-bottom: none; + } +} + +.nav-right .image-loading { + display: block; +} + +.nav-right .header-entry { + padding: 0; + padding-left: 1.5rem; +} + +@keyframes shimmer { + to { + background-position-x: 0%; + } +} + +.pfp, .pfp img { + height: 2.5rem; + border-radius: 2.5rem; + aspect-ratio: 1; + border-radius: 100%; + display: block; +} + +.pfp-sm, .pfp-sm img { + height: 1.75rem; +} + +.image-loading { + background: linear-gradient(-45deg, var(--secondary) 0%, var(--primary) 25%, var(--secondary) 50%); + background-size: 500%; + background-position-x: 150%; + animation: shimmer 1s linear infinite; +} + +.card { + background-color: var(--primary); + border-radius: .5rem; + padding: 1rem; +} + +.card form { + flex-grow: 1; +} + +.card .sub-card { + background-color: var(--secondary); + border-radius: .5rem; + padding: .75rem; +} + +.input { + padding: 10px; + border-radius: 10px; + width: calc(100% - 20px); + background-color: var(--secondary); + font-family: sfpro; +} + +.input:hover { + background-color: var(--hover); +} + +.row { + display: flex; + flex-direction: row; +} + +.col { + display: flex; + flex-direction: column; +} + +.grow { + flex-grow: 1; +} + +.ml-sm { + margin-left: .5rem; +} + +.ml { + margin-left: 1rem; +} + +.mr-sm { + margin-right: .5rem; +} + +.mr { + margin-right: 1rem; +} + +.mt { + margin-top: 1rem; +} + +.mb { + margin-bottom: .75rem; +} + +.dim { + color: var(--medium); +} + +.modal-container { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(255, 255, 255, .1); + display: block; +} + +.modal { + background-color: var(--primary); + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + min-width: 40rem; + min-height: 24rem; + border-radius: .5rem; + display: flex; + flex-direction: column; +} + +.modal>form { + display: flex; + flex-direction: column; + flex-grow: 1; +} + +.modal-header { + font-family: sfprobold; + position: relative; + border-bottom: 1px solid var(--light); + text-align: center; + margin: 0 1rem; + border-radius: .5rem .5rem 0 0; + display: flex; + justify-content: center; + align-items: center; + padding-left: 1rem; + cursor: grab; + padding: 1rem; +} + +.modal-content { + flex-grow: 1; + padding: 1rem; +} + +.modal-footer { + margin-top: auto; + padding: 0 1rem; + padding-bottom: 1rem; + display: flex; + flex-direction: row; + justify-content: flex-end; +} + +.float-right { + position: absolute; + transform: translate(0%, -50%); + top: 45%; + right: 0; +} + +.mi { + font-family: 'Material Icons'; + font-style: normal; + font-size: 1.5rem; +} + +.mi-sm { + font-size: 1rem; +} + +.mi-lg { + font-size: 2rem; +} + +button[type="submit"] { + text-align: center; + background-color: var(--logo); + flex-grow: 1; + padding: .5rem; +} + +button[type="submit"]:hover { + background-color: var(--logo); +} + diff --git a/web/public/css/error.css b/web/public/css/error.css new file mode 100644 index 0000000..aea11d9 --- /dev/null +++ b/web/public/css/error.css @@ -0,0 +1,16 @@ +#error { + display: flex; + flex-direction: column; + align-items: center; + margin-top: 10rem; +} + +#error h1 { + color: var(--logo); + font-family: Facebook; + font-size: 5rem; +} + +#error span { + font-size: 2rem; +} diff --git a/web/public/css/home.css b/web/public/css/home.css new file mode 100644 index 0000000..e70223e --- /dev/null +++ b/web/public/css/home.css @@ -0,0 +1,26 @@ +#main-content { + width: 100%; + display: flex; + flex-direction: column; + align-items: center; + margin-top: 1rem; +} + +.card { + width: 40rem; + margin-bottom: 1rem; +} + +.new-post-modal textarea { + border: none; + resize: none; + outline: none; + font-family: sfpro; + font-size: 1.5rem; + margin: 1rem 0; + width: 100%; + height: 70%; + flex-grow: 1; + background-color: transparent; + color: var(--text); +} diff --git a/web/public/css/post.css b/web/public/css/post.css new file mode 100644 index 0000000..6ad14ba --- /dev/null +++ b/web/public/css/post.css @@ -0,0 +1,12 @@ +.post hr { + color: var(--light); + margin: 0; +} + +.post hr:nth-of-type(1) { + margin-top: .5rem; +} + +.action-load-comments { + margin-left: 4rem; +} diff --git a/web/public/favicon.ico b/web/public/favicon.ico new file mode 100644 index 0000000..e023946 Binary files /dev/null and b/web/public/favicon.ico differ diff --git a/web/public/font/MaterialIcons-Regular.ttf b/web/public/font/MaterialIcons-Regular.ttf new file mode 100644 index 0000000..9d09b0f Binary files /dev/null and b/web/public/font/MaterialIcons-Regular.ttf differ diff --git a/web/public/font/facebook.otf b/web/public/font/facebook.otf new file mode 100644 index 0000000..97d5c6f Binary files /dev/null and b/web/public/font/facebook.otf differ diff --git a/web/public/font/sfpro.otf b/web/public/font/sfpro.otf new file mode 100644 index 0000000..7042365 Binary files /dev/null and b/web/public/font/sfpro.otf differ diff --git a/web/public/font/sfprobold.otf b/web/public/font/sfprobold.otf new file mode 100644 index 0000000..28fa5a4 Binary files /dev/null and b/web/public/font/sfprobold.otf differ diff --git a/web/public/js/jquery-3.7.1.min.js b/web/public/js/jquery-3.7.1.min.js new file mode 100644 index 0000000..7f37b5d --- /dev/null +++ b/web/public/js/jquery-3.7.1.min.js @@ -0,0 +1,2 @@ +/*! jQuery v3.7.1 | (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(ie,e){"use strict";var oe=[],r=Object.getPrototypeOf,ae=oe.slice,g=oe.flat?function(e){return oe.flat.call(e)}:function(e){return oe.concat.apply([],e)},s=oe.push,se=oe.indexOf,n={},i=n.toString,ue=n.hasOwnProperty,o=ue.toString,a=o.call(Object),le={},v=function(e){return"function"==typeof e&&"number"!=typeof e.nodeType&&"function"!=typeof e.item},y=function(e){return null!=e&&e===e.window},C=ie.document,u={type:!0,src:!0,nonce:!0,noModule:!0};function m(e,t,n){var r,i,o=(n=n||C).createElement("script");if(o.text=e,t)for(r in u)(i=t[r]||t.getAttribute&&t.getAttribute(r))&&o.setAttribute(r,i);n.head.appendChild(o).parentNode.removeChild(o)}function x(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?n[i.call(e)]||"object":typeof e}var t="3.7.1",l=/HTML$/i,ce=function(e,t){return new ce.fn.init(e,t)};function c(e){var t=!!e&&"length"in e&&e.length,n=x(e);return!v(e)&&!y(e)&&("array"===n||0===t||"number"==typeof t&&0+~]|"+ge+")"+ge+"*"),x=new RegExp(ge+"|>"),j=new RegExp(g),A=new RegExp("^"+t+"$"),D={ID:new RegExp("^#("+t+")"),CLASS:new RegExp("^\\.("+t+")"),TAG:new RegExp("^("+t+"|[*])"),ATTR:new RegExp("^"+p),PSEUDO:new RegExp("^"+g),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+ge+"*(even|odd|(([+-]|)(\\d*)n|)"+ge+"*(?:([+-]|)"+ge+"*(\\d+)|))"+ge+"*\\)|)","i"),bool:new RegExp("^(?:"+f+")$","i"),needsContext:new RegExp("^"+ge+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+ge+"*((?:-\\d)?\\d*)"+ge+"*\\)|)(?=[^-]|$)","i")},N=/^(?:input|select|textarea|button)$/i,q=/^h\d$/i,L=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,H=/[+~]/,O=new RegExp("\\\\[\\da-fA-F]{1,6}"+ge+"?|\\\\([^\\r\\n\\f])","g"),P=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))},M=function(){V()},R=J(function(e){return!0===e.disabled&&fe(e,"fieldset")},{dir:"parentNode",next:"legend"});try{k.apply(oe=ae.call(ye.childNodes),ye.childNodes),oe[ye.childNodes.length].nodeType}catch(e){k={apply:function(e,t){me.apply(e,ae.call(t))},call:function(e){me.apply(e,ae.call(arguments,1))}}}function I(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&&(V(e),e=e||T,C)){if(11!==p&&(u=L.exec(t)))if(i=u[1]){if(9===p){if(!(a=e.getElementById(i)))return n;if(a.id===i)return k.call(n,a),n}else if(f&&(a=f.getElementById(i))&&I.contains(e,a)&&a.id===i)return k.call(n,a),n}else{if(u[2])return k.apply(n,e.getElementsByTagName(t)),n;if((i=u[3])&&e.getElementsByClassName)return k.apply(n,e.getElementsByClassName(i)),n}if(!(h[t+" "]||d&&d.test(t))){if(c=t,f=e,1===p&&(x.test(t)||m.test(t))){(f=H.test(t)&&U(e.parentNode)||e)==e&&le.scope||((s=e.getAttribute("id"))?s=ce.escapeSelector(s):e.setAttribute("id",s=S)),o=(l=Y(t)).length;while(o--)l[o]=(s?"#"+s:":scope")+" "+Q(l[o]);c=l.join(",")}try{return k.apply(n,f.querySelectorAll(c)),n}catch(e){h(t,!0)}finally{s===S&&e.removeAttribute("id")}}}return re(t.replace(ve,"$1"),e,n,r)}function W(){var r=[];return function e(t,n){return r.push(t+" ")>b.cacheLength&&delete e[r.shift()],e[t+" "]=n}}function F(e){return e[S]=!0,e}function $(e){var t=T.createElement("fieldset");try{return!!e(t)}catch(e){return!1}finally{t.parentNode&&t.parentNode.removeChild(t),t=null}}function B(t){return function(e){return fe(e,"input")&&e.type===t}}function _(t){return function(e){return(fe(e,"input")||fe(e,"button"))&&e.type===t}}function z(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&&R(e)===t:e.disabled===t:"label"in e&&e.disabled===t}}function X(a){return F(function(o){return o=+o,F(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 U(e){return e&&"undefined"!=typeof e.getElementsByTagName&&e}function V(e){var t,n=e?e.ownerDocument||e:ye;return n!=T&&9===n.nodeType&&n.documentElement&&(r=(T=n).documentElement,C=!ce.isXMLDoc(T),i=r.matches||r.webkitMatchesSelector||r.msMatchesSelector,r.msMatchesSelector&&ye!=T&&(t=T.defaultView)&&t.top!==t&&t.addEventListener("unload",M),le.getById=$(function(e){return r.appendChild(e).id=ce.expando,!T.getElementsByName||!T.getElementsByName(ce.expando).length}),le.disconnectedMatch=$(function(e){return i.call(e,"*")}),le.scope=$(function(){return T.querySelectorAll(":scope")}),le.cssHas=$(function(){try{return T.querySelector(":has(*,:jqfake)"),!1}catch(e){return!0}}),le.getById?(b.filter.ID=function(e){var t=e.replace(O,P);return function(e){return e.getAttribute("id")===t}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&C){var n=t.getElementById(e);return n?[n]:[]}}):(b.filter.ID=function(e){var n=e.replace(O,P);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&&C){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=function(e,t){return"undefined"!=typeof t.getElementsByTagName?t.getElementsByTagName(e):t.querySelectorAll(e)},b.find.CLASS=function(e,t){if("undefined"!=typeof t.getElementsByClassName&&C)return t.getElementsByClassName(e)},d=[],$(function(e){var t;r.appendChild(e).innerHTML="",e.querySelectorAll("[selected]").length||d.push("\\["+ge+"*(?:value|"+f+")"),e.querySelectorAll("[id~="+S+"-]").length||d.push("~="),e.querySelectorAll("a#"+S+"+*").length||d.push(".#.+[+~]"),e.querySelectorAll(":checked").length||d.push(":checked"),(t=T.createElement("input")).setAttribute("type","hidden"),e.appendChild(t).setAttribute("name","D"),r.appendChild(e).disabled=!0,2!==e.querySelectorAll(":disabled").length&&d.push(":enabled",":disabled"),(t=T.createElement("input")).setAttribute("name",""),e.appendChild(t),e.querySelectorAll("[name='']").length||d.push("\\["+ge+"*name"+ge+"*="+ge+"*(?:''|\"\")")}),le.cssHas||d.push(":has"),d=d.length&&new RegExp(d.join("|")),l=function(e,t){if(e===t)return a=!0,0;var n=!e.compareDocumentPosition-!t.compareDocumentPosition;return n||(1&(n=(e.ownerDocument||e)==(t.ownerDocument||t)?e.compareDocumentPosition(t):1)||!le.sortDetached&&t.compareDocumentPosition(e)===n?e===T||e.ownerDocument==ye&&I.contains(ye,e)?-1:t===T||t.ownerDocument==ye&&I.contains(ye,t)?1:o?se.call(o,e)-se.call(o,t):0:4&n?-1:1)}),T}for(e in I.matches=function(e,t){return I(e,null,null,t)},I.matchesSelector=function(e,t){if(V(e),C&&!h[t+" "]&&(!d||!d.test(t)))try{var n=i.call(e,t);if(n||le.disconnectedMatch||e.document&&11!==e.document.nodeType)return n}catch(e){h(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(O,P),e[3]=(e[3]||e[4]||e[5]||"").replace(O,P),"~="===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]||I.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]&&I.error(e[0]),e},PSEUDO:function(e){var t,n=!e[6]&&e[2];return D.CHILD.test(e[0])?null:(e[3]?e[2]=e[4]||e[5]||"":n&&j.test(n)&&(t=Y(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(O,P).toLowerCase();return"*"===e?function(){return!0}:function(e){return fe(e,t)}},CLASS:function(e){var t=s[e+" "];return t||(t=new RegExp("(^|"+ge+")"+e+"("+ge+"|$)"))&&s(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=I.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 T(e,n,r){return v(n)?ce.grep(e,function(e,t){return!!n.call(e,t,e)!==r}):n.nodeType?ce.grep(e,function(e){return e===n!==r}):"string"!=typeof n?ce.grep(e,function(e){return-1)[^>]*|#([\w-]+))$/;(ce.fn.init=function(e,t,n){var r,i;if(!e)return this;if(n=n||k,"string"==typeof e){if(!(r="<"===e[0]&&">"===e[e.length-1]&&3<=e.length?[null,e,null]:S.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 ce?t[0]:t,ce.merge(this,ce.parseHTML(r[1],t&&t.nodeType?t.ownerDocument||t:C,!0)),w.test(r[1])&&ce.isPlainObject(t))for(r in t)v(this[r])?this[r](t[r]):this.attr(r,t[r]);return this}return(i=C.getElementById(r[2]))&&(this[0]=i,this.length=1),this}return e.nodeType?(this[0]=e,this.length=1,this):v(e)?void 0!==n.ready?n.ready(e):e(ce):ce.makeArray(e,this)}).prototype=ce.fn,k=ce(C);var E=/^(?:parents|prev(?:Until|All))/,j={children:!0,contents:!0,next:!0,prev:!0};function A(e,t){while((e=e[t])&&1!==e.nodeType);return e}ce.fn.extend({has:function(e){var t=ce(e,this),n=t.length;return this.filter(function(){for(var e=0;e\x20\t\r\n\f]*)/i,Ce=/^$|^module$|\/(?:java|ecma)script/i;xe=C.createDocumentFragment().appendChild(C.createElement("div")),(be=C.createElement("input")).setAttribute("type","radio"),be.setAttribute("checked","checked"),be.setAttribute("name","t"),xe.appendChild(be),le.checkClone=xe.cloneNode(!0).cloneNode(!0).lastChild.checked,xe.innerHTML="",le.noCloneChecked=!!xe.cloneNode(!0).lastChild.defaultValue,xe.innerHTML="",le.option=!!xe.lastChild;var ke={thead:[1,"","
"],col:[2,"","
"],tr:[2,"","
"],td:[3,"","
"],_default:[0,"",""]};function Se(e,t){var n;return n="undefined"!=typeof e.getElementsByTagName?e.getElementsByTagName(t||"*"):"undefined"!=typeof e.querySelectorAll?e.querySelectorAll(t||"*"):[],void 0===t||t&&fe(e,t)?ce.merge([e],n):n}function Ee(e,t){for(var n=0,r=e.length;n",""]);var je=/<|&#?\w+;/;function Ae(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 Re(e,t){return fe(e,"table")&&fe(11!==t.nodeType?t:t.firstChild,"tr")&&ce(e).children("tbody")[0]||e}function Ie(e){return e.type=(null!==e.getAttribute("type"))+"/"+e.type,e}function We(e){return"true/"===(e.type||"").slice(0,5)?e.type=e.type.slice(5):e.removeAttribute("type"),e}function Fe(e,t){var n,r,i,o,a,s;if(1===t.nodeType){if(_.hasData(e)&&(s=_.get(e).events))for(i in _.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)}),C.head.appendChild(r[0])},abort:function(){i&&i()}}});var Jt,Kt=[],Zt=/(=)\?(?=&|$)|\?\?/;ce.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var e=Kt.pop()||ce.expando+"_"+jt.guid++;return this[e]=!0,e}}),ce.ajaxPrefilter("json jsonp",function(e,t,n){var r,i,o,a=!1!==e.jsonp&&(Zt.test(e.url)?"url":"string"==typeof e.data&&0===(e.contentType||"").indexOf("application/x-www-form-urlencoded")&&Zt.test(e.data)&&"data");if(a||"jsonp"===e.dataTypes[0])return r=e.jsonpCallback=v(e.jsonpCallback)?e.jsonpCallback():e.jsonpCallback,a?e[a]=e[a].replace(Zt,"$1"+r):!1!==e.jsonp&&(e.url+=(At.test(e.url)?"&":"?")+e.jsonp+"="+r),e.converters["script json"]=function(){return o||ce.error(r+" was not called"),o[0]},e.dataTypes[0]="json",i=ie[r],ie[r]=function(){o=arguments},n.always(function(){void 0===i?ce(ie).removeProp(r):ie[r]=i,e[r]&&(e.jsonpCallback=t.jsonpCallback,Kt.push(r)),o&&v(i)&&i(o[0]),o=i=void 0}),"script"}),le.createHTMLDocument=((Jt=C.implementation.createHTMLDocument("").body).innerHTML="
",2===Jt.childNodes.length),ce.parseHTML=function(e,t,n){return"string"!=typeof e?[]:("boolean"==typeof t&&(n=t,t=!1),t||(le.createHTMLDocument?((r=(t=C.implementation.createHTMLDocument("")).createElement("base")).href=C.location.href,t.head.appendChild(r)):t=C),o=!n&&[],(i=w.exec(e))?[t.createElement(i[1])]:(i=Ae([e],t,o),o&&o.length&&ce(o).remove(),ce.merge([],i.childNodes)));var r,i,o},ce.fn.load=function(e,t,n){var r,i,o,a=this,s=e.indexOf(" ");return-1").append(ce.parseHTML(e)).find(r):e)}).always(n&&function(e,t){a.each(function(){n.apply(this,o||[e.responseText,t,e])})}),this},ce.expr.pseudos.animated=function(t){return ce.grep(ce.timers,function(e){return t===e.elem}).length},ce.offset={setOffset:function(e,t,n){var r,i,o,a,s,u,l=ce.css(e,"position"),c=ce(e),f={};"static"===l&&(e.style.position="relative"),s=c.offset(),o=ce.css(e,"top"),u=ce.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),v(t)&&(t=t.call(e,n,ce.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)}},ce.fn.extend({offset:function(t){if(arguments.length)return void 0===t?this:this.each(function(e){ce.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"===ce.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"===ce.css(e,"position"))e=e.parentNode;e&&e!==r&&1===e.nodeType&&((i=ce(e).offset()).top+=ce.css(e,"borderTopWidth",!0),i.left+=ce.css(e,"borderLeftWidth",!0))}return{top:t.top-i.top-ce.css(r,"marginTop",!0),left:t.left-i.left-ce.css(r,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){var e=this.offsetParent;while(e&&"static"===ce.css(e,"position"))e=e.offsetParent;return e||J})}}),ce.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(t,i){var o="pageYOffset"===i;ce.fn[t]=function(e){return M(this,function(e,t,n){var r;if(y(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)}}),ce.each(["top","left"],function(e,n){ce.cssHooks[n]=Ye(le.pixelPosition,function(e,t){if(t)return t=Ge(e,n),_e.test(t)?ce(e).position()[n]+"px":t})}),ce.each({Height:"height",Width:"width"},function(a,s){ce.each({padding:"inner"+a,content:s,"":"outer"+a},function(r,o){ce.fn[o]=function(e,t){var n=arguments.length&&(r||"boolean"!=typeof e),i=r||(!0===e||!0===t?"margin":"border");return M(this,function(e,t,n){var r;return y(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?ce.css(e,t,i):ce.style(e,t,n,i)},s,n?e:void 0,n)}})}),ce.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(e,t){ce.fn[t]=function(e){return this.on(t,e)}}),ce.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.on("mouseenter",e).on("mouseleave",t||e)}}),ce.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){ce.fn[n]=function(e,t){return 0 { + + $(containerSelector + ' ' + elementSelector).each(function (_, e) { + let me = $(e); + callback(me); + }); + + var onMutationsObserved = function(mutations) { + mutations.forEach(function(mutation) { + if (mutation.addedNodes.length) { + var elements = $(mutation.addedNodes).find(elementSelector); + for (var i = 0, len = elements.length; i < len; i++) { + let me = elements[i]; + me = $(me); + callback(me); + } + } + }); + }; + + var target = $(containerSelector)[0]; + var config = { childList: true, subtree: true }; + var MutationObserver = window.MutationObserver; + var observer = new MutationObserver(onMutationsObserved); + observer.observe(target, config); + }); +} diff --git a/web/public/js/modal.js b/web/public/js/modal.js new file mode 100644 index 0000000..792cd85 --- /dev/null +++ b/web/public/js/modal.js @@ -0,0 +1,64 @@ +$(document).on('click', ".modal-close", (o) => { + $(o.target).closest('.modal-container').remove(); +}); + +const initDrag = (header, modal, container) => { + let drag = false; + + let mouseX, mouseY, modalX, modalY; + + const onStart = (e) => { + e = e || window.event; + e.preventDefault(); + mouseX = e.clientX; + mouseY = e.clientY; + drag = true; + }; + + const onDrag = (e) => { + e = e || window.event; + e.preventDefault(); + if (!drag) { + return; + } + modalX = mouseX - e.clientX; + modalY = mouseY - e.clientY; + mouseX = e.clientX; + mouseY = e.clientY; + + let posX = (modal.offsetLeft - modalX), + posY = (modal.offsetTop - modalY); + + let minX = modal.offsetWidth / 2, + minY = modal.offsetHeight / 2; + + let maxX = container.offsetWidth - minX, + maxY = container.offsetHeight - minY; + + posX = Math.max(minX, Math.min(maxX, posX)); + posY = Math.max(minY, Math.min(maxY, posY)); + + posX = posX / container.offsetWidth * 100; + posY = posY / container.offsetHeight * 100; + + modal.style.left = posX + "%"; + modal.style.top = posY + "%"; + }; + + const onEnd = () => { + drag = false; + }; + + header.onmousedown = onStart; + container.onmousemove = onDrag; + container.onmouseup = onEnd; +}; + +observe('body', '.modal-header', function(el) { + let header = $(el); + let modal = header.closest('.modal'); + let container = header.closest('.modal-container'); + initDrag( + header[0], modal[0], container[0] + ); +}); diff --git a/web/public/js/post.js b/web/public/js/post.js new file mode 100644 index 0000000..736fa2b --- /dev/null +++ b/web/public/js/post.js @@ -0,0 +1,38 @@ +observe('.post', '.action-load-comments', function(me) { + me.on('click', function() { + let page = me.attr('page'); + if (!page) { + page = '1'; + } + let newPage = Number(page) + 1; + let id = me.attr('postId'); + me.attr('page', newPage + ''); + let url = '/home/comments?page=' + page + '&id=' + id; + $.get(url, function (data) { + if (data === '') { + me.remove(); + } else { + $(me).prepend(data); + } + }); + }); +}); + +observe('#main-content', '#action-load-posts', function(me) { + me.on('click', function () { + let page = me.attr('page'); + if (!page) { + page = '1'; + } + let newPage = Number(page) + 1; + me.attr('page', newPage + ''); + let url = '/home/posts?page=' + page; + $.get(url, function (data) { + if (data === '') { + me.remove(); + } else { + $('#post-container').append(data); + } + }); + }); +}); diff --git a/web/routes/error/controller.php b/web/routes/error/controller.php new file mode 100644 index 0000000..3cb2345 --- /dev/null +++ b/web/routes/error/controller.php @@ -0,0 +1,20 @@ +model = $model; + } + + public function index() { + parent::index(); + $data = $this->model->get_data(); + $this->view('header', $data); + $this->app_view('error', $data); + } + +} + +?> diff --git a/web/routes/error/model.php b/web/routes/error/model.php new file mode 100644 index 0000000..a30fccc --- /dev/null +++ b/web/routes/error/model.php @@ -0,0 +1,31 @@ +get_msg($data); + return $data; + } +} +?> diff --git a/web/routes/error/views/error.php b/web/routes/error/views/error.php new file mode 100644 index 0000000..3b926bc --- /dev/null +++ b/web/routes/error/views/error.php @@ -0,0 +1,4 @@ +
+

+ +
diff --git a/web/routes/home/controller.php b/web/routes/home/controller.php new file mode 100644 index 0000000..775e43a --- /dev/null +++ b/web/routes/home/controller.php @@ -0,0 +1,84 @@ +model = $model; + } + + public function index() { + parent::index(); + $data = $this->model->get_data(); + $this->view('header', $data); + $this->app_view('main', $data); + } + + public function posts() { + $page = $this->main->get_num('page', 0); + $page_size = 20; + $offset = $page * $page_size; + + $user = $this->main->user(); + + $query = $this->db; + + if ($user) { + $query = $query->select('p.*, l.post_id IS NOT NULL as liked'); + } else { + $query = $query->select('p.*, FALSE as liked'); + } + + $query = $query->from('admin.post p'); + + if ($user) { + $query = $query->join('admin.like l', 'p.id = l.post_id') + ->where('l.user_id')->eq($user['id']) + ->or()->where('l.user_id IS NULL'); + } + + $posts = $query->limit($page_size) + ->offset($offset) + ->rows(); + + $users = $this->main->get_users($posts); + + foreach ($posts as $post) { + $data = array(); + $data['user'] = $users[$post['user_id']]; + $data['post'] = $post; + $this->view('template/post', $data); + } + } + + public function comments() { + $page = $this->main->get_num('page', 0); + $id = $this->main->get_num('id'); + $page_size = 20; + $offset = $page * $page_size; + + $comments = $this->db + ->select('*') + ->from('admin.comment') + ->limit($page_size) + ->offset($offset) + ->rows(); + + $users = $this->main->get_users($comments); + + foreach ($comments as $comment) { + $data = array(); + $data['user'] = $users[$comment['user_id']]; + $data['comment'] = $comment; + $this->view('template/comment', $data); + } + } + + public function new_post_modal() { + $this->modal(lang('new_post_modal_title'), 'new-post'); + } + +} + +?> diff --git a/web/routes/home/model.php b/web/routes/home/model.php new file mode 100644 index 0000000..44a8549 --- /dev/null +++ b/web/routes/home/model.php @@ -0,0 +1,19 @@ +db + ->select('*') + ->from('admin.post') + ->limit(20) + ->rows(); + } + + public function get_data() { + $data = parent::get_data(); + $data['title'] = lang('title'); + $data['posts'] = $this->get_posts(); + return $data; + } +} +?> diff --git a/web/routes/home/views/main.php b/web/routes/home/views/main.php new file mode 100644 index 0000000..bf0087b --- /dev/null +++ b/web/routes/home/views/main.php @@ -0,0 +1,29 @@ + +
+ +
+
+ view('template/pfp', array('user' => $self))?> + + + +
+ +
+ +
+ posts()?> +
+ +
diff --git a/web/views/footer.php b/web/views/footer.php new file mode 100644 index 0000000..6cbe21b --- /dev/null +++ b/web/views/footer.php @@ -0,0 +1,2 @@ + + diff --git a/web/views/header.php b/web/views/header.php new file mode 100644 index 0000000..183f4f4 --- /dev/null +++ b/web/views/header.php @@ -0,0 +1,74 @@ + +main->user(); +?> + + + + main->link_js($js); + } + foreach ($css_files as $css) { + echo $this->main->link_css($css); + } + ?> + <?=$title?> + + + diff --git a/web/views/modal/new-post.php b/web/views/modal/new-post.php new file mode 100644 index 0000000..7215862 --- /dev/null +++ b/web/views/modal/new-post.php @@ -0,0 +1,28 @@ +main->user(); +?> +
+
+
+ view('template/pfp', array('user' => $user))?> +
+ + +
+
+ +
+ +
diff --git a/web/views/template/comment.php b/web/views/template/comment.php new file mode 100644 index 0000000..ef7a081 --- /dev/null +++ b/web/views/template/comment.php @@ -0,0 +1,10 @@ +
+ view('template/pfp', array('user' => $user))?> +
+
+ main->display_name($user)?> + main->display_date($comment['date'])?> +
+ +
+
diff --git a/web/views/template/modal.php b/web/views/template/modal.php new file mode 100644 index 0000000..4f47400 --- /dev/null +++ b/web/views/template/modal.php @@ -0,0 +1,12 @@ + diff --git a/web/views/template/pfp.php b/web/views/template/pfp.php new file mode 100644 index 0000000..842fc92 --- /dev/null +++ b/web/views/template/pfp.php @@ -0,0 +1,6 @@ + + + + diff --git a/web/views/template/post.php b/web/views/template/post.php new file mode 100644 index 0000000..d9c7c92 --- /dev/null +++ b/web/views/template/post.php @@ -0,0 +1,58 @@ +
+
+ view('template/pfp', array('user' => $user))?> +
+ + +
+
+

+ +

+main->user(); +?> + +
+
+ + +
+
+ +
+ +
+ comments(); + ilang('action_load_comments', + class: 'action-load-comments btn btn-line mt', + attrs: array('postId' => $post['id']) + ); + ?> +
+ +
+ view('template/pfp', array('user' => $user))?> +
+ + +
+
+ +
-- cgit v1.2.3-freya