# HG changeset patch
# User veltr
# Date 1355764776 -3600
# Node ID b7017da5a7b55a7ccbc52c438d46e36190c7ad8c
# Parent  285f51fd248028a10090612ed90d3be29937e59f
Added SD/HD Switching

diff -r 285f51fd2480 -r b7017da5a7b5 integration/content.html
--- a/integration/content.html	Wed Dec 19 16:55:00 2012 +0100
+++ b/integration/content.html	Mon Dec 17 18:19:36 2012 +0100
@@ -26,10 +26,29 @@
                 post_annotation : "testdata/post-test.php",
                 tag_page : "tag.html?tag=__TAG__"
             };
+            if (typeof window.localStorage !== "undefined" && window.localStorage.getItem !== "undefined") {
+                var res = window.localStorage.getItem("resolution") || "SD";
+            } else {
+                var res = "SD";
+            }
+            IriSP.video_url_transform = function(url) {
+                return url.replace(/([SH]D)\.[a-z0-9]+$/,res);
+            }
             $(function() {
                 IriSP.contentplayer({
                     project_url: "http://theend-integ.ftinfo.fr/theend/ldt/cljson/id/" + project
                 });
+                
+                $(".sdhdgroup").addClass(res);
+                
+                $(".sdhdbtn").click(function() {
+                    var newres = $(this).attr("title");
+                    if (res !== newres) {
+                        window.localStorage.setItem("resolution", newres);
+                        document.location.reload();
+                    }
+                    return false;
+                });
             });
         </script>
 
@@ -77,7 +96,11 @@
                 <div class="container_hcentering">
                     <a id="btnInfo" class="btn" href="#" title="info"></a>
 
-                    <a id="btnSDHD" class="btn" href="#" title="SD/HD"></a>
+                    <div class="sdhdgroup">
+                        <a id="btnSD" class="sdhdbtn" href="#" title="SD"></a>
+                        <div class="sdhdbtn sdhdsep"></div>
+                        <a id="btnHD" class="sdhdbtn" href="#" title="HD"></a>
+                    </div>
 
                     <div id="progressContainer" class="floatL">
 
diff -r 285f51fd2480 -r b7017da5a7b5 integration/css/theend.css
--- a/integration/css/theend.css	Wed Dec 19 16:55:00 2012 +0100
+++ b/integration/css/theend.css	Mon Dec 17 18:19:36 2012 +0100
@@ -408,22 +408,50 @@
     color: #ffffff;
 }
 
-.btn {
+.btn, .sdhdbtn {
     background: transparent url(../img/controls.png) no-repeat top left;
     float: left;
+}
+
+.btn, .sdhdgroup {
     margin: 0 16px;
 }
-#btnSDHD {
+
+.sdhdgroup {
+    margin-top: 5px;
+    float: left;
+}
+
+.sdhdbtn {
+    height: 12px;
+}
+
+#btnSD {
+    width: 24px;
+}
+
+.SD #btnSD, .HD #btnSD:hover {
     background-position: 0 0;
-    width: 55px;
-    height: 12px;
-    margin-top: 5px;
 } 
-#btnSDHD:hover {
+.HD #btnSD {
     background-position: 0 -12px;
-    width: 55px;
-    height: 12px;   
-}  
+}
+
+.sdhdsep {
+    background-position: -24px 0; width: 6px;
+}
+
+#btnHD {
+    width: 25px;
+}
+
+.SD #btnHD {
+    background-position: -30px 0;
+} 
+.SD #btnHD:hover, .HD #btnHD {
+    background-position: -30px -12px;
+}
+
 #btnBck {
     background-position: -55px 0;
     width: 16px;
diff -r 285f51fd2480 -r b7017da5a7b5 integration/tag.html
--- a/integration/tag.html	Wed Dec 19 16:55:00 2012 +0100
+++ b/integration/tag.html	Mon Dec 17 18:19:36 2012 +0100
@@ -27,12 +27,32 @@
                 post_annotation : "testdata/post-test.php",
                 tag_page : "niv2_rv.html?tag=__TAG__"
             };
+            if (typeof window.localStorage !== "undefined" && window.localStorage.getItem !== "undefined") {
+                var res = window.localStorage.getItem("resolution") || "SD";
+            } else {
+                var res = "SD";
+            }
+            IriSP.video_url_transform = function(url) {
+                return url.replace(/([SH]D)\.[a-z0-9]+$/,res);
+            }
             $(function() {
                 $("h1").text(tag);
+                
 
                 IriSP.tagplayer({
                     tag : tag
                 });
+                
+                $(".sdhdgroup").addClass(res);
+                
+                $(".sdhdbtn").click(function() {
+                    var newres = $(this).attr("title");
+                    if (res !== newres) {
+                        window.localStorage.setItem("resolution", newres);
+                        document.location.reload();
+                    }
+                    return false;
+                });
             });
         </script>
 
@@ -80,7 +100,11 @@
                 <div class="container_hcentering">
                     <a id="btnInfo" class="btn" href="#" title="info"></a>
 
-                    <a id="btnSDHD" class="btn" href="#" title="SD/HD"></a>
+                    <div class="sdhdgroup">
+                        <a id="btnSD" class="sdhdbtn" href="#" title="SD"></a>
+                        <div class="sdhdbtn sdhdsep"></div>
+                        <a id="btnHD" class="sdhdbtn" href="#" title="HD"></a>
+                    </div>
 
                     <div id="progressContainer" class="floatL">
 
diff -r 285f51fd2480 -r b7017da5a7b5 src/theend/static/theend/css/theend.css
--- a/src/theend/static/theend/css/theend.css	Wed Dec 19 16:55:00 2012 +0100
+++ b/src/theend/static/theend/css/theend.css	Mon Dec 17 18:19:36 2012 +0100
@@ -408,22 +408,50 @@
     color: #ffffff;
 }
 
-.btn {
+.btn, .sdhdbtn {
     background: transparent url(../img/controls.png) no-repeat top left;
     float: left;
+}
+
+.btn, .sdhdgroup {
     margin: 0 16px;
 }
-#btnSDHD {
+
+.sdhdgroup {
+    margin-top: 5px;
+    float: left;
+}
+
+.sdhdbtn {
+    height: 12px;
+}
+
+#btnSD {
+    width: 24px;
+}
+
+.SD #btnSD, .HD #btnSD:hover {
     background-position: 0 0;
-    width: 55px;
-    height: 12px;
-    margin-top: 5px;
 } 
-#btnSDHD:hover {
+.HD #btnSD {
     background-position: 0 -12px;
-    width: 55px;
-    height: 12px;   
-}  
+}
+
+.sdhdsep {
+    background-position: -24px 0; width: 6px;
+}
+
+#btnHD {
+    width: 25px;
+}
+
+.SD #btnHD {
+    background-position: -30px 0;
+} 
+.SD #btnHD:hover, .HD #btnHD {
+    background-position: -30px -12px;
+}
+
 #btnBck {
     background-position: -55px 0;
     width: 16px;
diff -r 285f51fd2480 -r b7017da5a7b5 src/theend/templates/theend/tag.html
--- a/src/theend/templates/theend/tag.html	Wed Dec 19 16:55:00 2012 +0100
+++ b/src/theend/templates/theend/tag.html	Mon Dec 17 18:19:36 2012 +0100
@@ -25,6 +25,28 @@
             });
         </script>
     {% endblock %}
+    
+        <script type="text/javascript">
+            if (typeof window.localStorage !== "undefined" && window.localStorage.getItem !== "undefined") {
+                var res = window.localStorage.getItem("resolution") || "SD";
+            } else {
+                var res = "SD";
+            }
+            IriSP.video_url_transform = function(url) {
+                return url.replace(/([SH]D)\.[a-z0-9]+$/,res);
+            }
+            $(function() {
+                $(".sdhdgroup").addClass(res);
+                $(".sdhdbtn").click(function() {
+                    var newres = $(this).attr("title");
+                    if (res !== newres) {
+                        window.localStorage.setItem("resolution", newres);
+                        document.location.reload();
+                    }
+                    return false;
+                });
+            });
+        </script>
 
 {% endblock %}
 
@@ -72,7 +94,11 @@
                 <div class="container_hcentering">
                     <a id="btnInfo" class="btn" href="#" title="info"></a>
 
-                    <a id="btnSDHD" class="btn" href="#" title="SD/HD"></a>
+                    <div class="sdhdgroup">
+                        <a id="btnSD" class="sdhdbtn" href="#" title="SD"></a>
+                        <div class="sdhdbtn sdhdsep"></div>
+                        <a id="btnHD" class="sdhdbtn" href="#" title="HD"></a>
+                    </div>
 
                     <div id="progressContainer" class="floatL">