diff options
Diffstat (limited to 'js')
-rw-r--r-- | js/controllers/presets-controller.js | 77 | ||||
-rwxr-xr-x | js/helper-classes/3D/snap-manager.js | 1 | ||||
-rwxr-xr-x | js/ninja.reel/ninja.js | 69 | ||||
-rwxr-xr-x | js/panels/Splitter.js | 13 | ||||
-rw-r--r-- | js/panels/drag-drop-composer.js | 4 | ||||
-rw-r--r-- | js/panels/presets/default-animation-presets.js | 4 |
6 files changed, 111 insertions, 57 deletions
diff --git a/js/controllers/presets-controller.js b/js/controllers/presets-controller.js index 0467f73c..975f9f7a 100644 --- a/js/controllers/presets-controller.js +++ b/js/controllers/presets-controller.js | |||
@@ -20,14 +20,39 @@ exports.PresetsController = Montage.create(Component, { | |||
20 | 20 | ||
21 | addTransition: { | 21 | addTransition: { |
22 | value: function(element) { | 22 | value: function(element) { |
23 | var transitionDuration; | ||
24 | |||
23 | element.classList.add(this.transitionClass); | 25 | element.classList.add(this.transitionClass); |
24 | element.addEventListener("webkitTransitionEnd", this, true); | 26 | element.addEventListener("webkitTransitionEnd", this, true); |
27 | |||
28 | |||
29 | //// TODO: replace this hack when webkit supports transitionStart event | ||
30 | transitionDuration = this.application.ninja.stylesController.getElementStyle(element, '-webkit-transition-duration', true); | ||
31 | element.njTimeout = window.setTimeout(function() { | ||
32 | this.captureWebkitTransitionEnd({ | ||
33 | 'target': element | ||
34 | }); | ||
35 | }.bind(this), this._getMilliseconds(transitionDuration) + 100); | ||
36 | } | ||
37 | }, | ||
38 | |||
39 | _getMilliseconds : { | ||
40 | value: function(duration) { | ||
41 | if(duration.indexOf('ms') !== -1) { | ||
42 | return parseInt(duration); | ||
43 | } else { | ||
44 | return parseFloat(duration)*1000; | ||
45 | } | ||
25 | } | 46 | } |
26 | }, | 47 | }, |
27 | 48 | ||
28 | captureWebkitTransitionEnd : { | 49 | captureWebkitTransitionEnd : { |
29 | value : function(e) { | 50 | value : function(e) { |
30 | var el = e.target; | 51 | var el = e.target; |
52 | |||
53 | //// TODO: replace this hack when webkit supports transitionStart event (see above) | ||
54 | window.clearTimeout(el.njTimeout); | ||
55 | |||
31 | el.classList.remove(this.transitionClass); | 56 | el.classList.remove(this.transitionClass); |
32 | el.removeEventListener("webkitTransitionEnd", this, true); | 57 | el.removeEventListener("webkitTransitionEnd", this, true); |
33 | } | 58 | } |
@@ -41,10 +66,29 @@ exports.PresetsController = Montage.create(Component, { | |||
41 | 66 | ||
42 | var stylesController = this.application.ninja.stylesController, | 67 | var stylesController = this.application.ninja.stylesController, |
43 | selectorBase = presetData.selectorBase, | 68 | selectorBase = presetData.selectorBase, |
44 | rules = []; | 69 | rules = [], |
70 | animationNames = []; | ||
45 | 71 | ||
46 | selectorBase = stylesController.generateClassName(selectorBase); | 72 | selectorBase = stylesController.generateClassName(selectorBase); |
47 | 73 | ||
74 | selection.forEach(function(element) { | ||
75 | var el = element._element, | ||
76 | animationName; | ||
77 | |||
78 | if(useTransition) { | ||
79 | this.addTransition(el); | ||
80 | } | ||
81 | |||
82 | ///// TODO: remove when we find out what to do with competing animations | ||
83 | animationName = stylesController.getElementStyle(el, '-webkit-animation-name'); | ||
84 | if(animationName) { | ||
85 | animationNames.push(animationName); | ||
86 | } | ||
87 | |||
88 | el.classList.add(selectorBase); | ||
89 | |||
90 | }, this); | ||
91 | |||
48 | presetData.rules.forEach(function(rule, i) { | 92 | presetData.rules.forEach(function(rule, i) { |
49 | ///// Treat keyframed rules differently | 93 | ///// Treat keyframed rules differently |
50 | if(rule.isKeyFrameRule) { | 94 | if(rule.isKeyFrameRule) { |
@@ -54,38 +98,19 @@ exports.PresetsController = Montage.create(Component, { | |||
54 | ); | 98 | ); |
55 | } else { | 99 | } else { |
56 | var suffix = rule.selectorSuffix || ''; | 100 | var suffix = rule.selectorSuffix || ''; |
57 | rules.push(stylesController.addRule('.'+selectorBase + suffix, rule.styles)); | ||
58 | } | ||
59 | }, this); | ||
60 | |||
61 | selection.forEach(function(element) { | ||
62 | if(useTransition) { | ||
63 | this.addTransition(element); | ||
64 | } | ||
65 | |||
66 | element.classList.add(selectorBase); | ||
67 | 101 | ||
68 | //// Keep track of elements with presets and don't add duplicates | 102 | ///// TODO: remove when we find out what to do with competing animations |
69 | this.setCachedPreset(element, presetData.id, rules); | 103 | if(rule.styles['-webkit-animation-name'] && animationNames.length) { |
104 | rule.styles['-webkit-animation-name'] += ',' + animationNames.join(','); | ||
105 | } | ||
70 | 106 | ||
107 | rules.push(stylesController.addRule('.'+selectorBase + suffix, rule.styles)); | ||
108 | } | ||
71 | }, this); | 109 | }, this); |
72 | 110 | ||
73 | } | 111 | } |
74 | }, | 112 | }, |
75 | 113 | ||
76 | setCachedPreset : { | ||
77 | value: function(el, presetId, rules) { | ||
78 | |||
79 | } | ||
80 | }, | ||
81 | |||
82 | getPresets : { | ||
83 | value: function(element) { | ||
84 | |||
85 | } | ||
86 | |||
87 | }, | ||
88 | |||
89 | stringifyKeys : { | 114 | stringifyKeys : { |
90 | value: function(keysArray) { | 115 | value: function(keysArray) { |
91 | var keysString = ''; | 116 | var keysString = ''; |
diff --git a/js/helper-classes/3D/snap-manager.js b/js/helper-classes/3D/snap-manager.js index 67dedc49..9f6b9ed1 100755 --- a/js/helper-classes/3D/snap-manager.js +++ b/js/helper-classes/3D/snap-manager.js | |||
@@ -499,6 +499,7 @@ var SnapManager = exports.SnapManager = Montage.create(Component, { | |||
499 | var n = this._elementCache.length; | 499 | var n = this._elementCache.length; |
500 | this._elementCache[index] = this._elementCache[n-1]; | 500 | this._elementCache[index] = this._elementCache[n-1]; |
501 | this._elementCache.pop(); | 501 | this._elementCache.pop(); |
502 | target.elementModel.isIn2DSnapCache = false; | ||
502 | found = true; | 503 | found = true; |
503 | } | 504 | } |
504 | 505 | ||
diff --git a/js/ninja.reel/ninja.js b/js/ninja.reel/ninja.js index 9cbbc9b9..9b5081dd 100755 --- a/js/ninja.reel/ninja.js +++ b/js/ninja.reel/ninja.js | |||
@@ -25,7 +25,7 @@ exports.Ninja = Montage.create(Component, { | |||
25 | }, | 25 | }, |
26 | 26 | ||
27 | _isResizing: { | 27 | _isResizing: { |
28 | value: false | 28 | value: null |
29 | }, | 29 | }, |
30 | _resizedHeight : { | 30 | _resizedHeight : { |
31 | value: 0 | 31 | value: 0 |
@@ -36,11 +36,18 @@ exports.Ninja = Montage.create(Component, { | |||
36 | 36 | ||
37 | height: { | 37 | height: { |
38 | get: function() { | 38 | get: function() { |
39 | if(this._height === null) { | ||
40 | var storedData = this.application.localStorage.getItem("timelinePanel"); | ||
41 | if(storedData && storedData.value) { | ||
42 | this._height = storedData.value; | ||
43 | } | ||
44 | } | ||
39 | return this._height; | 45 | return this._height; |
40 | }, | 46 | }, |
41 | set: function(val) { | 47 | set: function(val) { |
42 | if(this._height != val) { | 48 | if(this._height != val) { |
43 | this._height = val; | 49 | this._height = val; |
50 | this.application.localStorage.setItem("timelinePanel", {"version": this.version, "value": val}); | ||
44 | this.needsDraw = true; | 51 | this.needsDraw = true; |
45 | } | 52 | } |
46 | 53 | ||
@@ -56,11 +63,18 @@ exports.Ninja = Montage.create(Component, { | |||
56 | 63 | ||
57 | width: { | 64 | width: { |
58 | get: function() { | 65 | get: function() { |
66 | if(this._width === null) { | ||
67 | var storedData = this.application.localStorage.getItem("rightPanelsContainer"); | ||
68 | if(storedData && storedData.value) { | ||
69 | this._width = storedData.value; | ||
70 | } | ||
71 | } | ||
59 | return this._width; | 72 | return this._width; |
60 | }, | 73 | }, |
61 | set: function(val) { | 74 | set: function(val) { |
62 | if(this._width != val) { | 75 | if(this._width != val) { |
63 | this._width = val; | 76 | this._width = val; |
77 | this.application.localStorage.setItem("rightPanelsContainer", {"version": this.version, "value": val}); | ||
64 | this.needsDraw = true; | 78 | this.needsDraw = true; |
65 | } | 79 | } |
66 | 80 | ||
@@ -72,6 +86,8 @@ exports.Ninja = Montage.create(Component, { | |||
72 | this.isResizing = true; | 86 | this.isResizing = true; |
73 | this.height = parseInt(this.timeline.element.offsetHeight); | 87 | this.height = parseInt(this.timeline.element.offsetHeight); |
74 | this.width = parseInt(this.rightPanelContainer.offsetWidth); | 88 | this.width = parseInt(this.rightPanelContainer.offsetWidth); |
89 | this.rightPanelContainer.classList.add("disableTransition"); | ||
90 | this.timeline.element.classList.add("disableTransition"); | ||
75 | this.needsDraw = true; | 91 | this.needsDraw = true; |
76 | } | 92 | } |
77 | }, | 93 | }, |
@@ -80,7 +96,6 @@ exports.Ninja = Montage.create(Component, { | |||
80 | value:function(e) { | 96 | value:function(e) { |
81 | this._resizedHeight = e._event.dY; | 97 | this._resizedHeight = e._event.dY; |
82 | this._resizedWidth = e._event.dX; | 98 | this._resizedWidth = e._event.dX; |
83 | console.log("resizing"); | ||
84 | this.stage.resizeCanvases = true; | 99 | this.stage.resizeCanvases = true; |
85 | this.needsDraw = true; | 100 | this.needsDraw = true; |
86 | } | 101 | } |
@@ -88,13 +103,17 @@ exports.Ninja = Montage.create(Component, { | |||
88 | 103 | ||
89 | handleResizeEnd: { | 104 | handleResizeEnd: { |