Fix autofocus and some animations

php/footer.php

@@ -43,7 +43,7 @@
     </div>
     <div class="footer-copyright">
         <div class="container">
-            &copy; <?php echo date("Y"); ?>
+            &copy; 2014 - <?php echo date("Y"); ?>
             <a href="//nixo.no">Nixo</a> &amp;
             <a href="//kasperrt.no">KasperRT</a>
         </div>

php/nochan.php

@@ -71,7 +71,7 @@ if(isset($_GET['chan'])){
                             required pattern="[a-zA-Z0-9]+"
                             spellcheck="false"
                             maxlength="18"
-                            autofocus
+                            autocomplete
                         />
                         <label for="search">Find or create radio channel</label>
                         <datalist id="searches">
@@ -154,7 +154,7 @@ if(isset($_GET['chan'])){
         </div>
         <div class="footer-copyright">
             <div class="container">
-                &copy; <?php echo date("Y"); ?>
+                &copy; 2014 - <?php echo date("Y"); ?>
                 <a href="//nixo.no">Nixo</a> &amp;
                 <a href="//kasperrt.no">KasperRT</a>
             </div>

static/css/style.css

@@ -109,6 +109,10 @@ display: inline;
     height: 120px;
 }
 
+#chan-card{
+    opacity: 0;
+}
+
 .white-bg{
     background-color:white;
 }

static/js/nochan.js

@@ -49,6 +49,8 @@ function populate_channels(lists)
         if(num>19)break;
     }
     document.getElementById("searches").innerHTML = output;
+    Materialize.showStaggeredList('#channels');
+    $("#search").focus();
 }
 
 String.prototype.capitalizeFirstLetter = function() {
@@ -75,8 +77,6 @@ $(document).ready(function (){
     list_html = $("#channels").html();
     $("#channels").empty();
 
-    $("#search").focus();
-
     var socket = io.connect('http://'+window.location.hostname+':3000');
     var playlists = [];
     socket.emit('frontpage_lists');
@@ -86,8 +86,7 @@ $(document).ready(function (){
     })
 
 
-    Materialize.showStaggeredList('#channels');
-
+    
     var pad = 0;
     document.getElementById("zicon").addEventListener("click", function(){
         pad+=10;
@@ -111,5 +110,6 @@ $(document).ready(function (){
             }
         }
      }
+     
 
 });