diff options
Diffstat (limited to 'wp-admin/widgets.php')
| -rw-r--r-- | wp-admin/widgets.php | 256 |
1 files changed, 112 insertions, 144 deletions
diff --git a/wp-admin/widgets.php b/wp-admin/widgets.php index b6b330c..a33dc84 100644 --- a/wp-admin/widgets.php +++ b/wp-admin/widgets.php @@ -5,38 +5,25 @@ require_once 'admin.php'; if ( ! current_user_can('switch_themes') ) wp_die( __( 'Cheatin’ uh?' )); -wp_enqueue_script( 'scriptaculous-effects' ); -wp_enqueue_script( 'scriptaculous-dragdrop' ); +wp_enqueue_script('interface'); function wp_widgets_admin_head() { global $wp_registered_sidebars, $wp_registered_widgets, $wp_registered_widget_controls; - - define( 'WP_WIDGETS_WIDTH', 1 + 262 * ( count( $wp_registered_sidebars ) ) ); - define( 'WP_WIDGETS_HEIGHT', 35 * ( count( $wp_registered_widgets ) ) ); ?> - <link rel="stylesheet" href="widgets.css?version=<?php bloginfo('version'); ?>" type="text/css" /> + <?php wp_admin_css( 'css/widgets' ); ?> <!--[if IE 7]> <style type="text/css"> - #palette {float:left;} + #palette { float: <?php echo ( get_bloginfo( 'text_direction' ) == 'rtl' ) ? 'right' : 'left'; ?>; } </style> <![endif]--> - <style type="text/css"> - .dropzone ul { height: <?php echo constant( 'WP_WIDGETS_HEIGHT' ); ?>px; } - #sbadmin #zones { width: <?php echo constant( 'WP_WIDGETS_WIDTH' ); ?>px; } - </style> -<?php - if ( get_bloginfo( 'text_direction' ) == 'rtl' ) { -?> - <link rel="stylesheet" href="widgets-rtl.css?version=<?php bloginfo('version'); ?>" type="text/css" /> <?php - } - + $cols = array(); foreach ( $wp_registered_sidebars as $index => $sidebar ) { $cols[] = '\'' . $index . '\''; } $cols = implode( ', ', $cols ); - + $widgets = array(); foreach ( $wp_registered_widgets as $name => $widget ) { $widgets[] = '\'' . $widget['id'] . '\''; @@ -49,127 +36,111 @@ function wp_widgets_admin_head() { var widgets = [<?php echo $widgets; ?>]; var controldims = new Array; <?php foreach ( $wp_registered_widget_controls as $name => $widget ) : ?> - controldims['<?php echo $widget['id']; ?>control'] = new Array; - controldims['<?php echo $widget['id']; ?>control']['width'] = <?php echo (int) $widget['width']; ?>; - controldims['<?php echo $widget['id']; ?>control']['height'] = <?php echo (int) $widget['height']; ?>; + controldims['#<?php echo $widget['id']; ?>control'] = new Array; + controldims['#<?php echo $widget['id']; ?>control']['width'] = <?php echo (int) $widget['width']; ?>; + controldims['#<?php echo $widget['id']; ?>control']['height'] = <?php echo (int) $widget['height']; ?>; <?php endforeach; ?> function initWidgets() { <?php foreach ( $wp_registered_widget_controls as $name => $widget ) : ?> - $('<?php echo $widget['id']; ?>popper').onclick = function() {popControl('<?php echo $widget['id']; ?>control');}; - $('<?php echo $widget['id']; ?>closer').onclick = function() {unpopControl('<?php echo $widget['id']; ?>control');}; - new Draggable('<?php echo $widget['id']; ?>control', {revert:false,handle:'controlhandle',starteffect:function(){},endeffect:function(){},change:function(o){dragChange(o);}}); + jQuery('#<?php echo $widget['id']; ?>popper').click(function() {popControl('#<?php echo $widget['id']; ?>control');}); + jQuery('#<?php echo $widget['id']; ?>closer').click(function() {unpopControl('#<?php echo $widget['id']; ?>control');}); + jQuery('#<?php echo $widget['id']; ?>control').Draggable({handle: '.controlhandle', zIndex: 1000}); if ( true && window.opera ) - $('<?php echo $widget['id']; ?>control').style.border = '1px solid #bbb'; + jQuery('#<?php echo $widget['id']; ?>control').css('border','1px solid #bbb'); <?php endforeach; ?> - if ( true && window.opera ) - $('shadow').style.background = 'transparent'; - new Effect.Opacity('shadow', {to:0.0}); - widgets.map(function(o) {o='widgetprefix-'+o; Position.absolutize(o); Position.relativize(o);} ); - $A(Draggables.drags).map(function(o) {o.startDrag(null); o.finishDrag(null);}); - //for ( var n in Draggables.drags ) { - for ( n=0; n<=Draggables.drags.length; n++ ) { - if ( parseInt( n ) ) { - if ( Draggables.drags[n].element.id == 'lastmodule' ) { - Draggables.drags[n].destroy(); - break; - } - } - } - resetPaletteHeight(); + jQuery('#shadow').css('opacity','0'); + jQuery(widgets).each(function(o) {o='#widgetprefix-'+o; jQuery(o).css('position','relative');} ); } function resetDroppableHeights() { var max = 6; - cols.map(function(o) {var c = $(o).childNodes.length; if ( c > max ) max = c;} ); - var height = 35 * ( max + 1); - cols.map(function(o) {h = (($(o).childNodes.length + 1) * 35); $(o).style.height = (h > 280 ? h : 280) + 'px';} ); - } - function resetPaletteHeight() { - var p = $('palette'), pd = $('palettediv'), last = $('lastmodule'); - p.appendChild(last); - if ( Draggables.activeDraggable && last.id == Draggables.activeDraggable.element.id ) - last = last.previousSibling; - var y1 = Position.cumulativeOffset(last)[1] + last.offsetHeight; - var y2 = Position.cumulativeOffset(pd)[1] + pd.offsetHeight; - var dy = y1 - y2; - pd.style.height = (pd.offsetHeight + dy + 9) + "px"; + jQuery.map(cols, function(o) { + var c = jQuery('#' + o + ' li').length; + if ( c > max ) max = c; + }); + var maxheight = 35 * ( max + 1); + jQuery.map(cols, function(o) { + height = 0 == jQuery('#' + o + ' li').length ? maxheight - jQuery('#' + o + 'placemat').height() : maxheight; + jQuery('#' + o).height(height); + }); } function maxHeight(elm) { htmlheight = document.body.parentNode.clientHeight; bodyheight = document.body.clientHeight; var height = htmlheight > bodyheight ? htmlheight : bodyheight; - $(elm).style.height = height + 'px'; + jQuery(elm).height(height); + } + function getViewportDims() { + var x,y; + if (self.innerHeight) { // all except Explorer + x = self.innerWidth; + y = self.innerHeight; + } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode + x = document.documentElement.clientWidth; + y = document.documentElement.clientHeight; + } else if (document.body) { // other Explorers + x = document.body.clientWidth; + y = document.body.clientHeight; + } + return new Array(x,y); } function dragChange(o) { - el = o.element ? o.element : $(o); - var p = Position.page(el); - var right = p[0]; - var top = p[1]; - var left = $('shadow').offsetWidth - (el.offsetWidth + right); - var bottom = $('shadow').offsetHeight - (el.offsetHeight + top); - if ( right < 1 ) el.style.left = 0; - if ( top < 1 ) el.style.top = 0; - if ( left < 1 ) el.style.left = (left + right) + 'px'; - if ( bottom < 1 ) el.style.top = (top + bottom) + 'px'; + var p = getViewportDims(); + var screenWidth = p[0]; + var screenHeight = p[1]; + var elWidth = parseInt( jQuery(o).css('width') ); + var elHeight = parseInt( jQuery(o).css('height') ); + var elLeft = parseInt( jQuery(o).css('left') ); + var elTop = parseInt( jQuery(o).css('top') ); + if ( screenWidth < ( parseInt(elLeft) + parseInt(elWidth) ) ) + jQuery(o).css('left', ( screenWidth - elWidth ) + 'px' ); + if ( screenHeight < ( parseInt(elTop) + parseInt(elHeight) ) ) + jQuery(o).css('top', ( screenHeight - elHeight ) + 'px' ); + if ( elLeft < 1 ) + jQuery(o).css('left', '1px'); + if ( elTop < 1 ) + jQuery(o).css('top', '1px'); } function popControl(elm) { - el = $(elm); - el.style.width = controldims[elm]['width'] + 'px'; - el.style.height = controldims[elm]['height'] + 'px'; var x = ( document.body.clientWidth - controldims[elm]['width'] ) / 2; var y = ( document.body.parentNode.clientHeight - controldims[elm]['height'] ) / 2; - el.style.position = 'absolute'; - el.style.right = '' + x + 'px'; - el.style.top = '' + y + 'px'; - el.style.zIndex = 1000; - el.className='control'; - $('shadow').onclick = function() {unpopControl(elm);}; - window.onresize = function(){maxHeight('shadow');dragChange(elm);}; + jQuery(elm).css({display: 'block', width: controldims[elm]['width'] + 'px', height: controldims[elm]['height'] + 'px', position: 'absolute', right: x + 'px', top: y + 'px', zIndex: '1000' }); + jQuery(elm).attr('class','control'); + jQuery('#shadow').click(function() {unpopControl(elm);}); + window.onresize = function(){maxHeight('#shadow');dragChange(elm);}; popShadow(); } function popShadow() { - maxHeight('shadow'); - var shadow = $('shadow'); - shadow.style.zIndex = 999; - shadow.style.display = 'block'; - new Effect.Opacity('shadow', {duration:0.5, from:0.0, to:0.2}); + maxHeight('#shadow'); + jQuery('#shadow').css({zIndex: '999', display: 'block'}); + jQuery('#shadow').fadeTo('fast', 0.2); } function unpopShadow() { - new Effect.Opacity('shadow', {to:0.0}); - $('shadow').style.display = 'none'; + jQuery('#shadow').fadeOut('fast', function() {jQuery('#shadow').hide()}); } function unpopControl(el) { - $(el).className='hidden'; + jQuery(el).attr('class','hidden'); + jQuery(el).hide(); unpopShadow(); } function serializeAll() { - <?php foreach ( $wp_registered_sidebars as $index => $sidebar ) : ?> - $('<?php echo $index; ?>order').value = Sortable.serialize('<?php echo $index; ?>'); + <?php $i = 0; foreach ( $wp_registered_sidebars as $index => $sidebar ) : $i++; ?> + var serial<?php echo $i ?> = jQuery.SortSerialize('<?php echo $index ?>'); + jQuery('#<?php echo $index ?>order').attr('value',serial<?php echo $i ?>.hash.replace(/widgetprefix-/g, '')); <?php endforeach; ?> } function updateAll() { - resetDroppableHeights(); - resetPaletteHeight(); - cols.map(function(o){ - var pm = $(o+'placematt'); - if ( $(o).childNodes.length == 0 ) { - pm.style.display = 'block'; - //Position.absolutize(o+'placematt'); - } else { - pm.style.display = 'none'; - } + jQuery.map(cols, function(o) { + if ( jQuery('#' + o + ' li').length ) + jQuery('#'+o+'placemat span.handle').hide(); + else + jQuery('#'+o+'placemat span.handle').show(); }); + resetDroppableHeights(); } - function noSelection(event) { - if ( document.selection ) { - var range = document.selection.createRange(); - range.collapse(false); - range.select(); - return false; - } - } - addLoadEvent(updateAll); - addLoadEvent(initWidgets); - Event.observe(window, 'resize', resetPaletteHeight); + jQuery(document).ready( function() { + updateAll(); + initWidgets(); + }); // ]]> </script> <?php @@ -179,19 +150,19 @@ do_action( 'sidebar_admin_setup' ); function wp_widget_draggable( $name ) { global $wp_registered_widgets, $wp_registered_widget_controls; - + if ( !isset( $wp_registered_widgets[$name] ) ) { return; } - + $sanitized_name = sanitize_title( $wp_registered_widgets[$name]['id'] ); $link_title = __( 'Configure' ); - $popper = ( isset( $wp_registered_widget_controls[$name] ) ) + $popper = ( isset( $wp_registered_widget_controls[$name] ) ) ? ' <div class="popper" id="' . $sanitized_name . 'popper" title="' . $link_title . '">≡</div>' : ''; - + $output = '<li class="module" id="widgetprefix-%1$s"><span class="handle">%2$s</span></li>'; - + printf( $output, $sanitized_name, $wp_registered_widgets[$name]['name'] . $popper ); } @@ -204,11 +175,11 @@ if ( count( $wp_registered_sidebars ) < 1 ) { ?> <div class="wrap"> <h2><?php _e( 'No Sidebars Defined' ); ?></h2> - + <p><?php _e( 'You are seeing this message because the theme you are currently using isn’t widget-aware, meaning that it has no sidebars that you are able to change. For information on making your theme widget-aware, please <a href="http://automattic.com/code/widgets/themes/">follow these instructions</a>.' ); /* TODO: article on codex */; ?></p> </div> <?php - + require_once 'admin-footer.php'; exit; } @@ -221,23 +192,23 @@ if ( empty( $sidebars_widgets ) ) { if ( isset( $_POST['action'] ) ) { check_admin_referer( 'widgets-save-widget-order' ); - + switch ( $_POST['action'] ) { case 'default' : $sidebars_widgets = wp_get_widget_defaults(); wp_set_sidebars_widgets( $sidebars_widgets ); break; - + case 'save_widget_order' : $sidebars_widgets = array(); - + foreach ( $wp_registered_sidebars as $index => $sidebar ) { $postindex = $index . 'order'; - + parse_str( $_POST[$postindex], $order ); - + $new_order = $order[$index]; - + if ( is_array( $new_order ) ) { foreach ( $new_order as $sanitized_name ) { foreach ( $wp_registered_widgets as $name => $widget ) { @@ -248,7 +219,7 @@ if ( isset( $_POST['action'] ) ) { } } } - + wp_set_sidebars_widgets( $sidebars_widgets ); break; } @@ -260,14 +231,14 @@ $inactive_widgets = array(); foreach ( $wp_registered_widgets as $name => $widget ) { $is_active = false; - + foreach ( $wp_registered_sidebars as $index => $sidebar ) { if ( is_array( $sidebars_widgets[$index] ) && in_array( $name, $sidebars_widgets[$index] ) ) { $is_active = true; break; } } - + if ( !$is_active ) { $inactive_widgets[] = $name; } @@ -297,9 +268,9 @@ if ( isset( $_POST['action'] ) ) { ?> <div class="wrap"> <h2><?php _e( 'Sidebar Arrangement' ); ?></h2> - + <p><?php _e( 'You can drag and drop widgets onto your sidebar below.' ); ?></p> - + <form id="sbadmin" method="post" onsubmit="serializeAll();"> <p class="submit"> <input type="submit" value="<?php _e( 'Save Changes »' ); ?>" /> @@ -309,17 +280,17 @@ if ( isset( $_POST['action'] ) ) { foreach ( $wp_registered_sidebars as $index => $sidebar ) { ?> <input type="hidden" id="<?php echo $index; ?>order" name="<?php echo $index; ?>order" value="" /> - + <div class="dropzone"> <h3><?php echo $sidebar['name']; ?></h3> - - <div id="<?php echo $index; ?>placematt" class="module placemat"> + + <div id="<?php echo $index; ?>placemat" class="placemat"> <span class="handle"> <h4><?php _e( 'Default Sidebar' ); ?></h4> <?php _e( 'Your theme will display its usual sidebar when this box is empty. Dragging widgets into this box will replace the usual sidebar with your customized sidebar.' ); ?> </span> </div> - + <ul id="<?php echo $index; ?>"> <?php if ( is_array( $sidebars_widgets[$index] ) ) { @@ -333,42 +304,39 @@ if ( isset( $_POST['action'] ) ) { <?php } ?> - - <br class="clear" /> - + </div> - + <div id="palettediv"> <h3><?php _e( 'Available Widgets' ); ?></h3> - + <ul id="palette"> <?php foreach ( $inactive_widgets as $name ) { wp_widget_draggable( $name ); } ?> - <li id="lastmodule"><span></span></li> </ul> </div> - + <script type="text/javascript"> // <![CDATA[ + jQuery(document).ready(function(){ <?php foreach ( $containers as $container ) { ?> - Sortable.create("<?php echo $container; ?>", { - dropOnEmpty: true, containment: [<?php echo $c_string; ?>], - handle: 'handle', constraint: false, onUpdate: updateAll, - format: /^widgetprefix-(.*)$/ - }); + jQuery('ul#<?php echo $container; ?>').Sortable({ + accept: 'module', activeclass: 'activeDraggable', opacity: 0.8, revert: true, onStop: updateAll + }); <?php } ?> + }); // ]]> </script> - + <p class="submit"> <?php wp_nonce_field( 'widgets-save-widget-order' ); ?> <input type="hidden" name="action" id="action" value="save_widget_order" /> <input type="submit" value="<?php _e( 'Save Changes »' ); ?>" /> </p> - + <div id="controls"> <?php foreach ( $wp_registered_widget_controls as $name => $widget ) { ?> <div class="hidden" id="<?php echo $widget['id']; ?>control"> @@ -381,12 +349,12 @@ if ( isset( $_POST['action'] ) ) { <?php } ?> </div> </form> - + <br class="clear" /> </div> - + <div id="shadow"> </div> - + <?php do_action( 'sidebar_admin_page' ); ?> <?php require_once 'admin-footer.php'; ?> |