http://www.mediawiki.org/wiki/Special:Code/MediaWiki/71192
Revision: 71192
Author: dale
Date: 2010-08-17 05:43:00 +0000 (Tue, 17 Aug 2010)
Log Message:
-----------
improved sequencer mutli-track support
Modified Paths:
--------------
branches/MwEmbedStandAlone/modules/EmbedPlayer/skins/mvpcf/mw.style.PlayerSkinMvpcf.css
branches/MwEmbedStandAlone/modules/Sequencer/css/mw.style.Sequencer.css
branches/MwEmbedStandAlone/modules/Sequencer/mw.SequencerConfig.js
branches/MwEmbedStandAlone/modules/Sequencer/mw.SequencerTimeline.js
branches/MwEmbedStandAlone/mwEmbed.js
Modified:
branches/MwEmbedStandAlone/modules/EmbedPlayer/skins/mvpcf/mw.style.PlayerSkinMvpcf.css
===================================================================
---
branches/MwEmbedStandAlone/modules/EmbedPlayer/skins/mvpcf/mw.style.PlayerSkinMvpcf.css
2010-08-17 03:44:55 UTC (rev 71191)
+++
branches/MwEmbedStandAlone/modules/EmbedPlayer/skins/mvpcf/mw.style.PlayerSkinMvpcf.css
2010-08-17 05:43:00 UTC (rev 71192)
@@ -1,22 +1,9 @@
-/*
+/**
* reference player skin
*/
-/*Video player*/
-
-/* large play button: */
-.mv-player .play-btn-large {
- width : 130px;
- height : 96px;
- background : url(images/player_big_play_button.png) !important;
- position : absolute;
- cursor : pointer;
- border : none !important;
- z-index : 1;
-}
-/*.ui-state-default */
-
+/*.ui-state-default */
.mv-player a:link {color: #2060c1; text-decoration: underline;}
.mv-player a:visited {color: #2060c1; text-decoration: underline;}
/*a:visited {color: #75a5e4; text-decoration: underline;}*/ /*Not sure if you
want this*/
Modified:
branches/MwEmbedStandAlone/modules/Sequencer/css/mw.style.Sequencer.css
===================================================================
--- branches/MwEmbedStandAlone/modules/Sequencer/css/mw.style.Sequencer.css
2010-08-17 03:44:55 UTC (rev 71191)
+++ branches/MwEmbedStandAlone/modules/Sequencer/css/mw.style.Sequencer.css
2010-08-17 05:43:00 UTC (rev 71192)
@@ -16,8 +16,7 @@
overflow-x: scroll;
}
-.mwe-sequencer .clipTrackSet{
- height: 100px;
+.mwe-sequencer .clipTrackSet{
background-color: #EEE;
border: solid thin #999;
list-style-position: inside;
Modified: branches/MwEmbedStandAlone/modules/Sequencer/mw.SequencerConfig.js
===================================================================
--- branches/MwEmbedStandAlone/modules/Sequencer/mw.SequencerConfig.js
2010-08-17 03:44:55 UTC (rev 71191)
+++ branches/MwEmbedStandAlone/modules/Sequencer/mw.SequencerConfig.js
2010-08-17 05:43:00 UTC (rev 71192)
@@ -24,9 +24,9 @@
"Sequencer.AddMediaImageWidth" : 640,
// Default timeline "video / image" clip thumb size
- "Sequencer.TimelineVideoThumbSize" : 100,
+ "Sequencer.TimelineTrackHeight" : 100,
// Default timeline "audio / collapsed" size
- "Sequencer.TimelineVideoThumbSize" : 30
+ "Sequencer.TimelineColapsedTrackSize" : 30
})
\ No newline at end of file
Modified: branches/MwEmbedStandAlone/modules/Sequencer/mw.SequencerTimeline.js
===================================================================
--- branches/MwEmbedStandAlone/modules/Sequencer/mw.SequencerTimeline.js
2010-08-17 03:44:55 UTC (rev 71191)
+++ branches/MwEmbedStandAlone/modules/Sequencer/mw.SequencerTimeline.js
2010-08-17 05:43:00 UTC (rev 71192)
@@ -20,6 +20,9 @@
'width' : 120
},
+ // Store the max track length
+ maxTrackLength: 0,
+
init: function( sequencer ){
this.sequencer = sequencer;
},
@@ -29,15 +32,15 @@
},
/**
- * xxx needs to support multiple tracks
+ * Get the timelineTracksContainer
*/
- getTracksContainer: function( trackId ){
+ getTracksContainer: function( ){
if( this.getTimelineContainer().find( '.timelineTrackContainer'
).length == 0 ){
// getTimelineContainer
this.getTimelineContainer().append(
$j('<div />')
.addClass('timelineTrackContainer')
- .append(
+ .append(
$j('<div />')
.addClass( 'ui-layout-west
trackNamesContainer'),
@@ -61,11 +64,18 @@
this.trackLayout.resizeAll();
},
getTimelineContainerHeight: function(){
- var timelineHeight = 0;
+ var _this = this;
+ // Start with vertical space for one more track
+ var timelineHeight = mw.getConfig(
'Sequencer.TimelineTrackHeight' );
var smilSequenceTracks =
this.sequencer.getSmil().getBody().getSeqElements();
$j.each(smilSequenceTracks, function( trackIndex,
smilSequenceTrack ){
- _this.drawSequenceTrack( trackIndex, smilSequenceTrack
);
+ if( $j( smilSequenceTrack).attr('tracktype') == 'audio'
){
+ timelineHeight+= mw.getConfig(
'Sequencer.TimelineColapsedTrackSize')
+ }else{
+ timelineHeight+= mw.getConfig(
'Sequencer.TimelineTrackHeight' )
+ }
})
+ return timelineHeight;
},
// Get the selected sequence track index ( for now its always zero )
getSelectedTrackIndex: function(){
@@ -86,38 +96,42 @@
drawSequenceTrack: function( trackIndex, smilSequenceTrack ){
var _this = this;
- // Tracks by default are video tracks
- var trackType = ( $j( smilSequenceTrack ).attr('tracktype') ) ?
$j ( smilSequenceTrack ).attr('tracktype') : 'video'
- mw.log("SequenceTimeline::drawSequenceTrack: Track inx: " +
trackIndex + ' trackType:' + trackType );
+ // Tracks by default are video tracks
+ mw.log("SequenceTimeline::drawSequenceTrack: Track inx: " +
+ trackIndex + ' trackType:' + $j (
smilSequenceTrack ).attr('tracktype') );
// Check if we already have a container for this track set
// Add sequence track name if not present
var $clipTrackName = $j( '#' + this.getTrackNameInterfaceId(
trackIndex ) );
if( $clipTrackName.length == 0 ) {
- $clipTrackName =
this.getTracksContainer().find('.trackNamesContainer').append(
- this.getTrackNameInterface( trackIndex,
smilSequenceTrack, trackType )
+
this.getTracksContainer().find('.trackNamesContainer').append(
+ this.getTrackNameInterface( trackIndex,
smilSequenceTrack )
)
+ $clipTrackName = $j( '#' +
this.getTrackNameInterfaceId( trackIndex ) );
}
// xxx check for specific smilSequenceTrack updates that
require TrackNameInterface update
// Add Sequence track container if not present
var $clipTrackSet = $j( '#' + this.getTrackSetId( trackIndex ))
- if( $clipTrackSet.length == 0 ) {
- $clipTrackSet =
this.getTracksContainer().find('.clipTrackSetContainer').append(
- this.getClipTrackSet( trackIndex )
- ).find( '.clipTrackSet');
- }
+ mw.log( "SequenceTimeline::drawSequenceTrack: id: " +
$clipTrackSet.length );
+ if( $clipTrackSet.length == 0 ) {
+
this.getTracksContainer().find('.clipTrackSetContainer').append(
+ this.getClipTrackSet( trackIndex ,
smilSequenceTrack)
+ )
+ $clipTrackSet = $j( '#' + this.getTrackSetId(
trackIndex ));
+ }
// Draw sequence track clips ( checks for dom updates to
smilSequenceTrack )
- this.drawTrackClipsInterface( $clipTrackSet, smilSequenceTrack
, trackType );
+ this.drawTrackClipsInterface( $clipTrackSet, smilSequenceTrack
);
},
/**
* add Track Clips and Interface binding
*/
- drawTrackClipsInterface: function( $clipTrackSet, smilSequenceTrack,
trackType ){
+ drawTrackClipsInterface: function( $clipTrackSet, smilSequenceTrack ){
var _this = this;
- mw.log( '')
+ mw.log( 'drawTrackClipsInterface:: existing lenght: ' +
+ $clipTrackSet.children() + ' id: ' +
$clipTrackSet.attr('id') );
// Setup a local pointer to the smil engine:
var smil = this.sequencer.getSmil();
@@ -149,7 +163,7 @@
reRenderThumbFlag = true;
} else {
// Confirm clip is in the correct indexOrder
- //mw.log( 'indexOrder::' +
$timelineClip.attr('id') + ' '+ $timelineClip.data('indexOrder') + ' == ' +
$node.data('indexOrder'));
+ // mw.log( 'indexOrder::' +
$timelineClip.attr('id') + ' '+ $timelineClip.data('indexOrder') + ' == ' +
$node.data('indexOrder'));
if( $timelineClip.data('indexOrder') !=
$node.data('indexOrder') ){
reOrderTimelineFlag = true;
}
@@ -157,7 +171,6 @@
// xxx Check if the start time was changed to set
reRenderThumbFlag
-
if ( reRenderThumbFlag ){
// issue a draw Thumb request ( since we
reinserted into the dom )
// Check Buffer for when the first frame of the
smilNode can be grabbed:
@@ -165,7 +178,8 @@
//mw.log("getTrackClipInterface::bufferedSeek for " + smil.getPageDomId( $node
));
_this.drawClipThumb( $node , 0);
});
- }
+ }
+
// Update the $previusClip
$previusClip = $timelineClip;
// Update the natural order index
@@ -183,7 +197,7 @@
$clipTrackSet.children().each(function (inx, clip){
$j( clip ).data('indexOrder', inx);
});
- }
+ }
// Give the track set a width relative to the number of clips
$clipTrackSet.css('width', ($clipTrackSet.find( '.timelineClip'
).length + 1) *
@@ -205,24 +219,30 @@
getTrackSetId:function( trackIndex ){
return this.sequencer.getId() + '_clipTrackSet_' + trackIndex;
},
+
/**
* get and add a clip track set to the dom:
*/
- getClipTrackSet: function( trackIndex ){
+ getClipTrackSet: function( trackIndex, smilSequenceTrack ){
var _this = this;
-
+
+ var trackHeight = ( $j( smilSequenceTrack).attr('tracktype') ==
'audio' )?
+ mw.getConfig(
'Sequencer.TimelineColapsedTrackSize') :
+ mw.getConfig( 'Sequencer.TimelineTrackHeight' )
+
return $j('<ul />')
- .attr('id', this.getTrackSetId( trackIndex ))
- .data('trackIndex', trackIndex)
- .addClass('clipTrackSet ui-corner-all')
+ .attr( 'id', this.getTrackSetId( trackIndex ))
+ .data( 'trackIndex', trackIndex )
+ .addClass( 'clipTrackSet ui-corner-all' )
+ .css( 'height', trackHeight )
// Add "sortable
.sortable({
placeholder: "clipSortTarget timelineClip
ui-corner-all",
- opacity: 0.6,
+ opacity: 0.6,
tolerance: 'pointer',
cursor: 'move',
helper: function( event, helper ){
- // xxxx might need some fixes
for multi-track
+ // xxx might need some fixes
for multi-track
var $selected =
_this.getTimelineContainer().find( '.selectedClip' )
if ( $selected.length === 0 ||
$selected.length == 1) {
return $j( helper );
@@ -617,6 +637,8 @@
* for now just audio or video with icon
*/
getTrackNameInterface: function( trackIndex, smilSequenceTrack ){
+ mw.log( 'SequencerTimeline:: getTrackNameInterface : ' +
trackIndex);
+
var $trackNameContainer = $j('<div />')
.attr('id', this.getTrackNameInterfaceId( trackIndex ) )
.addClass('trackNames ui-corner-all')
@@ -625,28 +647,34 @@
$j('<a />')
.attr('href','#')
.addClass( "ui-icon_link" );
+
if( $j( smilSequenceTrack).attr('tracktype') == 'audio' ){
$trackNameTitle.append(
$j('<span />').addClass( 'ui-icon
ui-icon-volume-on'),
$j('<span />').text( gM(
'mwe-sequencer-audio-track' ) )
)
- $trackNameContainer.css( 'height' , '30px' );
+ $trackNameContainer.css({
+ 'height' : mw.getConfig(
'Sequencer.TimelineColapsedTrackSize')
+ });
} else {
// for now default to "video" tracktype
$trackNameTitle.append(
$j('<span />').addClass( 'ui-icon
ui-icon-video'),
$j('<span />').text( gM(
'mwe-sequencer-video-track' ) )
)
- $trackNameContainer.css( 'height' , '100px' );
+ $trackNameContainer.css({
+ 'height' : mw.getConfig(
'Sequencer.TimelineTrackHeight' )
+ });
}
- // Add the track title as a tool tip
+
+ // Add the track title as a title attribute
if ( $j( smilSequenceTrack ).attr('title') ){
$trackNameTitle.find('span').attr('title', $j(
smilSequenceTrack ).attr('title') );
}
$trackNameContainer.append( $trackNameTitle )
// Wrap the track name in a box that matches the trackNames
- return
+ return $trackNameContainer;
},
getTrackNameInterfaceId: function(trackIndex ){
return this.sequencer.getId() + '_trackName_' + trackIndex;
Modified: branches/MwEmbedStandAlone/mwEmbed.js
===================================================================
--- branches/MwEmbedStandAlone/mwEmbed.js 2010-08-17 03:44:55 UTC (rev
71191)
+++ branches/MwEmbedStandAlone/mwEmbed.js 2010-08-17 05:43:00 UTC (rev
71192)
@@ -2260,7 +2260,7 @@
$j( targetObject ).trigger( triggerName, function() {
callInx++;
if( callInx == callbackCount ){
- mw.log(" callbackCountReached run:: " +
callback);
+ //mw.log(" callbackCountReached run:: " +
callback);
// Run callback
callback();
}
_______________________________________________
MediaWiki-CVS mailing list
MediaWiki-CVS@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-cvs
