summaryrefslogtreecommitdiff
path: root/src/web/_views
diff options
context:
space:
mode:
authorFreya Murphy <freya@freyacat.org>2024-04-01 11:09:25 -0400
committerFreya Murphy <freya@freyacat.org>2024-04-01 11:09:25 -0400
commit3a82baec9d793edf81ac2b151b0f4d4159641375 (patch)
treef9d50c296b078ac48c2a2391c172c3ccf37edb3f /src/web/_views
parentrefactor asset dir, refactor oberver in lib (diff)
downloadxssbook2-3a82baec9d793edf81ac2b151b0f4d4159641375.tar.gz
xssbook2-3a82baec9d793edf81ac2b151b0f4d4159641375.tar.bz2
xssbook2-3a82baec9d793edf81ac2b151b0f4d4159641375.zip
login and register, liking on homepage
Diffstat (limited to 'src/web/_views')
-rw-r--r--src/web/_views/apps/auth/login.php86
-rw-r--r--src/web/_views/apps/error/main.php6
-rw-r--r--src/web/_views/apps/home/main.php27
-rw-r--r--src/web/_views/footer.php8
-rw-r--r--src/web/_views/header.php62
-rw-r--r--src/web/_views/header_empty.php23
-rw-r--r--src/web/_views/modal/new_post.php59
-rw-r--r--src/web/_views/modal/register.php173
-rw-r--r--src/web/_views/template/comment.php15
-rw-r--r--src/web/_views/template/error.php12
-rw-r--r--src/web/_views/template/modal.php14
-rw-r--r--src/web/_views/template/pfp.php8
-rw-r--r--src/web/_views/template/post.php86
-rw-r--r--src/web/_views/template/posts.php23
-rw-r--r--src/web/_views/template/toast.php26
15 files changed, 628 insertions, 0 deletions
diff --git a/src/web/_views/apps/auth/login.php b/src/web/_views/apps/auth/login.php
new file mode 100644
index 0000000..d7f326b
--- /dev/null
+++ b/src/web/_views/apps/auth/login.php
@@ -0,0 +1,86 @@
+<?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php /* vi: syntax=php */ ?>
+<div id="main-content">
+ <div class="branding col">
+ <h1>xssbook</h1>
+ <span><?=lang('login_branding')?></span>
+ </div>
+ <div class="form card col">
+ <form id="action-login" class="col" action="">
+ <div class="rel mb">
+ <input
+ type="text"
+ name="username"
+ id="login-username"
+ placeholder=" "
+ >
+ <label for="username">
+ <?=lang('ph_username')?>
+ </label>
+ </div>
+ <div class="rel mb">
+ <input
+ type="password"
+ name="password"
+ id="login-password"
+ placeholder=" "
+ >
+ <label for="password">
+ <?=lang('ph_password')?>
+ </label>
+ </div>
+ <?=ilang('action_login',
+ class: 'btn btn-submit btn-wide',
+ button: TRUE,
+ attrs: array('type' => 'submit')
+ )?>
+ <?=ilang('action_forgot_passwd',
+ class: 'btn btn-line btn-blue btn-wide mt'
+ )?>
+ </form>
+ <hr>
+ <?=ilang('action_create_account',
+ id: 'action-register',
+ class: 'btn btn-success btn-wide',
+ button: TRUE,
+ attrs: array('type' => 'submit')
+ )?>
+ </div>
+ <script>
+
+ var onLogin = function(data) {
+ let jwt = data.token;
+
+ $.ajax({
+ url: '/auth/update',
+ method: 'POST',
+ data: JSON.stringify({
+ key: 'jwt',
+ value: jwt
+ }),
+ success: function (_) {
+ window.location = '/home';
+ }
+ })
+ };
+
+ $('#action-login').on('submit', function(e) {
+ e.preventDefault();
+ let username = $('#login-username').val();
+ let password = $('#login-password').val();
+
+ $.ajax({
+ url: '/api/rpc/login',
+ method: 'POST',
+ data: JSON.stringify({ username, password }),
+ success: onLogin
+ });
+ });
+
+ $('#action-register').on('click', function() {
+ $.get( "/modal/register", function (data) {
+ $(document.body).append(data);
+ });
+ })
+ </script>
+</div>
diff --git a/src/web/_views/apps/error/main.php b/src/web/_views/apps/error/main.php
new file mode 100644
index 0000000..dde39cf
--- /dev/null
+++ b/src/web/_views/apps/error/main.php
@@ -0,0 +1,6 @@
+<?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php /* vi: syntax=php */ ?>
+<div id="main-content">
+ <h1><?=$title?></h1>
+ <span><?=$msg?></span>
+</div>
diff --git a/src/web/_views/apps/home/main.php b/src/web/_views/apps/home/main.php
new file mode 100644
index 0000000..29bf7c3
--- /dev/null
+++ b/src/web/_views/apps/home/main.php
@@ -0,0 +1,27 @@
+<?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php /* vi: syntax=php */ ?>
+<div id="main-content">
+<?php if ($self): ?>
+ <div id="new-post" class="card">
+ <div class="row grow">
+ <?php $this->view('template/pfp', array('user' => $self))?>
+ <a
+ id="action-new-post"
+ class="btn btn-alt btn-wide ml"
+ autocomplete="off"
+ aria-label="<?=lang('action_new_post_tip')?>"
+ >
+ <?=lang('action_new_post_text', sub: [$self['first_name']])?>
+ </a>
+ </div>
+ <script>
+ $('#action-new-post').on('click', function() {
+ $.get( "/modal/new_post", function (data) {
+ $(document.body).append(data);
+ });
+ })
+ </script>
+ </div>
+<?php endif; ?>
+ <?php $this->post_controller->index(); ?>
+</div>
diff --git a/src/web/_views/footer.php b/src/web/_views/footer.php
new file mode 100644
index 0000000..9040c3a
--- /dev/null
+++ b/src/web/_views/footer.php
@@ -0,0 +1,8 @@
+<?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php /* vi: syntax=php */ ?>
+ <footer>
+ Freya Murphy © 2023 | <a href="https://freya.cat">freya.cat</a>
+ </footer>
+ <body>
+
+</html>
diff --git a/src/web/_views/header.php b/src/web/_views/header.php
new file mode 100644
index 0000000..7c60197
--- /dev/null
+++ b/src/web/_views/header.php
@@ -0,0 +1,62 @@
+<?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php /* vi: syntax=php */ ?>
+<?php
+ $self = $this->main->user();
+ $this->view('header_empty', $data);
+?>
+ <header class="nav">
+ <div class="nav-left">
+ <span class="logo">xssbook</span>
+ </div>
+ <div class="nav-center" :class="{hidden: !visible}">
+ <a
+ id="action-home"
+ class="btn"
+ href="/home"
+ title="<?=lang('action_home_tip')?>"
+ >
+ <i class="mi mi-lg">home</i>
+ <span><?=lang('action_home_text')?></span>
+ </a>
+ <a
+ id="action-people"
+ class="btn"
+ href="/people"
+ title="<?=lang('action_people_tip')?>"
+ >
+ <i class="mi mi-lg">people</i>
+ <span><?=lang('action_people_text')?></span>
+ </a>
+ <a
+ id="action-chat"
+ class="btn"
+ href="/chat"
+ title="<?=lang('action_chat_tip')?>"
+ >
+ <i class="mi mi-lg">chat</i>
+ <span><?=lang('action_chat_text')?></span>
+ </a>
+ </div>
+ <div class="nav-right">
+ <button
+ id="action-hamburger"
+ title="<?=lang('action_hamburger_tip')?>"
+ >
+ <i class="mi mi-lg">menu</i>
+ </button>
+ <?php if($self): ?>
+ <?php $this->view('template/pfp', array(
+ 'user' => $self,
+ 'class' => 'pfp-sm ml',
+ )); ?>
+ <?php else: ?>
+ <?=ilang('action_login', class: 'btn', href: '/auth/login')?>
+ <?php endif; ?>
+ </div>
+ <script>
+ $('#action-hamburger').on('click', function() {
+ let menu = $('.nav-center');
+ menu.toggleClass('visible');
+ });
+ </script>
+ </header>
diff --git a/src/web/_views/header_empty.php b/src/web/_views/header_empty.php
new file mode 100644
index 0000000..75f6f17
--- /dev/null
+++ b/src/web/_views/header_empty.php
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <script>
+ <?php if ($this->main->session): ?>
+ var jwtStr = <?=json_encode($this->main->session['jwt'])?>;
+ <?php else: ?>
+ var jwtStr = null;
+ <?php endif; ?>
+ </script>
+ <?php
+ foreach ($js_files as $js) {
+ echo $this->main->link_js($js);
+ }
+ foreach ($css_files as $css) {
+ echo $this->main->link_css($css);
+ }
+ ?>
+ <title><?=$title?></title>
+ </head>
+ <body>
+ <div id="toast-container">
+ </div>
diff --git a/src/web/_views/modal/new_post.php b/src/web/_views/modal/new_post.php
new file mode 100644
index 0000000..50b9b84
--- /dev/null
+++ b/src/web/_views/modal/new_post.php
@@ -0,0 +1,59 @@
+<?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php /* vi: syntax=php */ ?>
+<?php
+ $user = $this->main->user();
+?>
+<form id="new-post-form">
+<div class="modal-content new-post-modal">
+ <div class="row">
+ <?php $this->view('template/pfp', array('user' => $user))?>
+ <div class="col ml">
+ <strong><?=$user['first_name'] . ' ' . $user['last_name']?></strong>
+ <span class="dim"><?=lang('now')?></span>
+ </div>
+ </div>
+ <textarea
+ type="text"
+ name="content"
+ id="new-post-content"
+ placeholder="<?=lang('action_new_post_text', sub: [$user['first_name']])?>"
+ ></textarea>
+</div>
+<div class="modal-footer">
+ <?=ilang('action_submit',
+ id: 'new-post-submit',
+ class: 'btn btn-wide btn-submit',
+ attrs: array('type' => 'submit'),
+ button: TRUE
+ )?>
+</div>
+</form>
+<script>
+ $('#new-post-form').submit(function(e) {
+ e.preventDefault();
+ let content = $('#new-post-content').val();
+ let me = $(this);
+
+ const getPost = function(data) {
+ if (data) {
+ $('#post-container').prepend(data);
+ }
+ me.closest('.modal-container').remove();
+ }
+
+ const onPost = function(data) {
+ let id = data[0].id;
+ $.get({
+ url: '/_util/post/post?id=' + id,
+ success: getPost
+ });
+ }
+
+ $.ajax({
+ url: '/api/post',
+ method: 'POST',
+ data: JSON.stringify({ content }),
+ success: onPost
+ });
+ });
+</script>
diff --git a/src/web/_views/modal/register.php b/src/web/_views/modal/register.php
new file mode 100644
index 0000000..f4d364a
--- /dev/null
+++ b/src/web/_views/modal/register.php
@@ -0,0 +1,173 @@
+
+<?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php /* vi: syntax=php */ ?>
+<form id="register-form">
+<div class="modal-content register-modal col">
+ <label class="static">
+ <?=lang('ph_basic_info')?>
+ </label>
+ <div class="row mt">
+ <div class="rel btn-wide">
+ <input
+ type="text"
+ name="first_name"
+ id="register-first-name"
+ placeholder=" "
+ >
+ <label for="first_name">
+ <?=lang('ph_first_name')?>
+ </label>
+ </div>
+ <div class="rel ml btn-wide">
+ <input
+ type="text"
+ name="last_name"
+ id="register-last-name"
+ placeholder=" "
+ >
+ <label for="last_name">
+ <?=lang('ph_last_name')?>
+ </label>
+ </div>
+ </div>
+ <div class="rel mt">
+ <input
+ type="text"
+ name="username"
+ id="register-username"
+ placeholder=" "
+ >
+ <label for="username">
+ <?=lang('ph_username')?>
+ </label>
+ </div>
+ <div class="rel mt">
+ <input
+ type="password"
+ name="password"
+ id="register-password"
+ placeholder=" "
+ >
+ <label for="password">
+ <?=lang('ph_password')?>
+ </label>
+ </div>
+ <div class="rel mt">
+ <input
+ type="text"
+ name="email"
+ id="register-email"
+ placeholder=" "
+ >
+ <label for="email">
+ <?=lang('ph_email')?>
+ </label>
+ </div>
+ <label for="birth_date" class="mt static">
+ <?=lang('ph_birth_date')?>
+ </label>
+ <input
+ class="mt"
+ type="date"
+ name="birth_date"
+ id="register-birth-date"
+ >
+ <label for="gender" class="mt static">
+ <?=lang('ph_gender')?>
+ </label>
+ <div class="row mt" data-type="radio" data-name="gender-wrapper">
+ <div class="rel radio mr">
+ <input
+ type="radio"
+ id="register-gender-male"
+ name="gender"
+ value="male"
+ >
+ <label
+ for="register-gender-male"
+ class="static"
+ >
+ <?=lang('ph_gender_male')?>
+ </label>
+ </div>
+ <div class="rel radio mr">
+ <input
+ type="radio"
+ id="register-gender-female"
+ name="gender"
+ value="female"
+ >
+ <label
+ for="register-gender-female"
+ class="static"
+ >
+ <?=lang('ph_gender_female')?>
+ </label>
+ </div>
+ <div class="rel radio">
+ <input
+ type="radio"
+ id="register-gender-lettuce"
+ name="gender"
+ value="lettuce"
+ >
+ <label
+ for="register-gender-lettuce"
+ class="static"
+ >
+ <?=lang('ph_gender_lettuce')?>
+ </label>
+ </div>
+ </div>
+</div>
+<div class="modal-footer">
+ <?=ilang('action_register',
+ id: 'register-submit',
+ class: 'btn btn-wide btn-success',
+ attrs: array('type' => 'submit'),
+ button: TRUE
+ )?>
+</div>
+</form>
+<script>
+ $('#register-form').submit(function(e) {
+ e.preventDefault();
+
+ const form = event.target;
+ const formFields = form.elements;
+
+ let first_name = formFields.first_name.value.trim();
+ let last_name = formFields.last_name.value.trim();
+ let username = formFields.username.value.trim();
+ let password = formFields.password.value.trim();
+ let email = formFields.email.value.trim();
+ let birth_date = formFields.birth_date.value.trim();
+ let gender = formFields.gender.value.trim();
+
+ if(birth_date === '') {
+ errorToast('toast_date_empty');
+ return;
+ }
+
+ const onSuccess = () => {
+ $.ajax({
+ url: '/api/rpc/login',
+ method: 'POST',
+ data: JSON.stringify({
+ username, password
+ }),
+ success: onLogin
+ });
+ };
+
+ $.ajax({
+ url: '/api/user',
+ method: 'POST',
+ data: JSON.stringify({
+ first_name, last_name, username, password,
+ email, birth_date, gender
+ }),
+ success: onSuccess
+ });
+ });
+</script>
diff --git a/src/web/_views/template/comment.php b/src/web/_views/template/comment.php
new file mode 100644
index 0000000..3ff473b
--- /dev/null
+++ b/src/web/_views/template/comment.php
@@ -0,0 +1,15 @@
+<?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php /* vi: syntax=php */ ?>
+<?php
+ $format_model = $this->load->model('format');
+?>
+<div class="comment row mt">
+ <?php $this->view('template/pfp', array('user' => $user))?>
+ <div class="ml col sub-card">
+ <div class="row">
+ <strong><?=$format_model->name($user)?></strong>
+ <span class="dim ml"><?=$format_model->date($comment['created'])?></span>
+ </div>
+ <?=$comment['content']?>
+ </div>
+</div>
diff --git a/src/web/_views/template/error.php b/src/web/_views/template/error.php
new file mode 100644
index 0000000..2e02cb1
--- /dev/null
+++ b/src/web/_views/template/error.php
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title><?=$code . ' - ' . $msg?></title>
+ </head>
+ <body>
+ <center>
+ <h1><?=$code . ' ' . $msg?></h1>
+ </center>
+ <hr>
+ </body>
+</html>
diff --git a/src/web/_views/template/modal.php b/src/web/_views/template/modal.php
new file mode 100644
index 0000000..e3ce6fe
--- /dev/null
+++ b/src/web/_views/template/modal.php
@@ -0,0 +1,14 @@
+<?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php /* vi: syntax=php */ ?>
+<div class="modal-container">
+ <div class="modal">
+ <div class="modal-header row">
+ <?=$title?>
+ <?=ilang(
+ 'action_modal_close',
+ class: 'float-right btn btn-action modal-close',
+ )?>
+ </div>
+ <?php $this->view('modal/' . $content) ?>
+ </div>
+</div>
diff --git a/src/web/_views/template/pfp.php b/src/web/_views/template/pfp.php
new file mode 100644
index 0000000..aec7318
--- /dev/null
+++ b/src/web/_views/template/pfp.php
@@ -0,0 +1,8 @@
+<?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php /* vi: syntax=php */ ?>
+<?php
+ $class = isset($class) ? $class : '';
+?>
+<a class="image-loading pfp <?=$class?>" href="/profile?id=<?=$user['id']?>">
+ <img src="/api/rpc/avatar?user_id=<?=$user['id']?>" />
+</a>
diff --git a/src/web/_views/template/post.php b/src/web/_views/template/post.php
new file mode 100644
index 0000000..83a72bf
--- /dev/null
+++ b/src/web/_views/template/post.php
@@ -0,0 +1,86 @@
+<?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php /* vi: syntax=php */ ?>
+<div class="post card">
+ <div class="row">
+ <?php $this->view('template/pfp', array('user' => $user))?>
+ <div class="col ml">
+ <strong><?=$user['first_name'] . ' ' . $user['last_name']?></strong>
+ <span class="dim"><?=$post['created']?></span>
+ </div>
+ </div>
+ <p>
+ <?=$post['content']?>
+ </p>
+<?php
+ $self = $this->main->user();
+ $liked = $post['like_id'] ? 'btn-blue' : '';
+ $post_attrs = array(
+ 'postId' => $post['id']
+ );
+ if ($post['like_id'] !== NULL) {
+ $post_attrs['likeId'] = $post['like_id'];
+ }
+?>
+<?php if ($self): ?>
+ <hr>
+ <div class="row">
+ <?=ilang('action_like',
+ class: 'btn btn-wide action-like ' . $liked,
+ attrs: $post_attrs
+ )?>
+ <?=ilang('action_comment', class: 'btn btn-wide action-comment',
+ click: '$(\'#action-new-comment-' . $post['id'] . '\').focus()'
+ )?>
+ </div>
+ <hr>
+<?php endif; ?>
+ <div class="col comments pb">
+ <?php
+ $_GET = array('id' => $post['id']);
+ $cdata = $this->comments();
+
+ $loaded = $cdata['loaded'];
+ $max = $cdata['max'];
+ $page_size = $cdata['page_size'];
+ $total = $post['comment_count'];
+
+ if ($loaded >= $page_size && $page_size < $total) {
+ ilang('action_load_comments',
+ class: 'action-load-comments btn btn-line mt',
+ attrs: array(
+ 'postId' => $post['id'],
+ 'loaded' => $loaded,
+ 'pageSize' => $page_size,
+ 'commentCount' => $total,
+ 'commentMax' => $max,
+ )
+ );
+ }
+
+ ?>
+ </div>
+<?php if ($self): ?>
+ <div class="row pb">
+ <?php $this->view('template/pfp', array('user' => $user))?>
+ <form class="ml action-new-comment-form row">
+ <input
+ type="hidden"
+ name="id"
+ value="<?=$post['id']?>"
+ >
+ <input
+ id="action-new-comment-<?=$post['id']?>"
+ class="action-new-comment btn btn-wide btn-alt"
+ postId="<?=$post['id']?>"
+ autocomplete="off"
+ type="text"
+ name="text"
+ placeholder="<?=lang('action_new_comment_text')?>"
+ aria-label="<?=lang('action_new_comment_tip')?>"
+ >
+ </form>
+ </div>
+<?php endif; ?>
+</div>
+
+
diff --git a/src/web/_views/template/posts.php b/src/web/_views/template/posts.php
new file mode 100644
index 0000000..5e9156c
--- /dev/null
+++ b/src/web/_views/template/posts.php
@@ -0,0 +1,23 @@
+<div id="post-container">
+<?php
+ $pdata = $this->posts();
+
+ $loaded = $pdata['loaded'];
+ $page_size = $pdata['page_size'];
+ $total = $pdata['total'];
+ $max = $pdata['max'];
+
+ if ($loaded >= $page_size && $page_size < $total) {
+ ilang('action_load_posts',
+ id: 'action-load-posts',
+ class: 'btn btn-line btn-wide mb',
+ attrs: array(
+ 'loaded' => $loaded,
+ 'pageSize' => $page_size,
+ 'postCount' => $total,
+ 'postMax' => $max,
+ )
+ );
+ }
+?>
+</div>
diff --git a/src/web/_views/template/toast.php b/src/web/_views/template/toast.php
new file mode 100644
index 0000000..ae2e7d8
--- /dev/null
+++ b/src/web/_views/template/toast.php
@@ -0,0 +1,26 @@
+<?php /* Copyright (c) 2024 Freya Murphy */ ?>
+<?php /* vi: syntax=php */ ?>
+<?php
+ $params = array();
+
+ if ($detail) {
+ array_push($params, lang('api_column_' . $detail));
+ }
+
+ if ($hint) {
+ array_push($params, $hint);
+ }
+
+ $lang_msg = lang($msg, FALSE, sub: $params);
+
+ if(!$lang_msg) {
+ $lang_msg = $msg;
+ } else {
+ $lang_msg = ucfirst($lang_msg);
+ }
+
+?>
+<div class="toast error">
+ <?=$lang_msg?>
+ <?=ilang('action_close', class: 'action-close-toast')?>
+</div>
generated by cgit v1.2.3-freya (git 2.51.0) at 2025-09-22 17:58:55 +0000