1 /* 2 * Copyright © 2009 Apple Inc. All rights reserved. 3 */ 4 5 /** 6 * @class 7 * 8 * A virtual class that allows the definition of pre-baked transitions that can be used as parameter 9 * for the {@link Element#applyTransition} method. In reality, any object that provides the type of 10 * properties instances of this class offers can be used with that method. 11 * 12 * @name TKTransitionDefinition 13 * @since TuneKit 1.0 14 */ 15 16 /** 17 * @name TKTransitionDefinition.prototype 18 * @property {Array} base A set of property / value pairs that are applied to the element as the transition starts. The properties 19 * listed there are not supposed to be transitioned. If you wish to set a from state for a property that gets transitioned, use 20 * the {@link #properties} and {@link from} properties instead. 21 * @property {Array} properties The set of properties that will be transitioned. The properties are CSS properties 22 * of the element that will be transitioned using this definition. 23 * @property {Array} from Optional list of values to start the transition from. Each value in this array must match the property 24 * at the same index in the {@link #properties} array. 25 * @property {Array} to Required list of values to transition to. Each value in this array must match the property 26 * at the same index in the {@link #properties} array. 27 */ 28 29 /** 30 * Fades out. 31 * @constant 32 * @type TKTransitionDefinition 33 */ 34 const TKViewTransitionDissolveOut = { 35 properties : ['opacity'], 36 from : [1], 37 to : [0] 38 }; 39 40 /** 41 * Fades in. 42 * @constant 43 * @type TKTransitionDefinition 44 */ 45 const TKViewTransitionDissolveIn = { 46 properties : ['opacity'], 47 from : [0], 48 to : [1] 49 }; 50 51 /** 52 * Fades in while scaling up to identity scale. 53 * @constant 54 * @type TKTransitionDefinition 55 */ 56 const TKViewTransitionZoomIn = { 57 properties : ['opacity', '-webkit-transform'], 58 from : [0, 'scale(0.2)'], 59 to : [1, 'scale(1)'] 60 }; 61 62 /** 63 * Fades out while scaling down to identity scale. 64 * @constant 65 * @type TKTransitionDefinition 66 */ 67 const TKViewTransitionZoomOut = { 68 properties : ['opacity', '-webkit-transform'], 69 from : [0, 'scale(1.2)'], 70 to : [1, 'scale(1)'] 71 }; 72 73 /** 74 * Fades in while rotating from the right. 75 * @constant 76 * @type TKTransitionDefinition 77 */ 78 const TKViewTransitionCrossSpinRight = { 79 properties : ['opacity', '-webkit-transform'], 80 from : [0, 'rotate(20deg)'], 81 to : [1, 'rotate(0)'] 82 }; 83 84 /** 85 * Fades in while rotating from the left. 86 * @constant 87 * @type TKTransitionDefinition 88 */ 89 const TKViewTransitionCrossSpinLeft = { 90 properties : ['opacity', '-webkit-transform'], 91 from : [0, 'rotate(-20deg)'], 92 to : [1, 'rotate(0)'] 93 }; 94 95 /** 96 * Scale transition scaling in. 97 * @constant 98 * @type TKTransitionDefinition 99 */ 100 const TKViewTransitionScaleIn = { 101 base : ['z-index', 1], 102 properties : ['-webkit-transform'], 103 from : ['scale(0.01)'], 104 to : ['scale(1)'] 105 }; 106 107 /** 108 * Scale transition scaling out. 109 * @constant 110 * @type TKTransitionDefinition 111 */ 112 const TKViewTransitionScaleOut = { 113 base : ['z-index', 1], 114 properties : ['-webkit-transform'], 115 from : ['scale(1)'], 116 to : ['scale(0.01)'] 117 }; 118