comicpress options working

classes/ComicPressAdmin.inc

@@ -135,11 +135,11 @@ class ComicPressAdmin {
 	function _render_admin_storyline_tree($node, $parent_id = "0") {
 	  foreach ($node as $category_id => $children) {
 			$category = get_category($category_id);
-			echo '<div id="category_' . $parent_id . '/' . $category_id . '" class="cp-category-info">';
+			echo '<div id="category_' . $parent_id . '-' . $category_id . '" class="cp-category-info">';
 				echo '<span>' . $category->name . '</span>';
 				if (is_array($children)) {
 					echo '<div class="cp-children">';
-						$this->_render_admin_storyline_tree($children, $parent_id . '/' . $category_id);
+						$this->_render_admin_storyline_tree($children, $parent_id . '-' . $category_id);
 					echo '</div>';
 				}
 			echo '</div>';
@@ -235,9 +235,6 @@ class ComicPressAdmin {
    * Update ComicPress options.
    */
   function handle_update_comicpress_options($info) {
-    foreach (array('helpers') as $type) {
-      $this->comicpress->comicpress_options[$type] = array();
-    }
     foreach ($this->comicpress->comicpress_options as $option => $value) {
       if (isset($info[$option])) {
         switch ($option) {
@@ -281,11 +278,6 @@ class ComicPressAdmin {
 						}
             break;
           // @codeCoverageIgnoreStart
-          case 'helpers':
-            foreach ($info[$option] as $type => $set) {
-              $this->comicpress->comicpress_options[$option][$type] = true;
-            }
-            break;
 					case 'storyline_order':
 						$storyline = new ComicPressStoryline();
 						$storyline->normalize($info[$option]);
@@ -328,6 +320,18 @@ class ComicPressAdmin {
     }
   }
 
+  function handle_update_get_new_image_type_editor($info) {
+  	$type = substr(md5(rand()), 0, 6);
+  	$info = array(
+  		'dimensions' => '100x100',
+  		'default' => false,
+  		'name' => 'New Type'
+  	);
+
+  	require_once('partials/_image-type-editor.inc');
+  	exit(0);
+  }
+
   /**
    * Update the zoom slider info.
    * @param $info The browser input.

classes/partials/options-admin.inc

@@ -1,18 +1,20 @@
 <div class="wrap">
 	<h2><?php _e('ComicPress Config', 'comicpress') ?></h2>
-	<form method="post">
+	<form method="post" action="">
 		<input type="hidden" name="cp[_nonce]" value="<?php echo $nonce ?>" />
 		<h3><?php _e('Global Options', 'comicpress') ?></h3>
 		<table class="widefat fixed">
 			<tr>
 				<th width="25%" scope="row" valign="top"><?php _e("Arrange storyline category order", 'comicpress') ?></th>
 				<td width="75%">
-					<input type="hidden" name="cp[storyline_order]" />
+					<input type="hidden" name="cp[storyline_order]" value="" />
-					<div id="storyline-sorter" class="cp-children">
+					<div id="storyline-sorter">
+						<div class="cp-children">
 							<?php
 								$this->_render_admin_storyline_tree(reset($storyline->get_simple_storyline()))
 							?>
 						</div>
+					</div>
 					<script type="text/javascript">Storyline.setup()</script>
 					<p><em><?php _e('(drag and drop desired order. categories can be modified on the Posts -> Categories page)', 'comicpress') ?></em></p>
 				</td>
@@ -25,11 +27,13 @@
 							<?php include('_image-type-editor.inc'); ?>
 						<?php } ?>
 					</div>
-					<a id="add-new-image-type" href="#">Add a new image type</a>
+					<a id="add-new-image-type" href="#">[+] Add a new image type</a>
 					<script type="text/javascript">ComicImageTypes.setup()</script>
 				</td>
 			</tr>
 		</table>
-		<input class="button" type="submit" value="<?php _e('Submit Changes', 'comicpress') ?>" />
+		<div style="text-align: center; margin-top: 10px;">
+			<input class="button" type="submit" value="<?php _e('Submit Updated ComicPress Options', 'comicpress') ?>" />
+		</div>
 	</form>
 </div>

css/cp-admin.css

@@ -8,7 +8,13 @@
 
 .cp-category-info span {
 	cursor: move;
-	color: #004
+	color: #33a;
+	font-size: 18px;
+	line-height: 22px
+}
+
+.cp-category-info span:hover {
+	color: #46d;
 }
 
 #ordering-zoom-slider-holder {
@@ -94,3 +100,10 @@
 	font-weight: bold;
 	color: #aaa
 }
+
+#add-new-image-type {
+	font-size: 16px;
+	line-height: 16px;
+	display: block;
+	margin-bottom: 10px;
+}

js/Storyline.js

@@ -3,10 +3,10 @@ var ComicImageTypes = {};
 
 (function() {
 	Storyline.get_order = function() {
-		var order = []
+		var order = [];
 		$$('#storyline-sorter .cp-category-info').each(function(info) {
-			var matches = info.id.match(/category_([0-9\/]+)/);
+			var matches = info.id.match(/category_([0-9\-]+)/);
-			if (matches) { order.push(matches[1]); }
+			if (matches) { order.push(matches[1].replace(/\-/g,'/')); }
 		});
 		$$('input[name*=storyline_order]').pop().value = order.join(',');
 	};
@@ -33,6 +33,20 @@ var ComicImageTypes = {};
 				});
 			});
 		});
+
+		Storyline.get_order();
+	};
+
+	ComicImageTypes.setup_checkboxes = function() {
+		var checkboxes = $$('input[name*=default][name*=image_types]');
+		checkboxes.each(function(c) {
+			c.stopObserving('change');
+			c.observe('change', function(e) {
+				checkboxes.each(function(ch) {
+					if (e.target != ch) { ch.checked = false; }
+				});
+			});
+		});
 	};
 
 	ComicImageTypes.setup = function() {
@@ -41,7 +55,7 @@ var ComicImageTypes = {};
 			if (closer) {
 				closer.observe('click', function(e) {
 					Event.stop(e);
-					if (confirm('Are you sure? Your templates may break after deleting this image type')) {
+					if (confirm('Are you sure? Your templates may break after deleting this image type.')) {
 						new Effect.Fade(ith, {
 							from: 1,
 							to: 0,
@@ -54,14 +68,7 @@ var ComicImageTypes = {};
 			}
 		});
 
-		var checkboxes = $$('input[name*=default][name*=image_types]');
+		ComicImageTypes.setup_checkboxes();
-		checkboxes.each(function(c) {
-			c.observe('change', function(e) {
-				checkboxes.each(function(ch) {
-					if (e.target != ch) { ch.checked = false; }
-				});
-			});
-		});
 
 		$('add-new-image-type').observe('click', function(e) {
 			Event.stop(e);
@@ -69,9 +76,12 @@ var ComicImageTypes = {};
 				method: 'get',
 				parameters: {
 					'cp[_nonce]': ComicPressAdmin.nonce,
-					'cp[
+					'cp[action]': 'get-new-image-type-editor'
 				},
-				insertion: 'bottom'
+				insertion: 'bottom',
+				onComplete: function() {
+					ComicImageTypes.setup_checkboxes();
+				}
 			});
 		});
 	};