YVL: YouTube Video Looper

.in_wrap,.i_wrap{display:none;}YVL implements JavaScript.
Please enable it to use this super awesome tool.

[embiggen]

YouTube now has "loop" function on each video by right clicking the video and click "loop". Very looped sentence.

How to Use [#][x]

Go to YouTube, and find the video you really like. Copy the url (from address bar or from share bar) then paste it on the tool above. If it's a valid YouTube video (i.e. not a private video and embedding-allowed and, of course, the url is correct), the poster image will be shown and the buttons will be enabled.
But sometimes, the poster from the video can be shown but the video itself can't be embedded.
If that happens, remove it from the tool then pick another video.
There are plenty other neat videos on YouTube.
Click "Loop it!" to start the loops. You can open another tab(s) on your browser and keep listening to your music/comedy/your-hobby-stuffs/ambient-sound infinitely.
While looping, the input text cannot be changed.

Also, while looping, keep your internet connection connected, because YouTube player continuously checks things (small requests/responses of the video statistics, not the whole media). The embed API doesn't cover that part.
To change the volume, slide the slider on the volume box, or use the YouTube player volume.
To pause, hit "Pause". Or hit the pause button on the YouTube player.
To resume, hit the "Play" button. Or hit the play button on the YouTube player.
To stop, clear the input url (re-enable it), and remove the video, hit "Remove".
No url data is stored here.
Added Sep 21, 2015 NEW MONITOR!
There's a new monitor to indicate the buffered percentage of the media.
Added Sep 20, 2015 NEW BUTTONS!
The buttons with "640", "853", and "1280" will resize the player to that width, respectively, not the resolution. The available resolution can be seen and set from the YouTube player.
The full screen mode can be set from YouTube player.
Use "embiggen" link to watch the video in clutter-free zone.
Added Sep 18, 2015 NEW BUTTON and MONITORS and THING!
- The new textarea can be used to temporarily store the video urls if you wanna watch more than 1 video.
  Copy-paste the url you pasted earlier into the textarea before you remove it from the input box. So that you can re-loop the video later.
- The "Go 853!" has been switched to the above update.
  The "Go 853!" will resize the player into 853 x 480. The "Normal" size is 640 x 360. It works only for larger area. For area smaller than 853 or 640, the player will be follow the parent container width.
  Use the "embiggen" link below YVL to make use of this new button.
  
  If you use the "Go 853!" on this page static layout, you'll get 4:3 aspect ratio of the video.
  
  To make it full screen, use the button on YouTube player.
- The two monitors are to show the playback resolution and speed, respectively, from the left (or top).
- Also, this has more stages of responsivity. Plus the color of the loop-area-marker buttons are monotone-ed.
Added Sep 16, 2015 NEW BUTTONS!
- They are for looping certain part of the video.
  It's recommended to buffer the entire video first.
  But then again, if it's a very long one, you can first seek to a certain part (the start point), mark that, then wait until the other part (end point) has been buffered and mark that part. You'll be playing that loop region infinitely.
  Recommended browser to do this task: any latest browser that supports HTML5 multimedia API.
  If the "End Point" isn't the actual video's end point, the remaining data will still be fetched. But the video playback is scoped to that loop region only.
  With this loop region feature, you can learn a particular part from a tutorial over and over. Or something else you'd find "enthralling".
  To slow down/speed up the video, you can use the custom play speed on the YouTube player.
  
  Note: "End Point" must be larger than "Start Point".
- To full reset the loop region, hit again both buttons. To half reset, hit either button.
  Clear the "End Point" before hitting the "Start Point" to avoid the loop from the beginning.
- The "Replay!" button will start the loop from the beginning of the looping area.
  If there's no looping area, then the video will start from 0 (the default beginning of the video).
Added Sep 15, 2015
- Updates
  Updated the handler for unavailable video error response.
  
  Removed the "auto-100%-volume" feature on play/rewind (after pause/end). YVL will follow the last setting you put (for one video).
- To rewind the video, hit "Replay!" button.
If there's another unknown error on the YouTube player, simply hit "Remove" button. No need to reload this page.
If YVL cannot load, or in the middle of something there's weird behavior on it, do reload this page.

Methods [#][x]

Other [#][x]

YVL is designed to do a "single" request for the video, then loop the cached-media. But if you arm the loop area then disarm the feature (certain part buffering), the normal loop will get the remaining data until it's done (referencing the first load, not the seeking load).
Other small XHR requests/responses aren't (can't be) cached. They're YouTube's interaction-features to keep track of things.
But most are using long expiration-age. Thus, most will run from your browser's cache.

One more, about the loop region, if you created a loop region, then seek to after/before the loop range, the loop range wouldn't be reset. You need to manually full/half reset it.
The built-in player control can be used normally.
The counter for how many times the video is looped is incremented after the video has actually ended. It doesn't get triggered for certain-region-looping.
This tool was tested and tinkered on latest Chrome and Firefox.
YVL should work on any other latest browser, such as Opera, Yandex browser, IE10 or Edge, Comodo, Maxthon, and others.
The autoplay initialization feature only works on desktop (the one which is actually on a desk or not, like on your lap, laptop) and tablet (which uses non-mobile browser).

On mobile device, the FIRST autoplay load (for the HTML5 video) feature won't work. It needs to be a manual interaction (tap). But after the video is started, played, and buffered, the looping (standard or with certain looping-region) feature will run (tested on Chrome-Android).
The "auto stop" will occur if you play a video which has less than ~10 seconds of length. And/or your internet connection isn't stable, which triggered the automagicresolutionamatron. This built-in feature will request another suitable media (smaller/bigger size) from YouTube server. So make sure you're streaming at pretty much "empty traffic" of your own time zone.
To find out whether a video can be looped or not, pay attention at the "buffered" monitor.
This is better viewed on device which has like, separated keyboard and mouse with screen width larger than 800px. This accommodates mobile and tablet devices, but they're not that sweet compared on desktop. Ya know, with all the pop-up keyboard and that copy-pasting. And the jumping scroll.
Who made this anyway? Get him.
But before we all get our pitchforks and shovels, this one is the 2015-09-21 version, revision 6.

Port Raptor

Monday, September 14, 2015

YVL: YouTube Video Looper