From e8dbb4d750127fb1901551d0bd79e2350a2ea2c3 Mon Sep 17 00:00:00 2001
From: Maksym Pavlenko <pavlenko.maksym@gmail.com>
Date: Sun, 18 Dec 2016 13:43:04 -0800
Subject: [PATCH] Implement switchers

---
 src/Podsync/Views/Home/Index.cshtml |  4 +--
 src/Podsync/wwwroot/js/site.js      | 49 +++++++++++++++++++++++------
 2 files changed, 42 insertions(+), 11 deletions(-)

diff --git a/src/Podsync/Views/Home/Index.cshtml b/src/Podsync/Views/Home/Index.cshtml
index fb8ddbc..609d2e0 100644
--- a/src/Podsync/Views/Home/Index.cshtml
+++ b/src/Podsync/Views/Home/Index.cshtml
@@ -36,8 +36,8 @@
             <p>
                 <i id="control-icon" class="fa fa-question-circle" aria-hidden="true"></i>
                 <span id="control-panel" class="locked">
-                    Selected format <a class="selected-option">video</a> <a>audio</a>,
-                    quality <a class="selected-option">best</a> <a>worst</a>,
+                    Selected format <a class="selected-option" id="video-format">video</a> <a id="audio-format">audio</a>,
+                    quality <a class="selected-option" id="best-quality">best</a> <a id="worst-quality">worst</a>,
                 </span>
                 <span class="locked" style="text-decoration: line-through">
                     <i class="fa fa-question-circle master-tooltip" title="Still under development. We will keep you updated via Patreon's news feed" aria-hidden="true"></i>
diff --git a/src/Podsync/wwwroot/js/site.js b/src/Podsync/wwwroot/js/site.js
index 9974795..a1e853a 100644
--- a/src/Podsync/wwwroot/js/site.js
+++ b/src/Podsync/wwwroot/js/site.js
@@ -74,28 +74,59 @@ $(function () {
         Control panel
     */
 
-    function enableControls(enable) {
-        if (enable) {
+    function lockControls(lock) {
+        if (lock) {
+            $('#control-panel').addClass('locked');
+            $('#control-icon')
+                .removeClass('fa-wrench')
+                .addClass('fa-question-circle master-tooltip')
+                .attr('title', 'This features are available for patrons only (please, login with your Patreon account). You may support us and unlock this features');
+        } else {
             $('#control-panel')
                 .removeClass('locked');
             $('#control-icon')
                 .removeClass('fa-question-circle master-tooltip')
                 .addClass('fa-wrench')
                 .removeAttr('title');
-        } else {
-            $('#control-panel').addClass('locked');
-            $('#control-icon')
-                .removeClass('fa-wrench')
-                .addClass('fa-question-circle master-tooltip')
-                .attr('title', 'This features are available for patrons only (please, login with your Patreon account). You may support us and unlock this features');
         }
     }
 
+    function isLocked() {
+        return $('#control-panel').hasClass('locked');
+    }
+
+    /*
+        Handlers
+    */
+
+    function formatSwith() {
+        if (isLocked()) {
+            return;
+        }
+
+        $('#video-format, #audio-format').toggleClass('selected-option');
+    }
+
+    function qualitySwitch() {
+        if (isLocked()) {
+            return;
+        }
+
+        $('#best-quality, #worst-quality').toggleClass('selected-option');
+    }
+
+    /*
+        Attach handlers
+    */
+
     $('#get-link').click(function(e) {
         var url = $('#url-input').val();
         createFeed({ url: url, quality: 'VideoHigh' }, displayLink);
         e.preventDefault();
     });
 
-    enableControls(true);
+    $('#video-format, #audio-format').click(formatSwith);
+    $('#best-quality, #worst-quality').click(qualitySwitch);
+
+    lockControls(true);
 });
\ No newline at end of file