Basic RESTful actions for cards.

apps/bwc_web/assets/js/app.js

@@ -12,4 +12,17 @@ import "../css/app.scss"
 //     import {Socket} from "phoenix"
 //     import socket from "./socket"
 //
-import "phoenix_html"
+import "phoenix_html";
+import "jquery";
+import $ from 'jquery';
+window.jQuery = $;
+window.$ = $;
+
+import UIkit from 'uikit';
+import Icons from 'uikit/dist/js/uikit-icons';
+
+// loads the Icon plugin
+UIkit.use(Icons);
+
+
+import "./bwc.js";

apps/bwc_web/assets/js/bwc.js

@@ -0,0 +1,68 @@
+import $ from 'jquery';
+import UIkit from 'uikit';
+window.jQuery = $;
+window.$ = $;
+window.UIkit = UIkit;
+
+window.deleteCard = (id) => {
+    var CSRF_TOKEN = $("input[name=_csrf_token]").val();
+    $.ajax({
+        url: "/api/cards/" + id,
+        method: 'DELETE',
+        beforeSend: function(xhr) {
+            xhr.setRequestHeader("X-CSRF-Token", CSRF_TOKEN);
+        }
+    }).done(function(response) {
+        UIkit.notification(response['data']);
+        $("div#card-" + response['card']).remove();
+    });
+}
+
+window.chooseGiphy = (url) => {
+	$("img.card-picture").attr("src", url);
+	$("input#card_picture").val(url);
+    $(".uk-close").click();
+}
+window.giphySearch = () => {
+    var query = $("#giphySearch").val().trim().replace(/ /g, "+");
+    const api_url = "https://api.giphy.com/v1/gifs/search?api_key=GUHvLYHRcNgPAIKt4PNZcjYw5FBeBX0F&q=" + query + "&limit=25&offset=0&rating=R&lang=en";
+    $.ajax({
+        url: api_url,
+        method: 'GET'
+    }).done(function(response) {
+
+        // This is the API response data. It's a JSON object of 25 gifs
+        console.log(response.data);
+        $("#giphySearchResults").html("");
+        response.data.forEach(function(i) {
+            var giphyURL = i.images.fixed_height.url;
+            $("#giphySearchResults").append(
+                "<a href='javascript:chooseGiphy(" +
+                '"' +
+                giphyURL +
+                '"' +
+                ");'><img class='search-result' src='" + giphyURL + "'/></a>"
+            );
+        });
+
+    });
+};
+
+$("#giphySearch").keyup(function(e) {
+    if (e.keyCode == "13") {
+        giphySearch();
+    }
+});
+
+$("#giphySearchButton").click(function(e) {
+    giphySearch();
+});
+
+
+$('#imageModalContent').on('keyup keypress', function(e) {
+	var keyCode = e.keyCode || e.which;
+	if (keyCode === 13) {
+	    e.preventDefault();
+	    return false;
+	}
+    });