diff --git a/assets/components/container/container.vue b/assets/components/container/container.vue
index 259f2771..67341ff9 100644
--- a/assets/components/container/container.vue
+++ b/assets/components/container/container.vue
@@ -150,7 +150,6 @@ export default {
flex-grow: 1;
overflow-y: auto;
overflow-x: hidden;
- box-shadow: 0 0 3px var(--shadow-weak);
z-index: 1;
}
diff --git a/assets/components/footer/footer.vue b/assets/components/footer/footer.vue
index dc736090..87cf0346 100644
--- a/assets/components/footer/footer.vue
+++ b/assets/components/footer/footer.vue
@@ -16,6 +16,7 @@
font-size: .8rem;
font-weight: bold;
text-align: center;
+ box-shadow: inset -3px 0 3px var(--shadow-hint);
}
.segment {
diff --git a/assets/components/form/toggle.vue b/assets/components/form/toggle.vue
new file mode 100644
index 00000000..9baeea69
--- /dev/null
+++ b/assets/components/form/toggle.vue
@@ -0,0 +1,102 @@
+
+
+
+
+
+
+
diff --git a/assets/components/header/menu.vue b/assets/components/header/menu.vue
index 07c85a98..1f5fa39f 100644
--- a/assets/components/header/menu.vue
+++ b/assets/components/header/menu.vue
@@ -164,10 +164,10 @@ export default {
.menu-username {
display: block;
font-weight: bold;
- color: var(--shadow-strong);
+ color: var(--darken-strong);
font-size: .9rem;
padding: .75rem 1rem;
- border-bottom: solid 1px var(--shadow-hint);
+ border-bottom: solid 1px var(--darken-hint);
text-align: center;
text-decoration: none;
}
diff --git a/assets/components/users/user.vue b/assets/components/users/user.vue
index 2ce84c53..5f68e19e 100644
--- a/assets/components/users/user.vue
+++ b/assets/components/users/user.vue
@@ -19,12 +19,36 @@
:key="stash.id"
class="stash"
>
-
- {{ stash.name }}
-
+
import ActorPreview from './actor-preview.vue';
import ScenePreview from './scene-preview.vue';
+import Toggle from '../form/toggle.vue';
async function fetchUser() {
this.user = await this.$store.dispatch('fetchUser', this.$route.params.username);
+ this.isMe = this.user.id === this.$store.state.auth.user?.id;
+
this.pageTitle = this.user?.username;
}
+async function publishStash(stash, isPublic) {
+ await this.$store.dispatch('updateStash', {
+ stashId: stash.id,
+ stash: { public: isPublic },
+ });
+
+ this.fetchUser();
+}
+
async function mounted() {
await this.fetchUser();
}
@@ -82,18 +118,21 @@ export default {
components: {
ActorPreview,
ScenePreview,
+ Toggle,
},
data() {
return {
user: this.$route.params.username === this.$store.state.auth.user?.username
? this.$store.state.auth.user
: null,
+ isMe: false,
pageTitle: null,
};
},
mounted,
methods: {
fetchUser,
+ publishStash,
},
};
@@ -133,17 +172,9 @@ export default {
box-shadow: 0 0 3px var(--shadow-weak);
}
-.stash-link.stash-section {
- display: block;
- text-decoration: none;
-}
-
-.stash-name {
- color: var(--shadow-strong);
- margin: 0;
-}
-
.stash-section {
+ display: flex;
+ align-items: center;
padding: .5rem;
&:not(:last-child) {
@@ -151,6 +182,34 @@ export default {
}
}
+.stash-header {
+ justify-content: space-between;
+ padding: 0;
+}
+
+.stash-link.stash-section {
+ display: inline-block;
+ text-decoration: none;
+}
+
+.stash-public {
+ display: flex;
+ align-items: center;
+ padding: .5rem;
+ cursor: pointer;
+
+ .icon {
+ fill: var(--shadow-strong);
+ margin: 0 .5rem 0 0;
+ }
+}
+
+.stash-name {
+ color: var(--shadow-strong);
+ padding: .5rem;
+ margin: 0;
+}
+
.stash-actors,
.stash-scenes {
display: flex;
diff --git a/assets/css/_theme.scss b/assets/css/_theme.scss
index a8ab64dd..aab34ee9 100644
--- a/assets/css/_theme.scss
+++ b/assets/css/_theme.scss
@@ -92,7 +92,7 @@ $breakpoint4: 1500px;
--background-dim: #181818;
--background-soft: #111;
- --profile: #222;
+ --profile: #000;
--tile: #2a2a2a;
--link: #dd6688;
diff --git a/assets/js/api.js b/assets/js/api.js
index 9ea39189..7592bedf 100644
--- a/assets/js/api.js
+++ b/assets/js/api.js
@@ -25,9 +25,9 @@ async function get(endpoint, query = {}) {
throw new Error(errorMsg);
}
-async function post(endpoint, data) {
+async function post(endpoint, data, method = 'POST') {
const res = await fetch(`${config.api.url}${endpoint}`, {
- method: 'POST',
+ method,
mode: 'cors',
headers: {
'Content-Type': 'application/json',
@@ -51,6 +51,14 @@ async function post(endpoint, data) {
throw new Error(errorMsg);
}
+async function patch(endpoint, data) {
+ return post(endpoint, data, 'PATCH');
+}
+
+async function put(endpoint, data) {
+ return post(endpoint, data, 'PUT');
+}
+
async function del(endpoint) {
const res = await fetch(`${config.api.url}${endpoint}`, {
method: 'DELETE',
@@ -97,4 +105,6 @@ export {
post,
del,
graphql,
+ patch,
+ put,
};
diff --git a/assets/js/stashes/actions.js b/assets/js/stashes/actions.js
index 438148f3..2690efc2 100644
--- a/assets/js/stashes/actions.js
+++ b/assets/js/stashes/actions.js
@@ -1,4 +1,10 @@
-import { graphql, post, del } from '../api';
+import {
+ graphql,
+ post,
+ del,
+ patch,
+} from '../api';
+
import { releaseFields } from '../fragments';
import { curateStash } from '../curate';
@@ -61,6 +67,12 @@ function initStashesActions(store, _router) {
return curateStash(stash);
}
+ async function updateStash(context, { stashId, stash }) {
+ const newStash = await patch(`/stashes/${stashId}`, stash);
+
+ return newStash;
+ }
+
async function stashActor(context, { actorId, stashId }) {
await post(`/stashes/${stashId}/actors`, { actorId });
}
@@ -93,6 +105,7 @@ function initStashesActions(store, _router) {
unstashActor,
unstashScene,
unstashMovie,
+ updateStash,
};
}
diff --git a/src/stashes.js b/src/stashes.js
index 8f10276e..a0951f63 100644
--- a/src/stashes.js
+++ b/src/stashes.js
@@ -29,11 +29,31 @@ async function fetchStash(stashId, sessionUser) {
})
.first();
+ if (!stash) {
+ throw new HttpError('You are not authorized to access this stash', 403);
+ }
+
+ return curateStash(stash);
+}
+
+async function updateStash(stashId, newStash, sessionUser) {
+ if (!sessionUser) {
+ throw new HttpError('You are not authenthicated', 401);
+ }
+
+ const stash = await knex('stashes')
+ .where({
+ id: stashId,
+ user_id: sessionUser.id,
+ })
+ .update(newStash)
+ .returning('*');
+
if (!stash) {
throw new HttpError('You are not authorized to modify this stash', 403);
}
- return stash;
+ return curateStash(stash);
}
async function stashActor(actorId, stashId, sessionUser) {
@@ -110,4 +130,5 @@ module.exports = {
unstashScene,
unstashActor,
unstashMovie,
+ updateStash,
};
diff --git a/src/web/server.js b/src/web/server.js
index d09366e1..d8195ce8 100644
--- a/src/web/server.js
+++ b/src/web/server.js
@@ -50,6 +50,7 @@ const {
unstashActor,
unstashScene,
unstashMovie,
+ updateStash,
} = require('./stashes');
async function initServer() {
@@ -83,6 +84,8 @@ async function initServer() {
router.post('/api/users', signup);
+ router.patch('/api/stashes/:stashId', updateStash);
+
router.post('/api/stashes/:stashId/actors', stashActor);
router.post('/api/stashes/:stashId/scenes', stashScene);
router.post('/api/stashes/:stashId/movies', stashMovie);
diff --git a/src/web/stashes.js b/src/web/stashes.js
index 885961f1..b1030b06 100644
--- a/src/web/stashes.js
+++ b/src/web/stashes.js
@@ -7,8 +7,15 @@ const {
unstashActor,
unstashScene,
unstashMovie,
+ updateStash,
} = require('../stashes');
+async function updateStashApi(req, res) {
+ const stash = await updateStash(req.params.stashId, req.body, req.session.user);
+
+ res.send(stash);
+}
+
async function stashActorApi(req, res) {
await stashActor(req.body.actorId, req.params.stashId, req.session.user);
@@ -52,4 +59,5 @@ module.exports = {
unstashActor: unstashActorApi,
unstashScene: unstashSceneApi,
unstashMovie: unstashMovieApi,
+ updateStash: updateStashApi,
};