| OLD | NEW |
|---|
| 1 <!DOCTYPE HTML> | 1 <!DOCTYPE HTML> |
| 2 <html i18n-values="dir:textdirection;"> | 2 <html i18n-values="dir:textdirection;"> |
| 3 <head> | 3 <head> |
| 4 <meta charset="utf-8"> | 4 <meta charset="utf-8"> |
| 5 <title>Media Player</title> | 5 <title>Media Player</title> |
| 6 <style type="text/css"> | 6 <style type="text/css"> |
| 7 | 7 |
| 8 body { | 8 body { |
| 9 overflow: hidden; | 9 overflow: hidden; |
| 10 background: black; | 10 background: black; |
| (...skipping 97 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 108 } | 108 } |
| 109 | 109 |
| 110 .soundbutton { | 110 .soundbutton { |
| 111 position: absolute; | 111 position: absolute; |
| 112 right: 30px; | 112 right: 30px; |
| 113 bottom: 0; | 113 bottom: 0; |
| 114 border-left: 1px solid #424242; | 114 border-left: 1px solid #424242; |
| 115 border-right: 1px solid black; | 115 border-right: 1px solid black; |
| 116 } | 116 } |
| 117 | 117 |
| 118 .soundicon { | 118 .soundiconhigh { |
| 119 background: url('../../app/theme/mediaplayer_vol_high.png'); | 119 background: url('../../app/theme/mediaplayer_vol_high.png'); |
| 120 } |
| 121 |
| 122 .soundiconmuted { |
| 123 background: url('../../app/theme/mediaplayer_vol_mute.png'); |
| 124 } |
| 125 |
| 126 .soundiconhigh, |
| 127 .soundiconmuted { |
| 120 background-repeat: no-repeat; | 128 background-repeat: no-repeat; |
| 121 background-position: 6px 8px; | 129 background-position: 6px 8px; |
| 122 } | 130 } |
| 123 | 131 |
| 124 .volume { | 132 .volume { |
| 125 position: absolute; | 133 position: absolute; |
| 126 bottom: 30px; | 134 bottom: 30px; |
| 127 height: 80px; | 135 height: 80px; |
| 128 width: 30px; | 136 width: 30px; |
| 129 right: 30px; | 137 right: 30px; |
| (...skipping 113 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 243 position: absolute; | 251 position: absolute; |
| 244 right: 0; | 252 right: 0; |
| 245 bottom: 0; | 253 bottom: 0; |
| 246 border-left: 1px solid #424242; | 254 border-left: 1px solid #424242; |
| 247 border-right: 1px solid black; | 255 border-right: 1px solid black; |
| 248 } | 256 } |
| 249 | 257 |
| 250 .playlisticon { | 258 .playlisticon { |
| 251 background: url('../../app/theme/mediaplayer_playlist.png'); | 259 background: url('../../app/theme/mediaplayer_playlist.png'); |
| 252 background-repeat: no-repeat; | 260 background-repeat: no-repeat; |
| 253 background-position: 6px 8px; | 261 background-position: 6px 8px; |
| 254 } | 262 } |
| 255 | 263 |
| 256 .controlbutton { | 264 .controlbutton { |
| 257 z-index: 9999; | 265 z-index: 9999; |
| 258 cursor: pointer; | 266 cursor: pointer; |
| 259 width: 28px; | 267 width: 28px; |
| 260 height: 30px; | 268 height: 30px; |
| 261 } | 269 } |
| 262 | 270 |
| 263 .controlbutton:hover { | 271 .controlbutton:hover { |
| (...skipping 19 matching lines...) Expand all Loading... |
| 283 return document.getElementById(o); | 291 return document.getElementById(o); |
| 284 } | 292 } |
| 285 | 293 |
| 286 /////////////////////////////////////////////////////////////////////////////// | 294 /////////////////////////////////////////////////////////////////////////////// |
| 287 // Document Functions: | 295 // Document Functions: |
| 288 /** | 296 /** |
| 289 * Window onload handler, sets up the page. | 297 * Window onload handler, sets up the page. |
| 290 */ | 298 */ |
| 291 function load() { | 299 function load() { |
| 292 chrome.send('getCurrentPlaylist', []); | 300 chrome.send('getCurrentPlaylist', []); |
| 293 }; | 301 } |
| 294 | 302 |
| 295 var videoPlaybackElement = null; | 303 var videoPlaybackElement = null; |
| 296 var audioPlaybackElement = null; | 304 var audioPlaybackElement = null; |
| 297 var currentPlaylist = null; | 305 var currentPlaylist = null; |
| 298 var currentItem = -1; | 306 var currentItem = -1; |
| 307 var savedVolumeValue = 0; |
| 308 var hideVolumeTimerId = 0; |
| 299 | 309 |
| 300 function onMediaProgress() { | 310 function onMediaProgress() { |
| 301 var element = getMediaElement(); | 311 var element = getMediaElement(); |
| 302 var current = element.currentTime; | 312 var current = element.currentTime; |
| 303 var duration = element.duration; | 313 var duration = element.duration; |
| 304 var progress = $('progress'); | 314 var progress = $('progress'); |
| 305 progress.value = (current*100)/duration; | 315 progress.value = (current*100)/duration; |
| 306 var played = $('sliderplayed'); | 316 var played = $('sliderplayed'); |
| 307 played.style.width = '' + progress.value + '%'; | 317 played.style.width = '' + progress.value + '%'; |
| 308 if (progress.value == 100) { | 318 if (progress.value == 100) { |
| 309 onMediaComplete(); | 319 onMediaComplete(); |
| 310 } | 320 } |
| 311 }; | 321 } |
| 312 | 322 |
| 313 function onLoadedProgress(e) { | 323 function onLoadedProgress(e) { |
| 314 var element = $('sliderloaded'); | 324 var element = $('sliderloaded'); |
| 315 if (e.lengthComputable) { | 325 if (e.lengthComputable) { |
| 316 element.style.display = 'block'; | 326 element.style.display = 'block'; |
| 317 var percent = (e.loaded * 100) / e.total; | 327 var percent = (e.loaded * 100) / e.total; |
| 318 element.style.width = '' + percent + '%'; | 328 element.style.width = '' + percent + '%'; |
| 319 } else { | 329 } else { |
| 320 element.style.display = 'none'; | 330 element.style.display = 'none'; |
| 321 } | 331 } |
| 322 }; | 332 } |
| 323 | 333 |
| 324 function onMediaError(e) { | 334 function onMediaError(e) { |
| 325 chrome.send('playbackError', ['Error playing back']); | 335 chrome.send('playbackError', ['Error playing back']); |
| 326 onMediaComplete(); | 336 onMediaComplete(); |
| 327 }; | 337 } |
| 328 | 338 |
| 329 function onMediaComplete() { | 339 function onMediaComplete() { |
| 330 currentItem ++; | 340 currentItem ++; |
| 331 if (currentItem >= currentPlaylist.length) { | 341 if (currentItem >= currentPlaylist.length) { |
| 332 currentItem -= 1; | 342 currentItem -= 1; |
| 333 var element = getMediaElement(); | 343 var element = getMediaElement(); |
| 334 element.currentTime = 0; | 344 element.currentTime = 0; |
| 335 element.pause(); | 345 element.pause(); |
| 336 onMediaPause(); | 346 onMediaPause(); |
| 337 onMediaProgress(); | 347 onMediaProgress(); |
| 338 return; | 348 return; |
| 339 } | 349 } |
| 340 var mediaElement = getMediaElement(); | 350 var mediaElement = getMediaElement(); |
| 341 mediaElement.removeEventListener("progress", onLoadedProgress, true); | 351 mediaElement.removeEventListener("progress", onLoadedProgress, true); |
| 342 mediaElement.removeEventListener("timeupdate", onMediaProgress, true); | 352 mediaElement.removeEventListener("timeupdate", onMediaProgress, true); |
| 343 mediaElement.removeEventListener("durationchange", onMetadataAvail, true); | 353 mediaElement.removeEventListener("durationchange", onMetadataAvail, true); |
| 344 // MediaElement.removeEventListener("ended", onMediaComplete, true); | 354 // MediaElement.removeEventListener("ended", onMediaComplete, true); |
| 345 mediaElement.removeEventListener("play", onMediaPlay, true); | 355 mediaElement.removeEventListener("play", onMediaPlay, true); |
| 346 mediaElement.removeEventListener("pause", onMediaPause, true); | 356 mediaElement.removeEventListener("pause", onMediaPause, true); |
| 347 | 357 |
| 348 chrome.send('currentOffsetChanged', ['' + currentItem]); | 358 chrome.send('currentOffsetChanged', ['' + currentItem]); |
| 349 playMediaFile(currentPlaylist[currentItem].path); | 359 playMediaFile(currentPlaylist[currentItem].path); |
| 350 }; | 360 } |
| 351 | 361 |
| 352 function onMediaPlay() { | 362 function onMediaPlay() { |
| 353 var pausebutton = $('pausebutton'); | 363 var pausebutton = $('pausebutton'); |
| 354 var playbutton = $('playbutton'); | 364 var playbutton = $('playbutton'); |
| 355 pausebutton.style.display = 'block'; | 365 pausebutton.style.display = 'block'; |
| 356 playbutton.style.display = 'none'; | 366 playbutton.style.display = 'none'; |
| 357 }; | 367 } |
| 358 | 368 |
| 359 function onMediaPause() { | 369 function onMediaPause() { |
| 360 var pausebutton = $('pausebutton'); | 370 var pausebutton = $('pausebutton'); |
| 361 var playbutton = $('playbutton'); | 371 var playbutton = $('playbutton'); |
| 362 playbutton.style.display = 'block'; | 372 playbutton.style.display = 'block'; |
| 363 pausebutton.style.display = 'none'; | 373 pausebutton.style.display = 'none'; |
| 364 }; | 374 } |
| 365 | 375 |
| 366 function setupMediaEvents(element) { | 376 function setupMediaEvents(element) { |
| 367 element.addEventListener("progress", onLoadedProgress, true); | 377 element.addEventListener("progress", onLoadedProgress, true); |
| 368 element.addEventListener("timeupdate", onMediaProgress, true); | 378 element.addEventListener("timeupdate", onMediaProgress, true); |
| 369 element.addEventListener("durationchange", onMetadataAvail, true); | 379 element.addEventListener("durationchange", onMetadataAvail, true); |
| 370 // element.addEventListener("ended", onMediaComplete, true); | 380 // element.addEventListener("ended", onMediaComplete, true); |
| 371 element.onerror = onMediaError; | 381 element.onerror = onMediaError; |
| 372 element.addEventListener("play", onMediaPlay, true); | 382 element.addEventListener("play", onMediaPlay, true); |
| 373 element.addEventListener("pause", onMediaPause, true); | 383 element.addEventListener("pause", onMediaPause, true); |
| 374 }; | 384 } |
| 375 | 385 |
| 376 function getMediaElement() { | 386 function getMediaElement() { |
| 377 var mediaElement; | 387 var mediaElement; |
| 378 if (videoPlaybackElement) { | 388 if (videoPlaybackElement) { |
| 379 mediaElement = videoPlaybackElement; | 389 mediaElement = videoPlaybackElement; |
| 380 } else { | 390 } else { |
| 381 mediaElement = audioPlaybackElement; | 391 mediaElement = audioPlaybackElement; |
| 382 } | 392 } |
| 383 return mediaElement; | 393 return mediaElement; |
| 384 }; | 394 } |
| 385 | 395 |
| 386 function playPauseButtonClick() { | 396 function playPauseButtonClick() { |
| 387 var mediaElement = getMediaElement(); | 397 var mediaElement = getMediaElement(); |
| 388 if (mediaElement.paused || mediaElement.ended) { | 398 if (mediaElement.paused || mediaElement.ended) { |
| 389 mediaElement.play(); | 399 mediaElement.play(); |
| 390 } else { | 400 } else { |
| 391 mediaElement.pause(); | 401 mediaElement.pause(); |
| 392 } | 402 } |
| 393 }; | 403 } |
| 394 | 404 |
| 395 function prevButtonClick() { | 405 function prevButtonClick() { |
| 396 var element = getMediaElement(); | 406 var element = getMediaElement(); |
| 397 if (element.currentTime > 6) { | 407 if (element.currentTime > 6) { |
| 398 element.currentTime = 0; | 408 element.currentTime = 0; |
| 399 return; | 409 return; |
| 400 } | 410 } |
| 401 currentItem --; | 411 currentItem --; |
| 402 if (currentItem < 0) { | 412 if (currentItem < 0) { |
| 403 currentItem = -1; | 413 currentItem = -1; |
| 404 return; | 414 return; |
| 405 } | 415 } |
| 406 chrome.send('currentOffsetChanged', ['' + currentItem]); | 416 chrome.send('currentOffsetChanged', ['' + currentItem]); |
| 407 playMediaFile(currentPlaylist[currentItem].path); | 417 playMediaFile(currentPlaylist[currentItem].path); |
| 408 }; | 418 } |
| 409 | 419 |
| 410 function nextButtonClick() { | 420 function nextButtonClick() { |
| 411 currentItem ++; | 421 currentItem ++; |
| 412 if (currentItem >= currentPlaylist.length) { | 422 if (currentItem >= currentPlaylist.length) { |
| 413 currentItem = -1; | 423 currentItem = -1; |
| 414 return; | 424 return; |
| 415 } | 425 } |
| 416 chrome.send('currentOffsetChanged', ['' + currentItem]); | 426 chrome.send('currentOffsetChanged', ['' + currentItem]); |
| 417 playMediaFile(currentPlaylist[currentItem].path); | 427 playMediaFile(currentPlaylist[currentItem].path); |
| 418 }; | 428 } |
| 419 | 429 |
| 420 function userChangedProgress() { | 430 function userChangedProgress() { |
| 421 var val = $('progress').value; | 431 var val = $('progress').value; |
| 422 var element = getMediaElement(); | 432 var element = getMediaElement(); |
| 423 if (element.seekable && element.duration) { | 433 if (element.seekable && element.duration) { |
| 424 var current = (progress.value * element.duration)/100; | 434 var current = (progress.value * element.duration)/100; |
| 425 element.currentTime = current; | 435 element.currentTime = current; |
| 426 } | 436 } |
| 427 }; | 437 } |
| 428 | 438 |
| 429 function toggleVolumeVisible() { | 439 function changeVolumeVisibility(visible) { |
| 430 var volume_div = $('volume'); | 440 var volume = $('volume'); |
| 431 if (volume_div.style.display == 'none') { | 441 volume.style.display = visible ? 'block' : 'none'; |
| 432 volume_div.style.display = 'block'; | 442 } |
| 433 } else { | 443 |
| 434 volume_div.style.display = 'none'; | 444 function showVolume() { |
| 445 if (hideVolumeTimerId) { |
| 446 clearTimeout(hideVolumeTimerId); |
| 447 hideVolumeTimerId = 0; |
| 435 } | 448 } |
| 436 }; | 449 |
| 450 changeVolumeVisibility(true); |
| 451 } |
| 452 |
| 453 function hideVolume() { |
| 454 if (!hideVolumeTimerId) |
| 455 hideVolumeTimerId = setTimeout('changeVolumeVisibility(false)', 500); |
| 456 } |
| 437 | 457 |
| 438 function volumeChange() { | 458 function volumeChange() { |
| 439 var volumeslider = $('volumeslider'); | 459 var volumeslider = $('volumeslider'); |
| 440 var element = getMediaElement(); | 460 var element = getMediaElement(); |
| 441 element.volume = (volumeslider.value/100); | 461 element.volume = (volumeslider.value/100); |
| 442 }; | 462 |
| 463 var soundicon = $('soundicon'); |
| 464 soundicon.className = soundicon.className.replace( |
| 465 /soundicon.*/, |
| 466 element.volume > 0 ? 'soundiconhigh' : 'soundiconmuted'); |
| 467 } |
| 468 |
| 469 function muteVolume(mute) { |
| 470 var volumeslider = $('volumeslider'); |
| 471 var element = getMediaElement(); |
| 472 if (mute) { |
| 473 savedVolumeValue = volumeslider.value; |
| 474 volumeslider.value = 0; |
| 475 volumeChange(); |
| 476 } else { |
| 477 volumeslider.value = savedVolumeValue; |
| 478 volumeChange(); |
| 479 } |
| 480 } |
| 481 |
| 482 function toggleVolumeMute() { |
| 483 muteVolume($('volumeslider').value != 0); |
| 484 } |
| 443 | 485 |
| 444 function setupPlaybackControls() { | 486 function setupPlaybackControls() { |
| 445 var element = $('playercontrols'); | 487 var element = $('playercontrols'); |
| 446 playercontrols.innerHTML = ''; // clear out other | 488 playercontrols.innerHTML = ''; // clear out other |
| 447 var controlsclass = ''; | 489 var controlsclass = ''; |
| 448 if (videoPlaybackElement != null) { | 490 if (videoPlaybackElement != null) { |
| 449 controlsclass = 'video'; | 491 controlsclass = 'video'; |
| 450 element.className = 'videocontrols'; | 492 element.className = 'videocontrols'; |
| 451 } else if (audioPlaybackElement != null) { | 493 } else if (audioPlaybackElement != null) { |
| 452 controlsclass = 'audio'; | 494 controlsclass = 'audio'; |
| (...skipping 63 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 516 sliderback.appendChild(loaded); | 558 sliderback.appendChild(loaded); |
| 517 | 559 |
| 518 var played = document.createElement('div'); | 560 var played = document.createElement('div'); |
| 519 played.id = 'sliderplayed'; | 561 played.id = 'sliderplayed'; |
| 520 played.className = 'sliderplayed'; | 562 played.className = 'sliderplayed'; |
| 521 sliderback.appendChild(played); | 563 sliderback.appendChild(played); |
| 522 | 564 |
| 523 var soundbutton = document.createElement('div'); | 565 var soundbutton = document.createElement('div'); |
| 524 soundbutton.id = 'soundbutton'; | 566 soundbutton.id = 'soundbutton'; |
| 525 soundbutton.className = controlsclass + ' controlbutton soundbutton'; | 567 soundbutton.className = controlsclass + ' controlbutton soundbutton'; |
| 526 soundbutton.onclick = toggleVolumeVisible; | 568 soundbutton.onclick = toggleVolumeMute; |
| 569 soundbutton.onmouseover = showVolume; |
| 570 soundbutton.onmouseout = hideVolume; |
| 527 var soundicon = document.createElement('div'); | 571 var soundicon = document.createElement('div'); |
| 528 soundicon.className = 'icon soundicon'; | 572 soundicon.id = 'soundicon'; |
| 573 soundicon.className = 'icon soundiconhigh'; |
| 529 soundbutton.appendChild(soundicon); | 574 soundbutton.appendChild(soundicon); |
| 530 element.appendChild(soundbutton); | 575 element.appendChild(soundbutton); |
| 531 | 576 |
| 532 var fullscreen = document.createElement('div'); | 577 var fullscreen = document.createElement('div'); |
| 533 fullscreen.id = 'fullscreen'; | 578 fullscreen.id = 'fullscreen'; |
| 534 fullscreen.className = controlsclass + ' controlbutton fullscreen'; | 579 fullscreen.className = controlsclass + ' controlbutton fullscreen'; |
| 535 fullscreen.onclick = toggleFullscreen; | 580 fullscreen.onclick = toggleFullscreen; |
| 536 var fullscreenicon = document.createElement('div'); | 581 var fullscreenicon = document.createElement('div'); |
| 537 fullscreenicon.className = 'icon fullscreenicon'; | 582 fullscreenicon.className = 'icon fullscreenicon'; |
| 538 fullscreen.appendChild(fullscreenicon); | 583 fullscreen.appendChild(fullscreenicon); |
| 539 element.appendChild(fullscreen); | 584 element.appendChild(fullscreen); |
| 540 | 585 |
| 541 var volume = document.createElement('div'); | 586 var volume = document.createElement('div'); |
| 542 volume.id = 'volume'; | 587 volume.id = 'volume'; |
| 543 volume.className = controlsclass + ' controlbutton volume'; | 588 volume.className = controlsclass + ' volume'; |
| 544 volume.style.display = 'none'; | 589 volume.style.display = 'none'; |
| 590 volume.onmouseover = showVolume; |
| 591 volume.onmouseout = hideVolume; |
| 545 var volumeslider = document.createElement('input'); | 592 var volumeslider = document.createElement('input'); |
| 546 volumeslider.type = 'range'; | 593 volumeslider.type = 'range'; |
| 547 volumeslider.id = 'volumeslider'; | 594 volumeslider.id = 'volumeslider'; |
| 548 volumeslider.className = 'volumeslider'; | 595 volumeslider.className = 'volumeslider'; |
| 549 volumeslider.onchange = volumeChange; | 596 volumeslider.onchange = volumeChange; |
| 550 volume.appendChild(volumeslider); | 597 volume.appendChild(volumeslider); |
| 551 document.body.appendChild(volume); | 598 document.body.appendChild(volume); |
| 599 volumeChange(); |
| 552 | 600 |
| 553 var duration = document.createElement('div'); | 601 var duration = document.createElement('div'); |
| 554 duration.id = 'duration'; | 602 duration.id = 'duration'; |
| 555 duration.className = 'duration'; | 603 duration.className = 'duration'; |
| 556 element.appendChild(duration); | 604 element.appendChild(duration); |
| 557 }; | 605 } |
| 558 | 606 |
| 559 function playAudioFile(uri) { | 607 function playAudioFile(uri) { |
| 560 if (videoPlaybackElement != null) { | 608 if (videoPlaybackElement != null) { |
| 561 document.body.removeChild(videoPlaybackElement); | 609 document.body.removeChild(videoPlaybackElement); |
| 562 videoPlaybackElement = null; | 610 videoPlaybackElement = null; |
| 563 } | 611 } |
| 564 if (audioPlaybackElement == null) { | 612 if (audioPlaybackElement == null) { |
| 565 audioPlaybackElement = document.createElement('audio'); | 613 audioPlaybackElement = document.createElement('audio'); |
| 566 audioPlaybackElement.className = 'playbackaudioelement'; | 614 audioPlaybackElement.className = 'playbackaudioelement'; |
| 567 audioPlaybackElement.autoplay = true; | 615 audioPlaybackElement.autoplay = true; |
| 568 audioPlaybackElement.controls = false; | 616 audioPlaybackElement.controls = false; |
| 569 setupMediaEvents(audioPlaybackElement); | 617 setupMediaEvents(audioPlaybackElement); |
| 570 audioPlaybackElement.src = uri; | 618 audioPlaybackElement.src = uri; |
| 571 setupPlaybackControls(); | 619 setupPlaybackControls(); |
| 572 document.body.appendChild(audioPlaybackElement); | 620 document.body.appendChild(audioPlaybackElement); |
| 573 } else { | 621 } else { |
| 574 setupMediaEvents(audioPlaybackElement); | 622 setupMediaEvents(audioPlaybackElement); |
| 575 audioPlaybackElement.src = uri; | 623 audioPlaybackElement.src = uri; |
| 576 audioPlaybackElement.currentTime = 0; | 624 audioPlaybackElement.currentTime = 0; |
| 577 audioPlaybackElement.load(); | 625 audioPlaybackElement.load(); |
| 578 audioPlaybackElement.play(); | 626 audioPlaybackElement.play(); |
| 579 } | 627 } |
| 580 }; | 628 } |
| 581 | 629 |
| 582 function toggleFullscreen() { | 630 function toggleFullscreen() { |
| 583 chrome.send('toggleFullscreen', ['']); | 631 chrome.send('toggleFullscreen', ['']); |
| 584 }; | 632 } |
| 585 | 633 |
| 586 function onMetadataAvail() { | 634 function onMetadataAvail() { |
| 587 var element = getMediaElement(); | 635 var element = getMediaElement(); |
| 588 var duration = element.duration; | 636 var duration = element.duration; |
| 589 if (duration) { | 637 if (duration) { |
| 590 var durString = '' + Math.floor((duration / 60)) + ':' + (Math.floor(duratio
n) % 60); | 638 var durString = '' + Math.floor((duration / 60)) + ':' + (Math.floor(duratio
n) % 60); |
| 591 var durDiv = $('duration'); | 639 var durDiv = $('duration'); |
| 592 durDiv.textContent = durString; | 640 durDiv.textContent = durString; |
| 593 } | 641 } |
| 594 }; | 642 } |
| 595 | 643 |
| 596 function playVideoFile(uri) { | 644 function playVideoFile(uri) { |
| 597 if (audioPlaybackElement != null) { | 645 if (audioPlaybackElement != null) { |
| 598 document.body.removeChild(audioPlaybackElement); | 646 document.body.removeChild(audioPlaybackElement); |
| 599 audioPlaybackElement = null; | 647 audioPlaybackElement = null; |
| 600 } | 648 } |
| 601 if (videoPlaybackElement == null) { | 649 if (videoPlaybackElement == null) { |
| 602 videoPlaybackElement = document.createElement('video'); | 650 videoPlaybackElement = document.createElement('video'); |
| 603 videoPlaybackElement.className = 'playbackvideoelement'; | 651 videoPlaybackElement.className = 'playbackvideoelement'; |
| 604 videoPlaybackElement.autoplay = true; | 652 videoPlaybackElement.autoplay = true; |
| 605 videoPlaybackElement.controls = false; | 653 videoPlaybackElement.controls = false; |
| 606 setupMediaEvents(videoPlaybackElement); | 654 setupMediaEvents(videoPlaybackElement); |
| 607 videoPlaybackElement.src = uri; | 655 videoPlaybackElement.src = uri; |
| 608 videoPlaybackElement.load(); | 656 videoPlaybackElement.load(); |
| 609 var toggleButton = document.createElement('div'); | 657 var toggleButton = document.createElement('div'); |
| 610 toggleButton.className = 'fullscreentoggle'; | 658 toggleButton.className = 'fullscreentoggle'; |
| 611 toggleButton.id = 'fullscreentoggle'; | 659 toggleButton.id = 'fullscreentoggle'; |
| 612 toggleButton.onclick = toggleFullscreen; | 660 toggleButton.onclick = toggleFullscreen; |
| 613 document.body.appendChild(toggleButton); | 661 document.body.appendChild(toggleButton); |
| 614 setupPlaybackControls(); | 662 setupPlaybackControls(); |
| 615 document.body.appendChild(videoPlaybackElement); | 663 document.body.appendChild(videoPlaybackElement); |
| 616 } else { | 664 } else { |
| 617 setupMediaEvents(videoPlaybackElement); | 665 setupMediaEvents(videoPlaybackElement); |
| 618 videoPlaybackElement.src = uri; | 666 videoPlaybackElement.src = uri; |
| 619 videoPlaybackElement.currentTime = 0; | 667 videoPlaybackElement.currentTime = 0; |
| 620 videoPlaybackElement.load(); | 668 videoPlaybackElement.load(); |
| 621 videoPlaybackElement.play(); | 669 videoPlaybackElement.play(); |
| 622 } | 670 } |
| 623 }; | 671 } |
| 624 | 672 |
| 625 function stopAllPlayback() { | 673 function stopAllPlayback() { |
| 626 var element = getMediaElement(); | 674 var element = getMediaElement(); |
| 627 if (element != null) { | 675 if (element != null) { |
| 628 element.pause(); | 676 element.pause(); |
| 629 } | 677 } |
| 630 }; | 678 } |
| 631 | 679 |
| 632 function playlistChanged(info, playlist) { | 680 function playlistChanged(info, playlist) { |
| 633 if (info.force) { | 681 if (info.force) { |
| 634 currentPlaylist = playlist; | 682 currentPlaylist = playlist; |
| 635 stopAllPlayback(); | 683 stopAllPlayback(); |
| 636 if (playlist.length >= 1) { | 684 if (playlist.length >= 1) { |
| 637 if (info.currentOffset) { | 685 if (info.currentOffset) { |
| 638 currentItem = info.currentOffset; | 686 currentItem = info.currentOffset; |
| 639 } else { | 687 } else { |
| 640 currentItem = 0; | 688 currentItem = 0; |
| (...skipping 17 matching lines...) Expand all Loading... |
| 658 return; | 706 return; |
| 659 } | 707 } |
| 660 } | 708 } |
| 661 if (playlist.length > 0) { | 709 if (playlist.length > 0) { |
| 662 currentItem = 0; | 710 currentItem = 0; |
| 663 chrome.send('currentOffsetChanged', ['' + currentItem]); | 711 chrome.send('currentOffsetChanged', ['' + currentItem]); |
| 664 playMediaFile(playlist[0].path); | 712 playMediaFile(playlist[0].path); |
| 665 } | 713 } |
| 666 } | 714 } |
| 667 } | 715 } |
| 668 }; | 716 } |
| 669 | 717 |
| 670 function togglePlaylist() { | 718 function togglePlaylist() { |
| 671 chrome.send("togglePlaylist", []); | 719 chrome.send("togglePlaylist", []); |
| 672 }; | 720 } |
| 673 | 721 |
| 674 function playMediaFile(url) { | 722 function playMediaFile(url) { |
| 675 if (pathIsVideoFile(url) ) { | 723 if (pathIsVideoFile(url) ) { |
| 676 playVideoFile(url); | 724 playVideoFile(url); |
| 677 } else if(pathIsAudioFile(url)) { | 725 } else if(pathIsAudioFile(url)) { |
| 678 playAudioFile(url); | 726 playAudioFile(url); |
| 679 } else { | 727 } else { |
| 680 alert('file unknown'); | 728 alert('file unknown'); |
| 681 } | 729 } |
| 682 }; | 730 } |
| 683 | 731 |
| 684 </script> | 732 </script> |
| 685 <body onload='load();' onselectstart='return false'> | 733 <body onload='load();' onselectstart='return false'> |
| 686 <div id='glow' class='glow'></div> | 734 <div id='glow' class='glow'></div> |
| 687 <div id='playercontrols' class='playercontrols'> | 735 <div id='playercontrols' class='playercontrols'> |
| 688 </div> | 736 </div> |
| 689 </body> | 737 </body> |
| 690 </html> | 738 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2722006:
Mute when clicked on sound button in ChromeOS media player. (Closed)
Base URL: http://src.chromium.org/git/chromium.git