r63409 MediaWiki - Code Review archive

Repository:	MediaWiki
Revision:	< r63408‎ \| r63409 \| r63410 >
Date:	19:37, 8 March 2010
Author:	tparscal
Status:	ok
Tags:
Comment:	Made changes to how template capsules are rendered and interacted with. Switched to using the click handler for actual clicking while retaining a mousedown handler with return false to prevent dragging and such. Made lots of improvments to the quality of the image assets as well.
Modified paths:	/trunk/extensions/UsabilityInitiative/UsabilityInitiative.hooks.php (modified) (history) /trunk/extensions/UsabilityInitiative/images/wikiEditor/templateEditor/collapse.png (modified) (history) /trunk/extensions/UsabilityInitiative/images/wikiEditor/templateEditor/dialog-collapsed.png (modified) (history) /trunk/extensions/UsabilityInitiative/images/wikiEditor/templateEditor/dialog-expanded.png (modified) (history) /trunk/extensions/UsabilityInitiative/images/wikiEditor/templateEditor/expand.png (modified) (history) /trunk/extensions/UsabilityInitiative/images/wikiEditor/templateEditor/name-bg.png (modified) (history) /trunk/extensions/UsabilityInitiative/js/plugins.combined.js (modified) (history) /trunk/extensions/UsabilityInitiative/js/plugins.combined.min.js (modified) (history) /trunk/extensions/UsabilityInitiative/js/plugins/jquery.wikiEditor.html (modified) (history) /trunk/extensions/UsabilityInitiative/js/plugins/jquery.wikiEditor.templateEditor.js (modified) (history)

Diff [purge]

Index: trunk/extensions/UsabilityInitiative/UsabilityInitiative.hooks.php
—	—	@@ -78,14 +78,14 @@
79	79	array( 'src' => 'js/plugins/jquery.wikiEditor.dialogs.js', 'version' => 19 ),
80	80	array( 'src' => 'js/plugins/jquery.wikiEditor.toc.js', 'version' => 97 ),
81	81	array( 'src' => 'js/plugins/jquery.wikiEditor.preview.js', 'version' => 11 ),
82		~~- array( 'src' => 'js/plugins/jquery.wikiEditor.templateEditor.js', 'version' => 36 ),~~
	82	+ array( 'src' => 'js/plugins/jquery.wikiEditor.templateEditor.js', 'version' => 37 ),
83	83	array( 'src' => 'js/plugins/jquery.wikiEditor.publish.js', 'version' => 3 ),
84	84	),
85	85	'combined' => array(
86		~~- array( 'src' => 'js/plugins.combined.js', 'version' => 305 ),~~
	86	+ array( 'src' => 'js/plugins.combined.js', 'version' => 306 ),
87	87	),
88	88	'minified' => array(
89		~~- array( 'src' => 'js/plugins.combined.min.js', 'version' => 305 ),~~
	89	+ array( 'src' => 'js/plugins.combined.min.js', 'version' => 306 ),
90	90	),
91	91	),
92	92	);
Index: trunk/extensions/UsabilityInitiative/images/wikiEditor/templateEditor/expand.png
Cannot display: file marked as a binary type.
svn:mime-type = image/png
Index: trunk/extensions/UsabilityInitiative/images/wikiEditor/templateEditor/collapse.png
Cannot display: file marked as a binary type.
svn:mime-type = application/octet-stream
Index: trunk/extensions/UsabilityInitiative/images/wikiEditor/templateEditor/dialog-collapsed.png
Cannot display: file marked as a binary type.
svn:mime-type = application/octet-stream
Index: trunk/extensions/UsabilityInitiative/images/wikiEditor/templateEditor/dialog-expanded.png
Cannot display: file marked as a binary type.
svn:mime-type = application/octet-stream
Index: trunk/extensions/UsabilityInitiative/images/wikiEditor/templateEditor/name-bg.png
Cannot display: file marked as a binary type.
svn:mime-type = application/octet-stream
Index: trunk/extensions/UsabilityInitiative/js/plugins/jquery.wikiEditor.templateEditor.js
—	—	@@ -158,28 +158,30 @@
159	159	var $templateName = $( '<span />' )
160	160	.addClass( 'wikiEditor-template-name wikiEditor-noinclude' )
161	161	.text( model.getName() )
162		~~- .mousedown( toggleWikiTextEditor )~~
	162	+ .click( function() { createDialog( $template ); return false; } )
	163	+ .mousedown( function() { return false; } )
163	164	.prependTo( $template );
164	165
165	166	var $templateExpand = $( '<span />' )
166	167	.addClass( 'wikiEditor-template-expand wikiEditor-noinclude' )
167		~~- .mousedown( toggleWikiTextEditor )~~
	168	+ .click( toggleWikiTextEditor )
	169	+ .mousedown( function() { return false; } )
168	170	.prependTo( $template );
169	171
170	172	var $templateDialog = $( '<span />' )
171	173	.addClass( 'wikiEditor-template-dialog wikiEditor-noinclude' )
172		~~- .mousedown( function() { createDialog( $template ); return false; } )~~
	174	+ .click( function() { createDialog( $template ); return false; } )
	175	+ .mousedown( function() { return false; } )
173	176	.insertAfter( $templateName );
174		-
	177	+
175	178	function toggleWikiTextEditor() {
176	179	context.fn.purgeOffsets();
177		~~- var $template = $( this ).closest( '.wikiEditor-template' );~~
178		~~- $template~~
	180	+ $(this)
	181	+ .closest( '.wikiEditor-template' )
179	182	.toggleClass( 'wikiEditor-template-expanded' )
180		~~- .toggleClass( 'wikiEditor-template-collapsed' );~~
181		-
182		~~- var $wikitext = $template.children( '.wikiEditor-template-text' );~~
183		~~- $wikitext.toggleClass( 'wikiEditor-nodisplay' );~~
	183	+ .toggleClass( 'wikiEditor-template-collapsed' )
	184	+ .find( '.wikiEditor-template-text' )
	185	+ .toggleClass( 'wikiEditor-nodisplay' );
184	186	return false;
185	187	};
186	188
Index: trunk/extensions/UsabilityInitiative/js/plugins/jquery.wikiEditor.html
—	—	@@ -49,30 +49,39 @@
50	50	margin: 0 2px;
51	51	}
52	52	.wikiEditor-template-name {
	53	+ cursor: pointer;
	54	+ display: inline-block;
	55	+ height: 16px;
53	56	background: url( '../../images/wikiEditor/templateEditor/name-bg.png' ) 0 0 repeat-x #e8e8e8;
54		~~- color:#333333;~~
55		~~- font-family: Helvetica, sans-serif;~~
	57	+ color: #333333;
	58	+ font-family: sans-serif;
	59	+ text-decoration: none;
	60	+ overflow: hidden;
	61	+ line-height: 16px;
	62	+ padding-left: 0.33em;
56	63	font-size: 12px;
57		~~- padding-left:4px;~~
58		~~- padding-right: 9px;~~
59		~~- padding-top: 1px;~~
60		~~- display: inline;~~
61		~~- text-decoration:none;~~
62		~~- border:1px solid #d9d9d9;~~
63		~~- border-right: none;~~
64		~~- cursor: pointer;~~
65	64	}
66		~~- .wikiEditor-template-expand{~~
	65	+ .wikiEditor-template-expand {
67	66	cursor: pointer;
	67	+ display: inline-block;
	68	+ height: 16px;
	69	+ width: 13px;
	70	+ background-position: 50%; /FF3/
	71	+ /*
68	72	padding-left: 6px;
69	73	padding-right: 6px;
70		~~- background-position: 50%; /FF3/~~
	74	+ */
71	75	}
72		~~- .wikiEditor-template-dialog{~~
	76	+ .wikiEditor-template-dialog {
73	77	cursor: pointer;
	78	+ display: inline-block;
	79	+ height: 16px;
	80	+ width: 22px;
	81	+ background-position: 50%; /FF3/
	82	+ /*
74	83	padding-left: 11px;
75	84	padding-right: 11px;
76		~~- background-position: 50%; /FF3/~~
	85	+ */
77	86	}
78	87	.wikiEditor-template-expanded .wikiEditor-template-expand {
79	88	background-image: url(../../images/wikiEditor/templateEditor/collapse.png);
—	—	@@ -115,11 +124,12 @@
116	125	display: inline;
117	126	}
118	127	.wikiEditor-template .wikiEditor-template-text {
	128	+ margin-top: -8px;
	129	+ display: block;
119	130	background: #f3f3f3;
120		~~- margin-top: -4px;~~
121		~~- border: solid 1px #d9d9d9;~~
122		~~- padding-left: 4px;~~
123		~~- display: block;~~
	131	+ border-top: solid 1px #cccccc;
	132	+ border-bottom: solid 1px #cccccc;
	133	+ padding: 0.5em 4px;
124	134	}
125	135	.wikiEditor-template-end, .wikiEditor-template-start {
126	136	color: blue;
Index: trunk/extensions/UsabilityInitiative/js/plugins.combined.js
—	—	@@ -9260,28 +9260,30 @@
9261	9261	var $templateName = $( '<span />' )
9262	9262	.addClass( 'wikiEditor-template-name wikiEditor-noinclude' )
9263	9263	.text( model.getName() )
9264		~~- .mousedown( toggleWikiTextEditor )~~
	9264	+ .click( function() { createDialog( $template ); return false; } )
	9265	+ .mousedown( function() { return false; } )
9265	9266	.prependTo( $template );
9266	9267
9267	9268	var $templateExpand = $( '<span />' )
9268	9269	.addClass( 'wikiEditor-template-expand wikiEditor-noinclude' )
9269		~~- .mousedown( toggleWikiTextEditor )~~
	9270	+ .click( toggleWikiTextEditor )
	9271	+ .mousedown( function() { return false; } )
9270	9272	.prependTo( $template );
9271	9273
9272	9274	var $templateDialog = $( '<span />' )
9273	9275	.addClass( 'wikiEditor-template-dialog wikiEditor-noinclude' )
9274		~~- .mousedown( function() { createDialog( $template ); return false; } )~~
	9276	+ .click( function() { createDialog( $template ); return false; } )
	9277	+ .mousedown( function() { return false; } )
9275	9278	.insertAfter( $templateName );
9276		-
	9279	+
9277	9280	function toggleWikiTextEditor() {
9278	9281	context.fn.purgeOffsets();
9279		~~- var $template = $( this ).closest( '.wikiEditor-template' );~~
9280		~~- $template~~
	9282	+ $(this)
	9283	+ .closest( '.wikiEditor-template' )
9281	9284	.toggleClass( 'wikiEditor-template-expanded' )
9282		~~- .toggleClass( 'wikiEditor-template-collapsed' );~~
9283		-
9284		~~- var $wikitext = $template.children( '.wikiEditor-template-text' );~~
9285		~~- $wikitext.toggleClass( 'wikiEditor-nodisplay' );~~
	9285	+ .toggleClass( 'wikiEditor-template-collapsed' )
	9286	+ .find( '.wikiEditor-template-text' )
	9287	+ .toggleClass( 'wikiEditor-nodisplay' );
9286	9288	return false;
9287	9289	};
9288	9290
Index: trunk/extensions/UsabilityInitiative/js/plugins.combined.min.js
—	—	@@ -640,7 +640,7 @@
641	641	if(tokenIndex<tokenArray.length){var beginIndex=tokenIndex;var endIndex=-1;var openTemplates=1;var templatesMatched=false;while(tokenIndex<tokenArray.length-1&&endIndex==-1){tokenIndex++;if(tokenArray[tokenIndex].label=='TEMPLATE_BEGIN'){openTemplates++;}else if(tokenArray[tokenIndex].label=='TEMPLATE_END'){openTemplates--;if(openTemplates==0){endIndex=tokenIndex;}}}
642	642	if(endIndex!=-1){markers.push({start:tokenArray[beginIndex].offset,end:tokenArray[endIndex].offset,type:'template',anchor:'wrap',afterWrap:function(node){var model=$.wikiEditor.modules.templateEditor.fn.updateModel($(node));if(model.isCollapsible()){$.wikiEditor.modules.templateEditor.fn.wrapTemplate($(node));}else{$(node).addClass('wikiEditor-template-text');}},beforeUnwrap:function(node){if($(node).parent().hasClass('wikiEditor-template')){$.wikiEditor.modules.templateEditor.fn.unwrapTemplate($(node));}},onSkip:function(node){if($(node).html()==$(node).data('oldHTML')){return;}
643	643	var model=$.wikiEditor.modules.templateEditor.fn.updateModel($(node));if($(node).parent().hasClass('wikiEditor-template')){var $name=$(node).parent().children('.wikiEditor-template-name');if($name.text()!=model.getName()){$name.text(model.getName());}}
644		-if($(node).parent().hasClass('wikiEditor-template')&&!model.isCollapsible()){$.wikiEditor.modules.templateEditor.fn.unwrapTemplate($(node));}else if(!$(node).parent().hasClass('wikiEditor-template')&&model.isCollapsible()){$.wikiEditor.modules.templateEditor.fn.wrapTemplate($(node));}},getAnchor:function(ca1,ca2){return $(ca1.parentNode).is('span.wikiEditor-template-text')?ca1.parentNode:null;},context:context});}else{tokenArray[beginIndex].label='TEMPLATE_FALSE_BEGIN';tokenIndex=beginIndex;}}}}},exp:[{'regex':/{{/,'label':"TEMPLATE_BEGIN"},{'regex':/}}/,'label':"TEMPLATE_END",'markAfter':true}],cfg:{},fn:{create:function(context,config){context.modules.templateEditor={};},wrapTemplate:function($wrapper){var model=$wrapper.data('model');var context=$wrapper.data('marker').context;var $template=$wrapper.wrap('<span class="wikiEditor-template"></span>').addClass('wikiEditor-template-text wikiEditor-nodisplay').parent().addClass('wikiEditor-template-collapsed');var $templateName=$('<span />').addClass('wikiEditor-template-name wikiEditor-noinclude').text(model.getName()).mousedown(toggleWikiTextEditor).prependTo($template);var $templateExpand=$('<span />').addClass('wikiEditor-template-expand wikiEditor-noinclude').mousedown(toggleWikiTextEditor).prependTo($template);var $templateDialog=$('<span />').addClass('wikiEditor-template-dialog wikiEditor-noinclude').mousedown(function(){createDialog($template);return false;}).insertAfter($templateName);function toggleWikiTextEditor(){context.fn.purgeOffsets();var $template=$(this).closest('.wikiEditor-template');$template.toggleClass('wikiEditor-template-expanded').toggleClass('wikiEditor-template-collapsed');var $wikitext=$template.children('.wikiEditor-template-text');$wikitext.toggleClass('wikiEditor-nodisplay');return false;};var dialog={'titleMsg':'wikieditor-template-editor-dialog-title','id':'wikiEditor-template-dialog','html':'\
	644	+if($(node).parent().hasClass('wikiEditor-template')&&!model.isCollapsible()){$.wikiEditor.modules.templateEditor.fn.unwrapTemplate($(node));}else if(!$(node).parent().hasClass('wikiEditor-template')&&model.isCollapsible()){$.wikiEditor.modules.templateEditor.fn.wrapTemplate($(node));}},getAnchor:function(ca1,ca2){return $(ca1.parentNode).is('span.wikiEditor-template-text')?ca1.parentNode:null;},context:context});}else{tokenArray[beginIndex].label='TEMPLATE_FALSE_BEGIN';tokenIndex=beginIndex;}}}}},exp:[{'regex':/{{/,'label':"TEMPLATE_BEGIN"},{'regex':/}}/,'label':"TEMPLATE_END",'markAfter':true}],cfg:{},fn:{create:function(context,config){context.modules.templateEditor={};},wrapTemplate:function($wrapper){var model=$wrapper.data('model');var context=$wrapper.data('marker').context;var $template=$wrapper.wrap('<span class="wikiEditor-template"></span>').addClass('wikiEditor-template-text wikiEditor-nodisplay').parent().addClass('wikiEditor-template-collapsed');var $templateName=$('<span />').addClass('wikiEditor-template-name wikiEditor-noinclude').text(model.getName()).click(function(){createDialog($template);return false;}).mousedown(function(){return false;}).prependTo($template);var $templateExpand=$('<span />').addClass('wikiEditor-template-expand wikiEditor-noinclude').click(toggleWikiTextEditor).mousedown(function(){return false;}).prependTo($template);var $templateDialog=$('<span />').addClass('wikiEditor-template-dialog wikiEditor-noinclude').click(function(){createDialog($template);return false;}).mousedown(function(){return false;}).insertAfter($templateName);function toggleWikiTextEditor(){context.fn.purgeOffsets();$(this).closest('.wikiEditor-template').toggleClass('wikiEditor-template-expanded').toggleClass('wikiEditor-template-collapsed').find('.wikiEditor-template-text').toggleClass('wikiEditor-nodisplay');return false;};var dialog={'titleMsg':'wikieditor-template-editor-dialog-title','id':'wikiEditor-template-dialog','html':'\
645	645	<fieldset>\
646	646	<div class="wikiEditor-template-dialog-title" />\
647	647	<div class="wikiEditor-template-dialog-fields" />\

Status & tagging log

20:30, 8 March 2010 Catrope (talk | contribs) changed the status of r63409 [removed: new added: ok]