Animat.css update, changing config format

BoldGrid · May 18, 2018 · 2a92459 · 2a92459
1 parent 4052ea3
commit 2a92459
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 3 deletions.
diff --git a/src/controls/animation/control.js b/src/controls/animation/control.js
@@ -12,7 +12,7 @@ export class Control {
 	constructor( options ) {
 		this.options = options || {};
 		this.$target = this.options.target;
-		this.animationClasses = _.flatten( _.values( animateConfig ) );
+		this.animationClasses = this._getAnimationClasses();
 		this.animationClassesString = this.animationClasses.join( ' ' );
 
 		this.delayControl = new Slider( {
@@ -83,6 +83,24 @@ export class Control {
 		return this.$control;
 	}
 
+	/**
+	 * Get a list of available animations from the configruations file.
+	 *
+	 * @since 0.14.0
+	 *
+	 * @return {array} List of animations.
+	 */
+	_getAnimationClasses() {
+		const classes = [];
+		for ( const category of _.values( animateConfig ) ) {
+			for ( const [ animationClass, enabled ] of Object.entries( category ) ) {
+				classes.push( animationClass );
+			}
+		}
+
+		return classes;
+	}
+
 	/**
 	 * Preset the type control.
 	 *

diff --git a/src/controls/animation/template.html b/src/controls/animation/template.html
@@ -4,9 +4,9 @@ <h3 class="control-title">Animation</h3>
 		<h4 class="control-title">Type</h4>
 		<select class="animations" name="animation-type">
 			<option value="">None</option>
-			<% _.each( animateConfig, function ( category, categoryName ) {   %>
+			<% _.each( animateConfig, function ( category, categoryName ) {  %>
 				<optgroup label="<%= titleCase( categoryName )%>">
-			<%	_.each( category, function ( animationName ) {  %>
+			<%	_.each( category, function ( enabled, animationName ) { %>
 					<option value="<%=animationName %>"><%=titleCase( animationName ) %></option>
 				<% } ); %>
 				</optgroup>