3wordchant
/
oasis
0
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Separate edit and preview view for posts and comments

This commit is contained in:
Cecilia Lindskog 2021-02-17 21:55:14 +01:00
parent 04d52b9947
commit 11e4ca59fb
4 changed files with 165 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/assets/style.css
View File

@ -131,6 +131,12 @@ button,
color: var(--fg);
}
.edit-button {
float: right;
margin: 0;
margin-top: -1.9rem; /* This is not the best way to solve this but I couldn't think of anyother way atm, please let me know if anyone have any suggestions :) */
}
#blob {
visibility: hidden;
height: 0;

60
src/index.js
View File

@ -829,11 +829,39 @@ router
const messages = [rootMessage];
const previewData = await preparePreview(ctx);
const showPreview = true;
ctx.body = await previewSubtopicView({
messages,
myFeedId,
previewData,
showPreview,
contentWarning,
});
}
)
.post(
"/subtopic/edit/:message",
koaBody({ multipart: true }),
async (ctx) => {
const { message } = ctx.params;
const rootMessage = await post.get(message);
const myFeedId = await meta.myFeedId();
const rawContentWarning = String(ctx.request.body.contentWarning).trim();
const contentWarning =
rawContentWarning.length > 0 ? rawContentWarning : undefined;
const messages = [rootMessage];
const previewData = await preparePreview(ctx);
const showPreview = false;
ctx.body = await previewSubtopicView({
messages,
myFeedId,
previewData,
showPreview,
contentWarning,
});
}
@ -871,6 +899,7 @@ router
} = await resolveCommentComponents(ctx);
const previewData = await preparePreview(ctx);
const showPreview = true;
ctx.body = await previewCommentView({
messages,
@ -878,9 +907,30 @@ router
contentWarning,
parentMessage,
previewData,
showPreview,
});
}
)
.post("/comment/edit/:message", koaBody({ multipart: true }), async (ctx) => {
const {
messages,
contentWarning,
myFeedId,
parentMessage,
} = await resolveCommentComponents(ctx);
const previewData = await preparePreview(ctx);
const showPreview = false;
ctx.body = await previewCommentView({
messages,
myFeedId,
contentWarning,
parentMessage,
previewData,
showPreview,
});
})
.post("/comment/:message", koaBody(), async (ctx) => {
const { message } = ctx.params;
const text = String(ctx.request.body.text);
@ -912,6 +962,16 @@ router
const previewData = await preparePreview(ctx);
ctx.body = await previewView({ previewData, contentWarning });
})
.post("/publish/edit", koaBody(), async (ctx) => {
const rawContentWarning = String(ctx.request.body.contentWarning);
// Only submit content warning if it's a string with non-zero length.
const contentWarning =
rawContentWarning.length > 0 ? rawContentWarning : undefined;
const previewData = await preparePreview(ctx);
ctx.body = await publishView(previewData, previewData.text, contentWarning);
})
.post("/publish", koaBody(), async (ctx) => {
const text = String(ctx.request.body.text);
const rawContentWarning = String(ctx.request.body.contentWarning);

1
src/views/i18n.js
View File

@ -86,6 +86,7 @@ const i18n = {
mentionsMatching: "Matching Mentions",
preview: "Preview",
publish: "Publish",
edit: "Edit",
contentWarningPlaceholder: "Optional content warning for this post",
publishCustomDescription: [
"Publish a custom message by entering ",

155
src/views/index.js
View File

@ -684,21 +684,25 @@ exports.authorView = ({
exports.previewCommentView = async ({
previewData,
showPreview,
messages,
myFeedId,
parentMessage,
contentWarning,
}) => {
const publishAction = `/comment/${encodeURIComponent(messages[0].key)}`;
const editAction = `/comment/edit/${encodeURIComponent(messages[0].key)}`;
const preview = generatePreview({
previewData,
contentWarning,
action: publishAction,
editAction,
});
return exports.commentView(
{ messages, myFeedId, parentMessage },
preview,
showPreview,
previewData.text,
contentWarning
);
@ -707,6 +711,7 @@ exports.previewCommentView = async ({
exports.commentView = async (
{ messages, myFeedId, parentMessage },
preview,
showPreview,
text,
contentWarning
) => {
@ -739,35 +744,39 @@ exports.commentView = async (
return template(
i18n.commentTitle({ authorName }),
div({ class: "thread-container" }, messageElements),
preview !== undefined ? preview : "",
p(
...i18n.commentLabel({ publicOrPrivate, markdownUrl }),
...maybeSubtopicText
),
form(
{ action, method, enctype: "multipart/form-data" },
textarea(
{
autofocus: true,
required: true,
name: "text",
},
text ? text : isPrivate ? null : markdownMention
),
label(
i18n.contentWarningLabel,
input({
name: "contentWarning",
type: "text",
class: "contentWarning",
value: contentWarning ? contentWarning : "",
placeholder: i18n.contentWarningPlaceholder,
})
),
button({ type: "submit" }, i18n.preview),
label({ class: "file-button", for: "blob" }, i18n.attachFiles),
input({ type: "file", id: "blob", name: "blob" })
)
showPreview && preview !== undefined ? preview : "",
showPreview
? ""
: p(
...i18n.commentLabel({ publicOrPrivate, markdownUrl }),
...maybeSubtopicText
),
showPreview
? ""
: form(
{ action, method, enctype: "multipart/form-data" },
textarea(
{
autofocus: true,
required: true,
name: "text",
},
text ? text : isPrivate ? null : markdownMention
),
label(
i18n.contentWarningLabel,
input({
name: "contentWarning",
type: "text",
class: "contentWarning",
value: contentWarning ? contentWarning : "",
placeholder: i18n.contentWarningPlaceholder,
})
),
button({ type: "submit" }, i18n.preview),
label({ class: "file-button", for: "blob" }, i18n.attachFiles),
input({ type: "file", id: "blob", name: "blob" })
)
);
};
@ -877,7 +886,12 @@ exports.publishView = (preview, text, contentWarning) => {
);
};
const generatePreview = ({ previewData, contentWarning, action }) => {
const generatePreview = ({
previewData,
contentWarning,
action,
editAction,
}) => {
const { authorMeta, text, mentions } = previewData;
// craft message that looks like it came from the db
@ -989,6 +1003,20 @@ const generatePreview = ({ previewData, contentWarning, action }) => {
value: text,
}),
button({ type: "submit" }, i18n.publish)
),
form(
{ action: editAction, method: "post" },
input({
name: "contentWarning",
type: "hidden",
value: contentWarning,
}),
input({
name: "text",
type: "hidden",
value: text,
}),
button({ type: "submit", class: "edit-button" }, i18n.edit)
)
)
);
@ -996,13 +1024,15 @@ const generatePreview = ({ previewData, contentWarning, action }) => {
exports.previewView = ({ previewData, contentWarning }) => {
const publishAction = "/publish";
const editAction = "/publish/edit";
const preview = generatePreview({
previewData,
contentWarning,
action: publishAction,
editAction,
});
return exports.publishView(preview, previewData.text, contentWarning);
return template("Preview", preview);
};
/**
@ -1237,20 +1267,24 @@ exports.threadsView = ({ messages }) => {
exports.previewSubtopicView = async ({
previewData,
showPreview,
messages,
myFeedId,
contentWarning,
}) => {
const publishAction = `/subtopic/${encodeURIComponent(messages[0].key)}`;
const editAction = `/subtopic/edit/${encodeURIComponent(messages[0].key)}`;
const preview = generatePreview({
previewData,
contentWarning,
action: publishAction,
editAction,
});
return exports.subtopicView(
{ messages, myFeedId },
preview,
showPreview,
previewData.text,
contentWarning
);
@ -1259,6 +1293,7 @@ exports.previewSubtopicView = async ({
exports.subtopicView = async (
{ messages, myFeedId },
preview,
showPreview,
text,
contentWarning
) => {
@ -1288,32 +1323,38 @@ exports.subtopicView = async (
return template(
i18n.subtopicTitle({ authorName }),
div({ class: "thread-container" }, messageElements),
preview !== undefined ? preview : "",
p(i18n.subtopicLabel({ markdownUrl })),
form(
{ action: subtopicForm, method: "post", enctype: "multipart/form-data" },
textarea(
{
autofocus: true,
required: true,
name: "text",
},
text ? text : markdownMention
),
label(
i18n.contentWarningLabel,
input({
name: "contentWarning",
type: "text",
class: "contentWarning",
value: contentWarning ? contentWarning : "",
placeholder: i18n.contentWarningPlaceholder,
})
),
button({ type: "submit" }, i18n.preview),
label({ class: "file-button", for: "blob" }, i18n.attachFiles),
input({ type: "file", id: "blob", name: "blob" })
)
showPreview && preview !== undefined ? preview : "",
showPreview ? "" : p(i18n.subtopicLabel({ markdownUrl })),
showPreview
? ""
: form(
{
action: subtopicForm,
method: "post",
enctype: "multipart/form-data",
},
textarea(
{
autofocus: true,
required: true,
name: "text",
},
text ? text : markdownMention
),
label(
i18n.contentWarningLabel,
input({
name: "contentWarning",
type: "text",
class: "contentWarning",
value: contentWarning ? contentWarning : "",
placeholder: i18n.contentWarningPlaceholder,
})
),
button({ type: "submit" }, i18n.preview),
label({ class: "file-button", for: "blob" }, i18n.attachFiles),
input({ type: "file", id: "blob", name: "blob" })
)
);
};