From ad6e4d1a4126b12b39ea988ac6e140a93367f1dc Mon Sep 17 00:00:00 2001 From: azaozz Date: Sun, 10 May 2009 00:49:48 +0000 Subject: [PATCH] Append the widget's title to the header, adjust sidebar height after changing widgets, see #9511 git-svn-id: http://svn.automattic.com/wordpress/trunk@11246 1a063a9b-81f0-0310-95a4-ce76da25c4cd --- wp-admin/css/colors-classic.css | 4 +++ wp-admin/css/colors-fresh.css | 4 +++ wp-admin/css/ie.css | 17 ++++++++++ wp-admin/css/widgets.css | 17 +++++++--- wp-admin/includes/widgets.php | 2 +- wp-admin/js/widgets.dev.js | 55 ++++++++++++++++++++++++--------- wp-admin/js/widgets.js | 2 +- wp-includes/script-loader.php | 8 ++--- 8 files changed, 85 insertions(+), 24 deletions(-) diff --git a/wp-admin/css/colors-classic.css b/wp-admin/css/colors-classic.css index d15209985b..14af1d2fce 100644 --- a/wp-admin/css/colors-classic.css +++ b/wp-admin/css/colors-classic.css @@ -1633,3 +1633,7 @@ div.widgets-sortables, #widgets-right .sidebar-name-arrow { background: transparent url(../images/fav-arrow.gif) no-repeat scroll 0 -1px; } + +h4 .in-widget-title { + color: #636363; +} diff --git a/wp-admin/css/colors-fresh.css b/wp-admin/css/colors-fresh.css index d6ada78870..b4664daf11 100644 --- a/wp-admin/css/colors-fresh.css +++ b/wp-admin/css/colors-fresh.css @@ -1622,3 +1622,7 @@ div.widgets-sortables, #widgets-right .sidebar-name-arrow { background: transparent url(../images/fav-arrow.gif) no-repeat scroll 0 -1px; } + +h4 .in-widget-title { + color: #636363; +} diff --git a/wp-admin/css/ie.css b/wp-admin/css/ie.css index 3827b0e134..034ebc2263 100644 --- a/wp-admin/css/ie.css +++ b/wp-admin/css/ie.css @@ -372,3 +372,20 @@ table.ie-fixed { right: -2px; } +* html .widget-title h4 { + width: 210px; +} + +#available-widgets .widget-holder { + padding-bottom: 65px; +} + +#widgets-left .inactive { + padding-bottom: 10px; +} + +.widget-liquid-right .widget, +#wp_inactive_widgets .widget { + position: relative; +} + diff --git a/wp-admin/css/widgets.css b/wp-admin/css/widgets.css index a50e7a0a41..268f95d76a 100644 --- a/wp-admin/css/widgets.css +++ b/wp-admin/css/widgets.css @@ -31,7 +31,7 @@ div.widget-liquid-right { #wp_inactive_widgets .widget { width: 250px; margin: 0 auto 20px; - position: relative; + overflow: hidden; } #wp_inactive_widgets .widget { @@ -43,6 +43,7 @@ div.sidebar-name h3 { margin: 0; padding: 5px 12px; font-size: 13px; + height: 19px; } div.sidebar-name { @@ -157,11 +158,12 @@ ul#widget-list { .widget .widget-top { font-size: 12px; font-weight: bold; - line-height: 1; + height: 26px; + overflow: hidden; } .widget-top .widget-title { - padding: 7px 9px; + padding: 5px 9px; } .widget-top .widget-title-action { @@ -205,7 +207,9 @@ a.widget-action { .widget-title h4 { margin: 0; - line-height: 1; + line-height: 1.3; + overflow: hidden; + white-space: nowrap; } .widgets-sortables { @@ -291,3 +295,8 @@ a.widget-control-edit { height: 29px; width: 26px; } + +h4 .in-widget-title { + font-size: 11px; + white-space: nowrap; +} diff --git a/wp-admin/includes/widgets.php b/wp-admin/includes/widgets.php index 429f726ea2..1176e76736 100644 --- a/wp-admin/includes/widgets.php +++ b/wp-admin/includes/widgets.php @@ -172,7 +172,7 @@ function wp_widget_control( $sidebar_args ) { -

+

diff --git a/wp-admin/js/widgets.dev.js b/wp-admin/js/widgets.dev.js index ce15b2a541..38635188bc 100644 --- a/wp-admin/js/widgets.dev.js +++ b/wp-admin/js/widgets.dev.js @@ -4,16 +4,15 @@ var wpWidgets; wpWidgets = { init : function() { - var rem, hr = $('#available-widgets .widget-holder').height() - 7, firstsb = $('#widgets-right .widgets-holder-wrap .widgets-sortables:first'), hl = firstsb.height(); + var rem; $('#widgets-right div.sidebar-name').click(function(){ var c = $(this).siblings('.widgets-sortables'); if ( c.is(':visible') ) { - c.hide().sortable('disable'); $(this).parent().addClass('closed'); } else { - c.show().sortable('enable').sortable('refresh'); $(this).parent().removeClass('closed'); + c.sortable('refresh'); } }); @@ -25,8 +24,9 @@ wpWidgets = { } }); - if ( hr > hl ) - firstsb.css('minHeight', hr + 'px'); + $('#widgets-right .widget, #wp_inactive_widgets .widget').each(function(){ + wpWidgets.appendTitle(this); + }); this.addEvents(); $('.widget-error').parents('.widget').find('a.widget-action').click(); @@ -37,6 +37,7 @@ wpWidgets = { distance: 2, helper: 'clone', zIndex: 5, + containment: 'document', start: function(e,ui) { wpWidgets.fixWebkit(1); ui.helper.find('.widget-description').hide(); @@ -57,6 +58,7 @@ wpWidgets = { cursor: 'move', distance: 2, opacity: 0.65, + containment: 'document', start: function(e,ui) { wpWidgets.fixWebkit(1); ui.item.find('.widget-inside').hide(); @@ -65,7 +67,6 @@ wpWidgets = { stop: function(e,ui) { var add = ui.item.find('input.add_new').val(), n = ui.item.find('input.multi_number').val(), id = ui.item.attr('id'), sb = $(this).attr('id'); ui.item.css({'marginLeft':'','width':''}); - if ( add ) { if ( 'multi' == add ) { ui.item.html( ui.item.html().replace(/<[^<>]+>/g, function(m){ return m.replace(/__i__|%i%/g, n); }) ); @@ -82,14 +83,15 @@ wpWidgets = { ui.item.find('a.widget-action').click(); } wpWidgets.saveOrder(sb); + wpWidgets.resize(); wpWidgets.fixWebkit(); }, receive: function(e,ui) { if ( !$(this).is(':visible') ) $(this).sortable('cancel'); } - - }).not(':visible').sortable('disable'); + }); + wpWidgets.resize(); }, saveOrder : function(sb) { @@ -125,26 +127,51 @@ wpWidgets = { data += '&' + $.param(a); $.post( ajaxurl, data, function(r){ - var id; + var id, widget; $('.ajax-feedback').css('visibility', 'hidden'); if ( !t ) return; + widget = $(t).parents('.widget'); + if ( del ) { - $(t).parents('.widget').slideUp('normal', function(){ $(this).remove(); }); - if ( !a.widget_number ) { - id = a['widget-id']; + widget.slideUp('normal', function(){ + $(this).remove(); + wpWidgets.resize(); + }); + if ( !$('.widget_number', widget).val() ) { + id = $('.widget-id', widget).val(); $('#available-widgets .widget-id').each(function(){ if ( $(this).val() == id ) $(this).parents('.widget').show(); }); } } else { - $(t).parents('.widget-inside').slideUp('normal', function(){ $(this).parents('.widget').css({'width':'','marginLeft':''}); }); + $(t).parents('.widget-inside').slideUp('normal', function(){ + widget.css({'width':'','marginLeft':''}); + wpWidgets.appendTitle(widget); + }); } }); }, + appendTitle : function(widget) { + $('input[type="text"]', widget).each(function(){ + if ( this.id.indexOf('title') != -1 && $(this).val() ) { + $('.widget-title .in-widget-title', widget).html(': ' + $(this).val()); + return false; + } + }); + }, + + resize : function() { + $('.widgets-sortables').not('#wp_inactive_widgets').each(function(){ + var h = 50, H = $('.widget', this).length; + h = h + parseInt(H * 48, 10); + $(this).css( 'minHeight', h + 'px' ); + }); + }, + fixWebkit : function(n) { n = n ? 'none' : ''; $('body').css({ @@ -161,7 +188,7 @@ wpWidgets = { if ( w > 250 && inside.parents('.widgets-sortables').length ) { css['width'] = w + 30 + 'px'; if ( inside.parents('.widget-liquid-right').length ) - css['marginLeft'] = 234 - w + 'px'; + css['marginLeft'] = 235 - w + 'px'; inside.parents('.widget').css(css); } inside.slideDown('normal'); diff --git a/wp-admin/js/widgets.js b/wp-admin/js/widgets.js index 5d4a9c8be1..056f097232 100644 --- a/wp-admin/js/widgets.js +++ b/wp-admin/js/widgets.js @@ -1 +1 @@ -var wpWidgets;(function(a){wpWidgets={init:function(){var e,d=a("#available-widgets .widget-holder").height()-7,c=a("#widgets-right .widgets-holder-wrap .widgets-sortables:first"),b=c.height();a("#widgets-right div.sidebar-name").click(function(){var f=a(this).siblings(".widgets-sortables");if(f.is(":visible")){f.hide().sortable("disable");a(this).parent().addClass("closed")}else{f.show().sortable("enable").sortable("refresh");a(this).parent().removeClass("closed")}});a("#widgets-left div.sidebar-name").click(function(){if(a(this).siblings(".widget-holder").is(":visible")){a(this).parent().addClass("closed")}else{a(this).parent().removeClass("closed")}});if(d>b){c.css("minHeight",d+"px")}this.addEvents();a(".widget-error").parents(".widget").find("a.widget-action").click();a("#widget-list .widget").draggable({connectToSortable:".widgets-sortables",handle:".widget-title",distance:2,helper:"clone",zIndex:5,start:function(g,f){wpWidgets.fixWebkit(1);f.helper.find(".widget-description").hide()},stop:function(g,f){if(e){a(e).hide()}e="";wpWidgets.fixWebkit()}});a(".widgets-sortables").sortable({placeholder:"widget-placeholder",connectWith:".widgets-sortables",items:".widget",handle:".widget-title",cursor:"move",distance:2,opacity:0.65,start:function(g,f){wpWidgets.fixWebkit(1);f.item.find(".widget-inside").hide();f.item.css({marginLeft:"",width:""})},stop:function(h,f){var g=f.item.find("input.add_new").val(),k=f.item.find("input.multi_number").val(),j=f.item.attr("id"),i=a(this).attr("id");f.item.css({marginLeft:"",width:""});if(g){if("multi"==g){f.item.html(f.item.html().replace(/<[^<>]+>/g,function(l){return l.replace(/__i__|%i%/g,k)}));f.item.attr("id",j.replace(/__i__|%i%/g,k));k++;a("div#"+j).find("input.multi_number").val(k)}else{if("single"==g){f.item.attr("id","new-"+j);e="div#"+j}}wpWidgets.addEvents(f.item);wpWidgets.save(f.item.find("form").serialize(),i,0,0);f.item.find("input.add_new").val("");f.item.find("a.widget-action").click()}wpWidgets.saveOrder(i);wpWidgets.fixWebkit()},receive:function(g,f){if(!a(this).is(":visible")){a(this).sortable("cancel")}}}).not(":visible").sortable("disable")},saveOrder:function(c){a("#"+c).parents(".widgets-holder-wrap").find(".ajax-feedback").css("visibility","visible");var b={action:"widgets-order",savewidgets:a("#_wpnonce_widgets").val(),sidebars:[]};a(".widgets-sortables").each(function(){b["sidebars["+a(this).attr("id")+"]"]=a(this).sortable("toArray").join(",")});a.post(ajaxurl,b,function(){a(".ajax-feedback").css("visibility","hidden")})},save:function(e,f,c,d){a("#"+f).parents(".widgets-holder-wrap").find(".ajax-feedback").css("visibility","visible");var b={action:"save-widget",savewidgets:a("#_wpnonce_widgets").val(),sidebar:f};if(c){b.delete_widget=1}e+="&"+a.param(b);a.post(ajaxurl,e,function(g){var h;a(".ajax-feedback").css("visibility","hidden");if(!d){return}if(c){a(d).parents(".widget").slideUp("normal",function(){a(this).remove()});if(!b.widget_number){h=b["widget-id"];a("#available-widgets .widget-id").each(function(){if(a(this).val()==h){a(this).parents(".widget").show()}})}}else{a(d).parents(".widget-inside").slideUp("normal",function(){a(this).parents(".widget").css({width:"",marginLeft:""})})}})},fixWebkit:function(b){b=b?"none":"";a("body").css({WebkitUserSelect:b,KhtmlUserSelect:b})},addEvents:function(b){b=b||document;a("a.widget-action",b).click(function(){var d=parseInt(a(this).parents(".widget").find(".widget-width").val(),10),e={},c=a(this).parents(".widget-top").siblings(".widget-inside");if(c.is(":hidden")){if(d>250&&c.parents(".widgets-sortables").length){e.width=d+30+"px";if(c.parents(".widget-liquid-right").length){e.marginLeft=234-d+"px"}c.parents(".widget").css(e)}c.slideDown("normal")}else{c.slideUp("normal",function(){c.parents(".widget").css({width:"",marginLeft:""})})}return false});a(".widget-control-save",b).click(function(){wpWidgets.save(a(this).parents("form").serialize(),a(this).parents(".widgets-sortables").attr("id"),0,this);return false});a(".widget-control-remove",b).click(function(){wpWidgets.save(a(this).parents("form").serialize(),a(this).parents(".widgets-sortables").attr("id"),1,this);return false})}};a(document).ready(function(){wpWidgets.init()})})(jQuery); \ No newline at end of file +var wpWidgets;(function(a){wpWidgets={init:function(){var b;a("#widgets-right div.sidebar-name").click(function(){var d=a(this).siblings(".widgets-sortables");if(d.is(":visible")){a(this).parent().addClass("closed")}else{a(this).parent().removeClass("closed");d.sortable("refresh")}});a("#widgets-left div.sidebar-name").click(function(){if(a(this).siblings(".widget-holder").is(":visible")){a(this).parent().addClass("closed")}else{a(this).parent().removeClass("closed")}});a("#widgets-right .widget, #wp_inactive_widgets .widget").each(function(){wpWidgets.appendTitle(this)});this.addEvents();a(".widget-error").parents(".widget").find("a.widget-action").click();a("#widget-list .widget").draggable({connectToSortable:".widgets-sortables",handle:".widget-title",distance:2,helper:"clone",zIndex:5,containment:"document",start:function(d,c){wpWidgets.fixWebkit(1);c.helper.find(".widget-description").hide()},stop:function(d,c){if(b){a(b).hide()}b="";wpWidgets.fixWebkit()}});a(".widgets-sortables").sortable({placeholder:"widget-placeholder",connectWith:".widgets-sortables",items:".widget",handle:".widget-title",cursor:"move",distance:2,opacity:0.65,containment:"document",start:function(d,c){wpWidgets.fixWebkit(1);c.item.find(".widget-inside").hide();c.item.css({marginLeft:"",width:""})},stop:function(f,c){var d=c.item.find("input.add_new").val(),i=c.item.find("input.multi_number").val(),h=c.item.attr("id"),g=a(this).attr("id");c.item.css({marginLeft:"",width:""});if(d){if("multi"==d){c.item.html(c.item.html().replace(/<[^<>]+>/g,function(e){return e.replace(/__i__|%i%/g,i)}));c.item.attr("id",h.replace(/__i__|%i%/g,i));i++;a("div#"+h).find("input.multi_number").val(i)}else{if("single"==d){c.item.attr("id","new-"+h);b="div#"+h}}wpWidgets.addEvents(c.item);wpWidgets.save(c.item.find("form").serialize(),g,0,0);c.item.find("input.add_new").val("");c.item.find("a.widget-action").click()}wpWidgets.saveOrder(g);wpWidgets.resize();wpWidgets.fixWebkit()},receive:function(d,c){if(!a(this).is(":visible")){a(this).sortable("cancel")}}});wpWidgets.resize()},saveOrder:function(c){a("#"+c).parents(".widgets-holder-wrap").find(".ajax-feedback").css("visibility","visible");var b={action:"widgets-order",savewidgets:a("#_wpnonce_widgets").val(),sidebars:[]};a(".widgets-sortables").each(function(){b["sidebars["+a(this).attr("id")+"]"]=a(this).sortable("toArray").join(",")});a.post(ajaxurl,b,function(){a(".ajax-feedback").css("visibility","hidden")})},save:function(e,f,c,d){a("#"+f).parents(".widgets-holder-wrap").find(".ajax-feedback").css("visibility","visible");var b={action:"save-widget",savewidgets:a("#_wpnonce_widgets").val(),sidebar:f};if(c){b.delete_widget=1}e+="&"+a.param(b);a.post(ajaxurl,e,function(g){var i,h;a(".ajax-feedback").css("visibility","hidden");if(!d){return}h=a(d).parents(".widget");if(c){h.slideUp("normal",function(){a(this).remove();wpWidgets.resize()});if(!a(".widget_number",h).val()){i=a(".widget-id",h).val();a("#available-widgets .widget-id").each(function(){if(a(this).val()==i){a(this).parents(".widget").show()}})}}else{a(d).parents(".widget-inside").slideUp("normal",function(){h.css({width:"",marginLeft:""});wpWidgets.appendTitle(h)})}})},appendTitle:function(b){a('input[type="text"]',b).each(function(){if(this.id.indexOf("title")!=-1&&a(this).val()){a(".widget-title .in-widget-title",b).html(": "+a(this).val());return false}})},resize:function(){a(".widgets-sortables").not("#wp_inactive_widgets").each(function(){var c=50,b=a(".widget",this).length;c=c+parseInt(b*48,10);a(this).css("minHeight",c+"px")})},fixWebkit:function(b){b=b?"none":"";a("body").css({WebkitUserSelect:b,KhtmlUserSelect:b})},addEvents:function(b){b=b||document;a("a.widget-action",b).click(function(){var d=parseInt(a(this).parents(".widget").find(".widget-width").val(),10),e={},c=a(this).parents(".widget-top").siblings(".widget-inside");if(c.is(":hidden")){if(d>250&&c.parents(".widgets-sortables").length){e.width=d+30+"px";if(c.parents(".widget-liquid-right").length){e.marginLeft=235-d+"px"}c.parents(".widget").css(e)}c.slideDown("normal")}else{c.slideUp("normal",function(){c.parents(".widget").css({width:"",marginLeft:""})})}return false});a(".widget-control-save",b).click(function(){wpWidgets.save(a(this).parents("form").serialize(),a(this).parents(".widgets-sortables").attr("id"),0,this);return false});a(".widget-control-remove",b).click(function(){wpWidgets.save(a(this).parents("form").serialize(),a(this).parents(".widgets-sortables").attr("id"),1,this);return false})}};a(document).ready(function(){wpWidgets.init()})})(jQuery); \ No newline at end of file diff --git a/wp-includes/script-loader.php b/wp-includes/script-loader.php index 7684bcba98..0b0f51cb48 100644 --- a/wp-includes/script-loader.php +++ b/wp-includes/script-loader.php @@ -330,7 +330,7 @@ function wp_default_scripts( &$scripts ) { $scripts->add( 'media-upload', "/wp-admin/js/media-upload$suffix.js", array( 'thickbox' ), '20090114' ); $scripts->add_data( 'media-upload', 'group', 1 ); - $scripts->add( 'admin-widgets', "/wp-admin/js/widgets$suffix.js", array( 'jquery-ui-sortable', 'jquery-ui-draggable' ), '20090507' ); + $scripts->add( 'admin-widgets', "/wp-admin/js/widgets$suffix.js", array( 'jquery-ui-sortable', 'jquery-ui-draggable' ), '20090509' ); $scripts->add_data( 'admin-widgets', 'group', 1 ); $scripts->add( 'word-count', "/wp-admin/js/word-count$suffix.js", array( 'jquery' ), '20090422' ); @@ -421,10 +421,10 @@ function wp_default_styles( &$styles ) { $styles->add( 'wp-admin', '/wp-admin/wp-admin.css', array(), '20090506' ); $styles->add_data( 'wp-admin', 'rtl', '/wp-admin/rtl.css' ); - $styles->add( 'ie', '/wp-admin/css/ie.css', array(), '20090415' ); + $styles->add( 'ie', '/wp-admin/css/ie.css', array(), '20090509' ); $styles->add_data( 'ie', 'conditional', 'lte IE 7' ); - $styles->add( 'colors', true, array(), '20090506' ); // Register "meta" stylesheet for admin colors + $styles->add( 'colors', true, array(), '20090509' ); // Register "meta" stylesheet for admin colors $styles->add( 'colors-fresh', '/wp-admin/css/colors-fresh.css', array(), '20081210'); // for login.php. Is there a better way? $styles->add_data( 'colors-fresh', 'rtl', true ); $styles->add( 'colors-classic', '/wp-admin/css/colors-classic.css', array(), '20081210'); @@ -432,7 +432,7 @@ function wp_default_styles( &$styles ) { $styles->add( 'global', '/wp-admin/css/global.css', array(), '20090504' ); $styles->add( 'media', '/wp-admin/css/media.css', array(), '20090325' ); - $styles->add( 'widgets', '/wp-admin/css/widgets.css', array(), '20090503' ); + $styles->add( 'widgets', '/wp-admin/css/widgets.css', array(), '20090509' ); $styles->add( 'dashboard', '/wp-admin/css/dashboard.css', array(), '20090305' ); $styles->add( 'install', '/wp-admin/css/install.css', array(), '20081210' ); $styles->add( 'theme-editor', '/wp-admin/css/theme-editor.css', array(), '20081210' );