Simple Chrome extension to change the size of the YouTube video to 720p or 1080p. Mostly useful when you run 2560x1600 can watch vids at 1:1 resolution in a window :)

_readme.txt

Example: http://yfrog.com/z/h2jk0bp

1. create a directory
2. put these two files in it and this image http://media.photobucket.com/image/youtube%20icon/librarysupporter/mlxperience/youtube-icon.png
3. open Chrome
4. tools > extensions
6. expand developer mode
7. load unpacked extension...
8. select directory with these two files in it
9. open a video

Took me an hour twenty tweet to tweet

http://twitter.com/SoreGums/statuses/99066608139509760
@SoreGums: you tube needs a "make video 720p" cause then it would be 100%... hmm wonder if I can create an extension to do it, http://bit.ly/346YGu
Thu 04 Aug 20:38 via TweetDeck

http://twitter.com/SoreGums/statuses/99086903634182144
@SoreGums: sweet done it! you tube video resizer for 720p & 1080p via a chrome extension https://gist.github.com/1125029 :)
Thu 04 Aug 21:58 via TweetDeck

manifest.json

{
  "name": "Change the size of YouTube video, use this before changing the size of the video in using the youTube controls",
  "version": "1.0",
  "permissions": [
    "tabs", "http://www.youtube.com/*", "https://www.youtube.com/*"
  ],
  "browser_action": {
      "default_title": "Change YouTube Video Size",
      "default_icon": "youtube-icon.png",
      "popup": "popup.html"
  }
}

popup.html

<style>
body {
  overflow: hidden;
  margin: 0px;
  padding: 0px;
  background: white;
}

div:first-child {
  margin-top: 0px;
}

div {
  cursor: pointer;
  text-align: center;
  padding: 1px 3px;
  font-family: sans-serif;
  font-size: 0.8em;
  width: 60px;
  margin-top: 1px;
  background: #cccccc;
}
div:hover {
  background: #aaaaaa;
}
</style>
<script>
function click(size) {
  var width = size.id == "720p" ? "1280px" : "1920px";
  var height = size.id == "720p" ? "720px" : "1080px";
  chrome.tabs.executeScript(null,
    {code:"document.getElementById('watch-video').style.width = '" + width + "'"}
  );
  chrome.tabs.executeScript(null,
    {code:"document.getElementById('watch-player').style.height = '" + height + "'"}
  );
  chrome.tabs.executeScript(null,
    {code:"document.getElementById('watch-player').style.width = '" + width + "'"}
  );

}
</script>
<div onclick="click(this)" id="720p">720p</div>
<div onclick="click(this)" id="1080p">1080p</div>