r69135 MediaWiki - Code Review archive

Repository:	MediaWiki
Revision:	< r69134‎ \| r69135 \| r69136 >
Date:	09:22, 7 July 2010
Author:	dale
Status:	deferred
Tags:
Comment:	stubs for clip edit
Modified paths:	/branches/MwEmbedStandAlone/modules/SequenceEdit/SequenceEdit.i18n.php (modified) (history) /branches/MwEmbedStandAlone/modules/SequenceEdit/loader.js (modified) (history) /branches/MwEmbedStandAlone/modules/SequenceEdit/mw.SequenceEdit.js (modified) (history) /branches/MwEmbedStandAlone/modules/SequenceEdit/mw.SequenceEditKeyBindings.js (modified) (history) /branches/MwEmbedStandAlone/modules/SequenceEdit/mw.SequenceEditPlayer.js (modified) (history) /branches/MwEmbedStandAlone/modules/SequenceEdit/mw.SequenceEditTimeline.js (modified) (history) /branches/MwEmbedStandAlone/modules/SequenceEdit/mw.SequenceEditTools.js (added) (history)

Diff [purge]

Index: branches/MwEmbedStandAlone/modules/SequenceEdit/loader.js
—	—	@@ -11,6 +11,7 @@
12	12	"mw.SequenceEditPlayer" : "mw.SequenceEditPlayer.js",
13	13	"mw.SequenceEditTimeline" : "mw.SequenceEditTimeline.js",
14	14	"mw.SequenceEditKeyBindings" : "mw.SequenceEditKeyBindings.js",
	15	+ "mw.SequenceEditTools" : "mw.SequenceEditTools.js",
15	16
16	17	"mw.FirefoggRender" : "mw.FirefoggRender.js",
17	18	"$j.fn.layout" : "ui.layout/ui.layout-1.2.0.js",
—	—	@@ -38,14 +39,16 @@
39	40	// Make sure we have the required mwEmbed libs:
40	41	return [
41	42	[ // Load the EmbedPlayer Module ( includes lots of dependent classes )
42		~~- 'EmbedPlayer'~~
	43	+ 'EmbedPlayer',
	44	+ 'mw.SequenceEdit'
43	45	],
44	46	[
45	47	'$j.contextMenu',
46		~~- 'mw.SequenceEdit',~~
	48	+
47	49	'mw.SequenceEditPlayer',
48	50	'mw.SequenceEditTimeline',
49	51	'mw.SequenceEditKeyBindings',
	52	+ 'mw.SequenceEditTools',
50	53
51	54	'mw.style.SequenceEdit'
52	55	],
Index: branches/MwEmbedStandAlone/modules/SequenceEdit/SequenceEdit.i18n.php
—	—	@@ -11,10 +11,18 @@
12	12	'mwe-sequenceedit-loading_timeline' => 'Loading timeline ...',
13	13	'mwe-sequenceedit-loading_player' => 'Loading player...',
14	14	'mwe-sequenceedit-loading_edit' => 'Loading edit...',
	15	+ 'mwe-sequenceedit-no_selected_resource' => '<h3>No resource selected</h3> Select a clip to enable editing.',
15	16	'mwe-sequenceedit-no-sequence-start-new' => 'Empty sequence, [$1 browser for assets] to create a new sequence',
16	17	'mwe-sequenceedit-video-track' => 'Video track',
17	18	'mwe-sequenceedit-audio-track' => 'Audio track',
18	19
	20	+ 'mwe-sequenceedit-trim-clip' => 'Trim clip',
	21	+ 'mwe-sequenceedit-preview' => 'Preview',
	22	+ 'mwe-sequenceedit-apply-changes' => 'Apply changes',
	23	+
	24	+ 'mwe-sequenceedit-start-time' => 'Start time',
	25	+ 'mwe-sequenceedit-clip-duration' => 'Clip duration',
	26	+
19	27	'mwe-sequenceedit-transition_in' => 'Transition in',
20	28	'mwe-sequenceedit-transition_out' => 'Transition out',
21	29	'mwe-sequenceedit-effects' => 'Effects stack',
—	—	@@ -29,7 +37,7 @@
30	38	'mwe-sequenceedit-menu_options' => 'Options',
31	39	'mwe-sequenceedit-loading_user_rights' => 'Loading user rights ...',
32	40	'mwe-sequenceedit-no_edit_permissions' => 'You do not have permissions to save changes to this sequence',
33		~~- 'mwe-sequenceedit-edit_clip' => 'Edit clip',~~
	41	+
34	42	'mwe-sequenceedit-edit_save' => 'Save sequence changes',
35	43	'mwe-sequenceedit-saving_wait' => 'Save in progress (please wait)',
36	44	'mwe-sequenceedit-save_done' => 'Save complete',
—	—	@@ -44,8 +52,7 @@
45	53	'mwe-sequenceedit-pixle2sec' => 'pixels to seconds',
46	54	'mwe-sequenceedit-rmclip' => 'Remove clip',
47	55	'mwe-sequenceedit-clip_in' => 'clip in',
48		~~- 'mwe-sequenceedit-clip_out' => 'clip out',~~
49		~~- 'mwe-sequenceedit-no_selected_resource' => '<h3>No resource selected</h3> Select a clip to enable editing.',~~
	56	+ 'mwe-sequenceedit-clip_out' => 'clip out',
50	57	'mwe-sequenceedit-error_edit_multiple' => '<h3>Multiple resources selected</h3> Select a single clip to edit it.',
51	58	'mwe-sequenceedit-editor_options' => 'Editor options',
52	59	'mwe-sequenceedit-editor_mode' => 'Editor mode',
Index: branches/MwEmbedStandAlone/modules/SequenceEdit/mw.SequenceEditKeyBindings.js
—	—	@@ -2,6 +2,22 @@
3	3	* Stores the key bindings
4	4	*/
5	5
	6	+/**
	7	+ * jQuery helper for input focus binding
	8	+ */
	9	+( function( $ ) {
	10	+ $.fn.sequenceEditInput = function( sequenceEdit ) {
	11	+ $j(this)
	12	+ .focus( function(){
	13	+ sequenceEdit.getKeyBindings().onFocus();
	14	+ })
	15	+ .blur( function(){
	16	+ sequenceEdit.getKeyBindings().onBlur();
	17	+ })
	18	+ return this;
	19	+ }
	20	+} )( jQuery );
	21	+
6	22	mw.SequenceEditKeyBindings = function( sequenceEdit ) {
7	23	return this.init( sequenceEdit );
8	24	};
—	—	@@ -24,7 +40,7 @@
25	41	switch( eventType ){
26	42	case 'copy':
27	43	this.copyEvent = callback;
28		~~- break;~~
	44	+ break;
29	45	case 'cut':
30	46	this.cutEvent = callback;
31	47	break;
—	—	@@ -40,11 +56,11 @@
41	57	}
42	58	return this;
43	59	},
44		~~- onInputFocus: function( ){~~
45		~~- _this.inputFocus = true;~~
	60	+ onFocus: function( ){
	61	+ this.inputFocus = true;
46	62	},
47		~~- onInputBlur: function(){~~
48		~~- _this.inputFocus = false;~~
	63	+ onBlur: function(){
	64	+ this.inputFocus = false;
49	65	},
50	66	setupKeyBindigs: function(){
51	67	var _this = this;
Index: branches/MwEmbedStandAlone/modules/SequenceEdit/mw.SequenceEditTimeline.js
—	—	@@ -199,7 +199,9 @@
200	200	},
201	201	// calls the edit interface passing in the selected clip:
202	202	editClip: function( selectedClip ){
203		-
	203	+ // get the smil element for the edit tool:
	204	+ var smilClip = this.sequenceEdit.getSmil().$dom.find('#' + $j( selectedClip ).data('smilId') );
	205	+ this.sequenceEdit.getEditTools().drawClipEditTool(smilClip, 'trim');
204	206	},
205	207
206	208	/**
—	—	@@ -217,12 +219,13 @@
218	220	});
219	221	// Invalidate / update embedPlayer duration:
220	222	this.sequenceEdit.getEmbedPlayer().getDuration( true );
221		~~- }~~
	223	+ }
222	224	},
223	225	/**
224	226	* Remove selected clips and update the smil player
225	227	*/
226		~~- removeSelectedClips: function( ){~~
	228	+ removeSelectedClips: function( ){
	229	+ var smil = this.sequenceEdit.getSmil();
227	230	// modify the smil.dom and rebuild
228	231	this.getTimelineContainer().find( '.selectedClip' ).each(function( inx, selectedClip ){
229	232	// Remove from smil dom:
—	—	@@ -452,11 +455,7 @@
453	456	}
454	457	return $j( sequenceNode ).data('id');
455	458	}
456		-}
	459	+}
457	460
458	461
459		-
460		-
461		-
462		-
463	462	} )( window.mw );
\ No newline at end of file
Index: branches/MwEmbedStandAlone/modules/SequenceEdit/mw.SequenceEditPlayer.js
—	—	@@ -60,6 +60,22 @@
61	61
62	62	},
63	63
	64	+ previewSmilClip: function(){
	65	+ // Set the borders to 'red' to indicate preview
	66	+ this.sequenceEdit.getContainer().find( '.mwseq-player' )
	67	+ .css('border', 'solid thin red');
	68	+
	69	+ // Get a special target of this subsmil node:
	70	+
	71	+ },
	72	+
	73	+ closePreivew: function(){
	74	+ // restore border
	75	+ this.sequenceEdit.getContainer().find( '.mwseq-player' )
	76	+ .css({'border': null});
	77	+ },
	78	+
	79	+
64	80	resizePlayer: function(){
65	81	mw.log("SequenceEditPlayer:: resizePlayer: " + $j('#' + this.getSmilPlayerId() ).length );
66	82	$j('#' + this.getSmilPlayerId() ).get(0)
Index: branches/MwEmbedStandAlone/modules/SequenceEdit/mw.SequenceEdit.js
—	—	@@ -68,8 +68,9 @@
69	69	this[optionName] = mw_sequenceedit_default_options[ optionName ]
70	70	}
71	71	}
72		~~- // For style properties assgin top level mwe-sequence-edit class~~
73		~~- this.getContainer().addClass('mwe-sequence-edit');~~
	72	+ // For style properties assign top level mwe-sequence-edit class
	73	+ this.getContainer()
	74	+ .addClass('mwe-sequence-edit');
74	75	},
75	76
76	77	// Return the container id for the sequence
—	—	@@ -116,7 +117,7 @@
117	118
118	119	});
119	120
120		~~- // Add deafult clip edit~~
	121	+ // Add default clip edit
121	122
122	123	},
123	124	getPlayer: function(){
—	—	@@ -135,17 +136,25 @@
136	137	return this.smil;
137	138	},
138	139	getTimeline: function(){
139		~~- if( ! this.timeline ){~~
	140	+ if( !this.timeline ){
140	141	this.timeline = new mw.SequenceEditTimeline( this );
141	142	}
142	143	return this.timeline;
143	144	},
	145	+ getEditTools: function(){
	146	+ if( !this.editTools ){
	147	+ this.editTools = new mw.SequenceEditTools( this );
	148	+ }
	149	+ return this.editTools;
	150	+ },
	151	+
144	152	getKeyBindings:function(){
145	153	if( ! this.keyBindings ){
146	154	this.keyBindings = new mw.SequenceEditKeyBindings( this );
147	155	}
148	156	return this.keyBindings;
149	157	},
	158	+
150	159	// Apply the resizable layout bindings and default sizes
151	160	applyLayoutBindings: function(){
152	161	var _this = this;
—	—	@@ -200,7 +209,7 @@
201	210	.append(
202	211	$j('<div />')
203	212	.addClass( "ui-layout-center mwseq-edit" )
204		~~- .text( gM('mwe-sequenceedit-loading_edit') ),~~
	213	+ .html( this.getEditTools().defaultText ),
205	214	$j('<div />')
206	215	.addClass( "ui-layout-east mwseq-player" )
207	216	.text( gM('mwe-sequenceedit-loading_player') ),
—	—	@@ -210,7 +219,9 @@
211	220	)
212	221	).children();
213	222	},
214		-
	223	+ getEditToolTarget: function(){
	224	+ return this.getContainer().find( '.mwseq-edit' );
	225	+ },
215	226	getContainer: function(){
216	227	return $j( this.interfaceContainer );
217	228	}
Index: branches/MwEmbedStandAlone/modules/SequenceEdit/mw.SequenceEditTools.js
—	—	@@ -0,0 +1,232 @@
	2	+/**
	3	+ * Handles the "tools" window top level component driver
	4	+ */
	5	+
	6	+//Wrap in mw closure to avoid global leakage
	7	+( function( mw ) {
	8	+
	9	+mw.SequenceEditTools = function( sequenceEdit ) {
	10	+ return this.init( sequenceEdit );
	11	+};
	12	+
	13	+// Set up the mvSequencer object
	14	+mw.SequenceEditTools.prototype = {
	15	+ init: function( sequenceEdit ){
	16	+ this.sequenceEdit = sequenceEdit;
	17	+ },
	18	+ defaultText : gM('mwe-sequenceedit-no_selected_resource'),
	19	+ tools:{
	20	+ 'trim':{
	21	+ 'title': gM('mwe-sequenceedit-trim-clip'),
	22	+ 'editWidgets' : [ 'trimTimeline' ],
	23	+ 'editableAttributes' : ['clipBegin','dur' ],
	24	+ 'editActions' : ['preview', 'apply', 'cancel']
	25	+ }
	26	+ },
	27	+ editableAttributes:{
	28	+ 'clipBegin':{
	29	+ 'type': 'time',
	30	+ 'title' : gM('mwe-sequenceedit-start-time' ),
	31	+ },
	32	+ 'dur' :{
	33	+ 'type': 'time',
	34	+ 'title' : gM('mwe-sequenceedit-clip-duration' ),
	35	+ }
	36	+ },
	37	+ editableTypes: {
	38	+ 'time' : {
	39	+ update : function( _this, smilClip, attributeName, value){
	40	+ // Validate time
	41	+ var seconds = _this.sequenceEdit.getSmil().parseTime( value );
	42	+ $j( smilClip ).attr( attributeName, mw.seconds2npt( seconds ) )
	43	+ },
	44	+ getSmilVal : function( _this, smilClip, attributeName ){
	45	+ var smil = _this.sequenceEdit.getSmil();
	46	+ return mw.seconds2npt(
	47	+ smil.parseTime(
	48	+ $j( smilClip ).attr( attributeName )
	49	+ )
	50	+ );
	51	+ }
	52	+ }
	53	+ },
	54	+ editActions: {
	55	+ 'preview' : {
	56	+ 'icon' : 'play',
	57	+ 'title' : gM('mwe-sequenceedit-preview'),
	58	+ 'action': function( _this, smilClip, toolId){
	59	+ //_this.sequenceEdit.getPlayer().previewClip( smilClip );
	60	+ }
	61	+ },
	62	+ 'apply' :{
	63	+ 'icon' : 'check',
	64	+ 'title' : gM('mwe-sequenceedit-apply-changes'),
	65	+ 'action': function( _this, smilClip, toolId){
	66	+ mw.log( "editActions:: changes already applied" );
	67	+ _this.sequenceEdit.getEditToolTarget().html(
	68	+ _this.defaultText
	69	+ )
	70	+ }
	71	+ },
	72	+ 'cancel':{
	73	+ 'icon': 'close',
	74	+ 'title' : gM('mwe-cancel'),
	75	+ 'action' : function( _this, smilClip, toolId){
	76	+ var tool = _this.tools[toolId];
	77	+ for( var i=0; i < tool.editableAttributes.length ; i++ ){
	78	+ var attributeName = tool.editableAttributes[i];
	79	+ var $editToolInput = $j('#' + _this.getEditToolId( toolId, attributeName ) );
	80	+ // Restore all original attribute values
	81	+ smilClip.attr( attributeName, $editToolInput.data('initialValue') );
	82	+ // close / empty the toolWindow
	83	+ }
	84	+ _this.sequenceEdit.getEditToolTarget().html(
	85	+ _this.defaultText
	86	+ )
	87	+ }
	88	+ }
	89	+ },
	90	+ getEditToolId: function( toolId, attributeName){
	91	+ return 'editTool_' + toolId + '_' + attributeName;
	92	+ },
	93	+ drawClipEditTool: function( smilClip, toolId ){
	94	+ $target = this.sequenceEdit.getEditToolTarget();
	95	+
	96	+ // Make sure the toolid exists
	97	+ if( !this.tools[ toolId ] ){
	98	+ mw.log("Error: tool " + toolId + ' not found');
	99	+ return ;
	100	+ }
	101	+ var tool = this.tools[ toolId ];
	102	+ // Append the title:
	103	+ $target.empty().append(
	104	+ $j('<h3 />' ).append(
	105	+ tool.title
	106	+ )
	107	+ );
	108	+
	109	+ // Build out widgets
	110	+ //for( var i =0 ; i < tool.editWidgets.length ; i ++ ){
	111	+ //}
	112	+
	113	+ // Build out the attritube list:
	114	+ for( var i=0; i < tool.editableAttributes.length ; i++ ){
	115	+ attributeName = tool.editableAttributes[i];
	116	+ $target.append(
	117	+ this.getEditableAttribute( smilClip, toolId, attributeName )
	118	+ );
	119	+ }
	120	+ // output a float divider:
	121	+ $target.append( $j('<div />').addClass('ui-helper-clearfix') );
	122	+
	123	+ // Build out edit Actions buttons
	124	+ for( var i=0; i < tool.editActions.length ; i++){
	125	+ var editActionId = tool.editActions[i];
	126	+ $target.append(
	127	+ this.getEditAction( smilClip, toolId, editActionId )
	128	+ )
	129	+ }
	130	+ },
	131	+ getEditAction: function( smilClip, toolId, editActionId ){
	132	+
	133	+ if(! this.editActions[ editActionId ]){
	134	+ mw.log("Error: getEditAction: " + editActionId + ' not found ');
	135	+ return ;
	136	+ }
	137	+ var _this = this;
	138	+ var editAction = this.editActions[ editActionId ];
	139	+ $actionButton = $j.button({
	140	+ icon_id: editAction.icon,
	141	+ text: editAction.title
	142	+ })
	143	+ .css({
	144	+ 'float': 'left',
	145	+ 'margin': '5px'
	146	+ })
	147	+ .buttonHover()
	148	+ .click( function(){
	149	+ editAction.action( _this, smilClip, toolId );
	150	+ })
	151	+ return $actionButton;
	152	+ },
	153	+ getEditableAttribute: function( smilClip, toolId, attributeName ){
	154	+ if( ! this.editableAttributes[ attributeName ] ){
	155	+ mw.log("Error: editableAttributes : " + attributeName + ' not found');
	156	+ return;
	157	+ }
	158	+ var _this = this;
	159	+ var editAttribute = this.editableAttributes[ attributeName ];
	160	+ var editType = editAttribute.type;
	161	+
	162	+ var initialValue = _this.editableTypes[ editType ].getSmilVal(
	163	+ _this,
	164	+ smilClip,
	165	+ attributeName
	166	+ );
	167	+ return $j( '<div />' )
	168	+ .css({
	169	+ 'float': 'left',
	170	+ 'width': '150px',
	171	+ 'border': 'solid thin #999',
	172	+ 'background-color': '#EEE',
	173	+ 'padding' : '2px',
	174	+ 'margin' : '5px'
	175	+ })
	176	+ .append(
	177	+ $j('<span />')
	178	+ .css('margin', '5px')
	179	+ .text( editAttribute.title ),
	180	+
	181	+ $j('<input />')
	182	+ .attr( {
	183	+ 'id' : _this.getEditToolId( toolId, attributeName),
	184	+ 'size': 5
	185	+ })
	186	+ .data('initialValue', initialValue )
	187	+ .sequenceEditInput( _this.sequenceEdit )
	188	+ .val( initialValue )
	189	+ .change(function(){
	190	+ // Run the editableType update function:
	191	+ _this.editableTypes[ editType ].update(
	192	+ _this,
	193	+ smilClip,
	194	+ attributeName,
	195	+ $j( this ).val()
	196	+ );
	197	+ })
	198	+ );
	199	+ },
	200	+
	201	+ /*drawTrimClipTool: function( clipNode ){
	202	+ $target = this.sequenceEdit.getToolTarget();
	203	+ $target.empty().append(
	204	+ $j('<div />')
	205	+ .addClass("toolTarget")
	206	+ .append(
	207	+ $j('<h3 />').text(
	208	+
	209	+ ),
	210	+ // Width of the container images thumbs set-in-out
	211	+
	212	+ $j('<div />')
	213	+ .addClass("ui-helper-clearfix"),
	214	+ // Start time and end time text:
	215	+ $j( '<div />' )
	216	+ .css({
	217	+ 'float': 'left',
	218	+ 'width': '200px',
	219	+ 'background-color': '#AAA'
	220	+ })
	221	+ .append(
	222	+ $j('<span />')
	223	+ .text( gM('mwe-sequenceedit-start-time') ),
	224	+ $j('<input />')
	225	+ .attr('size', 5)
	226	+ )
	227	+ )
	228	+ )
	229	+ )
	230	+ }*/
	231	+}
	232	+
	233	+} )( window.mw );
\ No newline at end of file

Status & tagging log

14:00, 3 September 2010 😂 (talk | contribs) changed the status of r69135 [removed: new added: deferred]