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:
parent
0bf4004046
commit
8f4d60c46f
22 changed files with 351 additions and 102 deletions
31
client/package-lock.json
generated
31
client/package-lock.json
generated
|
@ -17,6 +17,7 @@
|
|||
"js-cookie": "^3.0.1",
|
||||
"lodash": "^4.17.20",
|
||||
"node-sass": "^7.0.1",
|
||||
"photoswipe": "^5.2.7",
|
||||
"prop-types": "^15.8.1",
|
||||
"react": "^17.0.2",
|
||||
"react-beautiful-dnd": "^13.0.0",
|
||||
|
@ -26,6 +27,7 @@
|
|||
"react-i18next": "^11.16.6",
|
||||
"react-input-mask": "^2.0.4",
|
||||
"react-markdown": "^8.0.2",
|
||||
"react-photoswipe-gallery": "^2.2.1",
|
||||
"react-redux": "^7.2.8",
|
||||
"react-router-dom": "^5.3.1",
|
||||
"react-scripts": "5.0.1",
|
||||
|
@ -16224,6 +16226,14 @@
|
|||
"resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz",
|
||||
"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": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
|
||||
|
@ -18230,6 +18240,16 @@
|
|||
"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": {
|
||||
"version": "2.2.5",
|
||||
"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",
|
||||
"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": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz",
|
||||
|
@ -36319,6 +36344,12 @@
|
|||
"integrity": "sha512-a5Q7CkWznBRUWPmocCvE8b6lEYw1s6+opp/60dCunhO+G6E4tDTO2Sd2jKE+leEnnrLAE2Wj5DlDHNqj5wPv1Q==",
|
||||
"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": {
|
||||
"version": "2.2.5",
|
||||
"resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.2.5.tgz",
|
||||
|
|
|
@ -74,6 +74,7 @@
|
|||
"js-cookie": "^3.0.1",
|
||||
"lodash": "^4.17.20",
|
||||
"node-sass": "^7.0.1",
|
||||
"photoswipe": "^5.2.7",
|
||||
"prop-types": "^15.8.1",
|
||||
"react": "^17.0.2",
|
||||
"react-beautiful-dnd": "^13.0.0",
|
||||
|
@ -83,6 +84,7 @@
|
|||
"react-i18next": "^11.16.6",
|
||||
"react-input-mask": "^2.0.4",
|
||||
"react-markdown": "^8.0.2",
|
||||
"react-photoswipe-gallery": "^2.2.1",
|
||||
"react-redux": "^7.2.8",
|
||||
"react-router-dom": "^5.3.1",
|
||||
"react-scripts": "5.0.1",
|
||||
|
|
|
@ -1,88 +1,153 @@
|
|||
import React, { useCallback } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
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 Item from './Item';
|
||||
|
||||
import styles from './Attachments.module.scss';
|
||||
|
||||
const Attachments = React.memo(({ items, onUpdate, onDelete, onCoverUpdate }) => {
|
||||
const [t] = useTranslation();
|
||||
const [isOpened, toggleOpened] = useToggle();
|
||||
const INITIALLY_VISIBLE = 4;
|
||||
|
||||
const handleToggleClick = useCallback(() => {
|
||||
toggleOpened();
|
||||
}, [toggleOpened]);
|
||||
const Attachments = React.memo(
|
||||
({ items, onUpdate, onDelete, onCoverUpdate, onGalleryOpen, onGalleryClose }) => {
|
||||
const [t] = useTranslation();
|
||||
const [isAllVisible, toggleAllVisible] = useToggle();
|
||||
|
||||
const handleCoverSelect = useCallback(
|
||||
(id) => {
|
||||
onCoverUpdate(id);
|
||||
},
|
||||
[onCoverUpdate],
|
||||
);
|
||||
const handleCoverSelect = useCallback(
|
||||
(id) => {
|
||||
onCoverUpdate(id);
|
||||
},
|
||||
[onCoverUpdate],
|
||||
);
|
||||
|
||||
const handleCoverDeselect = useCallback(() => {
|
||||
onCoverUpdate(null);
|
||||
}, [onCoverUpdate]);
|
||||
const handleCoverDeselect = useCallback(() => {
|
||||
onCoverUpdate(null);
|
||||
}, [onCoverUpdate]);
|
||||
|
||||
const handleUpdate = useCallback(
|
||||
(id, data) => {
|
||||
onUpdate(id, data);
|
||||
},
|
||||
[onUpdate],
|
||||
);
|
||||
const handleUpdate = useCallback(
|
||||
(id, data) => {
|
||||
onUpdate(id, data);
|
||||
},
|
||||
[onUpdate],
|
||||
);
|
||||
|
||||
const handleDelete = useCallback(
|
||||
(id) => {
|
||||
onDelete(id);
|
||||
},
|
||||
[onDelete],
|
||||
);
|
||||
const handleDelete = useCallback(
|
||||
(id) => {
|
||||
onDelete(id);
|
||||
},
|
||||
[onDelete],
|
||||
);
|
||||
|
||||
const visibleItems = isOpened ? items : items.slice(0, 4);
|
||||
const handleBeforeGalleryOpen = useCallback(
|
||||
(gallery) => {
|
||||
onGalleryOpen();
|
||||
|
||||
return (
|
||||
<>
|
||||
{visibleItems.map((item) => (
|
||||
<Item
|
||||
key={item.id}
|
||||
name={item.name}
|
||||
url={item.url}
|
||||
coverUrl={item.coverUrl}
|
||||
createdAt={item.createdAt}
|
||||
isCover={item.isCover}
|
||||
isPersisted={item.isPersisted}
|
||||
onCoverSelect={() => handleCoverSelect(item.id)}
|
||||
onCoverDeselect={handleCoverDeselect}
|
||||
onUpdate={(data) => handleUpdate(item.id, data)}
|
||||
onDelete={() => handleDelete(item.id)}
|
||||
/>
|
||||
))}
|
||||
{items.length > 4 && (
|
||||
<Button
|
||||
fluid
|
||||
content={
|
||||
isOpened
|
||||
? t('action.showFewerAttachments')
|
||||
: t('action.showAllAttachments', {
|
||||
hidden: items.length - visibleItems.length,
|
||||
})
|
||||
gallery.on('destroy', () => {
|
||||
onGalleryClose();
|
||||
});
|
||||
},
|
||||
[onGalleryOpen, onGalleryClose],
|
||||
);
|
||||
|
||||
const handleToggleAllVisibleClick = useCallback(() => {
|
||||
toggleAllVisible();
|
||||
}, [toggleAllVisible]);
|
||||
|
||||
const galleryItemsNode = items.map((item, index) => {
|
||||
const props = item.coverUrl
|
||||
? {
|
||||
width: item.imageWidth,
|
||||
height: item.imageHeight,
|
||||
}
|
||||
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 = {
|
||||
items: PropTypes.array.isRequired, // eslint-disable-line react/forbid-prop-types
|
||||
onUpdate: PropTypes.func.isRequired,
|
||||
onDelete: PropTypes.func.isRequired,
|
||||
onCoverUpdate: PropTypes.func.isRequired,
|
||||
onGalleryOpen: PropTypes.func.isRequired,
|
||||
onGalleryClose: PropTypes.func.isRequired,
|
||||
};
|
||||
|
||||
export default Attachments;
|
||||
|
|
|
@ -1,4 +1,14 @@
|
|||
:global(#app) {
|
||||
.content {
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.contentWrapper {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.toggleButton {
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
|
|
|
@ -8,24 +8,32 @@ import EditPopup from './EditPopup';
|
|||
|
||||
import styles from './Item.module.scss';
|
||||
|
||||
const Item = React.memo(
|
||||
({
|
||||
name,
|
||||
url,
|
||||
coverUrl,
|
||||
createdAt,
|
||||
isCover,
|
||||
isPersisted,
|
||||
onCoverSelect,
|
||||
onCoverDeselect,
|
||||
onUpdate,
|
||||
onDelete,
|
||||
}) => {
|
||||
const Item = React.forwardRef(
|
||||
(
|
||||
{
|
||||
name,
|
||||
url,
|
||||
coverUrl,
|
||||
createdAt,
|
||||
isCover,
|
||||
isPersisted,
|
||||
onCoverSelect,
|
||||
onCoverDeselect,
|
||||
onClick,
|
||||
onUpdate,
|
||||
onDelete,
|
||||
},
|
||||
ref,
|
||||
) => {
|
||||
const [t] = useTranslation();
|
||||
|
||||
const handleClick = useCallback(() => {
|
||||
window.open(url, '_blank');
|
||||
}, [url]);
|
||||
if (onClick) {
|
||||
onClick();
|
||||
} else {
|
||||
window.open(url, '_blank');
|
||||
}
|
||||
}, [url, onClick]);
|
||||
|
||||
const handleToggleCoverClick = useCallback(
|
||||
(event) => {
|
||||
|
@ -54,7 +62,7 @@ const Item = React.memo(
|
|||
return (
|
||||
/* eslint-disable jsx-a11y/click-events-have-key-events,
|
||||
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,
|
||||
jsx-a11y/no-static-element-interactions */}
|
||||
<div
|
||||
|
@ -133,6 +141,7 @@ Item.propTypes = {
|
|||
createdAt: PropTypes.instanceOf(Date),
|
||||
isCover: PropTypes.bool.isRequired,
|
||||
isPersisted: PropTypes.bool.isRequired,
|
||||
onClick: PropTypes.func,
|
||||
onCoverSelect: PropTypes.func.isRequired,
|
||||
onCoverDeselect: PropTypes.func.isRequired,
|
||||
onUpdate: PropTypes.func.isRequired,
|
||||
|
@ -143,6 +152,7 @@ Item.defaultProps = {
|
|||
url: undefined,
|
||||
coverUrl: undefined,
|
||||
createdAt: undefined,
|
||||
onClick: undefined,
|
||||
};
|
||||
|
||||
export default Item;
|
||||
export default React.memo(Item);
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import React, { useCallback } from 'react';
|
||||
import React, { useCallback, useRef } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import classNames from 'classnames';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
@ -73,6 +73,8 @@ const CardModal = React.memo(
|
|||
}) => {
|
||||
const [t] = useTranslation();
|
||||
|
||||
const isGalleryOpened = useRef(false);
|
||||
|
||||
const handleNameUpdate = useCallback(
|
||||
(newName) => {
|
||||
onUpdate({
|
||||
|
@ -124,6 +126,22 @@ const CardModal = React.memo(
|
|||
});
|
||||
}, [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 labelIds = labels.map((label) => label.id);
|
||||
|
||||
|
@ -328,6 +346,8 @@ const CardModal = React.memo(
|
|||
onUpdate={onAttachmentUpdate}
|
||||
onDelete={onAttachmentDelete}
|
||||
onCoverUpdate={handleCoverUpdate}
|
||||
onGalleryOpen={handleGalleryOpen}
|
||||
onGalleryClose={handleGalleryClose}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -445,7 +465,7 @@ const CardModal = React.memo(
|
|||
);
|
||||
|
||||
return (
|
||||
<Modal open closeIcon size="small" centered={false} onClose={onClose}>
|
||||
<Modal open closeIcon size="small" centered={false} onClose={handleClose}>
|
||||
{canEdit ? (
|
||||
<AttachmentAddZone onCreate={onAttachmentCreate}>{contentNode}</AttachmentAddZone>
|
||||
) : (
|
||||
|
|
|
@ -10,6 +10,7 @@ import CoreWrapperContainer from '../containers/CoreWrapperContainer';
|
|||
import NotFound from './NotFound';
|
||||
|
||||
import 'react-datepicker/dist/react-datepicker.css';
|
||||
import 'photoswipe/dist/photoswipe.css';
|
||||
import '../lib/custom-ui/styles.css';
|
||||
|
||||
import '../styles.module.scss';
|
||||
|
|
|
@ -32,7 +32,7 @@ const createData = (timer) => {
|
|||
const TimerEditStep = React.memo(({ defaultValue, onUpdate, onBack, onClose }) => {
|
||||
const [t] = useTranslation();
|
||||
const [data, handleFieldChange, setData] = useForm(() => createData(defaultValue));
|
||||
const [isEditing, toggleEdit] = useToggle();
|
||||
const [isEditing, toggleEditing] = useToggle();
|
||||
|
||||
const hoursField = useRef(null);
|
||||
const minutesField = useRef(null);
|
||||
|
@ -55,10 +55,10 @@ const TimerEditStep = React.memo(({ defaultValue, onUpdate, onBack, onClose }) =
|
|||
onClose();
|
||||
}, [defaultValue, onUpdate, onClose]);
|
||||
|
||||
const handleToggleEditClick = useCallback(() => {
|
||||
const handleToggleEditingClick = useCallback(() => {
|
||||
setData(createData(defaultValue));
|
||||
toggleEdit();
|
||||
}, [defaultValue, setData, toggleEdit]);
|
||||
toggleEditing();
|
||||
}, [defaultValue, setData, toggleEditing]);
|
||||
|
||||
const handleSubmit = useCallback(() => {
|
||||
const parts = {
|
||||
|
@ -149,7 +149,7 @@ const TimerEditStep = React.memo(({ defaultValue, onUpdate, onBack, onClose }) =
|
|||
type="button"
|
||||
icon={isEditing ? 'close' : 'edit'}
|
||||
className={styles.iconButton}
|
||||
onClick={handleToggleEditClick}
|
||||
onClick={handleToggleEditingClick}
|
||||
/>
|
||||
</div>
|
||||
{isEditing && <Button positive content={t('action.save')} />}
|
||||
|
|
|
@ -134,6 +134,7 @@ export default {
|
|||
subscribeToMyOwnCardsByDefault: 'Standardmäßig meine eigenen Karten abonnieren',
|
||||
taskActions_title: 'Aufgabenaktionen',
|
||||
tasks: 'Aufgaben',
|
||||
thereIsNoPreviewAvailableForThisAttachment: 'Für diesen Anhang ist keine Vorschau verfügbar',
|
||||
time: 'Zeit',
|
||||
timer: 'Timer',
|
||||
title: 'Titel',
|
||||
|
|
|
@ -127,6 +127,8 @@ export default {
|
|||
subscribeToMyOwnCardsByDefault: 'Subscribe to my own cards by default',
|
||||
taskActions_title: 'Task Actions',
|
||||
tasks: 'Tasks',
|
||||
thereIsNoPreviewAvailableForThisAttachment:
|
||||
'There is no preview available for this attachment',
|
||||
time: 'Time',
|
||||
timer: 'Timer',
|
||||
title: 'Title',
|
||||
|
|
|
@ -122,6 +122,7 @@ export default {
|
|||
subscribeToMyOwnCardsByDefault: 'По умолчанию подписаться на мои собственные карточки',
|
||||
taskActions: 'Действия с задачей',
|
||||
tasks: 'Задачи',
|
||||
thereIsNoPreviewAvailableForThisAttachment: 'Предпросмотр для этого вложения недоступен',
|
||||
time: 'Время',
|
||||
timer: 'Таймер',
|
||||
title: 'Название',
|
||||
|
|
|
@ -101,6 +101,10 @@
|
|||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.pswp .pswp__img--placeholder {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
#root {
|
||||
|
|
4
package-lock.json
generated
4
package-lock.json
generated
|
@ -1,12 +1,12 @@
|
|||
{
|
||||
"name": "planka",
|
||||
"version": "1.1.5",
|
||||
"version": "1.2.1",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "planka",
|
||||
"version": "1.1.5",
|
||||
"version": "1.2.1",
|
||||
"hasInstallScript": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
|
|
|
@ -24,6 +24,16 @@ module.exports = {
|
|||
required: true,
|
||||
columnName: 'is_image',
|
||||
},
|
||||
imageWidth: {
|
||||
type: 'number',
|
||||
allowNull: true,
|
||||
columnName: 'image_width',
|
||||
},
|
||||
imageHeight: {
|
||||
type: 'number',
|
||||
allowNull: true,
|
||||
columnName: 'image_height',
|
||||
},
|
||||
name: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
|
|
|
@ -20,20 +20,24 @@
|
|||
* 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
|
||||
// no matter where we actually lift from.
|
||||
// > Note: This is not required in order to lift, but it is a convenient default.
|
||||
process.chdir(__dirname);
|
||||
|
||||
dotenv.config();
|
||||
|
||||
// Attempt to import `sails` dependency, as well as `rc` (for loading `.sailsrc` files).
|
||||
let sails;
|
||||
let rc;
|
||||
|
||||
try {
|
||||
sails = require('sails'); // eslint-disable-line global-require
|
||||
rc = require('sails/accessible/rc'); // eslint-disable-line global-require
|
||||
/* eslint-disable global-require */
|
||||
sails = require('sails');
|
||||
rc = require('sails/accessible/rc');
|
||||
/* eslint-enable global-require */
|
||||
} catch (error) {
|
||||
/* eslint-disable no-console */
|
||||
console.error("Encountered an error when attempting to require('sails'):");
|
||||
|
|
7
server/config/env/production.js
vendored
7
server/config/env/production.js
vendored
|
@ -321,4 +321,11 @@ module.exports = {
|
|||
// baseUrl: 'https://example.com',
|
||||
// internalEmailAddress: 'support@example.com',
|
||||
},
|
||||
|
||||
routes: {
|
||||
'GET /*': {
|
||||
view: 'index',
|
||||
skipAssets: true,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
|
|
@ -84,9 +84,4 @@ module.exports.routes = {
|
|||
action: 'attachments/download-thumbnail',
|
||||
skipAssets: false,
|
||||
},
|
||||
|
||||
'GET /*': {
|
||||
view: 'index',
|
||||
skipAssets: true,
|
||||
},
|
||||
};
|
||||
|
|
|
@ -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 () => {
|
||||
try {
|
||||
const isExists = await knex.schema.hasTable(config.migrations.tableName);
|
||||
const isExists = await knex.schema.hasTable(knexfile.migrations.tableName);
|
||||
|
||||
await knex.migrate.latest();
|
||||
if (!isExists) {
|
||||
|
|
|
@ -1,7 +1,8 @@
|
|||
const path = require('path');
|
||||
const dotenv = require('dotenv');
|
||||
const _ = require('lodash');
|
||||
|
||||
require('dotenv').config({
|
||||
dotenv.config({
|
||||
path: path.resolve(__dirname, '../.env'),
|
||||
});
|
||||
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
module.exports.up = (knex) =>
|
||||
knex.schema.createTable('card', (table) => {
|
||||
knex.schema.createTable('card', async (table) => {
|
||||
/* Columns */
|
||||
|
||||
table.bigInteger('id').primary().defaultTo(knex.raw('next_id()'));
|
||||
|
@ -12,7 +12,7 @@ module.exports.up = (knex) =>
|
|||
table.specificType('position', 'double precision');
|
||||
table.text('name').notNullable();
|
||||
table.text('description');
|
||||
table.timestamp('dueDate', true);
|
||||
table.timestamp('due_date', true);
|
||||
table.jsonb('timer');
|
||||
|
||||
table.timestamp('created_at', true);
|
||||
|
|
|
@ -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
38
server/get-config.js
Normal 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;
|
Loading…
Add table
Add a link
Reference in a new issue