Enhance date experience by eliminating hidden input field.

eth-timeline.php

@@ -163,14 +163,12 @@ class ETH_Timeline {
 		?>
 		<p id="eth-timeline-startbox">
 			<label for="eth-timeline-start"><?php _e( 'Start:', 'eth-timeline' ); ?></label>
-			<input type="text" name="eth-timeline-form[start]" id="eth-timeline-start" class="regular-text" value="<?php echo date( 'F j, Y', $start ); ?>" />
-			<input type="hidden" name="eth-timeline[start]" value="<?php echo $start * 1000; ?>" />
+			<input type="text" name="eth-timeline[start]" id="eth-timeline-start" class="regular-text" style="width: 11em;" value="<?php echo date( 'F j, Y', $start ); ?>" />
 		</p>
 
 		<p id="eth-timeline-endbox">
 			<label for="eth-timeline-end"><?php _e( 'End:', 'eth-timeline' ); ?></label>
-			<input type="text" name="eth-timeline-form[end]" id="eth-timeline-end" class="regular-text" value="<?php echo date( 'F j, Y', $end ); ?>" />
-			<input type="hidden" name="eth-timeline[end]" value="<?php echo $end * 1000; ?>" />
+			<input type="text" name="eth-timeline[end]" id="eth-timeline-end" class="regular-text" style="width: 11em;" value="<?php echo date( 'F j, Y', $end ); ?>" />
 		</p>
 		<?php
 
@@ -185,11 +183,14 @@ class ETH_Timeline {
 			return;
 
 		if ( isset( $_POST[ $this->get_nonce_name( 'date' ) ] ) && wp_verify_nonce( $_POST[ $this->get_nonce_name( 'date' ) ], $this->get_field_name( 'date' ) ) ) {
-			$dates = isset( $_POST['eth-timeline'] ) ? array_map( 'intval', $_POST['eth-timeline'] ) : array();
+			$dates = isset( $_POST['eth-timeline'] ) ? $_POST['eth-timeline'] : array();
 
-			foreach ( $dates as $key => $timestamp ) {
+			foreach ( $dates as $key => $date ) {
 				// Timestamp comes from JS
-				$timestamp = $timestamp / 1000;
+				if ( empty( $date ) )
+					$timestamp = 0;
+				else
+					$timestamp = strtotime( $date );
 
 				if ( $timestamp )
 					update_post_meta( $post_id, $this->{'meta_' . $key}, $timestamp );

js/admin.js

 ( function( $ ) {
 	$( document ).ready( function() {
 		var datepicker_args = {
-			altField: 'input[name="eth-timeline[start]"]',
-			altFormat: '@',
-			dateFormat: 'M dd, yy',
+			defaultDate: $( '#eth-timeline-start' ).val(),
+			dateFormat: 'MM dd, yy',
 		};
 
 		$( '#eth-timeline-start' ).datepicker( datepicker_args );
 
-		$.extend( datepicker_args, { altField: 'input[name="eth-timeline[end]"]', } );
+		$.extend( datepicker_args, { defaultDate: $( '#eth-timeline-end' ).val() } );
 		$( '#eth-timeline-end' ).datepicker( datepicker_args );
 	} );
 } )( jQuery );
\ No newline at end of file