beenull/ente
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

added install mobile app to photoFrame

Browse source
This commit is contained in:
Abhinav-grd 2021-05-23 05:44:02 +05:30
parent 0b08eeec5b
commit 0a66e963f9
2 changed files with 59 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

73
src/components/PhotoFrame.tsx
View file

@ -2,7 +2,7 @@ import router from 'next/router';
import { DeadCenter, FILE_TYPE } from 'pages/gallery'; import { DeadCenter, FILE_TYPE } from 'pages/gallery';
import PreviewCard from 'pages/gallery/components/PreviewCard'; import PreviewCard from 'pages/gallery/components/PreviewCard';
import React, { useState } from 'react'; import React, { useState } from 'react';
import { Button } from 'react-bootstrap'; import { Alert, Button } from 'react-bootstrap';
import { File } from 'services/fileService'; import { File } from 'services/fileService';
import styled from 'styled-components'; import styled from 'styled-components';
import DownloadManager from 'services/downloadManager'; import DownloadManager from 'services/downloadManager';
@ -23,6 +23,7 @@ interface TimeStampListItem {
items?: File[]; items?: File[];
itemStartIndex?: number; itemStartIndex?: number;
date?: string; date?: string;
banner?: any;
} }
const Container = styled.div` const Container = styled.div`
@ -31,7 +32,7 @@ const Container = styled.div`
width: 100%; width: 100%;
flex-wrap: wrap; flex-wrap: wrap;
margin: 0 auto; margin: 0 auto;
margin-bottom: 40px; margin-bottom: 1rem;
.pswp-thumbnail { .pswp-thumbnail {
display: inline-block; display: inline-block;
@ -72,6 +73,7 @@ const DateContainer = styled.div`
enum ITEM_TYPE { enum ITEM_TYPE {
TIME = 'TIME', TIME = 'TIME',
TILE = 'TILE', TILE = 'TILE',
BANNER = 'BANNER',
} }
interface Props { interface Props {
@ -308,15 +310,13 @@ const PhotoFrame = ({
) { ) {
currentDate = currentDate =
item.metadata.creationTime / 1000; item.metadata.creationTime / 1000;
const dateTimeFormat = new Intl.DateTimeFormat( const dateTimeFormat =
'en-IN', new Intl.DateTimeFormat('en-IN', {
{
weekday: 'short', weekday: 'short',
year: 'numeric', year: 'numeric',
month: 'long', month: 'long',
day: 'numeric', day: 'numeric',
} });
);
timeStampList.push({ timeStampList.push({
itemType: ITEM_TYPE.TIME, itemType: ITEM_TYPE.TIME,
date: isSameDay( date: isSameDay(
@ -355,6 +355,20 @@ const PhotoFrame = ({
} }
} }
}); });
files.length < 30 &&
timeStampList.push({
itemType: ITEM_TYPE.BANNER,
banner: (
<Alert
variant="success"
style={{
textAlign: 'center',
}}
>
{constants.INSTALL_MOBILE_APP()}
</Alert>
),
});
const extraRowsToRender = Math.ceil( const extraRowsToRender = Math.ceil(
(NO_OF_PAGES * height) / IMAGE_CONTAINER_HEIGHT (NO_OF_PAGES * height) / IMAGE_CONTAINER_HEIGHT
); );
@ -362,9 +376,9 @@ const PhotoFrame = ({
<List <List
itemSize={(index) => itemSize={(index) =>
timeStampList[index].itemType === timeStampList[index].itemType ===
ITEM_TYPE.TIME ITEM_TYPE.TILE
? DATE_CONTAINER_HEIGHT ? IMAGE_CONTAINER_HEIGHT
: IMAGE_CONTAINER_HEIGHT : DATE_CONTAINER_HEIGHT
} }
height={height} height={height}
width={width} width={width}
@ -374,14 +388,35 @@ const PhotoFrame = ({
> >
{({ index, style }) => { {({ index, style }) => {
return ( return (
<ListItem style={style}> <ListItem
style={
index ===
timeStampList.length - 1
? {
...style,
top: Math.max(
Number(
style.top
),
height - 45
),
height:
width < 450
? Number(
style.height
) * 2
: style.height,
}
: style
}
>
<ListContainer <ListContainer
columns={ columns={
timeStampList[index] timeStampList[index]
.itemType === .itemType ===
ITEM_TYPE.TIME ITEM_TYPE.TILE
? 1 ? columns
: columns : 1
} }
> >
{timeStampList[index] {timeStampList[index]
@ -394,6 +429,16 @@ const PhotoFrame = ({
].date ].date
} }
</DateContainer> </DateContainer>
) : timeStampList[index]
.itemType ===
ITEM_TYPE.BANNER ? (
<>
{
timeStampList[
index
].banner
}
</>
) : ( ) : (
timeStampList[ timeStampList[
index index

14
src/pages/gallery/index.tsx
View file

@ -340,20 +340,6 @@ export default function Gallery() {
openFileUploader={openFileUploader} openFileUploader={openFileUploader}
loadingBar={loadingBar} loadingBar={loadingBar}
/> />
{files.length < 30 && (
<Alert
variant="success"
style={{
position: 'fixed',
bottom: '1%',
width: '100%',
textAlign: 'center',
marginBottom: '0px',
}}
>
{constants.INSTALL_MOBILE_APP()}
</Alert>
)}
{selected.count > 0 && ( {selected.count > 0 && (
<SelectedFileOptions <SelectedFileOptions
addToCollectionHelper={addToCollectionHelper} addToCollectionHelper={addToCollectionHelper}