Move feed options from the dropdown and into the modal.

app.rb

@@ -435,7 +435,7 @@
   end
 
   if user
-    redirect Addressable::URI.new(path: "/instagram/#{user["id"] || user["pk"]}/#{user["username"]}", query_values: params.slice(:type)).normalize.to_s
+    redirect Addressable::URI.new(path: "/instagram/#{user["id"] || user["pk"]}/#{user["username"]}").normalize.to_s
   else
     return [404, "Can't find a user with that name. Sorry."]
   end
@@ -731,20 +731,20 @@
     raise(TwitchError, response) if !response.success?
     data = response.json["data"][0]
     return [404, "Can't find a game with that name."] if data.nil?
-    redirect Addressable::URI.new(path: "/twitch/directory/game/#{data["id"]}/#{game_name}", query_values: params.slice(:type)).normalize.to_s
+    redirect Addressable::URI.new(path: "/twitch/directory/game/#{data["id"]}/#{game_name}").normalize.to_s
   elsif vod_id
     response = Twitch.get("/videos", query: { id: vod_id })
     return [response.code, "Video does not exist."] if response.code == 404
     raise(TwitchError, response) if !response.success?
     data = response.json["data"][0]
-    redirect Addressable::URI.new(path: "/twitch/#{data["user_id"]}/#{data["user_name"]}", query_values: params.slice(:type)).normalize.to_s
+    redirect Addressable::URI.new(path: "/twitch/#{data["user_id"]}/#{data["user_name"]}").normalize.to_s
   else
     response = Twitch.get("/users", query: { login: username })
     return [response.code, "The username contains invalid characters."] if response.code == 400
     raise(TwitchError, response) if !response.success?
     data = response.json["data"][0]
     return [404, "Can't find a user with that name. Sorry."] if data.nil?
-    redirect Addressable::URI.new(path: "/twitch/#{data["id"]}/#{data["display_name"]}", query_values: params.slice(:type)).normalize.to_s
+    redirect Addressable::URI.new(path: "/twitch/#{data["id"]}/#{data["display_name"]}").normalize.to_s
   end
 end
 
@@ -1132,7 +1132,7 @@
   if user_id.nil?
     return [404, "This image was probably uploaded anonymously. Sorry."]
   else
-    redirect Addressable::URI.new(path: "/imgur/#{user_id}/#{username}", query_values: params.slice(:type)).normalize.to_s
+    redirect Addressable::URI.new(path: "/imgur/#{user_id}/#{username}").normalize.to_s
   end
 end
 

public/css/main.css

@@ -37,7 +37,10 @@ input[type="submit"] {
 }
 
 .input-group {
-  margin-top: 10px;
+  margin-bottom: 10px;
+}
+.form-group .input-group {
+  margin: 0;
 }
 .form-inline {
   margin-bottom: 15px;

public/js/main.js

@@ -53,11 +53,7 @@ $(document).ready(async function() {
     const q = form.find("input[name=q]").val();
     form.find("[data-download]").each(function() {
       const btn = $(this);
-      const val = btn.attr("data-download");
-      let url = `${form.attr("action")}/download?url=${q}`;
-      if (val) {
-        url += `&type=${val}`;
-      }
+      const url = `${form.attr("action")}/download?url=${q}`;
       btn.attr("href", url);
     });
     form.find("[data-action]").each(function() {
@@ -79,16 +75,14 @@ $(document).ready(async function() {
     });
   });
 
-  $("form[method=get]").submit(async function(event) {
+  $("#services form").submit(async function(event) {
     event.preventDefault();
 
     const form = $(this);
     const action = form.attr("action");
     const qs = form.serialize();
-    form.find("[name=type]").detach();
-
     const submit = form.find('input[type="submit"]');
-    submit.attr("data-original-value", submit.attr("value"));
+    const submit_value = submit.attr("value");
     submit.attr("value", "Working...");
     form.find("input").prop("disabled", true);
 
@@ -97,7 +91,7 @@ $(document).ready(async function() {
         "Accept": "application/json",
       },
     });
-    submit.attr("value", submit.attr("data-original-value"));
+    submit.attr("value", submit_value);
     form.find("input").prop("disabled", false);
     if (!response.ok) {
       alert(await response.text());
@@ -125,24 +119,44 @@ $(document).ready(async function() {
         url = data;
       }
     }
-    $("#feed-url").val(url);
-    $("#feed-modal").modal("show");
-    $("#feed-url").select();
+
+    const feed_modal = $("#feed-modal");
+    const feed_url = $("#feed-url");
+    feed_url.val(url);
+    feed_modal.modal("show", this);
+    feed_url.select();
+
+    return false;
+  });
+
+  $("#feed-modal").on("show.bs.modal", function(event) {
+    const modal = $(this);
+    const form = $(event.relatedTarget);
+    const action = form.attr("action");
+    const url = $("#feed-url").val();
+    console.log(url);
+    modal.find("form").hide();
+    modal.find(`#${action}-options`).show().attr("action", url).trigger("change");
   });
 
   $("#copy-button").click(function() {
     $("#feed-url").select();
     document.execCommand("copy");
   });
 
-  $("[data-submit-type]").click(function() {
-    const form = $(this).parents("form");
-    const val = $(this).attr("data-submit-type");
-    $('<input type="hidden" name="type">').val(val).insertAfter(this);
-    form.submit();
+  $("#feed-modal form").submit(function(event) {
+    event.preventDefault();
+    return false;
   });
-  $(window).bind("pageshow", function() {
-    $("[name=type]").detach(); // remove type inputs which remain when using the back button
+
+  $("#feed-modal form").change(function() {
+    const form = $(this);
+    const qs = $.param(form.serializeArray().filter(input => input.value != ""));
+    let url = form.attr("action");
+    if (qs != "") {
+      url += `?${qs}`;
+    }
+    $("#feed-url").val(url).select();
   });
 
   $("[data-download-filename]").click(async function() {
@@ -159,7 +173,7 @@ $(document).ready(async function() {
       },
     });
     if (!response.ok) {
-      alert(response.text());
+      alert(await response.text());
       return;
     }
     let data = await response.json();
@@ -261,9 +275,11 @@ $(document).ready(async function() {
           return;
         }
         const url = await response.json();
-        $("#feed-url").val(url);
-        $("#feed-modal").modal("show");
-        $("#feed-url").select();
+        const feed_modal = $("#feed-modal");
+        const feed_url = $("#feed-url");
+        feed_url.val(url);
+        feed_modal.modal("show");
+        feed_url.select();
       }
     }
   }