1
0
Fork 0
mirror of https://github.com/plankanban/planka.git synced 2025-07-18 12:49:43 +02:00

feat: Add gallery for attachments

This commit is contained in:
Maksim Eltyshev 2022-06-20 18:27:39 +02:00
parent 0bf4004046
commit 8f4d60c46f
22 changed files with 351 additions and 102 deletions

View file

@ -17,6 +17,7 @@
"js-cookie": "^3.0.1", "js-cookie": "^3.0.1",
"lodash": "^4.17.20", "lodash": "^4.17.20",
"node-sass": "^7.0.1", "node-sass": "^7.0.1",
"photoswipe": "^5.2.7",
"prop-types": "^15.8.1", "prop-types": "^15.8.1",
"react": "^17.0.2", "react": "^17.0.2",
"react-beautiful-dnd": "^13.0.0", "react-beautiful-dnd": "^13.0.0",
@ -26,6 +27,7 @@
"react-i18next": "^11.16.6", "react-i18next": "^11.16.6",
"react-input-mask": "^2.0.4", "react-input-mask": "^2.0.4",
"react-markdown": "^8.0.2", "react-markdown": "^8.0.2",
"react-photoswipe-gallery": "^2.2.1",
"react-redux": "^7.2.8", "react-redux": "^7.2.8",
"react-router-dom": "^5.3.1", "react-router-dom": "^5.3.1",
"react-scripts": "5.0.1", "react-scripts": "5.0.1",
@ -16224,6 +16226,14 @@
"resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz", "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
"integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=" "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns="
}, },
"node_modules/photoswipe": {
"version": "5.2.7",
"resolved": "https://registry.npmjs.org/photoswipe/-/photoswipe-5.2.7.tgz",
"integrity": "sha512-AogMba7W/O5gOtDIZ8cQuou1ltwxlaLNoZY1qi1s+kbYXpZk9D6rXxnNGAfDppl+bfe+sKLW2w2sx+3uQ8oPzg==",
"engines": {
"node": ">= 0.12.0"
}
},
"node_modules/picocolors": { "node_modules/picocolors": {
"version": "1.0.0", "version": "1.0.0",
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
@ -18230,6 +18240,16 @@
"react-dom": "^15.5.x || ^16.x || ^17.x" "react-dom": "^15.5.x || ^16.x || ^17.x"
} }
}, },
"node_modules/react-photoswipe-gallery": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/react-photoswipe-gallery/-/react-photoswipe-gallery-2.2.1.tgz",
"integrity": "sha512-xaUKKmwRLCpEzB8+bU7yxjXvRBHaInpBcI6YQY0UOeFctHAL3jGRDk9j2YbwmlgN7kRStHTcyrSNxr+zSaOnKg==",
"peerDependencies": {
"photoswipe": ">= 5.2.2",
"prop-types": ">= 15.7.0",
"react": ">= 16.8.0"
}
},
"node_modules/react-popper": { "node_modules/react-popper": {
"version": "2.2.5", "version": "2.2.5",
"resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.2.5.tgz", "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.2.5.tgz",
@ -35010,6 +35030,11 @@
"resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz", "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
"integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=" "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns="
}, },
"photoswipe": {
"version": "5.2.7",
"resolved": "https://registry.npmjs.org/photoswipe/-/photoswipe-5.2.7.tgz",
"integrity": "sha512-AogMba7W/O5gOtDIZ8cQuou1ltwxlaLNoZY1qi1s+kbYXpZk9D6rXxnNGAfDppl+bfe+sKLW2w2sx+3uQ8oPzg=="
},
"picocolors": { "picocolors": {
"version": "1.0.0", "version": "1.0.0",
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
@ -36319,6 +36344,12 @@
"integrity": "sha512-a5Q7CkWznBRUWPmocCvE8b6lEYw1s6+opp/60dCunhO+G6E4tDTO2Sd2jKE+leEnnrLAE2Wj5DlDHNqj5wPv1Q==", "integrity": "sha512-a5Q7CkWznBRUWPmocCvE8b6lEYw1s6+opp/60dCunhO+G6E4tDTO2Sd2jKE+leEnnrLAE2Wj5DlDHNqj5wPv1Q==",
"requires": {} "requires": {}
}, },
"react-photoswipe-gallery": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/react-photoswipe-gallery/-/react-photoswipe-gallery-2.2.1.tgz",
"integrity": "sha512-xaUKKmwRLCpEzB8+bU7yxjXvRBHaInpBcI6YQY0UOeFctHAL3jGRDk9j2YbwmlgN7kRStHTcyrSNxr+zSaOnKg==",
"requires": {}
},
"react-popper": { "react-popper": {
"version": "2.2.5", "version": "2.2.5",
"resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.2.5.tgz", "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.2.5.tgz",

View file

@ -74,6 +74,7 @@
"js-cookie": "^3.0.1", "js-cookie": "^3.0.1",
"lodash": "^4.17.20", "lodash": "^4.17.20",
"node-sass": "^7.0.1", "node-sass": "^7.0.1",
"photoswipe": "^5.2.7",
"prop-types": "^15.8.1", "prop-types": "^15.8.1",
"react": "^17.0.2", "react": "^17.0.2",
"react-beautiful-dnd": "^13.0.0", "react-beautiful-dnd": "^13.0.0",
@ -83,6 +84,7 @@
"react-i18next": "^11.16.6", "react-i18next": "^11.16.6",
"react-input-mask": "^2.0.4", "react-input-mask": "^2.0.4",
"react-markdown": "^8.0.2", "react-markdown": "^8.0.2",
"react-photoswipe-gallery": "^2.2.1",
"react-redux": "^7.2.8", "react-redux": "^7.2.8",
"react-router-dom": "^5.3.1", "react-router-dom": "^5.3.1",
"react-scripts": "5.0.1", "react-scripts": "5.0.1",

View file

@ -1,88 +1,153 @@
import React, { useCallback } from 'react'; import React, { useCallback } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { Button } from 'semantic-ui-react'; import { Gallery, Item as GalleryItem } from 'react-photoswipe-gallery';
import { Button, Grid } from 'semantic-ui-react';
import { useToggle } from '../../../lib/hooks'; import { useToggle } from '../../../lib/hooks';
import Item from './Item'; import Item from './Item';
import styles from './Attachments.module.scss'; import styles from './Attachments.module.scss';
const Attachments = React.memo(({ items, onUpdate, onDelete, onCoverUpdate }) => { const INITIALLY_VISIBLE = 4;
const [t] = useTranslation();
const [isOpened, toggleOpened] = useToggle();
const handleToggleClick = useCallback(() => { const Attachments = React.memo(
toggleOpened(); ({ items, onUpdate, onDelete, onCoverUpdate, onGalleryOpen, onGalleryClose }) => {
}, [toggleOpened]); const [t] = useTranslation();
const [isAllVisible, toggleAllVisible] = useToggle();
const handleCoverSelect = useCallback( const handleCoverSelect = useCallback(
(id) => { (id) => {
onCoverUpdate(id); onCoverUpdate(id);
}, },
[onCoverUpdate], [onCoverUpdate],
); );
const handleCoverDeselect = useCallback(() => { const handleCoverDeselect = useCallback(() => {
onCoverUpdate(null); onCoverUpdate(null);
}, [onCoverUpdate]); }, [onCoverUpdate]);
const handleUpdate = useCallback( const handleUpdate = useCallback(
(id, data) => { (id, data) => {
onUpdate(id, data); onUpdate(id, data);
}, },
[onUpdate], [onUpdate],
); );
const handleDelete = useCallback( const handleDelete = useCallback(
(id) => { (id) => {
onDelete(id); onDelete(id);
}, },
[onDelete], [onDelete],
); );
const visibleItems = isOpened ? items : items.slice(0, 4); const handleBeforeGalleryOpen = useCallback(
(gallery) => {
onGalleryOpen();
return ( gallery.on('destroy', () => {
<> onGalleryClose();
{visibleItems.map((item) => ( });
<Item },
key={item.id} [onGalleryOpen, onGalleryClose],
name={item.name} );
url={item.url}
coverUrl={item.coverUrl} const handleToggleAllVisibleClick = useCallback(() => {
createdAt={item.createdAt} toggleAllVisible();
isCover={item.isCover} }, [toggleAllVisible]);
isPersisted={item.isPersisted}
onCoverSelect={() => handleCoverSelect(item.id)} const galleryItemsNode = items.map((item, index) => {
onCoverDeselect={handleCoverDeselect} const props = item.coverUrl
onUpdate={(data) => handleUpdate(item.id, data)} ? {
onDelete={() => handleDelete(item.id)} width: item.imageWidth,
/> height: item.imageHeight,
))}
{items.length > 4 && (
<Button
fluid
content={
isOpened
? t('action.showFewerAttachments')
: t('action.showAllAttachments', {
hidden: items.length - visibleItems.length,
})
} }
className={styles.toggleButton} : {
onClick={handleToggleClick} content: (
/> <Grid verticalAlign="middle" className={styles.contentWrapper}>
)} <Grid.Column textAlign="center" className={styles.content}>
</> {t('common.thereIsNoPreviewAvailableForThisAttachment')}
); </Grid.Column>
}); </Grid>
),
};
const isVisible = isAllVisible || index < INITIALLY_VISIBLE;
return (
<GalleryItem
{...props} // eslint-disable-line react/jsx-props-no-spreading
key={item.id}
original={item.url}
caption={item.name}
>
{({ ref, open }) =>
isVisible ? (
<Item
ref={ref}
name={item.name}
url={item.url}
coverUrl={item.coverUrl}
createdAt={item.createdAt}
isCover={item.isCover}
isPersisted={item.isPersisted}
onClick={item.coverUrl ? open : undefined}
onCoverSelect={() => handleCoverSelect(item.id)}
onCoverDeselect={handleCoverDeselect}
onUpdate={(data) => handleUpdate(item.id, data)}
onDelete={() => handleDelete(item.id)}
/>
) : (
<span ref={ref} />
)
}
</GalleryItem>
);
});
return (
<>
<Gallery
withCaption
withDownloadButton
options={{
showHideAnimationType: 'none',
closeTitle: '',
zoomTitle: '',
arrowPrevTitle: '',
arrowNextTitle: '',
errorMsg: '',
}}
onBeforeOpen={handleBeforeGalleryOpen}
>
{galleryItemsNode}
</Gallery>
{items.length > INITIALLY_VISIBLE && (
<Button
fluid
content={
isAllVisible
? t('action.showFewerAttachments')
: t('action.showAllAttachments', {
hidden: items.length - INITIALLY_VISIBLE,
})
}
className={styles.toggleButton}
onClick={handleToggleAllVisibleClick}
/>
)}
</>
);
},
);
Attachments.propTypes = { Attachments.propTypes = {
items: PropTypes.array.isRequired, // eslint-disable-line react/forbid-prop-types items: PropTypes.array.isRequired, // eslint-disable-line react/forbid-prop-types
onUpdate: PropTypes.func.isRequired, onUpdate: PropTypes.func.isRequired,
onDelete: PropTypes.func.isRequired, onDelete: PropTypes.func.isRequired,
onCoverUpdate: PropTypes.func.isRequired, onCoverUpdate: PropTypes.func.isRequired,
onGalleryOpen: PropTypes.func.isRequired,
onGalleryClose: PropTypes.func.isRequired,
}; };
export default Attachments; export default Attachments;

View file

@ -1,4 +1,14 @@
:global(#app) { :global(#app) {
.content {
color: #fff;
font-size: 20px;
font-weight: 700;
}
.contentWrapper {
height: 100%;
}
.toggleButton { .toggleButton {
background: transparent; background: transparent;
box-shadow: none; box-shadow: none;

View file

@ -8,24 +8,32 @@ import EditPopup from './EditPopup';
import styles from './Item.module.scss'; import styles from './Item.module.scss';
const Item = React.memo( const Item = React.forwardRef(
({ (
name, {
url, name,
coverUrl, url,
createdAt, coverUrl,
isCover, createdAt,
isPersisted, isCover,
onCoverSelect, isPersisted,
onCoverDeselect, onCoverSelect,
onUpdate, onCoverDeselect,
onDelete, onClick,
}) => { onUpdate,
onDelete,
},
ref,
) => {
const [t] = useTranslation(); const [t] = useTranslation();
const handleClick = useCallback(() => { const handleClick = useCallback(() => {
window.open(url, '_blank'); if (onClick) {
}, [url]); onClick();
} else {
window.open(url, '_blank');
}
}, [url, onClick]);
const handleToggleCoverClick = useCallback( const handleToggleCoverClick = useCallback(
(event) => { (event) => {
@ -54,7 +62,7 @@ const Item = React.memo(
return ( return (
/* eslint-disable jsx-a11y/click-events-have-key-events, /* eslint-disable jsx-a11y/click-events-have-key-events,
jsx-a11y/no-static-element-interactions */ jsx-a11y/no-static-element-interactions */
<div className={styles.wrapper} onClick={handleClick}> <div ref={ref} className={styles.wrapper} onClick={handleClick}>
{/* eslint-enable jsx-a11y/click-events-have-key-events, {/* eslint-enable jsx-a11y/click-events-have-key-events,
jsx-a11y/no-static-element-interactions */} jsx-a11y/no-static-element-interactions */}
<div <div
@ -133,6 +141,7 @@ Item.propTypes = {
createdAt: PropTypes.instanceOf(Date), createdAt: PropTypes.instanceOf(Date),
isCover: PropTypes.bool.isRequired, isCover: PropTypes.bool.isRequired,
isPersisted: PropTypes.bool.isRequired, isPersisted: PropTypes.bool.isRequired,
onClick: PropTypes.func,
onCoverSelect: PropTypes.func.isRequired, onCoverSelect: PropTypes.func.isRequired,
onCoverDeselect: PropTypes.func.isRequired, onCoverDeselect: PropTypes.func.isRequired,
onUpdate: PropTypes.func.isRequired, onUpdate: PropTypes.func.isRequired,
@ -143,6 +152,7 @@ Item.defaultProps = {
url: undefined, url: undefined,
coverUrl: undefined, coverUrl: undefined,
createdAt: undefined, createdAt: undefined,
onClick: undefined,
}; };
export default Item; export default React.memo(Item);

View file

@ -1,4 +1,4 @@
import React, { useCallback } from 'react'; import React, { useCallback, useRef } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import classNames from 'classnames'; import classNames from 'classnames';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
@ -73,6 +73,8 @@ const CardModal = React.memo(
}) => { }) => {
const [t] = useTranslation(); const [t] = useTranslation();
const isGalleryOpened = useRef(false);
const handleNameUpdate = useCallback( const handleNameUpdate = useCallback(
(newName) => { (newName) => {
onUpdate({ onUpdate({
@ -124,6 +126,22 @@ const CardModal = React.memo(
}); });
}, [isSubscribed, onUpdate]); }, [isSubscribed, onUpdate]);
const handleGalleryOpen = useCallback(() => {
isGalleryOpened.current = true;
}, []);
const handleGalleryClose = useCallback(() => {
isGalleryOpened.current = false;
}, []);
const handleClose = useCallback(() => {
if (isGalleryOpened.current) {
return;
}
onClose();
}, [onClose]);
const userIds = users.map((user) => user.id); const userIds = users.map((user) => user.id);
const labelIds = labels.map((label) => label.id); const labelIds = labels.map((label) => label.id);
@ -328,6 +346,8 @@ const CardModal = React.memo(
onUpdate={onAttachmentUpdate} onUpdate={onAttachmentUpdate}
onDelete={onAttachmentDelete} onDelete={onAttachmentDelete}
onCoverUpdate={handleCoverUpdate} onCoverUpdate={handleCoverUpdate}
onGalleryOpen={handleGalleryOpen}
onGalleryClose={handleGalleryClose}
/> />
</div> </div>
</div> </div>
@ -445,7 +465,7 @@ const CardModal = React.memo(
); );
return ( return (
<Modal open closeIcon size="small" centered={false} onClose={onClose}> <Modal open closeIcon size="small" centered={false} onClose={handleClose}>
{canEdit ? ( {canEdit ? (
<AttachmentAddZone onCreate={onAttachmentCreate}>{contentNode}</AttachmentAddZone> <AttachmentAddZone onCreate={onAttachmentCreate}>{contentNode}</AttachmentAddZone>
) : ( ) : (

View file

@ -10,6 +10,7 @@ import CoreWrapperContainer from '../containers/CoreWrapperContainer';
import NotFound from './NotFound'; import NotFound from './NotFound';
import 'react-datepicker/dist/react-datepicker.css'; import 'react-datepicker/dist/react-datepicker.css';
import 'photoswipe/dist/photoswipe.css';
import '../lib/custom-ui/styles.css'; import '../lib/custom-ui/styles.css';
import '../styles.module.scss'; import '../styles.module.scss';

View file

@ -32,7 +32,7 @@ const createData = (timer) => {
const TimerEditStep = React.memo(({ defaultValue, onUpdate, onBack, onClose }) => { const TimerEditStep = React.memo(({ defaultValue, onUpdate, onBack, onClose }) => {
const [t] = useTranslation(); const [t] = useTranslation();
const [data, handleFieldChange, setData] = useForm(() => createData(defaultValue)); const [data, handleFieldChange, setData] = useForm(() => createData(defaultValue));
const [isEditing, toggleEdit] = useToggle(); const [isEditing, toggleEditing] = useToggle();
const hoursField = useRef(null); const hoursField = useRef(null);
const minutesField = useRef(null); const minutesField = useRef(null);
@ -55,10 +55,10 @@ const TimerEditStep = React.memo(({ defaultValue, onUpdate, onBack, onClose }) =
onClose(); onClose();
}, [defaultValue, onUpdate, onClose]); }, [defaultValue, onUpdate, onClose]);
const handleToggleEditClick = useCallback(() => { const handleToggleEditingClick = useCallback(() => {
setData(createData(defaultValue)); setData(createData(defaultValue));
toggleEdit(); toggleEditing();
}, [defaultValue, setData, toggleEdit]); }, [defaultValue, setData, toggleEditing]);
const handleSubmit = useCallback(() => { const handleSubmit = useCallback(() => {
const parts = { const parts = {
@ -149,7 +149,7 @@ const TimerEditStep = React.memo(({ defaultValue, onUpdate, onBack, onClose }) =
type="button" type="button"
icon={isEditing ? 'close' : 'edit'} icon={isEditing ? 'close' : 'edit'}
className={styles.iconButton} className={styles.iconButton}
onClick={handleToggleEditClick} onClick={handleToggleEditingClick}
/> />
</div> </div>
{isEditing && <Button positive content={t('action.save')} />} {isEditing && <Button positive content={t('action.save')} />}

View file

@ -134,6 +134,7 @@ export default {
subscribeToMyOwnCardsByDefault: 'Standardmäßig meine eigenen Karten abonnieren', subscribeToMyOwnCardsByDefault: 'Standardmäßig meine eigenen Karten abonnieren',
taskActions_title: 'Aufgabenaktionen', taskActions_title: 'Aufgabenaktionen',
tasks: 'Aufgaben', tasks: 'Aufgaben',
thereIsNoPreviewAvailableForThisAttachment: 'Für diesen Anhang ist keine Vorschau verfügbar',
time: 'Zeit', time: 'Zeit',
timer: 'Timer', timer: 'Timer',
title: 'Titel', title: 'Titel',

View file

@ -127,6 +127,8 @@ export default {
subscribeToMyOwnCardsByDefault: 'Subscribe to my own cards by default', subscribeToMyOwnCardsByDefault: 'Subscribe to my own cards by default',
taskActions_title: 'Task Actions', taskActions_title: 'Task Actions',
tasks: 'Tasks', tasks: 'Tasks',
thereIsNoPreviewAvailableForThisAttachment:
'There is no preview available for this attachment',
time: 'Time', time: 'Time',
timer: 'Timer', timer: 'Timer',
title: 'Title', title: 'Title',

View file

@ -122,6 +122,7 @@ export default {
subscribeToMyOwnCardsByDefault: 'По умолчанию подписаться на мои собственные карточки', subscribeToMyOwnCardsByDefault: 'По умолчанию подписаться на мои собственные карточки',
taskActions: 'Действия с задачей', taskActions: 'Действия с задачей',
tasks: 'Задачи', tasks: 'Задачи',
thereIsNoPreviewAvailableForThisAttachment: 'Предпросмотр для этого вложения недоступен',
time: 'Время', time: 'Время',
timer: 'Таймер', timer: 'Таймер',
title: 'Название', title: 'Название',

View file

@ -101,6 +101,10 @@
border-radius: 0; border-radius: 0;
} }
} }
.pswp .pswp__img--placeholder {
display: none !important;
}
} }
#root { #root {

4
package-lock.json generated
View file

@ -1,12 +1,12 @@
{ {
"name": "planka", "name": "planka",
"version": "1.1.5", "version": "1.2.1",
"lockfileVersion": 2, "lockfileVersion": 2,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "planka", "name": "planka",
"version": "1.1.5", "version": "1.2.1",
"hasInstallScript": true, "hasInstallScript": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {

View file

@ -24,6 +24,16 @@ module.exports = {
required: true, required: true,
columnName: 'is_image', columnName: 'is_image',
}, },
imageWidth: {
type: 'number',
allowNull: true,
columnName: 'image_width',
},
imageHeight: {
type: 'number',
allowNull: true,
columnName: 'image_height',
},
name: { name: {
type: 'string', type: 'string',
required: true, required: true,

View file

@ -20,20 +20,24 @@
* https://sailsjs.com/anatomy/app.js * https://sailsjs.com/anatomy/app.js
*/ */
require('dotenv').config(); const dotenv = require('dotenv');
// Ensure we're in the project directory, so cwd-relative paths work as expected // Ensure we're in the project directory, so cwd-relative paths work as expected
// no matter where we actually lift from. // no matter where we actually lift from.
// > Note: This is not required in order to lift, but it is a convenient default. // > Note: This is not required in order to lift, but it is a convenient default.
process.chdir(__dirname); process.chdir(__dirname);
dotenv.config();
// Attempt to import `sails` dependency, as well as `rc` (for loading `.sailsrc` files). // Attempt to import `sails` dependency, as well as `rc` (for loading `.sailsrc` files).
let sails; let sails;
let rc; let rc;
try { try {
sails = require('sails'); // eslint-disable-line global-require /* eslint-disable global-require */
rc = require('sails/accessible/rc'); // eslint-disable-line global-require sails = require('sails');
rc = require('sails/accessible/rc');
/* eslint-enable global-require */
} catch (error) { } catch (error) {
/* eslint-disable no-console */ /* eslint-disable no-console */
console.error("Encountered an error when attempting to require('sails'):"); console.error("Encountered an error when attempting to require('sails'):");

View file

@ -321,4 +321,11 @@ module.exports = {
// baseUrl: 'https://example.com', // baseUrl: 'https://example.com',
// internalEmailAddress: 'support@example.com', // internalEmailAddress: 'support@example.com',
}, },
routes: {
'GET /*': {
view: 'index',
skipAssets: true,
},
},
}; };

View file

@ -84,9 +84,4 @@ module.exports.routes = {
action: 'attachments/download-thumbnail', action: 'attachments/download-thumbnail',
skipAssets: false, skipAssets: false,
}, },
'GET /*': {
view: 'index',
skipAssets: true,
},
}; };

View file

@ -1,10 +1,12 @@
const config = require('./knexfile'); const initKnex = require('knex');
const knex = require('knex')(config); // eslint-disable-line import/order const knexfile = require('./knexfile');
const knex = initKnex(knexfile);
(async () => { (async () => {
try { try {
const isExists = await knex.schema.hasTable(config.migrations.tableName); const isExists = await knex.schema.hasTable(knexfile.migrations.tableName);
await knex.migrate.latest(); await knex.migrate.latest();
if (!isExists) { if (!isExists) {

View file

@ -1,7 +1,8 @@
const path = require('path'); const path = require('path');
const dotenv = require('dotenv');
const _ = require('lodash'); const _ = require('lodash');
require('dotenv').config({ dotenv.config({
path: path.resolve(__dirname, '../.env'), path: path.resolve(__dirname, '../.env'),
}); });

View file

@ -1,5 +1,5 @@
module.exports.up = (knex) => module.exports.up = (knex) =>
knex.schema.createTable('card', (table) => { knex.schema.createTable('card', async (table) => {
/* Columns */ /* Columns */
table.bigInteger('id').primary().defaultTo(knex.raw('next_id()')); table.bigInteger('id').primary().defaultTo(knex.raw('next_id()'));
@ -12,7 +12,7 @@ module.exports.up = (knex) =>
table.specificType('position', 'double precision'); table.specificType('position', 'double precision');
table.text('name').notNullable(); table.text('name').notNullable();
table.text('description'); table.text('description');
table.timestamp('dueDate', true); table.timestamp('due_date', true);
table.jsonb('timer'); table.jsonb('timer');
table.timestamp('created_at', true); table.timestamp('created_at', true);

View file

@ -0,0 +1,45 @@
const path = require('path');
const sharp = require('sharp');
const getConfig = require('../../get-config');
module.exports.up = async (knex) => {
await knex.schema.table('attachment', (table) => {
/* Columns */
table.integer('image_width');
table.integer('image_height');
});
const config = await getConfig();
const attachments = await knex('attachment');
// eslint-disable-next-line no-restricted-syntax
for (attachment of attachments) {
if (attachment.is_image) {
const image = sharp(
path.join(config.custom.attachmentsPath, attachment.dirname, attachment.filename),
);
let metadata;
try {
metadata = await image.metadata(); // eslint-disable-line no-await-in-loop
} catch (error) {
continue; // eslint-disable-line no-continue
}
// eslint-disable-next-line no-await-in-loop
await knex('attachment')
.update({
image_width: metadata.width,
image_height: metadata.height,
})
.where('id', attachment.id);
}
}
};
module.exports.down = (knex) =>
knex.schema.table('attachment', (table) => {
table.dropColumns('image_width', 'image_height');
});

38
server/get-config.js Normal file
View file

@ -0,0 +1,38 @@
const dotenv = require('dotenv');
const sails = require('sails');
const rc = require('sails/accessible/rc');
process.chdir(__dirname);
dotenv.config();
const config = rc('sails');
const getConfigPromise = new Promise((resolve) => {
sails.load(
{
...config,
hooks: {
...config.hooks,
logger: false,
request: false,
views: false,
blueprints: false,
responses: false,
helpers: false,
pubsub: false,
policies: false,
services: false,
security: false,
i18n: false,
session: false,
http: false,
userhooks: false,
},
},
() => {
resolve(sails.config);
},
);
});
module.exports = () => getConfigPromise;