Combine create wishlist with other options

This commit is contained in:
Jay Trees 2022-02-25 09:23:16 +01:00
parent c4af18f062
commit dcc19aed2e
7 changed files with 242 additions and 189 deletions

View file

@ -16,6 +16,30 @@ $response = array(
require '../../index.php';
switch ($_SERVER['REQUEST_METHOD']) {
case 'POST':
/**
* Create
*/
if (isset($_POST['wishlist-name'], $_SESSION['user']['id'])) {
$database->query('INSERT INTO `wishlists`
(
`user`,
`name`,
`hash`
) VALUES (
' . $_SESSION['user']['id'] . ',
"' . $_POST['wishlist-name'] . '",
"' . sha1(time() . $_SESSION['user']['id'] . $_POST['wishlist-name']) . '"
)
;');
$response['success'] = true;
$response['data'] = array(
'lastInsertId' => $database->lastInsertId(),
);
}
break;
case 'GET':
if (isset($_GET['userid']) || isset($_SESSION['user']['id'])) {
$user = isset($_GET['userid']) ? new User($_GET['userid']) : new User();

View file

@ -33,10 +33,6 @@ img {
/**
* Card
*/
.wishlist-cards {
margin-top: 1rem;
}
.ui.card {
overflow: hidden;
}
@ -135,10 +131,3 @@ p .ui.horizontal.label {
cursor: default;
user-select: none;
}
/**
* Segment
*/
.ui.segments {
overflow: hidden;
}

View file

@ -10,7 +10,6 @@ if ('serviceWorker' in navigator) {
})
}
const urlParams = new URLSearchParams(window.location.search);
$(function() {

View file

@ -4,27 +4,31 @@ $(function () {
*/
var wishlists = [];
$('.ui.dropdown.wishlists').api({
action: 'get wishlists',
method: 'GET',
on: 'now',
onSuccess: function (response, element, xhr) {
wishlists = response.results;
function wishlistsRefresh() {
$('.ui.dropdown.wishlists').api({
action: 'get wishlists',
method: 'GET',
on: 'now',
onSuccess: function (response, element, xhr) {
wishlists = response.results;
element.dropdown({
values: wishlists,
placeholder: 'No wishlist selected.'
})
element.dropdown({
values: wishlists,
placeholder: 'No wishlist selected.'
})
if (urlParams.has('wishlist')) {
element.dropdown('set selected', urlParams.get('wishlist'));
} else {
if (wishlists[0]) {
element.dropdown('set selected', wishlists[0].value);
if (urlParams.has('wishlist')) {
element.dropdown('set selected', urlParams.get('wishlist'));
} else {
if (wishlists[0]) {
element.dropdown('set selected', wishlists[0].value);
}
}
}
}
});
});
}
wishlistsRefresh();
/**
* Selection
@ -53,7 +57,11 @@ $(function () {
/**
* Cards
*/
$('.wishlist-cards').html(wishlists[wishlistIndex].cards);
if (wishlistIndex >= 0) {
$('.wishlist-cards').html(wishlists[wishlistIndex].cards);
} else {
$('.wishlist-cards').html('');
}
/**
* Generate cache
@ -292,7 +300,7 @@ $(function () {
onSuccess: function () {
column.fadeOut();
location.reload();
wishlistsRefresh();
},
});
}
@ -329,7 +337,7 @@ $(function () {
button.removeClass('loading');
location.reload();
wishlistsRefresh();
});
return false;
@ -420,4 +428,44 @@ $(function () {
});
});
/**
* Create wishlist
*/
$(document).on('click', '.button.wishlist-create', function () {
var modalWishlistCreate = $('.ui.modal.wishlist-create');
var formWishlistCreate = modalWishlistCreate.find('.ui.form');
modalWishlistCreate
.modal({
onApprove: function (buttonCreate) {
const formData = new URLSearchParams(new FormData(formWishlistCreate[0]));
formWishlistCreate.addClass('loading');
buttonCreate.addClass('loading');
fetch('/src/api/wishlists.php', {
method: 'POST',
body: formData
})
.then(response => response.json())
.then(response => {
if(response.success) {
modalWishlistCreate.modal('hide');
urlParams.set('wishlist', response.data.lastInsertId);
wishlistsRefresh();
}
})
.finally(() => {
formWishlistCreate.removeClass('loading');
buttonCreate.removeClass('loading');
});
return false;
}
})
.modal('show');
});
});

View file

@ -81,87 +81,85 @@ class Wishlist
$cardIndex = 0;
if (!empty($products)) { ?>
<div class="ui container">
<div class="ui stackable three column grid">
<?php foreach ($products as $product) {
$cache = new EmbedCache($product['url']);
$info = $cache->get(false);
$exists = $cache->exists() ? 'true' : 'false';
?>
<div class="column">
<div class="ui fluid card stretch" data-id="<?= $product['id'] ?>" data-index="<?= $cardIndex ?>" data-cache="<?= $exists ?>">
<div class="ui stackable three column grid">
<?php foreach ($products as $product) {
$cache = new EmbedCache($product['url']);
$info = $cache->get(false);
$exists = $cache->exists() ? 'true' : 'false';
?>
<div class="column">
<div class="ui fluid card stretch" data-id="<?= $product['id'] ?>" data-index="<?= $cardIndex ?>" data-cache="<?= $exists ?>">
<?php if ($info->image) { ?>
<div class="image">
<img class="preview" src="<?= $info->image ?>" loading="lazy"/>
<?php if ($info->image) { ?>
<div class="image">
<img class="preview" src="<?= $info->image ?>" loading="lazy"/>
<?php if ($info->favicon) { ?>
<img class="favicon" src="<?= $info->favicon ?>" loading="lazy"/>
<?php } ?>
<?php if ($info->favicon) { ?>
<img class="favicon" src="<?= $info->favicon ?>" loading="lazy"/>
<?php } ?>
<?php if ($info->providerName) { ?>
<span class="provider"><?= $info->providerName ?></span>
<?php } ?>
<?php if ($info->providerName) { ?>
<span class="provider"><?= $info->providerName ?></span>
<?php } ?>
<?php if ($userIsCurrent) { ?>
<button class="ui icon button refresh">
<i class="refresh icon"></i>
</button>
<?php if ($userIsCurrent) { ?>
<button class="ui icon button refresh">
<i class="refresh icon"></i>
</button>
<?php } ?>
</div>
<?php } ?>
<div class="content">
<?php if ($info->title) { ?>
<div class="header">
<?php if ($info->url) { ?>
<a href="<?= $info->url ?>" target="_blank"><?= $info->title ?></a>
<?php } else { ?>
<?= $info->title ?>
<?php } ?>
</div>
<?php } ?>
<div class="content">
<?php if ($info->title) { ?>
<div class="header">
<?php if ($info->url) { ?>
<a href="<?= $info->url ?>" target="_blank"><?= $info->title ?></a>
<?php } else { ?>
<?= $info->title ?>
<?php } ?>
</div>
<?php } ?>
<?php if ($info->keywords) { ?>
<div class="meta">
<?= implode(', ', $info->keywords) ?>
</div>
<?php } ?>
<?php if ($info->description) { ?>
<div class="description">
<?= $info->description ?>
</div>
<?php } ?>
</div>
<div class="extra content buttons">
<?php if (!$userIsCurrent) { ?>
<a class="ui small primary labeled icon button commit">
<i class="shopping cart icon"></i>
Commit
</a>
<?php } ?>
<?php if ($info->url) { ?>
<a class="ui small right labeled icon button" href="<?= $info->url ?>" target="_blank">
<i class="external icon"></i>
View
</a>
<?php } ?>
<?php if ($userIsCurrent) { ?>
<a class="ui small labeled red icon button delete">
<i class="trash icon"></i>
Delete
</a>
<?php } ?>
</div>
<?php if ($info->keywords) { ?>
<div class="meta">
<?= implode(', ', $info->keywords) ?>
</div>
<?php } ?>
<?php if ($info->description) { ?>
<div class="description">
<?= $info->description ?>
</div>
<?php } ?>
</div>
<div class="extra content buttons">
<?php if (!$userIsCurrent) { ?>
<a class="ui small primary labeled icon button commit">
<i class="shopping cart icon"></i>
Commit
</a>
<?php } ?>
<?php if ($info->url) { ?>
<a class="ui small right labeled icon button" href="<?= $info->url ?>" target="_blank">
<i class="external icon"></i>
View
</a>
<?php } ?>
<?php if ($userIsCurrent) { ?>
<a class="ui small labeled red icon button delete">
<i class="trash icon"></i>
Delete
</a>
<?php } ?>
</div>
</div>
<?php } ?>
</div>
</div>
<?php } ?>
</div>
<? $cardIndex++ ?>

View file

@ -68,14 +68,18 @@ $page->navigation();
</div>
</div>
<div class="wishlist-cards">
<?php
echo $wishlist->getCards(
array(
'exclude' => array('unavailable'),
)
);
?>
<div class="ui container">
<h2 class="ui header">Products</h2>
<div class="wishlist-cards">
<?php
echo $wishlist->getCards(
array(
'exclude' => array('unavailable'),
)
);
?>
</div>
</div>
</main>

View file

@ -11,47 +11,20 @@ use wishthis\{Page, User, Wishlist};
$page = new page(__FILE__, 'Wishlists');
$page->header();
$page->navigation();
/**
* Create
*/
if (isset($_POST['wishlist-create'], $_POST['name'])) {
$database->query('INSERT INTO `wishlists`
(
`user`,
`name`,
`hash`
) VALUES (
' . $_SESSION['user']['id'] . ',
"' . $_POST['name'] . '",
"' . sha1(time() . $_SESSION['user']['id'] . $_POST['name']) . '"
)
;');
header('Location: /?page=wishlists');
die();
}
/**
* Delete
*/
if (isset($_POST['wishlist_delete_id'])) {
$database->query('DELETE FROM `wishlists`
WHERE id = ' . $_POST['wishlist_delete_id'] . '
;');
}
?>
<main>
<div class="ui container">
<h1 class="ui header"><?= $page->title ?></h1>
<p>Here you can view and edit all of your wishlists.</p>
<div class="ui equal width stackable grid">
<h2 class="ui header">View</h2>
<div class="column">
<div class="ui segment form">
<h2 class="ui header">View</h2>
<p>Please select a wishlist to view.</p>
<div class="ui horizontal stackable segments">
<div class="ui segment">
<p>Please select a wishlist to view.</p>
<div class="ui form">
<div class="field">
<label>Wishlist</label>
<select class="ui fluid search selection dropdown loading wishlists" name="wishlist">
@ -59,65 +32,82 @@ if (isset($_POST['wishlist_delete_id'])) {
</select>
</div>
</div>
<div class="ui divider"></div>
<a class="ui small labeled icon button wishlist-product-add disabled">
<i class="add icon"></i>
Add a product
</a>
<a class="ui small labeled icon button wishlist-share disabled" target="_blank">
<i class="share icon"></i>
Share
</a>
<form class="ui form wishlist-delete" method="post" style="display: inline-block;">
<input type="hidden" name="wishlist_delete_id" />
<button class="ui small labeled red icon button disabled" type="submit">
<i class="trash icon"></i>
Delete
</button>
</form>
</div>
<div class="column">
<div class="ui segment">
<h2 class="ui header">Create</h2>
<p>
Choose a new name for your wishlist.
Here's a suggestion to get you started!
</p>
<div class="ui segment">
<p>General options.</p>
<form class="ui form" method="post">
<div class="field">
<label>Name</label>
<input type="text"
name="name"
placeholder="<?= getCurrentSeason() ?>"
value="<?= getCurrentSeason() ?>"
/>
</div>
<input class="ui primary button"
type="submit"
name="wishlist-create"
value="Create"
/>
</form>
</div>
<a class="ui small labeled icon button wishlist-create">
<i class="add icon"></i>
Create a wishlist
</a>
</div>
</div>
<div class="ui segment">
<h2 class="ui header">Options</h1>
<p>Wishlist related options.</p>
<h2 class="ui header">Products</h2>
<a class="ui small labeled icon button wishlist-product-add disabled">
<i class="add icon"></i>
Add a product
</a>
<div class="wishlist-cards"></div>
</div>
</main>
<a class="ui small labeled icon button wishlist-share disabled" target="_blank">
<i class="share icon"></i>
Share
</a>
<!-- Wishlist: Create -->
<div class="ui modal wishlist-create">
<div class="header">
Create a wishlist
</div>
<div class="content">
<div class="description">
<div class="ui header">Wishlist</div>
<p>
Choose a new name for your wishlist.
Here's a suggestion to get you started.
</p>
<form class="ui form wishlist-delete" method="post" style="display: inline-block;">
<input type="hidden" name="wishlist_delete_id" />
<button class="ui small labeled red icon button disabled" type="submit">
<i class="trash icon"></i>
Delete
</button>
<form class="ui form">
<div class="field">
<label>Name</label>
<input type="text"
name="wishlist-name"
placeholder="<?= getCurrentSeason() ?>"
value="<?= getCurrentSeason() ?>"
/>
</div>
</form>
</div>
</div>
<div class="actions">
<div class="ui approve primary button create">
Create
</div>
<div class="ui deny button cancel">
Cancel
</div>
</div>
</div>
<div class="wishlist-cards"></div>
</main>
<!-- Wishlist: Add a product -->
<div class="ui modal wishlist-product-add">
<div class="header">
Add a product
@ -152,6 +142,7 @@ if (isset($_POST['wishlist_delete_id'])) {
</div>
</div>
<!-- Wishlist: Add a product (fetch) -->
<div class="ui small modal wishlist-product-fetch">
<div class="header">
Incorrect URL