Index: trunk/extensions/MetavidWiki/skins/mv_stream.js |
— | — | @@ -90,9 +90,9 @@ |
91 | 91 | //add_custom_effects(); |
92 | 92 | //set up the init values for mouse over restore: |
93 | 93 | org_vid_title = $j('#mv_stream_time').html(); |
94 | | - if(!$j('#embed_vid').get(0)){ |
| 94 | + if(!$j('#embed_vid').get(0).ready_to_play){ |
95 | 95 | //no embed video present stop init |
96 | | - return ''; |
| 96 | + return js_log('no clip ready to play'); |
97 | 97 | } |
98 | 98 | org_vid_time_req = $j('#embed_vid').get(0).getTimeReq(); |
99 | 99 | org_thum_src = $j('#embed_vid').get(0).thumbnail; |
Index: trunk/extensions/MetavidWiki/skins/mv_embed/mv_sequence.css |
— | — | @@ -1,72 +0,0 @@ |
2 | | -/* the css file for sequence styles */ |
3 | | - |
4 | | -.mv_head_jump{ |
5 | | - font-family:"verdana","helvetica","arial",sans-serif; |
6 | | - font-size:11px; |
7 | | - background:#CCCCCC; |
8 | | - z-index:1; |
9 | | -} |
10 | | -.mv_playline{ |
11 | | - position:absolute; |
12 | | - background:gray; |
13 | | - top:20px; |
14 | | - left:0px; |
15 | | - width:2px; |
16 | | - bottom:20px; |
17 | | - z-index:10; |
18 | | -} |
19 | | -.mv_seq_tracks{ |
20 | | - position:absolute;left:90px;top:0px;right:12px;bottom:0px;overflow:auto; |
21 | | -} |
22 | | -.mv_tl_left_cnt{ |
23 | | - position:absolute; |
24 | | - top:0px; |
25 | | - left:0px; |
26 | | - bottom:0px; |
27 | | - width:85px; |
28 | | -} |
29 | | -.track_name{ |
30 | | - font-family:"verdana","helvetica","arial",sans-serif; |
31 | | - font-size:12px; |
32 | | - width:85px; |
33 | | - position:absolute; |
34 | | - background:#CCCCCC; |
35 | | -} |
36 | | -.container_track{ |
37 | | - position:absolute; |
38 | | - border:solid thin red; |
39 | | - |
40 | | -} |
41 | | -.mv_time_clip_text{ |
42 | | - font-family:"verdana","helvetica","arial",sans-serif; |
43 | | - font-size:12px; |
44 | | -} |
45 | | -.mv_time_clip{ |
46 | | - position:absolute; |
47 | | - z-index:0; |
48 | | - overflow:hidden; |
49 | | - border:solid thin white; |
50 | | - white-space: nowrap; |
51 | | -} |
52 | | -.mv_clip_cnt{ |
53 | | - position:absolute; |
54 | | - width:16px; |
55 | | - height:16px; |
56 | | -} |
57 | | - |
58 | | -.ui-drag-e{ cursor: e-resize;} |
59 | | -.ui-drag-w{ cursor: w-resize;} |
60 | | - |
61 | | -.mv_clip_stats{ |
62 | | - font-family:"verdana","helvetica","arial",sans-serif; |
63 | | - font-size:11px; |
64 | | - position:absolute; |
65 | | - background:#CCCCCC; |
66 | | - bottom:0px; |
67 | | - right:0px; |
68 | | -} |
69 | | -.mv_droppable{ |
70 | | - position:absolute; |
71 | | - top:0px; |
72 | | - z-index:-1; |
73 | | -} |
Index: trunk/extensions/MetavidWiki/skins/mv_embed/skins/mvpcf/mv_sequence.css |
— | — | @@ -0,0 +1,71 @@ |
| 2 | +/* the css file for sequence styles */ |
| 3 | +.mv_head_jump{ |
| 4 | + font-family:"verdana","helvetica","arial",sans-serif; |
| 5 | + font-size:11px; |
| 6 | + background:#CCCCCC; |
| 7 | + z-index:1; |
| 8 | +} |
| 9 | +.mv_playline{ |
| 10 | + position:absolute; |
| 11 | + background:gray; |
| 12 | + top:20px; |
| 13 | + left:0px; |
| 14 | + width:2px; |
| 15 | + bottom:20px; |
| 16 | + z-index:10; |
| 17 | +} |
| 18 | +.mv_seq_tracks{ |
| 19 | + position:absolute;left:90px;top:0px;right:12px;bottom:0px;overflow:auto; |
| 20 | +} |
| 21 | +.mv_tl_left_cnt{ |
| 22 | + position:absolute; |
| 23 | + top:0px; |
| 24 | + left:0px; |
| 25 | + bottom:0px; |
| 26 | + width:85px; |
| 27 | +} |
| 28 | +.track_name{ |
| 29 | + font-family:"verdana","helvetica","arial",sans-serif; |
| 30 | + font-size:12px; |
| 31 | + width:85px; |
| 32 | + position:absolute; |
| 33 | + background:#CCCCCC; |
| 34 | +} |
| 35 | +.container_track{ |
| 36 | + position:absolute; |
| 37 | + border:solid thin red; |
| 38 | + |
| 39 | +} |
| 40 | +.mv_time_clip_text{ |
| 41 | + font-family:"verdana","helvetica","arial",sans-serif; |
| 42 | + font-size:12px; |
| 43 | +} |
| 44 | +.mv_time_clip{ |
| 45 | + position:absolute; |
| 46 | + z-index:0; |
| 47 | + overflow:hidden; |
| 48 | + border:solid thin white; |
| 49 | + white-space: nowrap; |
| 50 | +} |
| 51 | +.mv_clip_cnt{ |
| 52 | + position:absolute; |
| 53 | + width:16px; |
| 54 | + height:16px; |
| 55 | +} |
| 56 | + |
| 57 | +.ui-drag-e{ cursor: e-resize;} |
| 58 | +.ui-drag-w{ cursor: w-resize;} |
| 59 | + |
| 60 | +.mv_clip_stats{ |
| 61 | + font-family:"verdana","helvetica","arial",sans-serif; |
| 62 | + font-size:11px; |
| 63 | + position:absolute; |
| 64 | + background:#CCCCCC; |
| 65 | + bottom:0px; |
| 66 | + right:0px; |
| 67 | +} |
| 68 | +.mv_droppable{ |
| 69 | + position:absolute; |
| 70 | + top:0px; |
| 71 | + z-index:-1; |
| 72 | +} |
Property changes on: trunk/extensions/MetavidWiki/skins/mv_embed/skins/mvpcf/mv_sequence.css |
___________________________________________________________________ |
Added: svn:eol-style |
1 | 73 | + native |
Index: trunk/extensions/MetavidWiki/skins/mv_embed/skins/mvpcf/styles.css |
— | — | @@ -13,10 +13,10 @@ |
14 | 14 | background:#262626 none repeat scroll 0 0; |
15 | 15 | border:3px solid #666666; |
16 | 16 | left:10%; |
17 | | - top:10%; |
| 17 | + top:5%; |
18 | 18 | position:fixed; |
19 | 19 | width:80%; |
20 | | - height:80%; |
| 20 | + height:90%; |
21 | 21 | z-index:100; |
22 | 22 | color:#fff; |
23 | 23 | } |
Index: trunk/extensions/MetavidWiki/skins/mv_embed/mv_embed.js |
— | — | @@ -204,10 +204,8 @@ |
205 | 205 | $j.ajaxSetup({ |
206 | 206 | cache: true |
207 | 207 | }); |
208 | | - js_log('jquery loaded'); |
209 | | - |
| 208 | + js_log('jquery loaded'); |
210 | 209 | mvJsLoader.doLoad(_this.lib_plugins, function(){ |
211 | | - js_log('loaded ui core'); |
212 | 210 | //load control ui after ui.core loaded |
213 | 211 | mvJsLoader.doLoad(_this.lib_controlui,function(){ |
214 | 212 | js_log('plugins loaded'); |
— | — | @@ -954,12 +952,11 @@ |
955 | 953 | } |
956 | 954 | } |
957 | 955 | |
958 | | -var sq_load_time=0; |
959 | 956 | function mv_do_sequence(initObj){ |
960 | 957 | js_log('mv_do_sequence'); |
961 | 958 | //issue a request to get the css file (if not already included): |
962 | | - if(!styleSheetPresent(mv_embed_path+'mv_sequence.css')) |
963 | | - loadExternalCss(mv_embed_path+'mv_sequence.css'); |
| 959 | + if(!styleSheetPresent(mv_embed_path+'skins/'+mv_skin_name+'/mv_sequence.css')) |
| 960 | + loadExternalCss(mv_embed_path+'skins/'+mv_skin_name+'/mv_sequence.css'); |
964 | 961 | //make sure we have the required mv_ebed libs (they are not loaded when no video element is on the page) |
965 | 962 | mvEmbed.load_libs(function(){ |
966 | 963 | //load playlist object and drag,drop,resize,hoverintent,libs |
— | — | @@ -2474,7 +2471,7 @@ |
2475 | 2472 | |
2476 | 2473 | //fix for IE<7 and its lack of PNG support: |
2477 | 2474 | out+=getTransparentPng(new Object ({id:'play_'+id, width:play_btn_width, height:play_btn_height, border:"0", |
2478 | | - src:mv_embed_path + '/skins/'+mv_skin_name+'/images/player_big_play_button.png' })); |
| 2475 | + src:mv_embed_path + '/skin/images/player_big_play_button.png' })); |
2479 | 2476 | out+='</a></div>'; |
2480 | 2477 | return out;*/ |
2481 | 2478 | }, |
Index: trunk/extensions/MetavidWiki/skins/mv_embed/mv_sequencer.js |
— | — | @@ -16,8 +16,26 @@ |
17 | 17 | * enables more dynamic layouts |
18 | 18 | * exports back out to json or inline format |
19 | 19 | */ |
| 20 | + |
| 21 | +gMsg['menu_welcome']='Welcome'; |
| 22 | +gMsg['menu_cliplib']='Clip Library'; |
| 23 | +gMsg['menu_transition']='Transitions'; |
| 24 | +gMsg['menu_soundtrack']='Soundtrack'; |
| 25 | + |
| 26 | +gMsg['zoom_in']='Zoom In'; |
| 27 | +gMsg['zoom_out']='Zoom Out'; |
| 28 | +gMsg['cut_clip']='Cut Clips'; |
| 29 | +gMsg['expand_track']='Expand Track'; |
| 30 | +gMsg['colapse_track']='Colapse Track'; |
| 31 | +gMsg['play_clip']='Play From Playline Position'; |
| 32 | +gMsg['pixle2sec']='pixles to seconds'; |
| 33 | +gMsg['rmclip']='Remove Clip'; |
| 34 | +gMsg['clip_in']='clip in'; |
| 35 | +gMsg['clip_out']='clip out'; |
| 36 | + |
20 | 37 | //used to set default values and validate the passed init object |
21 | 38 | var sequencerDefaultValues = { |
| 39 | + |
22 | 40 | instance_name:'mvSeq', //for now only one instance by name mvSeq is allowed |
23 | 41 | sequence_container_id:'null',//text value (so that its a valid property) |
24 | 42 | video_container_id:'mv_video_container', |
— | — | @@ -25,7 +43,8 @@ |
26 | 44 | timeline_id:'mv_timeline', |
27 | 45 | plObj_id:'plobj', |
28 | 46 | |
29 | | - |
| 47 | + track_timeline_format:'boxes', //boxes (imovie like) or timeline ( finalCut like) |
| 48 | + |
30 | 49 | timeline_scale:.25, //in pixel to second ratio ie 100pixles for every ~30seconds |
31 | 50 | timeline_duration:500, //default timeline length in seconds |
32 | 51 | playline_time:0, |
— | — | @@ -35,19 +54,7 @@ |
36 | 55 | // note some options will be lost in block rendering mode (like cutting clips etc) |
37 | 56 | timeline_mode:'time', |
38 | 57 | //Msg are all the language specific values ... |
39 | | - // (todo overwite by msg values preloaded in the page) |
40 | | - Msg:{ |
41 | | - zoom_in:'Zoom In', |
42 | | - zoom_out:'Zoom Out', |
43 | | - cut_clip:'Cut Clips', |
44 | | - expand_track:'Expand Track', |
45 | | - colapse_track:'Colapse Track', |
46 | | - play_clip:'Play From Playline Position', |
47 | | - pixle2sec:'pixles to seconds', |
48 | | - rmclip:'Remove Clip', |
49 | | - clip_in:'clip in', |
50 | | - clip_out:'clip out' |
51 | | - }, |
| 58 | + // (@@todo overwite by msg values preloaded in the page) |
52 | 59 | //tack/clips can be pushed via json or inline playlist format |
53 | 60 | inline_playlist:'null', //text value so its a valid property |
54 | 61 | inline_playlist_id:'null', |
— | — | @@ -76,34 +83,55 @@ |
77 | 84 | this[i]=initObj[i]; |
78 | 85 | } |
79 | 86 | } |
| 87 | + if(this.sequence_container_id==null) |
| 88 | + return js_log('Error: no sequence_container_id'); |
| 89 | + |
80 | 90 | //check for sequence_container |
81 | 91 | if(this.sequence_container_id!='null'){ |
82 | | - //@@todo make sure sequence container position is relative |
83 | | - //@@todo make sure the dim is safe size > 400x300 or so |
84 | | - $j('#'+this.sequence_container_id).css('position', 'relative'); |
| 92 | + |
| 93 | + //$j('#'+this.sequence_container_id).css('position', 'relative'); |
85 | 94 | this['base_width']=$j('#'+this.sequence_container_id).width(); |
86 | 95 | this['base_height']=$j('#'+this.sequence_container_id).height(); |
87 | 96 | |
| 97 | + /* |
88 | 98 | var vid_width = (Math.round(this['base_width']*.5)>320)? |
89 | 99 | Math.round(this['base_width']*.5):320; |
90 | 100 | var vid_height = Math.round(vid_width*.75)+30; |
| 101 | + */ |
| 102 | + var vid_width=320; |
| 103 | + var vid_height=240+30; |
91 | 104 | |
| 105 | + |
92 | 106 | //add the container divs (with basic layout) |
93 | 107 | $j('#'+this.sequence_container_id).html(''+ |
94 | | - '<div id="'+this.video_container_id+'" style="position:absolute;' + |
| 108 | + '<div id="'+this.video_container_id+'" style="position:absolute;right:0px;top:0px;' + |
95 | 109 | 'width:'+vid_width+'px;height:'+vid_height+'px;border:solid thin blue;"/>'+ |
96 | 110 | '<div id="'+this.sequence_tools_id+'" style="position:absolute;' + |
97 | | - 'left:'+(vid_width+10)+'px;right:0px;top:0px;height:'+vid_height+'px;border:solid thin black;"/>'+ |
| 111 | + 'left:0px;right:'+(vid_width+10)+'px;top:0px;height:'+vid_height+'px;border:solid thin black;"/>'+ |
98 | 112 | '<div id="'+this.timeline_id+'" style="position:absolute;' + |
99 | 113 | 'left:0px;right:0px;top:'+(vid_height+10)+'px;bottom:0px;border:solid thin red;"/>'); |
100 | | - |
| 114 | + |
| 115 | + js_log('set: '+this.sequence_container_id + ' html to:'+ "\n"+ |
| 116 | + $j('#'+this.sequence_container_id).html() |
| 117 | + ); |
101 | 118 | //add some sample tool content: (not translated since sequence_tools_id is generally overwritten |
102 | | - $j('#'+this.sequence_tools_id).html( |
103 | | - '<span style="margin:10px;"><b>Sample Sequence Methods:</b><ul>' + |
104 | | - '<li><a href="javascript:'+this.instance_name+'.addClip({track_id:0,type:\'mvClip\',mvclip:\'senate_proceeding_12-07-06?t=04:46:27/04:46:58\'})">Add <i>I fancy pencils</i> clip</a></li>' + |
105 | | - '<li><a href="javascript:'+this.instance_name+'.addRss({track_id:0,src:\'http://metavid.ucsc.edu/overlay/archive_browser/rss_filter_view?filters[0][type]=match&filters[0][val]=peace&start=0&rpp=10\'})">Add last 10 mentions of peace</li>' + |
106 | | - '</ul>'+ |
107 | | - '</span>' |
| 119 | + var menu_items = { |
| 120 | + 'welcome':1, |
| 121 | + 'cliplib':1, |
| 122 | + 'transition':1, |
| 123 | + 'soundtrack':1 |
| 124 | + }; |
| 125 | + var menu_html = '<ul style="list-style-type:none;list-style-position:outside;display:block;">'; |
| 126 | + for(var i in menu_items){ |
| 127 | + menu_html+='<li style="display:inline;padding:10px;"><a style="color:#fff" href="javascript:'+this.instance_name+'.disp(\''+i+'\')">'+getMsg('menu_'+i)+'</a></li>'; |
| 128 | + } |
| 129 | + menu_html+='</ul>'; |
| 130 | + $j('#'+this.sequence_tools_id).html( menu_html + |
| 131 | + '<div id="seq_tool_disp_'+this.instance_name+'">Welcome bla bla<br>' + |
| 132 | + '1<br>' + |
| 133 | + '2<br>' + |
| 134 | + '3<br>' + |
| 135 | + '</div>' |
108 | 136 | ); |
109 | 137 | |
110 | 138 | } |
— | — | @@ -111,19 +139,19 @@ |
112 | 140 | $j('#'+this.timeline_id).html(''+ |
113 | 141 | '<div id="'+this.timeline_id+'_left_cnt" class="mv_tl_left_cnt">'+ |
114 | 142 | '<div id="'+this.timeline_id+'_head_control" style="position:absolute;top:0px;left:0px;right:0px;height:30px;">' + |
115 | | - '<a title="'+this.Msg.play_clip+'" href="javascript:'+this.instance_name+'.play_jt()">'+ |
| 143 | + '<a title="'+getMsg('play_clip')+'" href="javascript:'+this.instance_name+'.play_jt()">'+ |
116 | 144 | getTransparentPng({id:this.timeline_id+'_play', width:"16", height:"16", border:"0", |
117 | 145 | src:mv_embed_path + 'images/control_play_blue.png' }) + |
118 | 146 | '</a>'+ |
119 | | - '<a title="'+this.Msg.zoom_in+'" href="javascript:'+this.instance_name+'.zoom_in()">'+ |
| 147 | + '<a title="'+getMsg('zoom_in')+'" href="javascript:'+this.instance_name+'.zoom_in()">'+ |
120 | 148 | getTransparentPng({id:this.timeline_id+'_zoom_in_icon', width:"16", height:"16", border:"0", |
121 | 149 | src:mv_embed_path + 'images/zoom_in.png' }) + |
122 | 150 | '</a>'+ |
123 | | - '<a title="'+this.Msg.zoom_out+'" href="javascript:'+this.instance_name+'.zoom_out()">'+ |
| 151 | + '<a title="'+getMsg('zoom_out')+'" href="javascript:'+this.instance_name+'.zoom_out()">'+ |
124 | 152 | getTransparentPng({id:this.timeline_id+'_zoom_in_icon', width:"16", height:"16", border:"0", |
125 | 153 | src:mv_embed_path + 'images/zoom_out.png' }) + |
126 | 154 | '</a>'+ |
127 | | - '<a title="'+this.Msg.cut_clip+'" href="javascript:'+this.instance_name+'.cut_mode()">'+ |
| 155 | + '<a title="'+getMsg('cut_clip')+'" href="javascript:'+this.instance_name+'.cut_mode()">'+ |
128 | 156 | getTransparentPng({id:this.timeline_id+'_cut', width:"16", height:"16", border:"0", |
129 | 157 | src:mv_embed_path + 'images/cut.png' }) + |
130 | 158 | '</a>'+ |
— | — | @@ -196,13 +224,13 @@ |
197 | 225 | var track_height=60; |
198 | 226 | var exc_img = 'opened'; |
199 | 227 | var exc_action='close'; |
200 | | - var exc_msg = this.Msg.colapse_track; |
| 228 | + var exc_msg = getMsg('colapse_track'); |
201 | 229 | break; |
202 | 230 | case 'text': |
203 | 231 | var track_height=20; |
204 | 232 | var exc_img = 'closed'; |
205 | 233 | var exc_action='open'; |
206 | | - var exc_msg = this.Msg.expand_track; |
| 234 | + var exc_msg = getMsg('expand_track'); |
207 | 235 | break; |
208 | 236 | } |
209 | 237 | //add track name: |
— | — | @@ -429,9 +457,9 @@ |
430 | 458 | '" class="mv_time_clip_text mv_clip_drag">'+clip.title; |
431 | 459 | } |
432 | 460 | //add in per clip controls |
433 | | - track_html+='<div title="'+this.Msg.clip_in+' '+clip.embed.start_ntp+'" class="ui-resizable-w ui-resizable-handle" style="width: 16px; height: 16px; left: 0px; top: 2px;background:url(\''+mv_embed_path+'images/application_side_contract.png\');"></div>'+"\n"; |
434 | | - track_html+='<div title="'+this.Msg.clip_out+' '+clip.embed.end_ntp+'" class="ui-resizable-e ui-resizable-handle" style="width: 16px; height: 16px; right: 0px; top: 2px;background:url(\''+mv_embed_path+'images/application_side_expand.png\');"></div>'+"\n"; |
435 | | - track_html+='<div title="'+this.Msg.rmclip+'" onClick="'+this.instance_name+'.removeClip('+track_id+','+j+')" style="position:absolute;cursor:pointer;width: 16px; height: 16px; left: 0px; bottom:2px;background:url(\''+mv_embed_path+'images/delete.png\');"></div>'+"\n"; |
| 461 | + track_html+='<div title="'+getMsg('clip_in')+' '+clip.embed.start_ntp+'" class="ui-resizable-w ui-resizable-handle" style="width: 16px; height: 16px; left: 0px; top: 2px;background:url(\''+mv_embed_path+'images/application_side_contract.png\');"></div>'+"\n"; |
| 462 | + track_html+='<div title="'+getMsg('clip_out')+' '+clip.embed.end_ntp+'" class="ui-resizable-e ui-resizable-handle" style="width: 16px; height: 16px; right: 0px; top: 2px;background:url(\''+mv_embed_path+'images/application_side_expand.png\');"></div>'+"\n"; |
| 463 | + track_html+='<div title="'+getMsg('rmclip')+'" onClick="'+this.instance_name+'.removeClip('+track_id+','+j+')" style="position:absolute;cursor:pointer;width: 16px; height: 16px; left: 0px; bottom:2px;background:url(\''+mv_embed_path+'images/delete.png\');"></div>'+"\n"; |
436 | 464 | track_html+='<span style="display:none;" class="mv_clip_stats"></span>'; |
437 | 465 | track_html+='</span>'; |
438 | 466 | //droppable_html+='<div id="dropBefore_'+i+'_c_'+j+'" class="mv_droppable" style="height:'+this.track_thumb_height+'px;left:'+clip.left_px+'px;width:'+Math.round(clip.width_px/2)+'px"></div>'; |
Index: trunk/extensions/MetavidWiki/skins/mv_embed/mv_playlist.js |
— | — | @@ -141,7 +141,15 @@ |
142 | 142 | $j('body').append('<div id="overlay"/> '+ |
143 | 143 | '<div id="modalbox" class="editor">'); |
144 | 144 | $j('#modalbox').html('loading editor<blink>...</blink>'); |
145 | | - |
| 145 | + var _this=this; |
| 146 | + js_log("calling sequence with url:"+ _this.src); |
| 147 | + //load sequencer: |
| 148 | + mv_do_sequence({ |
| 149 | + "sequence_container_id":'modalbox', |
| 150 | + "mv_pl_url_id":_this.src //kind of redundant but make for a clean "cancel".. |
| 151 | + // we could switch to moving around dom elements if performance is an issue |
| 152 | + }); |
| 153 | + |
146 | 154 | }, |
147 | 155 | selectPlaybackMethod:function(){ |
148 | 156 | this.cur_clip.embed.selectPlaybackMethod(); |