WP YouTube Lyte - Version 0.7.0

Version Description

  • new feature (as seen on Pitchfork ): embedding YouTube with audio-only (use "httpa://" instead of "httpv://")
  • merged lyte-min.js and lyte-newtube-min.js into one file
  • added wmode=transparant when video is played in flash-mode
Download this release

Release Info

Developer futtta
Plugin Icon 128x128 WP YouTube Lyte
Version 0.7.0
Comparing to
See all releases

Code changes from version 0.6.5 to 0.7.0

Files changed (19) hide show
  1. lyte/controls-160.png +0 -0
  2. lyte/controls-180.png +0 -0
  3. lyte/controls-425.png +0 -0
  4. lyte/controls-480.png +0 -0
  5. lyte/controls-560.png +0 -0
  6. lyte/controls-640.png +0 -0
  7. lyte/controls-newtube-160.png +0 -0
  8. lyte/controls-newtube-180.png +0 -0
  9. lyte/controls-newtube-425.png +0 -0
  10. lyte/controls-newtube-480.png +0 -0
  11. lyte/controls-newtube-560.png +0 -0
  12. lyte/controls-newtube-640.png +0 -0
  13. lyte/controls-newtube-853.png +0 -0
  14. lyte/lyte-min.js +145 -1
  15. lyte/lyte-newtube-min.js +0 -1
  16. options.php +5 -6
  17. readme.txt +14 -8
  18. widget.php +2 -4
  19. wp-youtube-lyte.php +28 -13
lyte/controls-160.png CHANGED
Binary file
lyte/controls-180.png CHANGED
Binary file
lyte/controls-425.png CHANGED
Binary file
lyte/controls-480.png CHANGED
Binary file
lyte/controls-560.png CHANGED
Binary file
lyte/controls-640.png CHANGED
Binary file
lyte/controls-newtube-160.png CHANGED
Binary file
lyte/controls-newtube-180.png CHANGED
Binary file
lyte/controls-newtube-425.png CHANGED
Binary file
lyte/controls-newtube-480.png CHANGED
Binary file
lyte/controls-newtube-560.png CHANGED
Binary file
lyte/controls-newtube-640.png CHANGED
Binary file
lyte/controls-newtube-853.png CHANGED
Binary file
lyte/lyte-min.js CHANGED
@@ -1 +1,145 @@
1
- var doc=document;var cI='lytecss';if(!doc.getElementById(cI)){var lk=doc.createElement('link');lk.id=cI;lk.rel='stylesheet';lk.type='text/css';lk.href=bU+'lyte.css';doc.getElementsByTagName('head')[0].appendChild(lk);}function lyte(){lytes=getElementsByClassName("lyte","div");for(var i=0;i<lytes.length;i++){lyte_id=lytes[i].id;p=doc.getElementById(lyte_id);p.className+=" lP";pW=p.clientWidth;pH=p.clientHeight;if(p.className.indexOf('widget')==-1){jsonUrl="http://gdata.youtube.com/feeds/api/videos/"+lyte_id+"?fields=id,title&alt=json-in-script&callback=parseMe";loadScript(jsonUrl)}pl=doc.createElement('div');p.appendChild(pl);p.onclick=nolyte;setStyle(p,'width:'+pW+'px;height:'+pH+'px;');pl.id="lyte_"+lyte_id;pl.className="pL";setStyle(pl,'height:'+pH+'px;width:'+pW+'px;background:url("http://img.youtube.com/vi/'+lyte_id+'/0.jpg") no-repeat scroll center -10px rgb(0, 0, 0);background-size:contain;');pl.innerHTML="<img src=\""+bU+"play.png\" alt=\"Click to play this video\" style=\"margin-top:"+((pH/2)-30)+"px;opacity:0.7;\" onmouseover=\"this.style.opacity=1;\" onmouseout=\"this.style.opacity=0.8;\"/><img src=\""+bU+"controls-"+pW+".png\" width=\"100%\" alt=\"\" id=\"ctrl\" style=\"max-width:"+pW+"px;\"/>";}}function nolyte(){this.onclick="";this.innerHTML="<embed src=\"http://www.youtube-nocookie.com/v/"+this.id+"&amp;autoplay=1&amp;rel=0&amp;egm=0&amp;fs=1&amp;iv_load_policy=3&amp;probably_logged_in=false\" type=\"application/x-shockwave-flash\" allowfullscreen=\"true\" id=\"lyte_"+this.id+"\" wmode=\"transparent\" width=\""+this.clientWidth+"\" height=\""+this.clientHeight+"\" allowscriptaccess=\"always\"></embed>"}function parseMe(r){title=r.entry.title.$t;idu=r.entry.id.$t;p=doc.getElementById("lyte_"+idu.substring((idu.length-11)));c=doc.createElement('div');c.className="tC";p.appendChild(c);setStyle(c,"margin:-"+((p.clientHeight/2)+15)+"px 5px;");t=doc.createElement('div');t.className="tT";c.appendChild(t);t.innerHTML=title;}function setStyle(e,s){if(typeof e.setAttribute==="function")e.setAttribute('style',s);else if(typeof e.style.setAttribute==="object")e.style.setAttribute('cssText',s)}function loadScript(url){scr=doc.createElement('script');scr.src=url;scr.type='text/javascript';doc.getElementsByTagName('head')[0].appendChild(scr)}var getElementsByClassName=function(className,tag,elm){if(doc.getElementsByClassName){getElementsByClassName=function(className,tag,elm){elm=elm||doc;var elements=elm.getElementsByClassName(className),nodeName=(tag)?new RegExp("\\b"+tag+"\\b","i"):null,returnElements=[],current;for(var i=0,il=elements.length;i<il;i+=1){current=elements[i];if(!nodeName||nodeName.test(current.nodeName)){returnElements.push(current)}}return returnElements}}else if(doc.evaluate){getElementsByClassName=function(className,tag,elm){tag=tag||"*";elm=elm||doc;var classes=className.split(" "),classesToCheck="",xhtmlNamespace="http://www.w3.org/1999/xhtml",namespaceResolver=(doc.documentElement.namespaceURI===xhtmlNamespace)?xhtmlNamespace:null,returnElements=[],elements,node;for(var j=0,jl=classes.length;j<jl;j+=1){classesToCheck+="[contains(concat(' ', @class, ' '), ' "+classes[j]+" ')]"}try{elements=doc.evaluate(".//"+tag+classesToCheck,elm,namespaceResolver,0,null)}catch(e){elements=doc.evaluate(".//"+tag+classesToCheck,elm,null,0,null)}while((node=elements.iterateNext())){returnElements.push(node)}return returnElements}}else{getElementsByClassName=function(className,tag,elm){tag=tag||"*";elm=elm||doc;var classes=className.split(" "),classesToCheck=[],elements=(tag==="*"&&elm.all)?elm.all:elm.getElementsByTagName(tag),current,returnElements=[],match;for(var k=0,kl=classes.length;k<kl;k+=1){classesToCheck.push(new RegExp("(^|\\s)"+classes[k]+"(\\s|$)"))}for(var l=0,ll=elements.length;l<ll;l+=1){current=elements[l];match=false;for(var m=0,ml=classesToCheck.length;m<ml;m+=1){match=classesToCheck[m].test(current.className);if(!match){break}}if(match){returnElements.push(current)}}return returnElements}}return getElementsByClassName(className,tag,elm)};lyte();
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ var doc = document;
2
+ var cI = 'lytecss';
3
+
4
+ if (!doc.getElementById(cI)) {
5
+ lk = doc.createElement('link');
6
+ lk.id = cI;
7
+ lk.rel = 'stylesheet';
8
+ lk.type = 'text/css';
9
+ lk.href = bU + 'lyte.css';
10
+ doc.getElementsByTagName('head')[0].appendChild(lk);
11
+ }
12
+
13
+ function lyte() {
14
+ lytes = getElementsByClassName("lyte", "div");
15
+ for (var i = 0; i < lytes.length; i++) {
16
+ lyte_id = lytes[i].id;
17
+ p = doc.getElementById(lyte_id);
18
+ p.className += " lP";
19
+ pW = p.clientWidth;
20
+ pH = p.clientHeight;
21
+ if ((p.className.indexOf('widget') === -1) && (p.className.indexOf('audio') === -1)){
22
+ jsonUrl = "http://gdata.youtube.com/feeds/api/videos/" + lyte_id + "?fields=id,title&alt=json-in-script&callback=parseMe";
23
+ loadScript(jsonUrl)
24
+ }
25
+ pl = doc.createElement('div');
26
+ p.appendChild(pl);
27
+ p.onclick = plaYT;
28
+ pl.id = "lyte_" + lyte_id;
29
+ pl.className = "pL";
30
+
31
+ if (p.className.indexOf('audio') === -1){
32
+ setStyle(pl, 'height:' + pH + 'px;width:' + pW + 'px;background:url("http://img.youtube.com/vi/' + lyte_id + '/0.jpg") no-repeat scroll center -10px rgb(0, 0, 0);background-size:contain;');
33
+ pl.innerHTML = "<img src=\"" + bU + "play.png\" alt=\"Click to play this video\" style=\"margin-top:" + ((pH / 2) - 30) + "px;opacity:0.7;\" onmouseover=\"this.style.opacity=1;\" onmouseout=\"this.style.opacity=0.8;\"/><img src=\"" + bU + "controls-" + nT + pW + ".png\" width=\"100%\" id=\"ctrl\" alt=\"\" style=\"max-width:" + pW + "px;\"/>";
34
+ } else {
35
+ setStyle(pl, 'height:' + pH + 'px;width:' + pW);
36
+ pl.innerHTML = "<img src=\"" + bU + "controls-" + nT + pW + ".png\" width=\"100%\" id=\"ctrl\" alt=\"\" style=\"max-width:" + pW + "px;\"/>";
37
+ }
38
+ }
39
+ }
40
+
41
+ function plaYT() {
42
+ this.onclick = "";
43
+ if (nT=="newtube-") {
44
+ this.innerHTML = "<iframe class=\"youtube-player\" type=\"text/html\" width=\"" + this.clientWidth + "\" height=\"" + this.clientHeight + "\" src=\"http://www.youtube.com/embed/" + this.id + "?autoplay=1&amp;rel=0&amp;egm=0&amp;iv_load_policy=3&amp;probably_logged_in=false\" frameborder=\"0\"></iframe>"
45
+ } else {
46
+ this.innerHTML = "<embed src=\"http://www.youtube-nocookie.com/v/" + this.id + "&amp;autoplay=1&amp;rel=0&amp;egm=0&amp;fs=1&amp;iv_load_policy=3&amp;probably_logged_in=false\" type=\"application/x-shockwave-flash\" allowfullscreen=\"true\" id=\"lyte_" + this.id + "\" wmode=\"transparent\" width=\"" + this.clientWidth + "\" height=\"" + this.clientHeight + "\" allowscriptaccess=\"always\"></embed>"
47
+ }
48
+ }
49
+
50
+ function parseMe(r) {
51
+ title = r.entry.title.$t;
52
+ idu = r.entry.id.$t;
53
+ p = doc.getElementById("lyte_" + idu.substring((idu.length - 11)));
54
+ c = doc.createElement('div');
55
+ c.className = "tC";
56
+ p.appendChild(c);
57
+ setStyle(c, "margin:-" + ((p.clientHeight / 2) + 15) + "px 5px;");
58
+ t = doc.createElement('div');
59
+ t.className = "tT";
60
+ c.appendChild(t);
61
+ t.innerHTML = title;
62
+ }
63
+
64
+ function setStyle(e, s) {
65
+ if (typeof e.setAttribute === "function") e.setAttribute('style', s);
66
+ else if (typeof e.style.setAttribute === "object") e.style.setAttribute('cssText', s)
67
+ }
68
+
69
+ function loadScript(url) {
70
+ scr = doc.createElement('script');
71
+ scr.src = url;
72
+ scr.type = 'text/javascript';
73
+ doc.getElementsByTagName('head')[0].appendChild(scr)
74
+ }
75
+
76
+ var getElementsByClassName = function (className, tag, elm) {
77
+ if (doc.getElementsByClassName) {
78
+ getElementsByClassName = function (className, tag, elm) {
79
+ elm = elm || doc;
80
+ var elements = elm.getElementsByClassName(className),
81
+ nodeName = (tag) ? new RegExp("\\b" + tag + "\\b", "i") : null,
82
+ returnElements = [],
83
+ current;
84
+ for (var i = 0, il = elements.length; i < il; i += 1) {
85
+ current = elements[i];
86
+ if (!nodeName || nodeName.test(current.nodeName)) {
87
+ returnElements.push(current)
88
+ }
89
+ }
90
+ return returnElements
91
+ }
92
+ } else if (doc.evaluate) {
93
+ getElementsByClassName = function (className, tag, elm) {
94
+ tag = tag || "*";
95
+ elm = elm || doc;
96
+ var classes = className.split(" "),
97
+ classesToCheck = "",
98
+ xhtmlNamespace = "http://www.w3.org/1999/xhtml",
99
+ namespaceResolver = (doc.documentElement.namespaceURI === xhtmlNamespace) ? xhtmlNamespace : null,
100
+ returnElements = [],
101
+ elements, node;
102
+ for (var j = 0, jl = classes.length; j < jl; j += 1) {
103
+ classesToCheck += "[contains(concat(' ', @class, ' '), ' " + classes[j] + " ')]"
104
+ }
105
+ try {
106
+ elements = doc.evaluate(".//" + tag + classesToCheck, elm, namespaceResolver, 0, null)
107
+ } catch (e) {
108
+ elements = doc.evaluate(".//" + tag + classesToCheck, elm, null, 0, null)
109
+ }
110
+ while ((node = elements.iterateNext())) {
111
+ returnElements.push(node)
112
+ }
113
+ return returnElements
114
+ }
115
+ } else {
116
+ getElementsByClassName = function (className, tag, elm) {
117
+ tag = tag || "*";
118
+ elm = elm || doc;
119
+ var classes = className.split(" "),
120
+ classesToCheck = [],
121
+ elements = (tag === "*" && elm.all) ? elm.all : elm.getElementsByTagName(tag),
122
+ current, returnElements = [],
123
+ match;
124
+ for (var k = 0, kl = classes.length; k < kl; k += 1) {
125
+ classesToCheck.push(new RegExp("(^|\\s)" + classes[k] + "(\\s|$)"))
126
+ }
127
+ for (var l = 0, ll = elements.length; l < ll; l += 1) {
128
+ current = elements[l];
129
+ match = false;
130
+ for (var m = 0, ml = classesToCheck.length; m < ml; m += 1) {
131
+ match = classesToCheck[m].test(current.className);
132
+ if (!match) {
133
+ break
134
+ }
135
+ }
136
+ if (match) {
137
+ returnElements.push(current)
138
+ }
139
+ }
140
+ return returnElements
141
+ }
142
+ }
143
+ return getElementsByClassName(className, tag, elm)
144
+ };
145
+ lyte();
lyte/lyte-newtube-min.js DELETED
@@ -1 +0,0 @@
1
- var doc=document;var cI='lytecss';if(!doc.getElementById(cI)){lk=doc.createElement('link');lk.id=cI;lk.rel='stylesheet';lk.type='text/css';lk.href=bU+'lyte.css';doc.getElementsByTagName('head')[0].appendChild(lk);}function lyte(){lytes=getElementsByClassName("lyte","div");for(var i=0;i<lytes.length;i++){lyte_id=lytes[i].id;p=doc.getElementById(lyte_id);p.className+=" lP";pW=p.clientWidth;pH=p.clientHeight;if(p.className.indexOf('widget')===-1){jsonUrl="http://gdata.youtube.com/feeds/api/videos/"+lyte_id+"?fields=id,title&alt=json-in-script&callback=parseMe";loadScript(jsonUrl)}pl=doc.createElement('div');p.appendChild(pl);p.onclick=nolyte;pl.id="lyte_"+lyte_id;pl.className="pL";setStyle(pl,'height:'+pH+'px;width:'+pW+'px;background:url("http://img.youtube.com/vi/'+lyte_id+'/0.jpg") no-repeat scroll center -10px rgb(0, 0, 0);background-size:contain;');pl.innerHTML="<img src=\""+bU+"play.png\" alt=\"Click to play this video\" style=\"margin-top:"+((pH/2)-30)+"px;opacity:0.7;\" onmouseover=\"this.style.opacity=1;\" onmouseout=\"this.style.opacity=0.8;\"/><img src=\""+bU+"controls-newtube-"+pW+".png\" width=\"100%\" id=\"ctrl\" alt=\"\" style=\"max-width:"+pW+"px;\"/>";}}function nolyte(){this.onclick="";this.innerHTML="<iframe class=\"youtube-player\" type=\"text/html\" width=\""+this.clientWidth+"\" height=\""+this.clientHeight+"\" src=\"http://www.youtube.com/embed/"+this.id+"?autoplay=1&amp;rel=0&amp;egm=0&amp;iv_load_policy=3&amp;probably_logged_in=false\" frameborder=\"0\"></iframe>"}function parseMe(r){title=r.entry.title.$t;idu=r.entry.id.$t;p=doc.getElementById("lyte_"+idu.substring((idu.length-11)));c=doc.createElement('div');c.className="tC";p.appendChild(c);setStyle(c,"margin:-"+((p.clientHeight/2)+15)+"px 5px;");t=doc.createElement('div');t.className="tT";c.appendChild(t);t.innerHTML=title;}function setStyle(e,s){if(typeof e.setAttribute==="function")e.setAttribute('style',s);else if(typeof e.style.setAttribute==="object")e.style.setAttribute('cssText',s)}function loadScript(url){scr=doc.createElement('script');scr.src=url;scr.type='text/javascript';doc.getElementsByTagName('head')[0].appendChild(scr)}var getElementsByClassName=function(className,tag,elm){if(doc.getElementsByClassName){getElementsByClassName=function(className,tag,elm){elm=elm||doc;var elements=elm.getElementsByClassName(className),nodeName=(tag)?new RegExp("\\b"+tag+"\\b","i"):null,returnElements=[],current;for(var i=0,il=elements.length;i<il;i+=1){current=elements[i];if(!nodeName||nodeName.test(current.nodeName)){returnElements.push(current)}}return returnElements}}else if(doc.evaluate){getElementsByClassName=function(className,tag,elm){tag=tag||"*";elm=elm||doc;var classes=className.split(" "),classesToCheck="",xhtmlNamespace="http://www.w3.org/1999/xhtml",namespaceResolver=(doc.documentElement.namespaceURI===xhtmlNamespace)?xhtmlNamespace:null,returnElements=[],elements,node;for(var j=0,jl=classes.length;j<jl;j+=1){classesToCheck+="[contains(concat(' ', @class, ' '), ' "+classes[j]+" ')]"}try{elements=doc.evaluate(".//"+tag+classesToCheck,elm,namespaceResolver,0,null)}catch(e){elements=doc.evaluate(".//"+tag+classesToCheck,elm,null,0,null)}while((node=elements.iterateNext())){returnElements.push(node)}return returnElements}}else{getElementsByClassName=function(className,tag,elm){tag=tag||"*";elm=elm||doc;var classes=className.split(" "),classesToCheck=[],elements=(tag==="*"&&elm.all)?elm.all:elm.getElementsByTagName(tag),current,returnElements=[],match;for(var k=0,kl=classes.length;k<kl;k+=1){classesToCheck.push(new RegExp("(^|\\s)"+classes[k]+"(\\s|$)"))}for(var l=0,ll=elements.length;l<ll;l+=1){current=elements[l];match=false;for(var m=0,ml=classesToCheck.length;m<ml;m+=1){match=classesToCheck[m].test(current.className);if(!match){break}}if(match){returnElements.push(current)}}return returnElements}} return getElementsByClassName(className,tag,elm)};lyte();
 
options.php CHANGED
@@ -33,9 +33,8 @@ function lyte_settings_page() {
33
  <div class="wrap">
34
  <h2>WP YouTube Lyte Settings</h2>
35
  <div style="float:left;width:70%;">
36
- <p>WP-YouTube-Lyte inserts "Lite YouTube Embeds" in your blog. These look and feel like normal embedded YouTube, but don't use Flash unless clicked on, thereby <a href="http://blog.futtta.be/2010/08/30/the-state-of-wp-youtube-lyte/" target="_blank">reducing download size & rendering time substantially</a>. The HTML5-option even allows for entirely Flash-less YouTube embeds, using H264 or WebM to play the video in compatible browsers. You can find more info on the <a href="http://wordpress.org/extend/plugins/wp-youtube-lyte/" target="_blank">wordpress.org WP-YouTube-Lyte page</a>.</p>
37
- <p>You can place video in your posts and pages by adding one or more http<strong>v</strong> YouTube-links to your post. These will automatically be replaced by WP-YouTube-Lyte with the correct (flash-less) code. Just replace the "http://" in the link with "httpv://", like this:
38
- <blockquote>http<strong>v</strong>://www.youtube.com/watch?v=QQPSMRQnNlU</blockquote></p>
39
  <p>You can modify WP-YouTube-Lyte's behaviour by changing the following settings:</p>
40
  <form method="post" action="options.php">
41
  <?php settings_fields( 'lyte-settings-group' ); ?>
@@ -44,15 +43,15 @@ function lyte_settings_page() {
44
  <th scope="row">Play video using Flash or HTML5-video?</th>
45
  <td>
46
  <fieldset><legend class="screen-reader-text"><span>Use Flash or HTML5 video?</span></legend>
47
- <label title="embed HTML5 video (highly experimental)"><input type="radio" name="newTube" value="1" <?php if (get_option('newTube')==="1") echo "checked" ?> /> Embed HTML5 video (experimental, uses <a href="http://apiblog.youtube.com/2010/07/new-way-to-embed-youtube-videos.html" target="_blank">the brand new YouTube embed-code</a>)</label><br />
48
- <label title="normal YouTube embeds with Flash video"><input type="radio" name="newTube" value="0" <?php if (get_option('newTube')!=="1") echo "checked" ?> /> Normal YouTube embeds with Flash video.</label><br />
49
  </fieldset>
50
  </td>
51
  </tr>
52
  <tr valign="top">
53
  <th scope="row">Player size:</th>
54
  <td>
55
- <fieldset><legend class="screen-reader-text"><span>Player size</span></legend>
56
  <?php require 'player_sizes.inc.php';
57
  $i=0;
58
  if (is_bool(get_option('size'))) { $sel = (int) $pDefault; } else { $sel= (int) get_option('size'); }
33
  <div class="wrap">
34
  <h2>WP YouTube Lyte Settings</h2>
35
  <div style="float:left;width:70%;">
36
+ <p>WP YouTube Lyte inserts "Lite YouTube Embeds" in your blog. These look and feel like normal embedded YouTube, but don't use Flash unless clicked on, thereby <a href="http://blog.futtta.be/2010/08/30/the-state-of-wp-youtube-lyte/" target="_blank">reducing download size & rendering time substantially</a>. When a video is played, WP-YouTube-Lyte can either activate <a href="http://apiblog.youtube.com/2010/07/new-way-to-embed-youtube-videos.html" target="_blank">YouTube's embedded html5-player</a> or the older Flash-version, depending on the settings below.</p>
37
+ <p>You can place video and audio in your posts and pages by adding one or more http<strong>v</strong> or http<strong>a</strong> YouTube-links to your post. These will automatically be replaced by WP YouTube Lyte with the correct (flash-less) code. To add a video for example, you type a URL like <em>http<strong>v</strong>://www.youtube.com/watch?v=QQPSMRQnNlU</em>. If you want an audio-only player, you enter <em>http<strong>a</strong>://www.youtube.com/watch?v=BIQIGR-kWtc</em>. There's more info on the <a href="http://wordpress.org/extend/plugins/wp-youtube-lyte/faq/" target="_blank">wordpress.org WP YouTube Lyte FAQ page</a>.</p>
 
38
  <p>You can modify WP-YouTube-Lyte's behaviour by changing the following settings:</p>
39
  <form method="post" action="options.php">
40
  <?php settings_fields( 'lyte-settings-group' ); ?>
43
  <th scope="row">Play video using Flash or HTML5-video?</th>
44
  <td>
45
  <fieldset><legend class="screen-reader-text"><span>Use Flash or HTML5 video?</span></legend>
46
+ <label title="embed HTML5 video"><input type="radio" name="newTube" value="1" <?php if (get_option('newTube')==="1") echo "checked" ?> /> Embed HTML5 video (uses <a href="http://apiblog.youtube.com/2010/07/new-way-to-embed-youtube-videos.html" target="_blank">the new YouTube embed-code</a>)</label><br />
47
+ <label title="normal YouTube embeds with Flash video"><input type="radio" name="newTube" value="0" <?php if (get_option('newTube')!=="1") echo "checked" ?> /> Old-style YouTube embeds with Flash video.</label><br />
48
  </fieldset>
49
  </td>
50
  </tr>
51
  <tr valign="top">
52
  <th scope="row">Player size:</th>
53
  <td>
54
+ <fieldset><legend class="screen-reader-text"><span>Player size</span></legend>
55
  <?php require 'player_sizes.inc.php';
56
  $i=0;
57
  if (is_bool(get_option('size'))) { $sel = (int) $pDefault; } else { $sel= (int) get_option('size'); }
readme.txt CHANGED
@@ -1,19 +1,15 @@
1
  === Plugin Name ===
2
  Contributors: futtta
3
- Tags: youtube, video, lyte, lite youtube embeds, html5 video, html5, widget
4
  Requires at least: 2.9
5
- Tested up to: 3.1
6
- Stable tag: 0.6.5
7
 
8
  "Lite YouTube Embeds" look like normal YouTube embeds but don't use Flash, thus reducing download size & page rendering time.
9
 
10
  == Description ==
11
 
12
- WP-YouTube-Lyte inserts "Lite YouTube Embeds" in your blog. These look and feel like normal embedded YouTube, but don't use Flash unless clicked on, thereby [reducing download size & rendering time substantially](http://blog.futtta.be/2010/08/30/the-state-of-wp-youtube-lyte/). Just add a YouTube-link with "httpv" instead of "http" and WP-YouTube-Lyte will replace that link with the correct (flash-less) code.
13
-
14
- WP-YouTube-Lyte implements [LYTE](http://blog.futtta.be/2010/04/23/high-performance-youtube-embeds/ "High Performance YouTube embeds"), which is a small javascript-library that creates a "dummy" YouTube-player which includes the clip thumbnail and title. When clicked on, the dummy player is seamlessly replaced by the actual video player.
15
-
16
- Experimental support for embedding html5 YouTube video is available (implementing [YouTube's new embed code](http://apiblog.youtube.com/2010/07/new-way-to-embed-youtube-videos.html)), meaning WP-YouTube-Lyte allows for an entirely flash-less YouTube experience on your blog, displaying YouTube's HTML5 video in h264 or the new WebM-codec.
17
 
18
  WP-Youtube-lyte can be used together with [Smart Youtube](http://wordpress.org/extend/plugins/smart-youtube/ "Great plugin"). In that case WP-Youtube-lyte will take care of the default embeds (httpv), while Smart Youtube continues to parse other types (httpvh, httpvhd, httpvp, ...).
19
 
@@ -38,6 +34,11 @@ HTML5 video will not be visible for everyone (see requirements), some visitors w
38
  = Does WP YouTube Lyte protect my visitor's privacy? =
39
  As opposed to some of the [most important](http://blog.futtta.be/2010/12/15/wordpress-com-stats-trojan-horse-for-quantcast-tracking/) [plugins](http://blog.futtta.be/2010/01/22/add-to-any-removed-from-here/) there is no 3rd party tracking code in WP YouTube Lyte.
40
 
 
 
 
 
 
41
  = Any bugs/ issues should I know about? =
42
  * The new YouTube HTML5-embed-code is a work in progress, positioning of video isn't always perfect when fallback Flash-version is used.
43
  * If you're using the HTML5-version and you have a WP-YouTube-Lyte widget in your sidebar, you'll notice how the controls at the bottom overlap. This is because YouTube's new embed code doesn't scale down to small sizes too great. The normal (Flash-based) player omits most controls in this case, I would expect the HTML5-version to do this as well in a not to distant future.
@@ -53,6 +54,11 @@ As opposed to some of the [most important](http://blog.futtta.be/2010/12/15/word
53
  * [Rate my plugin on wordpress.org](http://wordpress.org/extend/plugins/wp-youtube-lyte/), even if you think it stinks ;-)
54
 
55
  == Changelog ==
 
 
 
 
 
56
  = 0.6.5 =
57
  * updated images for html5-version to new look&feel
58
  * disabled "watch later" by adding variable "probably_logged_in=false" to youtube embed
1
  === Plugin Name ===
2
  Contributors: futtta
3
+ Tags: youtube, video, lyte, lite youtube embeds, html5 video, html5, widget, youtube audio, audio
4
  Requires at least: 2.9
5
+ Tested up to: 3.1.1
6
+ Stable tag: 0.7.0
7
 
8
  "Lite YouTube Embeds" look like normal YouTube embeds but don't use Flash, thus reducing download size & page rendering time.
9
 
10
  == Description ==
11
 
12
+ WP-YouTube-Lyte inserts "Lite YouTube Embeds" in your blog. These look and feel like normal embedded YouTube, but don't use Flash, thereby [reducing download size & rendering time substantially](http://blog.futtta.be/2010/08/30/the-state-of-wp-youtube-lyte/). Just add a YouTube-link with "httpv" (or "httpa" if you only want the audio) instead of "http" and WP-YouTube-Lyte will replace that link with the correct (flash-less) code. When a video is played, WP-YouTube-Lyte can activate [YouTube's embedded html5-player](http://apiblog.youtube.com/2010/07/new-way-to-embed-youtube-videos.html) or the older Flash-version.
 
 
 
 
13
 
14
  WP-Youtube-lyte can be used together with [Smart Youtube](http://wordpress.org/extend/plugins/smart-youtube/ "Great plugin"). In that case WP-Youtube-lyte will take care of the default embeds (httpv), while Smart Youtube continues to parse other types (httpvh, httpvhd, httpvp, ...).
15
 
34
  = Does WP YouTube Lyte protect my visitor's privacy? =
35
  As opposed to some of the [most important](http://blog.futtta.be/2010/12/15/wordpress-com-stats-trojan-horse-for-quantcast-tracking/) [plugins](http://blog.futtta.be/2010/01/22/add-to-any-removed-from-here/) there is no 3rd party tracking code in WP YouTube Lyte.
36
 
37
+ = Can I use WP YouTube Lyte for a custom field? =
38
+ As tested and confirmed by [rumultik.ru's Dimitri](http://rumultik.ru) (thanks for that man!), this indeed does work. Just pass the httpv url of such a field to lyte_parse like this:
39
+ `if(function_exists('lyte_parse')) { echo lyte_parse($video); }`
40
+ and you're good to go!
41
+
42
  = Any bugs/ issues should I know about? =
43
  * The new YouTube HTML5-embed-code is a work in progress, positioning of video isn't always perfect when fallback Flash-version is used.
44
  * If you're using the HTML5-version and you have a WP-YouTube-Lyte widget in your sidebar, you'll notice how the controls at the bottom overlap. This is because YouTube's new embed code doesn't scale down to small sizes too great. The normal (Flash-based) player omits most controls in this case, I would expect the HTML5-version to do this as well in a not to distant future.
54
  * [Rate my plugin on wordpress.org](http://wordpress.org/extend/plugins/wp-youtube-lyte/), even if you think it stinks ;-)
55
 
56
  == Changelog ==
57
+ = 0.7.0 =
58
+ * new feature (as seen [on Pitchfork](http://pitchfork.com/ "great site for music lovers") ): embedding YouTube with audio-only (use "httpa://" instead of "httpv://")
59
+ * merged lyte-min.js and lyte-newtube-min.js into one file
60
+ * added wmode=transparant when video is played in flash-mode
61
+
62
  = 0.6.5 =
63
  * updated images for html5-version to new look&feel
64
  * disabled "watch later" by adding variable "probably_logged_in=false" to youtube embed
widget.php CHANGED
@@ -24,15 +24,13 @@ class WYLWidget extends WP_Widget {
24
  $lyteSettings[0]=$wp_lyte_plugin_url."lyte/";
25
 
26
  if (get_option('newTube')==="1") {
27
- $lyteSettings[1]="lyte-newtube-min.js";
28
- } else {
29
- $lyteSettings[1]="lyte-min.js";
30
  }
31
  ?>
32
  <?php echo $before_widget; ?>
33
  <?php if ( $WYLtitle ) echo $before_title . $WYLtitle . $after_title; ?>
34
  <div class="lyte widget" id="<?php echo $WYLid; ?>" style="width:<?php echo $wSize[$WYLsize]['w']; ?>px;height:<?php echo $wSize[$WYLsize]['h']; ?>px;"><noscript><a href="http://youtu.be/<?php echo $WYLid;?>"><img src="http://img.youtube.com/vi/<?php echo $WYLid; ?>/default.jpg"></a></noscript><script type="text/javascript"><!--
35
- var bU='<?php echo $lyteSettings[0];?>';var d=document;if(d.addEventListener){d.addEventListener('DOMContentLoaded', insert, false)}else{window.onload=insert} function insert(){if(!d.getElementById('lytescr')){lytescr=d.createElement('script');lytescr.async=true;lytescr.id='lytescr';lytescr.src='<?php echo $lyteSettings[0].$lyteSettings[1];?>';h=d.getElementsByTagName('script')[0];h.parentNode.insertBefore(lytescr, h)}};
36
  --></script></div>
37
  <div><?php echo $WYLtext ?></div>
38
  <?php echo $after_widget; ?>
24
  $lyteSettings[0]=$wp_lyte_plugin_url."lyte/";
25
 
26
  if (get_option('newTube')==="1") {
27
+ $lyteSettings[1]="newtube-";
 
 
28
  }
29
  ?>
30
  <?php echo $before_widget; ?>
31
  <?php if ( $WYLtitle ) echo $before_title . $WYLtitle . $after_title; ?>
32
  <div class="lyte widget" id="<?php echo $WYLid; ?>" style="width:<?php echo $wSize[$WYLsize]['w']; ?>px;height:<?php echo $wSize[$WYLsize]['h']; ?>px;"><noscript><a href="http://youtu.be/<?php echo $WYLid;?>"><img src="http://img.youtube.com/vi/<?php echo $WYLid; ?>/default.jpg"></a></noscript><script type="text/javascript"><!--
33
+ var bU='<?php echo $lyteSettings[0];?>';var nT='<?php echo $lyteSettings[1];?>';var d=document;if(d.addEventListener){d.addEventListener('DOMContentLoaded', insert, false)}else{window.onload=insert} function insert(){if(!d.getElementById('lytescr')){lytescr=d.createElement('script');lytescr.async=true;lytescr.id='lytescr';lytescr.src='<?php echo $lyteSettings[0]."lyte-min.js";?>';h=d.getElementsByTagName('script')[0];h.parentNode.insertBefore(lytescr, h)}};
34
  --></script></div>
35
  <div><?php echo $WYLtext ?></div>
36
  <?php echo $after_widget; ?>
wp-youtube-lyte.php CHANGED
@@ -2,9 +2,9 @@
2
  /*
3
  Plugin Name: WP YouTube Lyte
4
  Plugin URI: http://blog.futtta.be/tag/lyte
5
- Description: WordPress Lite YouTube Embeds (with optional HTML5 video) in posts.
6
  Author: Frank Goossens (futtta)
7
- Version: 0.6.5
8
  Author URI: http://blog.futtta.be/
9
  */
10
 
@@ -14,45 +14,60 @@ require_once(dirname(__FILE__).'/widget.php');
14
 
15
  $wp_lyte_plugin_url = defined('WP_PLUGIN_URL') ? trailingslashit(WP_PLUGIN_URL . '/' . dirname(plugin_basename(__FILE__))) : trailingslashit(get_bloginfo('wpurl')) . PLUGINDIR . '/' . dirname(plugin_basename(__FILE__));
16
 
 
 
 
17
  $lyteSettings[0]=$wp_lyte_plugin_url."lyte/";
18
 
19
  if (get_option('newTube')==="1") {
20
- $lyteSettings[1]="lyte-newtube-min.js";
21
- } else {
22
- $lyteSettings[1]="lyte-min.js";
23
  }
24
 
25
  $oSize = (int) get_option('size');
26
  if ((is_bool($oSize)) || ($pSize[$oSize]['a']===false)) { $sel = (int) $pDefault; } else { $sel= $oSize; }
 
27
  $lyteSettings[2]=$pSize[$sel]['w'];
28
  $lyteSettings[3]=$pSize[$sel]['h'];
29
-
30
  $lyteSettings[4]=get_option('show_links');
31
 
32
  function lyte_parse($the_content) {
33
  global $lyteSettings;
34
- if(strpos($the_content, "httpv")!==FALSE ) {
35
  $char_codes = array('&#215;','&#8211;');
36
  $replacements = array("x", "--");
37
  $the_content=str_replace($char_codes, $replacements, $the_content);
38
 
39
- preg_match_all("/httpv:\/\/([a-zA-Z0-9\-\_]+\.|)youtube\.com\/watch(\?v\=|\/v\/)([a-zA-Z0-9\-\_]{11})([^<\s]*)/", $the_content, $matches, PREG_SET_ORDER);
 
40
  foreach($matches as $match) {
 
 
 
 
 
 
 
 
 
 
 
 
41
  switch ($lyteSettings[4]) {
42
  case "0":
43
- $noscript_post="<br />Watch on YouTube";
44
  $lytelinks_txt="";
45
  break;
46
  case "2":
47
  $noscript_post="";
48
- $lytelinks_txt="<div class=\"lL\">Watch this video <a href=\"http://youtu.be/".$match[3]."\">on YouTube</a> or on <a href=\"http://icant.co.uk/easy-youtube/?http://www.youtube.com/watch?v=".$match[3]."\">Easy Youtube</a>.</div>";
49
  break;
50
  default:
51
  $noscript_post="";
52
- $lytelinks_txt="<div class=\"lL\">Watch this video <a href=\"http://youtu.be/".$match[3]."\">on YouTube</a>.</div>";
53
  }
54
- $lytetemplate = "<div class=\"lyte\" id=\"".$match[3]."\" style=\"width:".$lyteSettings[2]."px;height:".$lyteSettings[3]."px;\"><noscript><a href=\"http://youtu.be/".$match[3]."\"><img src=\"http://img.youtube.com/vi/".$match[3]."/0.jpg\">".$noscript_post."</a></noscript><script type=\"text/javascript\"><!-- \n var bU='".$lyteSettings[0]."';var d=document;if(d.addEventListener){d.addEventListener('DOMContentLoaded', insert, false)}else{window.onload=insert} function insert(){if(!d.getElementById('lytescr')){lytescr=d.createElement('script');lytescr.async=true;lytescr.id='lytescr';lytescr.src='".$lyteSettings[0].$lyteSettings[1]."';h=d.getElementsByTagName('script')[0];h.parentNode.insertBefore(lytescr, h)}}; \n --></script></div>".$lytelinks_txt;
55
- $the_content = preg_replace("/httpv:\/\/([a-zA-Z0-9\-\_]+\.|)youtube\.com\/watch(\?v\=|\/v\/)([a-zA-Z0-9\-\_]{11})([^\s<]*)/", $lytetemplate, $the_content, 1);
 
56
  }
57
  }
58
  return $the_content;
2
  /*
3
  Plugin Name: WP YouTube Lyte
4
  Plugin URI: http://blog.futtta.be/tag/lyte
5
+ Description: Lite and accessible YouTube audio and video embedding.
6
  Author: Frank Goossens (futtta)
7
+ Version: 0.7.0
8
  Author URI: http://blog.futtta.be/
9
  */
10
 
14
 
15
  $wp_lyte_plugin_url = defined('WP_PLUGIN_URL') ? trailingslashit(WP_PLUGIN_URL . '/' . dirname(plugin_basename(__FILE__))) : trailingslashit(get_bloginfo('wpurl')) . PLUGINDIR . '/' . dirname(plugin_basename(__FILE__));
16
 
17
+ $plugin_dir = basename(dirname(__FILE__));
18
+ load_plugin_textdomain( 'wp-youtube-lyte', null, $plugin_dir );
19
+
20
  $lyteSettings[0]=$wp_lyte_plugin_url."lyte/";
21
 
22
  if (get_option('newTube')==="1") {
23
+ $lyteSettings[1]="newtube-";
 
 
24
  }
25
 
26
  $oSize = (int) get_option('size');
27
  if ((is_bool($oSize)) || ($pSize[$oSize]['a']===false)) { $sel = (int) $pDefault; } else { $sel= $oSize; }
28
+
29
  $lyteSettings[2]=$pSize[$sel]['w'];
30
  $lyteSettings[3]=$pSize[$sel]['h'];
 
31
  $lyteSettings[4]=get_option('show_links');
32
 
33
  function lyte_parse($the_content) {
34
  global $lyteSettings;
35
+ if((strpos($the_content, "httpv")!==FALSE)||(strpos($the_content, "httpa")!==FALSE)) {
36
  $char_codes = array('&#215;','&#8211;');
37
  $replacements = array("x", "--");
38
  $the_content=str_replace($char_codes, $replacements, $the_content);
39
 
40
+ preg_match_all("/http(a|v):\/\/([a-zA-Z0-9\-\_]+\.|)youtube\.com\/watch(\?v\=|\/v\/)([a-zA-Z0-9\-\_]{11})([^<\s]*)/", $the_content, $matches, PREG_SET_ORDER);
41
+
42
  foreach($matches as $match) {
43
+ if ($match[1]!=="a") {
44
+ $divHeight=$lyteSettings[3];
45
+ $audioClass="";
46
+ } else {
47
+ $audioClass=" audio";
48
+ if ($lyteSettings[1]=="newtube-"){
49
+ $divHeight=27;
50
+ } else {
51
+ $divHeight=25;
52
+ }
53
+ }
54
+
55
  switch ($lyteSettings[4]) {
56
  case "0":
57
+ $noscript_post="<br />".__("Watch on YouTube","wp-youtube-lyte");
58
  $lytelinks_txt="";
59
  break;
60
  case "2":
61
  $noscript_post="";
62
+ $lytelinks_txt="<div class=\"lL\">".__("Watch this video ","wp-youtube-lyte")."<a href=\"http://youtu.be/".$match[4]."\">".__("on YouTube","wp-youtube-lyte")."</a>".__(" or on ","wp-youtube-lyte")."<a href=\"http://icant.co.uk/easy-youtube/?http://www.youtube.com/watch?v=".$match[4]."\">Easy Youtube</a>.</div>";
63
  break;
64
  default:
65
  $noscript_post="";
66
+ $lytelinks_txt="<div class=\"lL\">".__("Watch this video ","wp-youtube-lyte")."<a href=\"http://youtu.be/".$match[4]."\">".__("on YouTube","wp-youtube-lyte")."</a>.</div>";
67
  }
68
+
69
+ $lytetemplate = "<div class=\"lyte".$audioClass."\" id=\"".$match[4]."\" style=\"width:".$lyteSettings[2]."px;height:".$divHeight."px;\"><noscript><a href=\"http://youtu.be/".$match[4]."\"><img src=\"http://img.youtube.com/vi/".$match[4]."/0.jpg\">".$noscript_post."</a></noscript><script type=\"text/javascript\"><!-- \n var nT='".$lyteSettings[1]."';var bU='".$lyteSettings[0]."';var d=document;if(d.addEventListener){d.addEventListener('DOMContentLoaded', insert, false)}else{window.onload=insert} function insert(){if(!d.getElementById('lytescr')){lytescr=d.createElement('script');lytescr.async=true;lytescr.id='lytescr';lytescr.src='".$lyteSettings[0]."lyte-min.js';h=d.getElementsByTagName('script')[0];h.parentNode.insertBefore(lytescr, h)}}; \n --></script></div>".$lytelinks_txt;
70
+ $the_content = preg_replace("/http(v|a):\/\/([a-zA-Z0-9\-\_]+\.|)youtube\.com\/watch(\?v\=|\/v\/)([a-zA-Z0-9\-\_]{11})([^\s<]*)/", $lytetemplate, $the_content, 1);
71
  }
72
  }
73
  return $the_content;