github-migration/comicpress-core
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

switched admin over to jquery

Browse Source
This commit is contained in:
John Bintz 2010-02-06 18:50:17 -05:00
parent b1d6514e73
commit 42ee62fbc3
11 changed files with 309 additions and 202 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
classes/ComicPressAdmin.inc
View File

@ -88,7 +88,7 @@ class ComicPressAdmin {
switch ($plugin_page) {
case 'comicpress/render_admin':
wp_enqueue_style('cp-admin', plugin_dir_url(dirname(__FILE__)) . '/css/cp-admin.css');
wp_enqueue_script('cp-admin', plugin_dir_url(dirname(__FILE__)) . '/js/Storyline.js', array('jquery', 'jquery-ui-dialog'));
wp_enqueue_script('cp-admin', plugin_dir_url(dirname(__FILE__)) . '/js/Storyline.js', array('jquery', 'jquery-ui-sortable', 'jquery-ui-tabs'));
add_action('admin_footer', array(&$this, 'admin_footer'));
break;
case 'comicpress/comicpress_docs':
@ -375,14 +375,14 @@ class ComicPressAdmin {
case 'image_types':
if (is_array($info['image_types'])) {
$this->comicpress->comicpress_options['image_types'] = array();
$defined_default = null;
$defined_default = isset($info['image_types']['_default']) ? $info['image_types']['_default'] : null;
unset($info['image_types']['_default']);
foreach ($info['image_types'] as $type => $image_info) {
if (is_array($image_info)) {
$new_value = array();
$new_type = $type;
foreach ($image_info as $field => $field_value) {
switch ($field) {
case 'default': $defined_default = $type; break;
case 'dimensions':
if (is_array($field_value)) {
if (count(array_intersect(array('width', 'height'), array_keys($field_value))) == 2) {

1
classes/partials/_comic-image-types.inc
View File

@ -6,7 +6,6 @@
<?php } ?>
</div>
<a id="add-new-image-type" href="#">[+] Add a new image type</a>
<script type="text/javascript">ComicImageTypes.setup()</script>
<input class="button-primary" type="submit" value="<?php _e('Submit Updated ComicPress Options', 'comicpress') ?>" />
</div>

2
classes/partials/_image-type-editor.inc
View File

@ -13,7 +13,7 @@
<th scope="row">Default image type?</th>
<td>
<label>
<input type="checkbox" name="cp[image_types][<?php echo $type ?>][default]" value="yes" <?php echo (!empty($info['default'])) ? 'checked="checked"' : '' ?> />
<input type="radio" name="cp[image_types][_default]" value="<?php echo esc_attr($type) ?>" <?php echo (!empty($info['default'])) ? 'checked="checked"' : '' ?> />
<em>(<?php _e('When using a ComicPress tag without specifying a type, this one will be used', 'comicpress') ?>)</em>
</label>
</td>

1
classes/partials/_storyline-order.inc
View File

@ -10,7 +10,6 @@
?>
</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>
<input class="button-primary" type="submit" value="<?php _e('Submit Updated ComicPress Options', 'comicpress') ?>" />

142
classes/partials/options-admin.inc
View File

@ -5,95 +5,93 @@
<input type="hidden" name="cp[action]" value="comicpress-options" />
<input type="hidden" name="cp[_action_nonce]" value="<?php echo esc_attr($action_nonce) ?>" />
<?php include('_storyline-order.inc') ?>
<div id="comicpress-admin-holder">
<?php include('_storyline-order.inc') ?>
<h3><?php _e('Category Groups', 'comicpress') ?></h3>
<h3><?php _e('Category Groups', 'comicpress') ?></h3>
<div id="comicpress-category-groups-holder" class="comicpress-holder">
<div id="category-groups-holder">
<?php
foreach ($this->comicpress->comicpress_options['category_groupings'] as $name => $category_ids) {
$key = $name;
include('_category-grouping-editor.inc');
}
?>
<div id="comicpress-category-groups-holder" class="comicpress-holder">
<div id="category-groups-holder">
<?php
foreach ($this->comicpress->comicpress_options['category_groupings'] as $name => $category_ids) {
$key = $name;
include('_category-grouping-editor.inc');
}
?>
</div>
<a id="add-new-category-group" href="#">[+] Add a new category group</a>
<br />
<input class="button-primary" type="submit" value="<?php _e('Submit Updated ComicPress Options', 'comicpress') ?>" />
</div>
<a id="add-new-category-group" href="#">[+] Add a new category group</a>
<script type="text/javascript">CategoryGroupings.setup()</script>
<br />
<input class="button-primary" type="submit" value="<?php _e('Submit Updated ComicPress Options', 'comicpress') ?>" />
<?php include('_comic-image-types.inc') ?>
<h3><?php _e('Enabled Backends', 'comicpress') ?></h3>
<div id="comicpress-enabled-backends-holder" class="comicpress-holder">
<table class="widefat">
<?php foreach ($backends as $backend) {
$obj = new $backend(); ?>
<tr>
<th scope="row">
<label>
<input type="checkbox"
name="cp[enabled_backends][<?php echo esc_attr($backend) ?>]"
value="yes"
<?php echo in_array($backend, $this->comicpress->comicpress_options['enabled_backends']) ? 'checked="checked"' : '' ?> />
<?php echo esc_html(preg_replace('#^ComicPressBackend(.*)Factory$#', '\1', $backend)) ?>
</label>
</th>
<td>
<?php echo esc_html($obj->description) ?>
</td>
</tr>
<?php } ?>
</table>
<p>
<?php _e("Disable backends you're not using to save system resources.", 'comicpress') ?>
</p>
<input class="button-primary" type="submit" value="<?php _e('Submit Updated ComicPress Options', 'comicpress') ?>" />
</div>
<?php do_action('comicpress-options-admin') ?>
</div>
<?php include('_comic-image-types.inc') ?>
<h3><?php _e('Enabled Backends', 'comicpress') ?></h3>
<div id="comicpress-enabled-backends-holder" class="comicpress-holder">
<table class="widefat">
<?php foreach ($backends as $backend) {
$obj = new $backend(); ?>
<tr>
<th scope="row">
<label>
<input type="checkbox"
name="cp[enabled_backends][<?php echo esc_attr($backend) ?>]"
value="yes"
<?php echo in_array($backend, $this->comicpress->comicpress_options['enabled_backends']) ? 'checked="checked"' : '' ?> />
<?php echo esc_html(preg_replace('#^ComicPressBackend(.*)Factory$#', '\1', $backend)) ?>
</label>
</th>
<td>
<?php echo esc_html($obj->description) ?>
</td>
</tr>
<?php } ?>
</table>
<p>
<?php _e("Disable backends you're not using to save system resources.", 'comicpress') ?>
</p>
<input class="button-primary" type="submit" value="<?php _e('Submit Updated ComicPress Options', 'comicpress') ?>" />
</div>
<?php do_action('comicpress-options-admin') ?>
</form>
</div>
<script type="text/javascript">
(function() {
var tab_holder = new Element('div', { className: 'comicpress-tab-holder' });
$$('.comicpress-admin > h2').pop().insert({after: tab_holder});
(function($) {
var tab_holder = $('<div class="comicpress-tab-holder"><ul /></div>');
var show_tab = function(which) {
tab_holder.childElements().each(function(t) {
var is_same = (t.id == which);
t[is_same ? 'addClassName' : 'removeClassName']('active');
$('comicpress-' + t.id.replace(/^comicpress-tab-/, ''))[is_same ? 'show' : 'hide']();
});
};
$('#comicpress-admin-holder').prepend(tab_holder);
$$('.comicpress-admin > form > h3').each(function(t) {
var id_suffix = t.innerHTML.replace(/\s+/g, '_');
var holder = new Element("div", { className: 'comicpress-admin-section', id: 'comicpress-' + id_suffix });
t.insert({before: holder});
$('#comicpress-admin-holder h3').each(function() {
var id = 'comicpress-' + $(this).html().replace(/\s+/g, '_');
holder.insert(t.next().remove());
holder.insert({top: t.remove()});
var tab = $('<a>')
.attr('href', '#' + id)
.wrap('<li />')
.html($(this).html())
.parent();
var tab = new Element("a", { href: "#", id: 'comicpress-tab-' + id_suffix }).update(t.innerHTML);
tab_holder.insert(tab);
tab_holder.find('ul').append(tab);
tab.observe('click', function(e) {
Event.stop(e);
show_tab(e.target.id)
var holder = $('<div class="comicpress-admin-section" />').attr('id', id);
$(this).before(holder).add($(this).next()).each(function() {
$(holder).append($(this).clone());
$(this).remove();
});
});
tab_holder.childElements().pop().addClassName('last');
$(tab_holder).find('ul li:last').addClass('last').end().tabs();
show_tab(tab_holder.childElements().shift().id);
Event.observe(document, 'dom:loaded', function() {
$(document).ready(function() {
ComicPressAdmin.image_type_editor_nonce = '<?php echo wp_create_nonce('comicpress-get-new-image-type-editor') ?>';
ComicPressAdmin.category_group_editor_nonce = '<?php echo wp_create_nonce('comicpress-get-new-category-group-editor') ?>';
ComicImageTypes.setup();
CategoryGroupings.setup();
Storyline.setup();
});
}());
}(jQuery));
</script>

27
css/cp-admin.css
View File

@ -235,7 +235,14 @@ tr.highlighted td {
/* Options */
.comicpress-tab-holder {
padding: 2px 0
padding: 3px 0;
overflow: hidden
}
.comicpress-tab-holder li {
float: left;
display: inline;
margin: 0
}
.comicpress-tab-holder a {
@ -247,19 +254,14 @@ tr.highlighted td {
border-width: 1px 0 0 1px;
}
.comicpress-tab-holder a.last {
.comicpress-tab-holder .last a {
border-right-width: 1px;
}
.comicpress-tab-holder a.active {
.ui-tabs-selected a {
background-color: white
}
.comicpress-admin form {
border: solid black 1px;
padding: 0 10px 10px;
}
.category-group-holder ul ul {
margin-left: 20px
}
@ -277,3 +279,12 @@ tr.highlighted td {
.category-group-holder .selected {
background-color: #99ccbb
}
.comicpress-admin-section {
border: solid black 1px;
padding: 10px
}
.comicpress-admin-section h3 {
margin-top: 0
}

199
js/Storyline.js
View File

@ -2,147 +2,118 @@ var Storyline = {};
var ComicImageTypes = {};
var CategoryGroupings = {};
(function() {
(function($) {
$.fn.setupAjax = function(action, nonce, target, onLoad) {
$(this).click(function() {
$.post(
ComicPressAdmin.ajax_uri,
{
'cp[_nonce]': ComicPressAdmin.nonce,
'cp[action]': action,
'cp[_action_nonce]': nonce
},
function(data) {
var type = $(data).hide();
$(target).append(type);
type.slideDown(250);
if (onLoad) { onLoad(); }
}
);
return false;
});
return this;
};
$.fn.setupRemover = function(message, parentSearch) {
$(this).unbind('click')
.click(function() {
if (confirm(message)) {
$(this).parents(parentSearch).slideUp(250, function() { $(this).remove(); });
}
return false;
});
return this;
};
Storyline.get_order = function() {
var order = [];
$$('#storyline-sorter .cp-category-info').each(function(info) {
var matches = info.id.match(/category_([0-9\-]+)/);
if (matches) { order.push(matches[1].replace(/\-/g,'/')); }
$('.cp-category-info').each(function() {
order.push(
$(this)
.attr('id')
.replace('category_', '')
.replace(/\-/g,'/')
);
});
$$('input[name*=storyline_order]').pop().value = order.join(',');
$('input[name*=storyline_order]').val(order.join(','));
};
Storyline.setup = function() {
var i = 0;
var depths = {};
$$('.cp-children').each(function(ch) {
ch.id = 'children-' + i;
var depth = ch.ancestors().length;
if (!depths[depth]) { depths[depth] = []; }
depths[depth].push(ch);
++i;
});
depths = $H(depths);
depths.keys().sort(function(a,b) { return b - a; }).each(function(depth) {
depths.get(depth).each(function(ch) {
Sortable.create(ch.id, {
tag: 'div',
handle: 'span',
onUpdate: Storyline.get_order
});
});
});
$('.cp-children').sortable({
axis: 'y',
stop: Storyline.get_order
}).disableSelection();
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_editors = function() {
$('.delete-image-type').setupRemover(
'Are you sure? Your templates may break after deleting this image type.',
'.image-type-holder'
);
};
ComicImageTypes.setup = function() {
$$('.image-type-holder').each(function(ith) {
var closer = ith.select('.delete-image-type').pop();
if (closer) {
closer.observe('click', function(e) {
Event.stop(e);
if (confirm('Are you sure? Your templates may break after deleting this image type.')) {
new Effect.Fade(ith, {
from: 1,
to: 0,
afterFinish: function() {
ith.parentNode.removeChild(ith);
}
});
}
});
}
});
ComicImageTypes.setup_editors();
ComicImageTypes.setup_checkboxes();
$('add-new-image-type').observe('click', function(e) {
Event.stop(e);
new Ajax.Updater('image-type-container', ComicPressAdmin.ajax_uri, {
method: 'get',
parameters: {
'cp[_nonce]': ComicPressAdmin.nonce,
'cp[action]': 'get-new-image-type-editor',
'cp[_action_nonce]': ComicPressAdmin.image_type_editor_nonce
},
insertion: 'bottom',
onComplete: function() {
ComicImageTypes.setup_checkboxes();
}
});
});
$('#add-new-image-type').setupAjax(
'get-new-image-type-editor',
ComicPressAdmin.image_type_editor_nonce,
'#image-type-container',
ComicImageTypes.setup_editors
);
};
CategoryGroupings.highlight_child_levels = function(e) {
(function($) {
$('.category-group-holder input[type=checkbox]').attr('disabled', false);
$('.category-group-holder input[type=checkbox]').attr('disabled', false);
$('.category-group-holder li')
.removeClass('selected')
.each(function() {
if ($(this).find('input[type=checkbox]:first').is('*:checked')) {
$(this).addClass('selected').find('input[type=checkbox]').not("*:first").attr('disabled', true);
}
});
$('.category-group-holder li')
.removeClass('selected')
.each(function() {
if ($(this).find('input[type=checkbox]:first').is('*:checked')) {
$(this).addClass('selected').find('input[type=checkbox]').not("*:first").attr('disabled', true);
}
});
$('.category-group-holder').each(function() {
$(this).find('.empty-group-warning')[($(this).find('input:checked').length == 0) ? 'show' : 'hide'](250);
});
}(jQuery))
$('.category-group-holder').each(function() {
$(this).find('.empty-group-warning')[($(this).find('input:checked').length == 0) ? 'show' : 'hide'](250);
});
}
CategoryGroupings.setup_editors = function() {
(function($) {
$('.category-group-holder input[type=checkbox], .category-group-holder label')
.unbind('click')
.click(CategoryGroupings.highlight_child_levels);
$('.category-group-holder input[type=checkbox], .category-group-holder label')
.unbind('click')
.click(CategoryGroupings.highlight_child_levels);
$('.delete-category-group-holder')
.unbind('click')
.click(function() {
if (confirm('Are you sure?')) {
$(this).parents('.category-group-holder').remove();
}
});
}(jQuery))
$('.delete-category-group-holder').setupRemover(
'Are you sure?',
'.category-group-holder'
);
}
CategoryGroupings.setup = function() {
CategoryGroupings.setup_editors();
CategoryGroupings.highlight_child_levels();
(function($) {
$('#add-new-category-group').click(function() {
$.post(
ComicPressAdmin.ajax_uri,
{
'cp[_nonce]': ComicPressAdmin.nonce,
'cp[action]': 'get-new-category-group-editor',
'cp[_action_nonce]': ComicPressAdmin.category_group_editor_nonce
},
function(data) {
$('#category-groups-holder').append(data);
CategoryGroupings.setup_editors();
}
);
return false;
});
}(jQuery));
$('#add-new-category-group').setupAjax(
'get-new-category-group-editor',
ComicPressAdmin.category_group_editor_nonce,
'#category-groups-holder',
CategoryGroupings.setup_editors
);
}
}())
}(jQuery))

5
test/ComicPressAdminTest.php
View File

@ -52,9 +52,10 @@ class ComicPressAdminTest extends PHPUnit_Framework_TestCase {
),
array(
'image_types' => array(
'_default' => 'archive',
'comic' => array('dimensions' => array('width' => '500', 'height' => '50')),
'archive' => array('default' => 'yes', 'dimensions' => array('width' => '100', 'height' => '100')),
)
'archive' => array('dimensions' => array('width' => '100', 'height' => '100')),
)
),
array(
'image_types' => array(

5
test/selenium/TestCategoryGroupings.html
View File

@ -71,6 +71,11 @@
<td>Are you sure?</td>
<td></td>
</tr>
<tr>
<td>waitForElementNotPresent</td>
<td>//div[@id=&quot;category-groups-holder&quot;]/div[${current_count}]</td>
<td></td>
</tr>
<tr>
<td>storeXpathCount</td>
<td>//div[@id=&quot;category-groups-holder&quot;]/div</td>

107
test/selenium/TestComicImageTypes.html Normal file
View File

@ -0,0 +1,107 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head profile="http://selenium-ide.openqa.org/profiles/test-case">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="selenium.base" href="" />
<title>TestComicImageTypes</title>
</head>
<body>
<table cellpadding="1" cellspacing="1" border="1">
<thead>
<tr><td rowspan="1" colspan="3">TestComicImageTypes</td></tr>
</thead><tbody>
<tr>
<td>open</td>
<td>/wp-admin</td>
<td></td>
</tr>
<tr>
<td>clickAndWait</td>
<td>link=ComicPress</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>comicpress-tab-Comic_Image_Types</td>
<td></td>
</tr>
<tr>
<td>assertVisible</td>
<td>comicpress-Comic_Image_Types</td>
<td></td>
</tr>
<tr>
<td>storeXpathCount</td>
<td>//div[@id=&quot;image-type-container&quot;]/div</td>
<td>current_count</td>
</tr>
<tr>
<td>click</td>
<td>add-new-image-type</td>
<td></td>
</tr>
<tr>
<td>storeEval</td>
<td>storedVars['current_count']++</td>
<td></td>
</tr>
<tr>
<td>waitForElementPresent</td>
<td>//div[@id=&quot;image-type-container&quot;]/div[${current_count}]</td>
<td></td>
</tr>
<tr>
<td>storeXpathCount</td>
<td>//div[@id=&quot;image-type-container&quot;]/div</td>
<td>new_count</td>
</tr>
<tr>
<td>assertEval</td>
<td>${current_count}</td>
<td>${new_count}</td>
</tr>
<tr>
<td>assertValue</td>
<td>//div[@id=&quot;image-type-container&quot;]/div[${new_count}]//input[contains(@name, &quot;[name]&quot;)]</td>
<td>New Type</td>
</tr>
<tr>
<td>click</td>
<td>//div[@id=&quot;image-type-container&quot;]/div[${new_count}]//a[@class=&quot;delete-image-type&quot;]</td>
<td></td>
</tr>
<tr>
<td>assertConfirmation</td>
<td>Are you sure?*</td>
<td></td>
</tr>
<tr>
<td>waitForElementNotPresent</td>
<td>//div[@id=&quot;image-type-container&quot;]/div[${current_count}]</td>
<td></td>
</tr>
<tr>
<td>storeXpathCount</td>
<td>//div[@id=&quot;image-type-container&quot;]/div</td>
<td>new_count</td>
</tr>
<tr>
<td>assertEval</td>
<td>${current_count} - 1</td>
<td>${new_count}</td>
</tr>
<tr>
<td>clickAndWait</td>
<td>//div[@id='comicpress-image-types-holder']/input</td>
<td></td>
</tr>
<tr>
<td>assertTextPresent</td>
<td>ComicPress configuration updated.</td>
<td></td>
</tr>
</tbody></table>
</body>
</html>

16
test/selenium/TestSuiteComicPressAdmin.html Normal file
View File

@ -0,0 +1,16 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type" />
<title>Test Suite</title>
</head>
<body>
<table id="suiteTable" cellpadding="1" cellspacing="1" border="1" class="selenium"><tbody>
<tr><td><b>Test Suite</b></td></tr>
<tr><td><a href="TestCategoryGroupings.html">TestCategoryGroupings</a></td></tr>
<tr><td><a href="TestComicImageTypes.html">TestComicImageTypes</a></td></tr>
<tr><td><a href="../../../../../../../../../..">Untitled</a></td></tr>
</tbody></table>
</body>
</html>