[wp-hackers] hi all... a hack, a bug a suggestion and thus a big mail

Shashi connect2shashi at gmail.com
Mon Dec 8 06:26:19 GMT 2008


A hack... (cool one)...

I found it very irritating to find the small button in the left
sidebar items (the one which expand em) so decided to make it
sleeker... This hack makes the users to have an option to enable
hover-triggered submenu expansion... uses the hoverIntent thing to
make it (absolutely) comfortable, tested and fixed wierd bugs with
fast clickers (as if it's an advertizement)... The option is made
available in the "screen options" section (which, as if forcing to
force the users to browse_happy(), does not work in IE6) in a sub
section called "Menu Comfort" It also enables the user to decide if
they want the menu expansion state remembered when the menu reloads
this will help people with smaller screen/poor resolution as they
won't have to scroll to select a menu item... options are saved using
setUserOption cookie operation... The only files changed are:
	wp-admin/includes/template.php
	wp-admin/js/common.js
Don't have any idea how
to commit to the svn... will i need any authorization etc? does trac
have a commit feature? i only know and like git so here's what i
did... This is a gitk diff output of my commit to 2.7RC1 and i've also
attatched the changed files here... so someone who can... please run
it (test and feedback) and commit it thanks! or you can help me
here... can i commit directly ('ny utility or somethin) to svn from a
git repo?

Working on...

In the click-to-expand mode the pics will lead to the $parent_file and
the text will expand it instead... this helps people struggle less to
reach their destination.. Most of the time, since no. of $parent_files
is less than $submenus...(natural rule of probability) your intent
wont be to go to the first submenu item. anyone who made this menu
thing can help... actually it took like 3 hrs to figure the working of
the menu out since i don't have access to internet, thus codex at my
home...

A bug (not in my hack... leave me out ;))...

-webkit-box-shadow sux in google chrome there'll be black corners
because it is rounded... I know that is chrome's bug! but its our
resp. to fix it.

Just a thought..

Looking at all the things that don't work in IE shouldn't we make the
browsehappy thing show up by default? currently its commented!! or
should we just rebilliously neglect ie users?

BTW...

Hello all...
I'm Shashi, new member in the list, 17 yr old from Bangalore, India
and have been hacking wp core for my new vision-come-true website
uncorkers.org for a few months and wordpress (...must say,
Matt sir, I'm a fan of all your dictatorship!..) like on top of best
pieces of codes i've come across in my life...Poetry;)..  So tell me
more about you hacker buddies...
diff:		----------------------------------------

------------------------ wp-admin/includes/template.php ------------------------
index 0bc5f1f..74e6f37 100644
@@ -3262,4 +3262,11 @@ function _post_states($post) {
 }

+/**
+ * Outputs the slide down menu in the Administration
+ * that contains contextual display options
+ *
+ * @since 2.7.0
+ *
+ */
 function screen_meta($screen) {
 	global $wp_meta_boxes, $_wp_contextual_help;
@@ -3280,8 +3287,19 @@ function screen_meta($screen) {
 ?>
 <div id="screen-meta">
+
+<div id="screen-options-wrap" class="hidden">
+<h5><?php _e('Menu Comfort'); ?></h5>
+<form id="adv-settings" action="" method="get">
+	<div class="metabox-prefs">
+	<label for="mstate">
+		<input name="mstate" type="checkbox" class="msetting" id="mstate"
/>Forget state on reload</label>
+	<label for="mhov">
+		<input name="mhov" type="checkbox" class="msetting" id="mhov"
/><?php _e("Don't expand on hover") ?></label>
+	<br class="clear" />
+</div>
+</form>
 <?php
 	if ( $show_screen ) :
 ?>
-<div id="screen-options-wrap" class="hidden">
 	<h5><?php _e('Show on screen') ?></h5>
 	<form id="adv-settings" action="" method="get">
@@ -3295,8 +3313,10 @@ function screen_meta($screen) {
 	<br class="clear" />
 	</div></form>
+<?php
+	endif;
+?>
 </div>

 <?php
-	endif;

 	global $title;
@@ -3338,9 +3358,7 @@ function screen_meta($screen) {
 <a href="#contextual-help" id="contextual-help-link"
class="show-settings"><?php _e('Help') ?></a>
 </div>
-<?php if ( $show_screen ) { ?>
 <div id="screen-options-link-wrap" class="hide-if-no-js screen-meta-toggle">
 <a href="#screen-options" id="show-settings-link"
class="show-settings"><?php _e('Screen Options') ?></a>
 </div>
-<?php } ?>
 </div>
 </div>

---------------------------- wp-admin/js/common.js ----------------------------
index 6eff515..33df7e5 100644
@@ -184,4 +184,11 @@ jQuery(document).ready( function($) {
 	});

+	// menu options
+	$('.msetting').each( function() {
+		$(this).click(function(){setUserSetting($(this).attr('id'),($(this).attr("checked")==true)?'n':'y');})
+			.attr("checked",(getUserSetting($(this).attr('id'))=='n')?true:false);
+	});
+
+	$('#adminmenu li.wp-has-submenu').hoverIntent(adminMenu.hoverSettings);
 	// check all checkboxes
 	var lastClicked = false;
@@ -264,8 +271,17 @@ adminMenu = {
 	restoreMenuState : function() {
 		$('#adminmenu li.wp-has-submenu').each(function(i, e) {
+			if( 'n' == getUserSetting( 'mstate' ) ){
+				if($(e).hasClass('wp-has-current-submenu'))
+					$(e).addClass('pinned');
+				else
+					$(e).removeClass('wp-menu-open');
+				return true;
+			}
 			var v = getUserSetting( 'm'+i );
-			if ( $(e).hasClass('wp-has-current-submenu') ) return true; //
leave the current parent open
+			if ( $(e).hasClass('wp-has-current-submenu') ) {
+					$(e).addClass('pinned'); return true;
+					} // leave the current parent open

-			if ( 'o' == v ) $(e).addClass('wp-menu-open');
+			if ( 'o' == v ) $(e).addClass('wp-menu-open').addClass('pinned');
 			else if ( 'c' == v ) $(e).removeClass('wp-menu-open');	
 		});
@@ -273,9 +289,13 @@ adminMenu = {

 	toggle : function(el) {
-
-		el['slideToggle'](150,
function(){el.css('display','');}).parent().toggleClass(
'wp-menu-open' );
-
+		if(getUserSetting('mhov')=='n') {
+			var effect=(el.parent().hasClass('pinned'))?'slideUp':'slideDown';
+			el[effect](150, function(){el.css({'display':''});}).parent()
+			.toggleClass('wp-menu-open').toggleClass('pinned');
+		}
+		else
+			el.parent().toggleClass('pinned');
 		$('#adminmenu li.wp-has-submenu').each(function(i, e) {
-			var v = $(e).hasClass('wp-menu-open') ? 'o' : 'c';
+			var v = $(e).hasClass('pinned') ? 'o' : 'c';
 			setUserSetting( 'm'+i, v );
 		});
@@ -283,9 +303,31 @@ adminMenu = {
 		return false;
 	},
-	
+
+	hover : function(el,act) {
+		if(getUserSetting('mhov')=='n') return true;
+		var eff='',tog='';
+		if(el.parent().hasClass('pinned'))
+			if(el.parent().hasClass('wp-menu-open')) return true;
+			else {eff='slideDown';tog='addClass';}
+		if(act=='hide'){eff='slideUp';tog='removeClass';}	//wierd fix
+		el[(eff)?eff:'slideToggle'](300, function(){el.css({'display':''});})
+		.parent()[(tog)?tog:'toggleClass']('wp-menu-open');
+	},
+	hoverSettings :{
+		over: function(e){
+			adminMenu.hover( $(this).find('.wp-submenu') ,"show" );
+		},
+		out: function(e){
+			adminMenu.hover( $(this).find('.wp-submenu'), "hide" );
+		},
+		timeout: 100,
+		sensitivity: 8,
+		interval: 200
+	},
 	fold : function(off) {
 		if (off) {
 			$('#wpcontent').removeClass('folded');
 			$('#adminmenu li.wp-has-submenu').unbind();
+			$('#adminmenu li.wp-has-submenu').hoverIntent(adminMenu.hoverSettings);
 		} else {
 			$('#wpcontent').addClass('folded');
@@ -300,7 +342,7 @@ adminMenu = {
 						m.css({'marginTop':''})
 					}
-					m.addClass('sub-open');
+					m.show("fast");
 				},
-				out: function(){ $(this).find('.wp-submenu').removeClass('sub-open'); },
+				out: function(){
$(this).find('.wp-submenu').hide("fast").css('display',''); },
 				timeout: 220,
 				sensitivity: 8,



-- 
    ,               ,
   /                 \
  ((__-^^-,-^^-__))
   `_----' `-----_-'
   `--|  o`   'o |--'
       \  `      /
        ):    : (
        :o__o:
         "---- "

   www.gnu.org
www.uncorkers.org
-------------- next part --------------

wpCookies = {
// The following functions are from Cookie.js class in TinyMCE, Moxiecode, used under LGPL.

	each : function(o, cb, s) {
		var n, l;

		if (!o)
			return 0;

		s = s || o;

		if (typeof(o.length) != 'undefined') {
			for (n=0, l = o.length; n<l; n++) {
				if (cb.call(s, o[n], n, o) === false)
					return 0;
			}
		} else {
			for (n in o) {
				if (o.hasOwnProperty(n)) {
					if (cb.call(s, o[n], n, o) === false)
						return 0;
				}
			}
		}
		return 1;
	},

	getHash : function(n) {
		var v = this.get(n), h;

		if (v) {
			this.each(v.split('&'), function(v) {
				v = v.split('=');
				h = h || {};
				h[v[0]] = v[1];
			});
		}
		return h;
	},

	setHash : function(n, v, e, p, d, s) {
		var o = '';

		this.each(v, function(v, k) {
			o += (!o ? '' : '&') + k + '=' + v;
		});

		this.set(n, o, e, p, d, s);
	},

	get : function(n) {
		var c = document.cookie, e, p = n + "=", b;

		if (!c)
			return;

		b = c.indexOf("; " + p);

		if (b == -1) {
			b = c.indexOf(p);

			if (b != 0)
				return null;
		} else
			b += 2;

		e = c.indexOf(";", b);

		if (e == -1)
			e = c.length;

		return decodeURIComponent(c.substring(b + p.length, e));
	},

	set : function(n, v, e, p, d, s) {
		document.cookie = n + "=" + encodeURIComponent(v) +
			((e) ? "; expires=" + e.toGMTString() : "") +
			((p) ? "; path=" + p : "") +
			((d) ? "; domain=" + d : "") +
			((s) ? "; secure" : "");
	},

	remove : function(n, p) {
		var d = new Date();

		d.setTime(d.getTime() - 1000);

		this.set(n, '', d, p, d);
	}
};

// Returns the value as string. Second arg or empty string is returned when value is not set.
function getUserSetting( name, def ) {
	var o = getAllUserSettings();

	if ( o.hasOwnProperty(name) )
		return o[name];

	if ( typeof def != 'undefined' )
		return def;

	return '';
}

// Both name and value must be only ASCII letters, numbers or underscore
// and the shorter, the better (cookies can store maximum 4KB). Not suitable to store text.
function setUserSetting( name, value, del ) {
	var c = 'wp-settings-'+userSettings.uid, o = wpCookies.getHash(c) || {}, d = new Date();
	var n = name.toString().replace(/[^A-Za-z0-9_]/, ''), v = value.toString().replace(/[^A-Za-z0-9_]/, '');

	if ( del ) delete o[n];
	else o[n] = v;

	d.setTime( d.getTime() + 31536000000 );
	p = userSettings.url;

	wpCookies.setHash(c, o, d, p );
	wpCookies.set('wp-settings-time-'+userSettings.uid, userSettings.time, d, p );
}

function deleteUserSetting( name ) {
	setUserSetting( name, '', 1 );
}

// Returns all settings as js object.
function getAllUserSettings() {
	return wpCookies.getHash('wp-settings-'+userSettings.uid) || {};
}


jQuery(document).ready( function($) {
	// pulse
	$('.fade').animate( { backgroundColor: '#ffffe0' }, 300).animate( { backgroundColor: '#fffbcc' }, 300).animate( { backgroundColor: '#ffffe0' }, 300).animate( { backgroundColor: '#fffbcc' }, 300);

	// show things that should be visible, hide what should be hidden
	$('.hide-if-no-js').removeClass('hide-if-no-js');
	$('.hide-if-js').hide();

	// Basic form validation
	if ( ( 'undefined' != typeof wpAjax ) && $.isFunction( wpAjax.validateForm ) ) {
		$('form.validate').submit( function() { return wpAjax.validateForm( $(this) ); } );
	}

	// Move .updated and .error alert boxes 
	$('div.wrap h2 ~ div.updated, div.wrap h2 ~ div.error').addClass('below-h2');
	$('div.updated, div.error').not('.below-h2').insertAfter('div.wrap h2:first');

	// screen settings tab
	$('#show-settings-link').click(function () {
		if ( ! $('#screen-options-wrap').hasClass('screen-options-open') ) {
			$('#contextual-help-link-wrap').addClass('invisible');
		}
		$('#screen-options-wrap').slideToggle('fast', function(){
			if ( $(this).hasClass('screen-options-open') ) {
				$('#show-settings-link').css({'backgroundImage':'url("images/screen-options-right.gif")'});
				$('#contextual-help-link-wrap').removeClass('invisible');
				$(this).removeClass('screen-options-open');
				
			} else {
				$('#show-settings-link').css({'backgroundImage':'url("images/screen-options-right-up.gif")'});
				$(this).addClass('screen-options-open');
			}
		});
		return false;
	});
	
	// help tab
	$('#contextual-help-link').click(function () {
		if ( ! $('#contextual-help-wrap').hasClass('contextual-help-open') ) {
			$('#screen-options-link-wrap').addClass('invisible');
		}
		$('#contextual-help-wrap').slideToggle('fast', function(){
			if ( $(this).hasClass('contextual-help-open') ) {
				$('#contextual-help-link').css({'backgroundImage':'url("images/screen-options-right.gif")'});
				$('#screen-options-link-wrap').removeClass('invisible');
				$(this).removeClass('contextual-help-open');
			} else {
				$('#contextual-help-link').css({'backgroundImage':'url("images/screen-options-right-up.gif")'});
				$(this).addClass('contextual-help-open');
			}
		});
		return false;
	});

	// menu options
	$('.msetting').each( function() {
		$(this).click(function(){setUserSetting($(this).attr('id'),($(this).attr("checked")==true)?'n':'y');})
			.attr("checked",(getUserSetting($(this).attr('id'))=='n')?true:false);
	});

	$('#adminmenu li.wp-has-submenu').hoverIntent(adminMenu.hoverSettings);
	// check all checkboxes
	var lastClicked = false;
	$( 'table:visible tbody .check-column :checkbox' ).click( function(e) {
		if ( 'undefined' == e.shiftKey ) { return true; }
		if ( e.shiftKey ) {
			if ( !lastClicked ) { return true; }
			var checks = $( lastClicked ).parents( 'form:first' ).find( ':checkbox' );
			var first = checks.index( lastClicked );
			var last = checks.index( this );
			if ( 0 < first && 0 < last && first != last ) {
				checks.slice( first, last ).attr( 'checked', $( this ).is( ':checked' ) ? 'checked' : '' );
			}
		}
		lastClicked = this;
		return true;
	} );

	$( 'thead :checkbox, tfoot :checkbox' ).click( function(e) {
		var c = $(this).attr('checked');

		$(this).parents( 'form:first' ).find( 'table tbody:visible, table thead:visible, table tfoot:visible').find( '.check-column :checkbox' ).attr( 'checked', function() {
			if ( e.shiftKey )
				return $(this).attr( 'checked' ) ? '' : 'checked';
			else if (c)
				return 'checked';

			return '';
		});
	});
});

var showNotice, adminMenu, columns;

// stub for doing better warnings
showNotice = {
	warn : function(text) {
		if ( confirm(text) )
			return true;

		return false;
	},
	
	note : function(text) {
		alert(text);
	}
};

(function($){
// sidebar admin menu
adminMenu = {
		
	init : function() {
		$('#adminmenu div.wp-menu-toggle').each( function() {
			if ( $(this).siblings('.wp-submenu').length ) 
				$(this).click(function(){ adminMenu.toggle( $(this).siblings('.wp-submenu') ); });
			else
				$(this).hide();
		});
		$('#adminmenu li.menu-top .wp-menu-image').click( function() { window.location = $(this).siblings('a.menu-top')[0].href; } );
		this.favorites();

		$('.wp-menu-separator').click(function(){
			if ( $('#wpcontent').hasClass('folded') ) {
				adminMenu.fold(1);
				setUserSetting( 'mfold', 'o' );
			} else {
				adminMenu.fold();
				setUserSetting( 'mfold', 'f' );
			}
		});

		if ( 'f' != getUserSetting( 'mfold' ) ) {
			this.restoreMenuState();
		} else {
			this.fold();
		}
	},

	restoreMenuState : function() {
		$('#adminmenu li.wp-has-submenu').each(function(i, e) {
			if( 'n' == getUserSetting( 'mstate' ) ){
				if($(e).hasClass('wp-has-current-submenu'))
					$(e).addClass('pinned');
				else
					$(e).removeClass('wp-menu-open');
				return true;
			}
			var v = getUserSetting( 'm'+i );
			if ( $(e).hasClass('wp-has-current-submenu') ) {
					$(e).addClass('pinned'); return true;
					} // leave the current parent open

			if ( 'o' == v ) $(e).addClass('wp-menu-open').addClass('pinned');
			else if ( 'c' == v ) $(e).removeClass('wp-menu-open');	
		});
	},

	toggle : function(el) {
		if(getUserSetting('mhov')=='n') {
			var effect=(el.parent().hasClass('pinned'))?'slideUp':'slideDown';
			el[effect](150, function(){el.css({'display':''});}).parent()
			.toggleClass('wp-menu-open').toggleClass('pinned');
		}
		else
			el.parent().toggleClass('pinned');
		$('#adminmenu li.wp-has-submenu').each(function(i, e) {
			var v = $(e).hasClass('pinned') ? 'o' : 'c';
			setUserSetting( 'm'+i, v );
		});

		return false;
	},

	hover : function(el,act) {
		if(getUserSetting('mhov')=='n') return true;
		var eff='',tog='';
		if(el.parent().hasClass('pinned'))
			if(el.parent().hasClass('wp-menu-open')) return true;
			else {eff='slideDown';tog='addClass';}
		if(act=='hide'){eff='slideUp';tog='removeClass';}	//wierd fix
		el[(eff)?eff:'slideToggle'](300, function(){el.css({'display':''});})
		.parent()[(tog)?tog:'toggleClass']('wp-menu-open');
	},
	hoverSettings :{
		over: function(e){
			adminMenu.hover( $(this).find('.wp-submenu') ,"show" );
		},
		out: function(e){
			adminMenu.hover( $(this).find('.wp-submenu'), "hide" );
		},
		timeout: 100,
		sensitivity: 8,
		interval: 200
	},
	fold : function(off) {
		if (off) {
			$('#wpcontent').removeClass('folded');
			$('#adminmenu li.wp-has-submenu').unbind();
			$('#adminmenu li.wp-has-submenu').hoverIntent(adminMenu.hoverSettings);
		} else {
			$('#wpcontent').addClass('folded');
			$('#adminmenu li.wp-has-submenu').hoverIntent({
				over: function(e){
					var m = $(this).find('.wp-submenu'), t = e.clientY, H = $(window).height(), h = m.height(), o;

					if ( (t+h+10) > H ) {
						o = (t+h+10) - H;
						m.css({'marginTop':'-'+o+'px'});
					} else if ( m.css('marginTop') ) {
						m.css({'marginTop':''})
					}
					m.show("fast");
				},
				out: function(){ $(this).find('.wp-submenu').hide("fast").css('display',''); },
				timeout: 220,
				sensitivity: 8,
				interval: 100
			});
			
		}
	},
	
	favorites : function() {
		$('#favorite-inside').width($('#favorite-actions').width()-4);
		$('#favorite-toggle, #favorite-inside').bind( 'mouseenter', function(){$('#favorite-inside').removeClass('slideUp').addClass('slideDown'); setTimeout(function(){if ( $('#favorite-inside').hasClass('slideDown') ) { $('#favorite-inside').slideDown(100); $('#favorite-first').addClass('slide-down'); }}, 200) } );
	
		$('#favorite-toggle, #favorite-inside').bind( 'mouseleave', function(){$('#favorite-inside').removeClass('slideDown').addClass('slideUp'); setTimeout(function(){if ( $('#favorite-inside').hasClass('slideUp') ) { $('#favorite-inside').slideUp(100, function(){ $('#favorite-first').removeClass('slide-down'); } ); }}, 300) } );
	}
};

$(document).ready(function(){adminMenu.init();});
})(jQuery);

(function($){
// show/hide/save table columns
columns = {
	init : function(page) {
		$('.hide-column-tog').click( function() {
			var column = $(this).val();
			var show = $(this).attr('checked');
			if ( show ) {
				$('.column-' + column).show();
			} else {
				$('.column-' + column).hide();
			}
			columns.save_manage_columns_state(page);
		} );
	},

	save_manage_columns_state : function(page) {
		var hidden = $('.manage-column').filter(':hidden').map(function() { return this.id; }).get().join(',');
		$.post('admin-ajax.php', {
			action: 'hidden-columns',
			hidden: hidden,
			hiddencolumnsnonce: $('#hiddencolumnsnonce').val(),
			page: page
		});
	}
}

})(jQuery);


More information about the wp-hackers mailing list