Skip to content

Commit 6c7179a

Browse files
bodymovinbodymovin
committed
added remember and apply settings
1 parent c1965c4 commit 6c7179a

10 files changed

Lines changed: 218 additions & 13 deletions

File tree

‎bundle/jsx/elements/layerElement.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -127,7 +127,7 @@ $.__bodymovin.bm_layerElement = (function () {
127127
if (lType !== layerTypes.camera) {
128128
bm_transformHelper.exportTransform(layerInfo, layerData, frameRate);
129129
bm_maskHelper.exportMasks(layerInfo, layerData, frameRate);
130-
bm_effectsHelper.exportEffects(layerInfo, layerData, frameRate);
130+
bm_effectsHelper.exportEffects(layerInfo, layerData, frameRate, includeHiddenData);
131131
bm_layerStylesHelper.exportStyles(layerInfo, layerData, frameRate);
132132
bm_timeremapHelper.exportTimeremap(layerInfo, layerData, frameRate);
133133
}

‎bundle/jsx/utils/effectsHelper.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -279,7 +279,7 @@ $.__bodymovin.bm_effectsHelper = (function () {
279279
return ob;
280280
}
281281

282-
function exportEffects(layerInfo, layerData, frameRate) {
282+
function exportEffects(layerInfo, layerData, frameRate, includeHiddenData) {
283283
//bm_eventDispatcher.log('PropertyType.PROPERTY' + PropertyType.PROPERTY);
284284
//bm_eventDispatcher.log('PropertyType.INDEXED_GROUP' + PropertyType.INDEXED_GROUP);
285285
//bm_eventDispatcher.log('PropertyType.NAMED_GROUP' + PropertyType.NAMED_GROUP);
@@ -293,7 +293,7 @@ $.__bodymovin.bm_effectsHelper = (function () {
293293
var effectsArray = [];
294294
for (i = 0; i < len; i += 1) {
295295
effectElement = effects(i + 1);
296-
if(effectElement.enabled) {
296+
if(effectElement.enabled || includeHiddenData) {
297297
var effectType = getEffectType(effectElement.matchName);
298298
/*
299299
//If the effect is not a Slider Control and is not enabled, it won't be exported.

‎src/helpers/localStorageHelper.js‎

Lines changed: 29 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,11 +117,39 @@ function savePathsToLocalStorage(paths) {
117117
return prom
118118
}
119119

120+
function saveSettingsToLocalStorage(settings) {
121+
return new Promise((resolve, reject) => {
122+
try {
123+
localStorage.setItem('defaultSettings', JSON.stringify(settings))
124+
resolve()
125+
} catch(err) {
126+
reject()
127+
}
128+
})
129+
}
130+
131+
function getSettingsFromLocalStorage(paths) {
132+
return new Promise((resolve, reject) => {
133+
try {
134+
var settings = localStorage.getItem('defaultSettings');
135+
if(settings) {
136+
resolve(JSON.parse(settings))
137+
} else {
138+
reject()
139+
}
140+
} catch(err) {
141+
reject()
142+
}
143+
})
144+
}
145+
120146
export {
121147
getProjectFromLocalStorage,
122148
saveProjectToLocalStorage,
123149
getFontsFromLocalStorage,
124150
saveFontsFromLocalStorage,
125151
getPathsFromLocalStorage,
126-
savePathsToLocalStorage
152+
savePathsToLocalStorage,
153+
getSettingsFromLocalStorage,
154+
saveSettingsToLocalStorage,
127155
}

‎src/redux/actions/actionTypes.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,9 @@ export default {
3636
RENDER_UPDATE_FONT_ORIGIN: 'RENDER/UPDATE_FONT_ORIGIN',
3737
RENDER_UPDATE_INPUT: 'RENDER/UPDATE_INPUT',
3838
SETTINGS_CANCEL: 'SETTINGS/CANCEL',
39+
SETTINGS_APPLY: 'SETTINGS/APPLY',
40+
SETTINGS_APPLY_FROM_CACHE: 'SETTINGS/APPLY_FROM_CACHE',
41+
SETTINGS_REMEMBER: 'SETTINGS/REMEMBER',
3942
SETTINGS_TOGGLE_VALUE: 'SETTINGS/TOGGLE_VALUE',
4043
SETTINGS_TOGGLE_EXTRA_COMP: 'SETTINGS/TOGGLE_EXTRA_COMP',
4144
SETTINGS_UPDATE_VALUE: 'SETTINGS/UPDATE_VALUE',

‎src/redux/actions/compositionActions.js‎

Lines changed: 34 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -96,12 +96,40 @@ function goToComps() {
9696
}
9797

9898
function toggleShowSelected() {
99-
console.log('toggleShowSelected:')
10099
return {
101100
type: actionTypes.SETTINGS_TOGGLE_SELECTED,
102101
}
103102
}
104103

104+
function rememberSettings() {
105+
return {
106+
type: actionTypes.SETTINGS_REMEMBER,
107+
}
108+
}
109+
110+
function applySettings() {
111+
return {
112+
type: actionTypes.SETTINGS_APPLY,
113+
allComps: false
114+
}
115+
}
116+
117+
function applySettingsToSelectedComps(settings) {
118+
return {
119+
type: actionTypes.SETTINGS_APPLY,
120+
settings,
121+
allComps: true
122+
}
123+
}
124+
125+
function applySettingsFromCache(settings, allComps) {
126+
return {
127+
type: actionTypes.SETTINGS_APPLY_FROM_CACHE,
128+
settings,
129+
allComps
130+
}
131+
}
132+
105133
export {
106134
filterChange,
107135
toggleShowSelected,
@@ -117,5 +145,9 @@ export {
117145
updateSettingsValue,
118146
goToPreview,
119147
goToPlayer,
120-
goToComps
148+
goToComps,
149+
rememberSettings,
150+
applySettings,
151+
applySettingsFromCache,
152+
applySettingsToSelectedComps,
121153
}

‎src/redux/reducers/compositions.js‎

Lines changed: 56 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ let initialState = {
55
filter: '',
66
items:{},
77
current: 0,
8-
show_only_selected: false
8+
show_only_selected: false,
99
}
1010
let extensionReplacer = /\.\w*$/g
1111

@@ -349,6 +349,59 @@ function toggleSelected(state, action) {
349349
return newState
350350
}
351351

352+
function applySettingsToAllComps(state, action) {
353+
const items = state.items
354+
const itemKeys = Object.keys(items)
355+
const newItems = itemKeys.reduce((accumulator, key) => {
356+
const settingsClone = JSON.parse(JSON.stringify(action.settings))
357+
const item = items[key]
358+
if (item.selected) {
359+
const itemSettings = {
360+
...item.settings,
361+
...settingsClone
362+
}
363+
accumulator[key] = {
364+
...item,
365+
settings: itemSettings
366+
}
367+
} else {
368+
accumulator[key] = item
369+
}
370+
return accumulator
371+
}, {})
372+
return {
373+
...state,
374+
items: newItems
375+
}
376+
}
377+
378+
function applySettingsFromCache(state, action) {
379+
380+
if(action.allComps) {
381+
return applySettingsToAllComps(state, action)
382+
}
383+
384+
const settingsClone = JSON.parse(JSON.stringify(action.settings))
385+
386+
let item = state.items[state.current]
387+
const newSettings = {
388+
...item.settings,
389+
...settingsClone,
390+
}
391+
const newState = {
392+
...state,
393+
items: {
394+
...state.items,
395+
[state.current]: {
396+
...item,
397+
settings: newSettings
398+
}
399+
}
400+
}
401+
console.log(newState)
402+
return newState
403+
}
404+
352405
export default function compositions(state = initialState, action) {
353406
switch (action.type) {
354407
case actionTypes.COMPOSITIONS_UPDATED:
@@ -378,6 +431,8 @@ export default function compositions(state = initialState, action) {
378431
return updateSettingsValue(state, action)
379432
case actionTypes.SETTINGS_TOGGLE_SELECTED:
380433
return toggleSelected(state, action)
434+
case actionTypes.SETTINGS_APPLY_FROM_CACHE:
435+
return applySettingsFromCache(state, action)
381436
default:
382437
return state
383438
}

‎src/redux/sagas/composition_sagas.js‎

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,11 @@
11
import { call, put, take, fork, select, takeEvery } from 'redux-saga/effects'
22
import actions from '../actions/actionTypes'
3+
import {saveSettingsToLocalStorage, getSettingsFromLocalStorage} from '../../helpers/localStorageHelper'
34
import {getCompositions, getDestinationPath, renderNextComposition, stopRenderCompositions} from '../../helpers/CompositionsProvider'
45
import getRenderComposition from '../selectors/render_composition_selector'
56
import storingPathsSelector from '../selectors/storing_paths_selector'
7+
import settingsSelector from '../selectors/settings_selector'
8+
import {applySettingsFromCache} from '../actions/compositionActions'
69

710
function *getCSCompositions(action) {
811
while(true) {
@@ -53,10 +56,25 @@ function *goToSettings() {
5356
})
5457
}
5558

59+
function *saveSettings() {
60+
let settings = yield select(settingsSelector)
61+
yield call(saveSettingsToLocalStorage, settings)
62+
}
63+
64+
function *applySettings(action) {
65+
try {
66+
const settings = yield call(getSettingsFromLocalStorage)
67+
yield put(applySettingsFromCache(settings, action.allComps))
68+
} catch(err) {
69+
}
70+
}
71+
5672
export default [
5773
fork(getCSCompositions),
5874
fork(getCompositionDestination),
5975
fork(startRender),
6076
takeEvery(actions.RENDER_STOP, stopRender),
61-
takeEvery(actions.COMPOSITION_DISPLAY_SETTINGS, goToSettings)
77+
takeEvery(actions.COMPOSITION_DISPLAY_SETTINGS, goToSettings),
78+
takeEvery(actions.SETTINGS_REMEMBER, saveSettings),
79+
takeEvery(actions.SETTINGS_APPLY, applySettings),
6280
]

‎src/redux/selectors/settings_selector.js‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { createSelector } from 'reselect'
2+
3+
const getCompositions = (state) => state.compositions
4+
5+
const settingsSelector = createSelector(
6+
[ getCompositions ],
7+
(compositions) => {
8+
const items = compositions.items
9+
const current = compositions.current
10+
const currentComp = items[current] || {}
11+
12+
return currentComp.settings
13+
}
14+
)
15+
16+
export default settingsSelector

‎src/views/compositions/Compositions.jsx‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { StyleSheet, css } from 'aphrodite'
44
import CompositionsList from './list/CompositionsList'
55
import CompositionsListHeader from './listHeader/CompositionsListHeader'
66
import MainHeader from '../../components/header/Main_header'
7-
import {getDestination, filterChange, toggleItem, displaySettings, getCompositions, goToPreview, goToPlayer, toggleShowSelected} from '../../redux/actions/compositionActions'
7+
import {getDestination, filterChange, toggleItem, displaySettings, getCompositions, goToPreview, goToPlayer, toggleShowSelected, applySettingsToSelectedComps} from '../../redux/actions/compositionActions'
88
import {startRender, showRenderBlock} from '../../redux/actions/renderActions'
99
import compositions_selector from '../../redux/selectors/compositions_selector'
1010
import Variables from '../../helpers/styles/variables'
@@ -88,6 +88,11 @@ class Compositions extends React.Component {
8888
onClick={this.props.toggleShowSelected}>
8989
{this.props.showOnlySelected ? 'Show All' : 'Show Selected Compositions'}
9090
</div>
91+
<div
92+
className={css(styles.toggleButton)}
93+
onClick={this.props.applySettingsToSelectedComps}>
94+
{'Apply Stored Settings to Selected Comps'}
95+
</div>
9196
</div>
9297
)
9398
}
@@ -107,7 +112,8 @@ const mapDispatchToProps = {
107112
goToPreview: goToPreview,
108113
goToPlayer: goToPlayer,
109114
showRenderBlock: showRenderBlock,
110-
toggleShowSelected: toggleShowSelected
115+
toggleShowSelected: toggleShowSelected,
116+
applySettingsToSelectedComps: applySettingsToSelectedComps
111117
}
112118

113119
export default connect(mapStateToProps, mapDispatchToProps)(Compositions)

‎src/views/settings/Settings.jsx‎

Lines changed: 50 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { StyleSheet, css } from 'aphrodite'
44
import BaseButton from '../../components/buttons/Base_button'
55
import SettingsListItem from './list/SettingsListItem'
66
import SettingsCollapsableItem from './collapsable/SettingsCollapsableItem'
7-
import {setCurrentCompId, cancelSettings, toggleSettingsValue, updateSettingsValue, toggleExtraComp, goToComps} from '../../redux/actions/compositionActions'
7+
import {setCurrentCompId, cancelSettings, toggleSettingsValue, updateSettingsValue, toggleExtraComp, goToComps, rememberSettings, applySettings} from '../../redux/actions/compositionActions'
88
import settings_view_selector from '../../redux/selectors/settings_view_selector'
99
import Variables from '../../helpers/styles/variables'
1010

@@ -24,7 +24,36 @@ const styles = StyleSheet.create({
2424
display: 'flex',
2525
flexDirection: 'column'
2626
},
27-
title: {
27+
header: {
28+
width: '100%',
29+
height: '60px',
30+
alignItems: 'center',
31+
display: 'flex',
32+
flexGrow: 0,
33+
padding: '10px 0',
34+
justifyContent: 'space-between'
35+
},
36+
headerTitle: {
37+
flexGrow: 0,
38+
fontSize: '18px',
39+
},
40+
headerButtons: {
41+
flexGrow: 0,
42+
display: 'inline-block',
43+
verticalAlign: 'top',
44+
},
45+
headerButtonsButton: {
46+
backgroundColor: 'transparent',
47+
borderRadius:'4px',
48+
color: Variables.colors.green,
49+
cursor: 'pointer',
50+
display: 'inline-block',
51+
marginLeft: '4px',
52+
padding: '4px 1px',
53+
textDecoration: 'underline',
54+
verticalAlign: 'top',
55+
},
56+
headerSpacer: {
2857
width: '100%',
2958
flexGrow: 0,
3059
fontSize: '18px',
@@ -178,7 +207,23 @@ class Settings extends React.PureComponent {
178207
return (
179208
<div className={css(styles.wrapper)}>
180209
<div className={css(styles.container)}>
181-
<div className={css(styles.title)}>Settings</div>
210+
<div className={css(styles.header)}>
211+
<div className={css(styles.headerTitle)}>Settings</div>
212+
<div className={css(styles.headerButtons)}>
213+
<button
214+
className={css(styles.headerButtonsButton)}
215+
onClick={this.props.onRememberSettings}
216+
>
217+
Remember Settings
218+
</button>
219+
<button
220+
className={css(styles.headerButtonsButton)}
221+
onClick={this.props.onApplySettings}
222+
>
223+
Apply Settings
224+
</button>
225+
</div>
226+
</div>
182227
<ul className={css(styles.compsList)}>
183228
<SettingsListItem
184229
title='Split'
@@ -300,6 +345,8 @@ function mapStateToProps(state) {
300345

301346
const mapDispatchToProps = {
302347
setCurrentCompId: setCurrentCompId,
348+
onRememberSettings: rememberSettings,
349+
onApplySettings: applySettings,
303350
cancelSettings: cancelSettings,
304351
goToComps: goToComps,
305352
toggleSettingsValue: toggleSettingsValue,

0 commit comments

Comments
 (0)