Login | Register For Free | Help
Search for: (Advanced)

Mailing List Archive: Wikipedia: Mediawiki-CVS

SVN: [59257] trunk/extensions/UsabilityInitiative/Vector

  

 
Wikipedia mediawiki-cvs RSS feed   Index | Next | Previous | View Threaded


adam at svn

Nov 19, 2009, 9:33 AM

Post #1 of 1 (60 views)
Permalink
SVN: [59257] trunk/extensions/UsabilityInitiative/Vector
http://www.mediawiki.org/wiki/Special:Code/MediaWiki/59257

Revision: 59257
Author: adam
Date: 2009-11-19 17:33:57 +0000 (Thu, 19 Nov 2009)

Log Message:
-----------
cleaning up the collapsibletabs code to make it more readable in preperation for some refactoring and animation improvements

Modified Paths:
--------------
trunk/extensions/UsabilityInitiative/Vector/Modules/CollapsibleTabs/CollapsibleTabs.js
trunk/extensions/UsabilityInitiative/Vector/Vector.combined.js
trunk/extensions/UsabilityInitiative/Vector/Vector.combined.min.js
trunk/extensions/UsabilityInitiative/Vector/Vector.hooks.php

Modified: trunk/extensions/UsabilityInitiative/Vector/Modules/CollapsibleTabs/CollapsibleTabs.js
===================================================================
--- trunk/extensions/UsabilityInitiative/Vector/Modules/CollapsibleTabs/CollapsibleTabs.js 2009-11-19 17:25:13 UTC (rev 59256)
+++ trunk/extensions/UsabilityInitiative/Vector/Modules/CollapsibleTabs/CollapsibleTabs.js 2009-11-19 17:33:57 UTC (rev 59257)
@@ -4,69 +4,75 @@

//Overloading the moveToCollapsed function to animate the transition
$j.collapsibleTabs.moveToCollapsed = function( ele ) {
- var $moving = $j(ele);
- $j($moving.data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting = true;
- var data = $moving.data('collapsibleTabsSettings');
+ var $moving = $j( ele );
+ $j( $moving.data( 'collapsibleTabsSettings' ).expandedContainer )
+ .data( 'collapsibleTabsSettings' ).shifting = true;
+ var data = $moving.data( 'collapsibleTabsSettings' );
// Remove the element from where it's at and put it in the dropdown menu
- var target = $moving.data('collapsibleTabsSettings').collapsedContainer;
- $moving.css("position", "relative").css( ( rtl ? 'left' : 'right'), 0 );
- $moving.animate({width: '1px'},"normal",function(){
- $j(this).hide();
- // add the placeholder
- $j('<span class="placeholder" style="display:none;"></span>').insertAfter(this);
- $j(this).remove().prependTo(target).data('collapsibleTabsSettings', data);
- $j(this).attr('style', 'display:list-item;');
- $j($j(ele).data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting = false;
- $j.collapsibleTabs.handleResize();
- });
+ var target = $moving.data( 'collapsibleTabsSettings' ).collapsedContainer;
+ $moving.css( "position", "relative" )
+ .css( ( rtl ? 'left' : 'right' ), 0 )
+ .animate( { width: '1px' }, "normal", function() {
+ $j( this ).hide();
+ // add the placeholder
+ $j( '<span class="placeholder" style="display:none;"></span>' ).insertAfter( this );
+ $j( this ).remove().prependTo( target ).data( 'collapsibleTabsSettings', data );
+ $j( this ).attr( 'style', 'display:list-item;' );
+ $j( $j( ele ).data( 'collapsibleTabsSettings' ).expandedContainer )
+ .data( 'collapsibleTabsSettings' ).shifting = false;
+ $j.collapsibleTabs.handleResize();
+ } );
};

// Overloading the moveToExpanded function to animate the transition
$j.collapsibleTabs.moveToExpanded = function( ele ) {
- var $moving = $j(ele);
- $j($moving.data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting = true;
- var data = $moving.data('collapsibleTabsSettings');
+ var $moving = $j( ele );
+ $j( $moving.data( 'collapsibleTabsSettings' ).expandedContainer )
+ .data( 'collapsibleTabsSettings' ).shifting = true;
+ var data = $moving.data( 'collapsibleTabsSettings' );
// grab the next appearing placeholder so we can use it for replacing
- var $target = $j($moving.data('collapsibleTabsSettings').expandedContainer).find('span.placeholder:first');
- var expandedWidth = $moving.data('collapsibleTabsSettings').expandedWidth;
- $moving.css("position", "relative").css( ( rtl ? 'right' : 'left'), 0 ).css('width','1px');
- $target.replaceWith($moving.remove().css('width','1px').data('collapsibleTabsSettings', data)
- .animate({width: expandedWidth+"px"}, "normal", function(){
- $j(this).attr('style', 'display:block;');
- $j($moving.data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting = false;
- $j.collapsibleTabs.handleResize();
- }));
+ var $target = $j( $moving.data( 'collapsibleTabsSettings' ).expandedContainer )
+ .find( 'span.placeholder:first' );
+ var expandedWidth = $moving.data( 'collapsibleTabsSettings' ).expandedWidth;
+ $moving.css( "position", "relative" ).css( ( rtl ? 'right' : 'left' ), 0 ).css( 'width', '1px' );
+ $target.replaceWith( $moving.remove().css( 'width', '1px' ).data( 'collapsibleTabsSettings', data )
+ .animate( { width: expandedWidth+"px" }, "normal", function() {
+ $j( this ).attr( 'style', 'display:block;' );
+ $j( $moving.data( 'collapsibleTabsSettings' ).expandedContainer )
+ .data( 'collapsibleTabsSettings' ).shifting = false;
+ $j.collapsibleTabs.handleResize();
+ } ) );
};

// Bind callback functions to animate our drop down menu in and out
// and then call the collapsibleTabs function on the menu
- $j('#p-views ul').bind("beforeTabCollapse", function(){
- if($j('#p-cactions').css('display')=='none')
- $j("#p-cactions").addClass("filledPortlet").removeClass("emptyPortlet")
- .find('h5').css('width','1px').animate({'width':'26px'}, 390);
- }).bind("beforeTabExpand", function(){
- if($j('#p-cactions li').length==1)
- $j("#p-cactions h5").animate({'width':'1px'},370, function(){
- $j(this).attr('style','').parent().addClass("emptyPortlet").removeClass("filledPortlet");
+ $j( '#p-views ul' ).bind( "beforeTabCollapse", function() {
+ if( $j( '#p-cactions' ).css( 'display' ) == 'none' )
+ $j( "#p-cactions" ).addClass( "filledPortlet" ).removeClass( "emptyPortlet" )
+ .find( 'h5' ).css( 'width','1px' ).animate( { 'width':'26px' }, 390 );
+ }).bind( "beforeTabExpand", function() {
+ if( $j( '#p-cactions li' ).length == 1 )
+ $j( "#p-cactions h5" ).animate( { 'width':'1px' }, 370, function() {
+ $j( this ).attr( 'style', '' ).parent().addClass( "emptyPortlet" ).removeClass( "filledPortlet" );
});
}).collapsibleTabs({
- expandCondition: function(eleWidth) {
+ expandCondition: function( eleWidth ) {
if( rtl ){
- return ( $j('#right-navigation').position().left + $j('#right-navigation').width() + 1)
- < ($j('#left-navigation').position().left - eleWidth);
+ return ( $j( '#right-navigation' ).position().left + $j( '#right-navigation' ).width() + 1 )
+ < ( $j( '#left-navigation' ).position().left - eleWidth);
} else {
- return ( $j('#left-navigation').position().left + $j('#left-navigation').width() + 1)
- < ($j('#right-navigation').position().left - eleWidth);
+ return ( $j( '#left-navigation' ).position().left + $j( '#left-navigation' ).width() + 1 )
+ < ( $j( '#right-navigation' ).position().left - eleWidth );
}
},
collapseCondition: function() {
if( rtl ){
- return ( $j('#right-navigation').position().left + $j('#right-navigation').width())
- > $j('#left-navigation').position().left;
+ return ( $j( '#right-navigation' ).position().left + $j( '#right-navigation' ).width() )
+ > $j( '#left-navigation' ).position().left;
} else {
- return ( $j('#left-navigation').position().left + $j('#left-navigation').width())
- > $j('#right-navigation').position().left;
+ return ( $j( '#left-navigation' ).position().left + $j( '#left-navigation' ).width() )
+ > $j( '#right-navigation' ).position().left;
}
}
- });
-});
\ No newline at end of file
+ } );
+} );
\ No newline at end of file

Modified: trunk/extensions/UsabilityInitiative/Vector/Vector.combined.js
===================================================================
--- trunk/extensions/UsabilityInitiative/Vector/Vector.combined.js 2009-11-19 17:25:13 UTC (rev 59256)
+++ trunk/extensions/UsabilityInitiative/Vector/Vector.combined.js 2009-11-19 17:33:57 UTC (rev 59257)
@@ -4,72 +4,78 @@

//Overloading the moveToCollapsed function to animate the transition
$j.collapsibleTabs.moveToCollapsed = function( ele ) {
- var $moving = $j(ele);
- $j($moving.data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting = true;
- var data = $moving.data('collapsibleTabsSettings');
+ var $moving = $j( ele );
+ $j( $moving.data( 'collapsibleTabsSettings' ).expandedContainer )
+ .data( 'collapsibleTabsSettings' ).shifting = true;
+ var data = $moving.data( 'collapsibleTabsSettings' );
// Remove the element from where it's at and put it in the dropdown menu
- var target = $moving.data('collapsibleTabsSettings').collapsedContainer;
- $moving.css("position", "relative").css( ( rtl ? 'left' : 'right'), 0 );
- $moving.animate({width: '1px'},"normal",function(){
- $j(this).hide();
- // add the placeholder
- $j('<span class="placeholder" style="display:none;"></span>').insertAfter(this);
- $j(this).remove().prependTo(target).data('collapsibleTabsSettings', data);
- $j(this).attr('style', 'display:list-item;');
- $j($j(ele).data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting = false;
- $j.collapsibleTabs.handleResize();
- });
+ var target = $moving.data( 'collapsibleTabsSettings' ).collapsedContainer;
+ $moving.css( "position", "relative" )
+ .css( ( rtl ? 'left' : 'right' ), 0 )
+ .animate( { width: '1px' }, "normal", function() {
+ $j( this ).hide();
+ // add the placeholder
+ $j( '<span class="placeholder" style="display:none;"></span>' ).insertAfter( this );
+ $j( this ).remove().prependTo( target ).data( 'collapsibleTabsSettings', data );
+ $j( this ).attr( 'style', 'display:list-item;' );
+ $j( $j( ele ).data( 'collapsibleTabsSettings' ).expandedContainer )
+ .data( 'collapsibleTabsSettings' ).shifting = false;
+ $j.collapsibleTabs.handleResize();
+ } );
};

// Overloading the moveToExpanded function to animate the transition
$j.collapsibleTabs.moveToExpanded = function( ele ) {
- var $moving = $j(ele);
- $j($moving.data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting = true;
- var data = $moving.data('collapsibleTabsSettings');
+ var $moving = $j( ele );
+ $j( $moving.data( 'collapsibleTabsSettings' ).expandedContainer )
+ .data( 'collapsibleTabsSettings' ).shifting = true;
+ var data = $moving.data( 'collapsibleTabsSettings' );
// grab the next appearing placeholder so we can use it for replacing
- var $target = $j($moving.data('collapsibleTabsSettings').expandedContainer).find('span.placeholder:first');
- var expandedWidth = $moving.data('collapsibleTabsSettings').expandedWidth;
- $moving.css("position", "relative").css( ( rtl ? 'right' : 'left'), 0 ).css('width','1px');
- $target.replaceWith($moving.remove().css('width','1px').data('collapsibleTabsSettings', data)
- .animate({width: expandedWidth+"px"}, "normal", function(){
- $j(this).attr('style', 'display:block;');
- $j($moving.data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting = false;
- $j.collapsibleTabs.handleResize();
- }));
+ var $target = $j( $moving.data( 'collapsibleTabsSettings' ).expandedContainer )
+ .find( 'span.placeholder:first' );
+ var expandedWidth = $moving.data( 'collapsibleTabsSettings' ).expandedWidth;
+ $moving.css( "position", "relative" ).css( ( rtl ? 'right' : 'left' ), 0 ).css( 'width', '1px' );
+ $target.replaceWith( $moving.remove().css( 'width', '1px' ).data( 'collapsibleTabsSettings', data )
+ .animate( { width: expandedWidth+"px" }, "normal", function() {
+ $j( this ).attr( 'style', 'display:block;' );
+ $j( $moving.data( 'collapsibleTabsSettings' ).expandedContainer )
+ .data( 'collapsibleTabsSettings' ).shifting = false;
+ $j.collapsibleTabs.handleResize();
+ } ) );
};

// Bind callback functions to animate our drop down menu in and out
// and then call the collapsibleTabs function on the menu
- $j('#p-views ul').bind("beforeTabCollapse", function(){
- if($j('#p-cactions').css('display')=='none')
- $j("#p-cactions").addClass("filledPortlet").removeClass("emptyPortlet")
- .find('h5').css('width','1px').animate({'width':'26px'}, 390);
- }).bind("beforeTabExpand", function(){
- if($j('#p-cactions li').length==1)
- $j("#p-cactions h5").animate({'width':'1px'},370, function(){
- $j(this).attr('style','').parent().addClass("emptyPortlet").removeClass("filledPortlet");
+ $j( '#p-views ul' ).bind( "beforeTabCollapse", function() {
+ if( $j( '#p-cactions' ).css( 'display' ) == 'none' )
+ $j( "#p-cactions" ).addClass( "filledPortlet" ).removeClass( "emptyPortlet" )
+ .find( 'h5' ).css( 'width','1px' ).animate( { 'width':'26px' }, 390 );
+ }).bind( "beforeTabExpand", function() {
+ if( $j( '#p-cactions li' ).length == 1 )
+ $j( "#p-cactions h5" ).animate( { 'width':'1px' }, 370, function() {
+ $j( this ).attr( 'style', '' ).parent().addClass( "emptyPortlet" ).removeClass( "filledPortlet" );
});
}).collapsibleTabs({
- expandCondition: function(eleWidth) {
+ expandCondition: function( eleWidth ) {
if( rtl ){
- return ( $j('#right-navigation').position().left + $j('#right-navigation').width() + 1)
- < ($j('#left-navigation').position().left - eleWidth);
+ return ( $j( '#right-navigation' ).position().left + $j( '#right-navigation' ).width() + 1 )
+ < ( $j( '#left-navigation' ).position().left - eleWidth);
} else {
- return ( $j('#left-navigation').position().left + $j('#left-navigation').width() + 1)
- < ($j('#right-navigation').position().left - eleWidth);
+ return ( $j( '#left-navigation' ).position().left + $j( '#left-navigation' ).width() + 1 )
+ < ( $j( '#right-navigation' ).position().left - eleWidth );
}
},
collapseCondition: function() {
if( rtl ){
- return ( $j('#right-navigation').position().left + $j('#right-navigation').width())
- > $j('#left-navigation').position().left;
+ return ( $j( '#right-navigation' ).position().left + $j( '#right-navigation' ).width() )
+ > $j( '#left-navigation' ).position().left;
} else {
- return ( $j('#left-navigation').position().left + $j('#left-navigation').width())
- > $j('#right-navigation').position().left;
+ return ( $j( '#left-navigation' ).position().left + $j( '#left-navigation' ).width() )
+ > $j( '#right-navigation' ).position().left;
}
}
- });
-});/* JavaScript for EditWarning extension */
+ } );
+} );/* JavaScript for EditWarning extension */

js2AddOnloadHook( function() {
// Check preferences for editwarning

Modified: trunk/extensions/UsabilityInitiative/Vector/Vector.combined.min.js
===================================================================
--- trunk/extensions/UsabilityInitiative/Vector/Vector.combined.min.js 2009-11-19 17:25:13 UTC (rev 59256)
+++ trunk/extensions/UsabilityInitiative/Vector/Vector.combined.min.js 2009-11-19 17:33:57 UTC (rev 59257)
@@ -1,5 +1,5 @@

-js2AddOnloadHook(function(){var rtl=$j('body.rtl').size()?true:false;$j.collapsibleTabs.moveToCollapsed=function(ele){var $moving=$j(ele);$j($moving.data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting=true;var data=$moving.data('collapsibleTabsSettings');var target=$moving.data('collapsibleTabsSettings').collapsedContainer;$moving.css("position","relative").css((rtl?'left':'right'),0);$moving.animate({width:'1px'},"normal",function(){$j(this).hide();$j('<span class="placeholder" style="display:none;"></span>').insertAfter(this);$j(this).remove().prependTo(target).data('collapsibleTabsSettings',data);$j(this).attr('style','display:list-item;');$j($j(ele).data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting=false;$j.collapsibleTabs.handleResize();});};$j.collapsibleTabs.moveToExpanded=function(ele){var $moving=$j(ele);$j($moving.data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting=true;var data=$moving.data('collapsibleTabsSettings');var $target=$j($moving.data('collapsibleTabsSettings').expandedContainer).find('span.placeholder:first');var expandedWidth=$moving.data('collapsibleTabsSettings').expandedWidth;$moving.css("position","relative").css((rtl?'right':'left'),0).css('width','1px');$target.replaceWith($moving.remove().css('width','1px').data('collapsibleTabsSettings',data).animate({width:expandedWidth+"px"},"normal",function(){$j(this).attr('style','display:block;');$j($moving.data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting=false;$j.collapsibleTabs.handleResize();}));};$j('#p-views ul').bind("beforeTabCollapse",function(){if($j('#p-cactions').css('display')=='none')
+js2AddOnloadHook(function(){var rtl=$j('body.rtl').size()?true:false;$j.collapsibleTabs.moveToCollapsed=function(ele){var $moving=$j(ele);$j($moving.data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting=true;var data=$moving.data('collapsibleTabsSettings');var target=$moving.data('collapsibleTabsSettings').collapsedContainer;$moving.css("position","relative").css((rtl?'left':'right'),0).animate({width:'1px'},"normal",function(){$j(this).hide();$j('<span class="placeholder" style="display:none;"></span>').insertAfter(this);$j(this).remove().prependTo(target).data('collapsibleTabsSettings',data);$j(this).attr('style','display:list-item;');$j($j(ele).data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting=false;$j.collapsibleTabs.handleResize();});};$j.collapsibleTabs.moveToExpanded=function(ele){var $moving=$j(ele);$j($moving.data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting=true;var data=$moving.data('collapsibleTabsSettings');var $target=$j($moving.data('collapsibleTabsSettings').expandedContainer).find('span.placeholder:first');var expandedWidth=$moving.data('collapsibleTabsSettings').expandedWidth;$moving.css("position","relative").css((rtl?'right':'left'),0).css('width','1px');$target.replaceWith($moving.remove().css('width','1px').data('collapsibleTabsSettings',data).animate({width:expandedWidth+"px"},"normal",function(){$j(this).attr('style','display:block;');$j($moving.data('collapsibleTabsSettings').expandedContainer).data('collapsibleTabsSettings').shifting=false;$j.collapsibleTabs.handleResize();}));};$j('#p-views ul').bind("beforeTabCollapse",function(){if($j('#p-cactions').css('display')=='none')
$j("#p-cactions").addClass("filledPortlet").removeClass("emptyPortlet").find('h5').css('width','1px').animate({'width':'26px'},390);}).bind("beforeTabExpand",function(){if($j('#p-cactions li').length==1)
$j("#p-cactions h5").animate({'width':'1px'},370,function(){$j(this).attr('style','').parent().addClass("emptyPortlet").removeClass("filledPortlet");});}).collapsibleTabs({expandCondition:function(eleWidth){if(rtl){return($j('#right-navigation').position().left+$j('#right-navigation').width()+1)<($j('#left-navigation').position().left-eleWidth);}else{return($j('#left-navigation').position().left+$j('#left-navigation').width()+1)<($j('#right-navigation').position().left-eleWidth);}},collapseCondition:function(){if(rtl){return($j('#right-navigation').position().left+$j('#right-navigation').width())>$j('#left-navigation').position().left;}else{return($j('#left-navigation').position().left+$j('#left-navigation').width())>$j('#right-navigation').position().left;}}});});js2AddOnloadHook(function(){if(!wgVectorPreferences||!(wgVectorPreferences.editwarning&&wgVectorPreferences.editwarning.enable)){return true;}
$j('#wpTextbox1, #wpSummary').each(function(){$j(this).data('origtext',$j(this).val());});fallbackWindowOnBeforeUnload=window.onbeforeunload;window.onbeforeunload=function(){var fallbackResult=null;if(fallbackWindowOnBeforeUnload){fallbackResult=fallbackWindowOnBeforeUnload();}

Modified: trunk/extensions/UsabilityInitiative/Vector/Vector.hooks.php
===================================================================
--- trunk/extensions/UsabilityInitiative/Vector/Vector.hooks.php 2009-11-19 17:25:13 UTC (rev 59256)
+++ trunk/extensions/UsabilityInitiative/Vector/Vector.hooks.php 2009-11-19 17:33:57 UTC (rev 59257)
@@ -12,15 +12,15 @@

static $scripts = array(
'raw' => array(
- array( 'src' => 'Modules/CollapsibleTabs/CollapsibleTabs.js', 'version' => 2 ),
+ array( 'src' => 'Modules/CollapsibleTabs/CollapsibleTabs.js', 'version' => 3 ),
array( 'src' => 'Modules/EditWarning/EditWarning.js', 'version' => 1 ),
array( 'src' => 'Modules/SimpleSearch/SimpleSearch.js', 'version' => 1 ),
),
'combined' => array(
- array( 'src' => 'Vector.combined.js', 'version' => 2 ),
+ array( 'src' => 'Vector.combined.js', 'version' => 3 ),
),
'minified' => array(
- array( 'src' => 'Vector.combined.min.js', 'version' => 2 ),
+ array( 'src' => 'Vector.combined.min.js', 'version' => 3 ),
),
);
static $modules = array(



_______________________________________________
MediaWiki-CVS mailing list
MediaWiki-CVS [at] lists
https://lists.wikimedia.org/mailman/listinfo/mediawiki-cvs

Wikipedia mediawiki-cvs RSS feed   Index | Next | Previous | View Threaded
 
 


Interested in having your list archived? Contact Gossamer Threads
 
  Web Applications & Managed Hosting Powered by Gossamer Threads Inc.