Commenting JS

reaktivstudios · Jul 5, 2017 · 85558d3 · 85558d3
1 parent 04eb8f1
commit 85558d3
Show file tree

Hide file tree

Showing 2 changed files with 59 additions and 14 deletions.
diff --git a/assets/js/cmb2-flexible.js b/assets/js/cmb2-flexible.js
@@ -1,10 +1,14 @@
 var cmb_flexible = {};
+window.CMB2 = window.CMB2 || {};
 window.CMB2.wysiwyg = window.CMB2.wysiwyg || false;
 
 (function( $, cmb ) {
 
 	var l10n = window.cmb2_l10 || {};
 
+	/**
+	 * Iniitalize Flexible content field
+	 */
 	cmb_flexible.init = function() {
 		var $metabox = cmb.metabox();
 
@@ -20,13 +24,23 @@ window.CMB2.wysiwyg = window.CMB2.wysiwyg || false;
 		} );
 	}
 
+	/**
+	 * Make sure no rows in flexible fields are set to disabled
+	 * Reset iterators whenever a flexible field is removed.
+	 *
+	 * @param  {object} evt Event object.
+	 */
 	cmb_flexible.removeDisabledRows = function( evt ) {
 		var $el = $( evt.target );
 		if (  $el.find( '.cmb-flexible-rows' ).length > 0 ) {
 			$el.find( '.cmb-remove-group-row' ).prop( 'disabled', false );
+			cmb_flexible.resetIterators( $el );
 		}
 	}
 
+	/**
+	 * Add the ability to remove all rows for flexible content fields.
+	 */
 	cmb_flexible.removeLastRow = function() {
 		var el = $(document).find( this );
 
@@ -39,6 +53,14 @@ window.CMB2.wysiwyg = window.CMB2.wysiwyg || false;
 		}
 	}
 
+	/**
+	 * Send an AJAX request for a new field and then add it to the DOM.
+	 *
+	 * Once a field has been added, need to make sure to initialize its 
+	 * dependencies and WYSIWYG functionality
+	 *
+	 * @param {object} evt Event object.
+	 */
 	cmb_flexible.addFlexibleRow = function( evt ) {
 		evt.preventDefault();
 
@@ -99,11 +121,24 @@ window.CMB2.wysiwyg = window.CMB2.wysiwyg || false;
 		});
 	}
 
+	/**
+	 * Show list of types on click.
+	 *
+	 * @param  {object} evt Event object.
+	 */
 	cmb_flexible.removeFlexibleHiddenClass = function( evt ) {
 		evt.preventDefault();
-		var list = $( this ).next( '.cmb-flexible-add-list' ).removeClass( 'hidden' );
+		var list = $( this ).next( '.cmb-flexible-add-list' ).toggleClass( 'hidden' );
 	}
 
+	/**
+	 * Sort through inputs and change the name attributes depending
+	 * on new iterator number.
+	 *
+	 * @param  {object} $el     jQuery Element object.
+	 * @param  {int}    prevNum Number to look for.
+	 * @param  {int}    newNum  Number to change to.
+	 */
 	cmb_flexible.updateFlexibleNames = function( $el, prevNum, newNum ) {
 		if ( $el.length > 0 ) {
 			newNum = newNum || prevNum - 1;
@@ -120,6 +155,11 @@ window.CMB2.wysiwyg = window.CMB2.wysiwyg || false;
 		}
 	}
 
+	/**
+	 * Shift Rows by switching them in the DOM.
+	 *
+	 * @param  {object} evt Event object.
+	 */
 	cmb_flexible.shiftRows = function( evt ) {
 		evt.preventDefault();
 
@@ -149,18 +189,28 @@ window.CMB2.wysiwyg = window.CMB2.wysiwyg || false;
 		cmb_flexible.updateFlexibleNames( $from, fromNum, gotoNum );
 		cmb_flexible.updateFlexibleNames( $goto, gotoNum, fromNum );
 
-		var $table = $this.closest( '.cmb-repeatable-group' );
-		$table.find( '.cmb-repeatable-grouping' ).each( function( rowindex ) {
-			var $row = $( this );
-			$row.data( 'iterator', rowindex );
-			$row.attr( 'data-iterator', rowindex );
-		} );
+		cmb_flexible.resetIterators( $this );
 
 		$from.add( $goto ).each(function() {
 			window.CMB2.wysiwyg.initRow( $( this ) );
 		} );
 
 	}
 
+	/**
+	 * We use both the data-iterator attribute to shift rows,
+	 * so need to make sure that is reset as well.
+	 *
+	 * @param  {object} $el jQuery element.
+	 */
+	cmb_flexible.resetIterators = function( $el ) {
+		var $table = $el.closest( '.cmb-repeatable-group' );
+		$table.find( '.cmb-repeatable-grouping' ).each( function( rowindex ) {
+			var $row = $( this );
+			$row.data( 'iterator', rowindex );
+			$row.attr( 'data-iterator', rowindex );
+		} );
+	}
+
 	$( cmb_flexible.init );
 })( jQuery, window.CMB2 );
diff --git a/cmb2-flexible-content-field.php b/cmb2-flexible-content-field.php
@@ -84,11 +84,6 @@ public function render_fields( $field, $escaped_value, $object_id, $object_type,
 			// These are the values from the fields.
 			$data = $escaped_value;
 
-			// This caches group attributes before the group is created, so that when options are set in add_subfields, they are applied.
-			// Can be replaced with set_options when that is released.
-			$field->set_prop( 'repeatable', true );
-			$group_attributes = $metabox->group_wrap_attributes( $field );
-
 			$group = $this->create_group( $field );
 
 			echo '<div class="cmb-row cmb-repeat-group-wrap ', esc_attr( $group->row_classes() ), '" data-fieldtype="flexible"><div class="cmb-td"><div data-groupid="', esc_attr( $group->id() ), '" id="', esc_attr( $group->id() ), '_repeat" ', $metabox->group_wrap_attributes( $group ), '>';
@@ -200,7 +195,7 @@ public function save_fields( $override_value, $values, $object_id, $field_args,
 			$field_group = $flexible_field->get_field_clone( $group_args );
 			$field_group->data_to_save = $values;
 
-			// // The saved array is used to hold sanitized values.
+			// The saved array is used to hold sanitized values.
 			$saved = array();
 			foreach ( $values as $i => $group_vals ) {
 
@@ -256,7 +251,7 @@ public function save_fields( $override_value, $values, $object_id, $field_args,
 		 * Add Flexible content scripts and styles
 		 */
 		public function add_scripts() {
-			wp_enqueue_script( 'cmb2-flexible-content', plugin_dir_url( __FILE__ ) . 'assets/js/cmb2-flexible.js', array( 'jquery', 'cmb2-scripts' ), '0.1', true );
+			wp_enqueue_script( 'cmb2-flexible-content', plugin_dir_url( __FILE__ ) . 'assets/js/cmb2-flexible.js', array( 'jquery', 'cmb2-scripts' ), '0.1.1', true );
 			wp_enqueue_style( 'cmb2-flexible-styles', plugin_dir_url( __FILE__ ) . 'assets/css/cmb2-flexible.css', array( 'cmb2-styles' ), '0.1' );
 		}