explorigin/gallery
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

WHHHEEEEEE OVERENGINEERING!!!

Browse Source
This commit is contained in:
Timothy Farrell 2017-12-16 04:35:21 -06:00
parent ecf1d6c51b
commit 622cfaed91
5 changed files with 18 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/gallery/src/interface/allImages.js
View File

@ -4,7 +4,6 @@ import { prop, computed, container } from 'frptools';
import { import {
subscribeToRender, subscribeToRender,
defineView, defineView,
subscribeToRender,
nodeParentWithType, nodeParentWithType,
defineElement as el defineElement as el
} from '../utils/domvm.js'; } from '../utils/domvm.js';

9
packages/gallery/src/interface/components/albumPhotoTemplate.js
View File

@ -8,7 +8,7 @@ import {
subscribeToRender subscribeToRender
} from '../../utils/domvm.js'; } from '../../utils/domvm.js';
import { injectStyle, styled } from '../../services/style.js'; import { injectStyle, styled } from '../../services/style.js';
import { DEFAULT_TRANSITION, CSS_FULL_SIZE, IMAGE_MARGIN } from '../styles.js'; import { DEFAULT_TRANSITION, CSS_FULL_SIZE, IMAGE_MARGIN, CLICKABLE } from '../styles.js';
import { Icon } from './icon.js'; import { Icon } from './icon.js';
import { AttachmentImageView } from './attachmentImage.js'; import { AttachmentImageView } from './attachmentImage.js';
@ -32,7 +32,7 @@ export function AlbumPhotoTemplate(vm, { doc }) {
onmouseenter: [hover, true], onmouseenter: [hover, true],
onmouseleave: [hover, false], onmouseleave: [hover, false],
css: { css: {
cursor: selectMode ? 'pointer' : 'zoom-in' cursor: selectMode ? CLICKABLE.cursor : 'zoom-in'
}, },
_data: doc _data: doc
}, },
@ -89,7 +89,7 @@ const image = styled('img', CSS_FULL_SIZE, DEFAULT_TRANSITION, {
zIndex: 0 zIndex: 0
}); });
const photoSelectButton = styled(DEFAULT_TRANSITION, { const photoSelectButton = styled(DEFAULT_TRANSITION, CLICKABLE, {
position: 'absolute', position: 'absolute',
top: '4%', top: '4%',
left: '4%', left: '4%',
@ -98,8 +98,7 @@ const photoSelectButton = styled(DEFAULT_TRANSITION, {
borderRadius: '50%', borderRadius: '50%',
padding: '2px', padding: '2px',
backgroundColor: 'transparent', backgroundColor: 'transparent',
opacity: 0, opacity: 0
cursor: 'pointer'
}); });
const photoOverlay = styled(CSS_FULL_SIZE, DEFAULT_TRANSITION, { const photoOverlay = styled(CSS_FULL_SIZE, DEFAULT_TRANSITION, {

5
packages/gallery/src/interface/components/albumTemplate.js
View File

@ -5,7 +5,7 @@ import {
patchNodeStyle patchNodeStyle
} from '../../utils/domvm.js'; } from '../../utils/domvm.js';
import { injectStyle, styled } from '../../services/style.js'; import { injectStyle, styled } from '../../services/style.js';
import { DEFAULT_TRANSITION } from '../styles.js'; import { DEFAULT_TRANSITION, CLICKABLE } from '../styles.js';
import { Icon } from './icon.js'; import { Icon } from './icon.js';
import { AlbumPhotoTemplate } from './albumPhotoTemplate.js'; import { AlbumPhotoTemplate } from './albumPhotoTemplate.js';
import { extractID } from '../../utils/conversion.js'; import { extractID } from '../../utils/conversion.js';
@ -71,8 +71,7 @@ const albumContent = styled({
userSelect: 'none' userSelect: 'none'
}); });
const albumSelectButton = styled(DEFAULT_TRANSITION, { const albumSelectButton = styled(DEFAULT_TRANSITION, CLICKABLE, {
paddingLeft: '0.5em', paddingLeft: '0.5em',
cursor: 'pointer',
opacity: 0 opacity: 0
}); });

15
packages/gallery/src/interface/components/appbar.js
View File

@ -4,6 +4,7 @@ import { Icon } from './icon.js';
import { defineElement as el, subscribeToRender } from '../../utils/domvm.js'; import { defineElement as el, subscribeToRender } from '../../utils/domvm.js';
import { injectStyle, styled } from '../../services/style.js'; import { injectStyle, styled } from '../../services/style.js';
import { pick } from '../../utils/conversion.js'; import { pick } from '../../utils/conversion.js';
import { CLICKABLE } from '../styles.js';
let seq = 0; let seq = 0;
const getSeq = pick('_seq'); const getSeq = pick('_seq');
@ -63,10 +64,7 @@ export function AppBarView(vm, params, key, opts) {
[ [
Icon({ Icon({
name: 'arrow_left', name: 'arrow_left',
size: 0.75, size: 0.75
attrs: {
onclick: popState
}
}) })
] ]
) )
@ -86,9 +84,12 @@ const header = styled({
alignItems: 'center' alignItems: 'center'
}); });
const backButtonContainer = styled({ const backButtonContainer = styled(
marginRight: '1em' {
}); marginRight: '1em'
},
CLICKABLE
);
const headerRight = styled({ const headerRight = styled({
display: 'flex', display: 'flex',

4
packages/gallery/src/interface/styles.js
View File

@ -9,3 +9,7 @@ export const DEFAULT_TRANSITION = {
transition: transition:
'transform 0.135s cubic-bezier(0, 0, 0.2, 1), opacity 0.135s cubic-bezier(0, 0, 0.2, 1)' 'transform 0.135s cubic-bezier(0, 0, 0.2, 1), opacity 0.135s cubic-bezier(0, 0, 0.2, 1)'
}; };
export const CLICKABLE = {
cursor: 'pointer'
};