Basic RESTful actions for cards.
This commit is contained in:
parent
4a31d8a31b
commit
6266b089a5
1
.jsbeautifyrc
Normal file
1
.jsbeautifyrc
Normal file
@ -0,0 +1 @@
|
||||
{"beautify.language": { "html": ["htm","html","html-eex","eex"]}}
|
||||
@ -7,9 +7,11 @@ defmodule Bwc do
|
||||
|
||||
@repo Repo
|
||||
|
||||
@doc """
|
||||
List all cards.
|
||||
"""
|
||||
|
||||
def get_title do
|
||||
|
||||
end
|
||||
|
||||
def list_cards, do: @repo.all(Card)
|
||||
|
||||
def get_card(id), do: @repo.get!(Card, id)
|
||||
|
||||
@ -10,7 +10,8 @@ defmodule Bwc.Application do
|
||||
children = [
|
||||
# Starts a worker by calling: Bwc.Worker.start_link(arg)
|
||||
# {Bwc.Worker, arg}
|
||||
{Bwc.Repo, []}
|
||||
{Bwc.Repo, []},
|
||||
{Phoenix.PubSub, [name: Bwc.PubSub, adapter: Phoenix.PubSub.PG2]}
|
||||
]
|
||||
|
||||
# See https://hexdocs.pm/elixir/Supervisor.html
|
||||
|
||||
@ -1,8 +1,10 @@
|
||||
/* This file is for your main application css. */
|
||||
@import "./phoenix.css";
|
||||
@import "./bwc.css";
|
||||
@import "./uikit.min.css";
|
||||
|
||||
/* Alerts and form errors */
|
||||
.alert {
|
||||
.alert {
|
||||
padding: 15px;
|
||||
margin-bottom: 20px;
|
||||
border: 1px solid transparent;
|
||||
|
||||
@ -1,10 +1,11 @@
|
||||
html{
|
||||
.bwc-logo{
|
||||
width:550px;
|
||||
}
|
||||
#top-bar{
|
||||
border-bottom: 2px solid gainsboro;
|
||||
padding-bottom:1em;
|
||||
|
||||
#play_mode{
|
||||
display:none;
|
||||
}
|
||||
|
||||
li.message{
|
||||
border-bottom:1px solid #eee;
|
||||
list-style:none;
|
||||
@ -97,6 +98,13 @@ div#chat{
|
||||
font-weight:default;
|
||||
}
|
||||
|
||||
.delete-tool{
|
||||
float:right;
|
||||
position:relative;
|
||||
right:40px;
|
||||
top:20px;
|
||||
}
|
||||
|
||||
.card-template{
|
||||
flex-direction: column;
|
||||
width: min-content;
|
||||
@ -104,6 +112,13 @@ div#chat{
|
||||
box-shadow: 0 5px 15px rgba(0,0,0,0.08);
|
||||
}
|
||||
|
||||
.card-preview{
|
||||
flex-direction: column;
|
||||
width: 250px;
|
||||
min-height:300px;
|
||||
margin:1rem;
|
||||
box-shadow: 0 5px 15px rgba(0,0,0,0.08);
|
||||
}
|
||||
.card-title{
|
||||
margin-top:0px;
|
||||
}
|
||||
@ -135,7 +150,11 @@ div.card-content{
|
||||
.card-content{
|
||||
font-size: 24px;
|
||||
text-align:left;
|
||||
margin: 2em;
|
||||
margin: 1.5em;
|
||||
}
|
||||
|
||||
.card-preview > .card-content {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.card-content-box{
|
||||
@ -149,22 +168,29 @@ div.card-content{
|
||||
}
|
||||
|
||||
#submitCard{
|
||||
background: #393;
|
||||
display:none;
|
||||
padding: 0px 10px !important;
|
||||
color:white;
|
||||
background: #06D6A0;
|
||||
width: 100px;
|
||||
top:3px;position:relative;
|
||||
margin-bottom:0px;
|
||||
}
|
||||
#submitCard:hover{
|
||||
background: #3c3;
|
||||
background: #05B384;
|
||||
}
|
||||
|
||||
#newCard{
|
||||
background: #e5e5e5;
|
||||
color:#5e5e5e;
|
||||
padding: 0px 10px !important;
|
||||
width: 100px;
|
||||
color:rgb(107, 58, 2);
|
||||
background: #fff9eb;
|
||||
top:3px;position:relative;
|
||||
margin-bottom:0px;
|
||||
}
|
||||
#newCard:hover{
|
||||
background: #ffedc2;
|
||||
}
|
||||
|
||||
#newCard:hover{
|
||||
background:#f9f9f9;
|
||||
}
|
||||
|
||||
|
||||
.image-tools{
|
||||
@ -190,6 +216,7 @@ input#giphySearch{
|
||||
|
||||
.search-result{
|
||||
margin: 10px;
|
||||
max-width: 200px;
|
||||
}
|
||||
|
||||
.uploader:hover{
|
||||
@ -215,9 +242,6 @@ input#giphySearch{
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
span#current-player-turn{
|
||||
|
||||
}
|
||||
.meta-turn{
|
||||
color: #1e87f0 !important;
|
||||
font-weight:bold;
|
||||
@ -325,10 +349,6 @@ b.currentPlayer{
|
||||
display:none;
|
||||
}
|
||||
|
||||
#card-view{
|
||||
display:none;
|
||||
}
|
||||
|
||||
img.player{
|
||||
width:100px;height:100px;
|
||||
object-fit: cover;
|
||||
@ -347,9 +367,6 @@ img.player{
|
||||
content:"";
|
||||
}
|
||||
|
||||
.change-profile{
|
||||
|
||||
}
|
||||
|
||||
.change-profile:hover{
|
||||
color: #0f6ecd;
|
||||
@ -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";
|
||||
68
apps/bwc_web/assets/js/bwc.js
Normal file
68
apps/bwc_web/assets/js/bwc.js
Normal file
@ -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;
|
||||
}
|
||||
});
|
||||
0
apps/bwc_web/assets/static/bwc.old/js/uikit-icons.min.js → apps/bwc_web/assets/js/uikit-icons.min.js
vendored
Executable file → Normal file
0
apps/bwc_web/assets/static/bwc.old/js/uikit-icons.min.js → apps/bwc_web/assets/js/uikit-icons.min.js
vendored
Executable file → Normal file
0
apps/bwc_web/assets/static/bwc.old/js/uikit.min.js → apps/bwc_web/assets/js/uikit.min.js
vendored
Executable file → Normal file
0
apps/bwc_web/assets/static/bwc.old/js/uikit.min.js → apps/bwc_web/assets/js/uikit.min.js
vendored
Executable file → Normal file
81
apps/bwc_web/assets/package-lock.json
generated
81
apps/bwc_web/assets/package-lock.json
generated
@ -1001,12 +1001,28 @@
|
||||
"integrity": "sha512-3c+yGKvVP5Y9TYBEibGNR+kLtijnj7mYrXRg+WpFb2X9xm04g/DXYkfg4hmzJQosc9snFNUPkbYIhu+KAm6jJw==",
|
||||
"dev": true
|
||||
},
|
||||
"@types/prop-types": {
|
||||
"version": "15.7.3",
|
||||
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz",
|
||||
"integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==",
|
||||
"dev": true
|
||||
},
|
||||
"@types/q": {
|
||||
"version": "1.5.4",
|
||||
"resolved": "https://registry.npmjs.org/@types/q/-/q-1.5.4.tgz",
|
||||
"integrity": "sha512-1HcDas8SEj4z1Wc696tH56G8OlRaH/sqZOynNNB+HF0WOeXPaxTtbYzJY2oEfiUxjSKjhCKr+MvR7dCHcEelug==",
|
||||
"dev": true
|
||||
},
|
||||
"@types/react": {
|
||||
"version": "16.14.2",
|
||||
"resolved": "https://registry.npmjs.org/@types/react/-/react-16.14.2.tgz",
|
||||
"integrity": "sha512-BzzcAlyDxXl2nANlabtT4thtvbbnhee8hMmH/CcJrISDBVcJS1iOsP1f0OAgSdGE0MsY9tqcrb9YoZcOFv9dbQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@types/prop-types": "*",
|
||||
"csstype": "^3.0.2"
|
||||
}
|
||||
},
|
||||
"@webassemblyjs/ast": {
|
||||
"version": "1.8.5",
|
||||
"resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.8.5.tgz",
|
||||
@ -2681,6 +2697,12 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"csstype": {
|
||||
"version": "3.0.5",
|
||||
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.5.tgz",
|
||||
"integrity": "sha512-uVDi8LpBUKQj6sdxNaTetL6FpeCqTjOvAQuQUa/qAqq8oOd4ivkbhgnqayl0dnPal8Tb/yB1tF+gOvCBiicaiQ==",
|
||||
"dev": true
|
||||
},
|
||||
"currently-unhandled": {
|
||||
"version": "0.4.1",
|
||||
"resolved": "https://registry.npmjs.org/currently-unhandled/-/currently-unhandled-0.4.1.tgz",
|
||||
@ -4379,6 +4401,12 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"jquery": {
|
||||
"version": "3.5.1",
|
||||
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.5.1.tgz",
|
||||
"integrity": "sha512-XwIBPqcMn57FxfT+Go5pzySnm4KWkT1Tv7gjrpT1srtf8Weynl6R273VJ5GjkRb51IzMp5nbaPjJXMWeju2MKg==",
|
||||
"dev": true
|
||||
},
|
||||
"js-base64": {
|
||||
"version": "2.6.4",
|
||||
"resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.6.4.tgz",
|
||||
@ -4559,6 +4587,15 @@
|
||||
"integrity": "sha1-0CJTc662Uq3BvILklFM5qEJ1R3M=",
|
||||
"dev": true
|
||||
},
|
||||
"loose-envify": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
|
||||
"integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"js-tokens": "^3.0.0 || ^4.0.0"
|
||||
}
|
||||
},
|
||||
"loud-rejection": {
|
||||
"version": "1.6.0",
|
||||
"resolved": "https://registry.npmjs.org/loud-rejection/-/loud-rejection-1.6.0.tgz",
|
||||
@ -6077,6 +6114,17 @@
|
||||
"integrity": "sha1-mEcocL8igTL8vdhoEputEsPAKeM=",
|
||||
"dev": true
|
||||
},
|
||||
"prop-types": {
|
||||
"version": "15.7.2",
|
||||
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz",
|
||||
"integrity": "sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"loose-envify": "^1.4.0",
|
||||
"object-assign": "^4.1.1",
|
||||
"react-is": "^16.8.1"
|
||||
}
|
||||
},
|
||||
"prr": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/prr/-/prr-1.0.1.tgz",
|
||||
@ -6209,6 +6257,23 @@
|
||||
"safe-buffer": "^5.1.0"
|
||||
}
|
||||
},
|
||||
"react": {
|
||||
"version": "16.14.0",
|
||||
"resolved": "https://registry.npmjs.org/react/-/react-16.14.0.tgz",
|
||||
"integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"loose-envify": "^1.1.0",
|
||||
"object-assign": "^4.1.1",
|
||||
"prop-types": "^15.6.2"
|
||||
}
|
||||
},
|
||||
"react-is": {
|
||||
"version": "16.13.1",
|
||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
|
||||
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
|
||||
"dev": true
|
||||
},
|
||||
"read-pkg": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-1.1.0.tgz",
|
||||
@ -7444,6 +7509,22 @@
|
||||
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
|
||||
"dev": true
|
||||
},
|
||||
"uikit": {
|
||||
"version": "3.6.5",
|
||||
"resolved": "https://registry.npmjs.org/uikit/-/uikit-3.6.5.tgz",
|
||||
"integrity": "sha512-ChsoZBuCC4y0CXqJ51tiIPS4zcKgj8yvXDl8njRyMBLCjNRFlHgSjem2T6pQsEEItoN+Vh7NE3iueD70A4LW4A==",
|
||||
"dev": true
|
||||
},
|
||||
"uikit-icons": {
|
||||
"version": "0.5.0",
|
||||
"resolved": "https://registry.npmjs.org/uikit-icons/-/uikit-icons-0.5.0.tgz",
|
||||
"integrity": "sha512-KOXrEp6pKp6i9GvVdsi0P0dVOxd0QddCsvWcMTezyiHe44X6V2Uwj1mU5WX5bs6balVbxSKULkXlRRngYh0DrA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@types/react": "^16.9.11",
|
||||
"react": "^16.11.0"
|
||||
}
|
||||
},
|
||||
"unicode-canonical-property-names-ecmascript": {
|
||||
"version": "1.0.4",
|
||||
"resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz",
|
||||
|
||||
@ -16,12 +16,15 @@
|
||||
"babel-loader": "^8.0.0",
|
||||
"copy-webpack-plugin": "^5.1.1",
|
||||
"css-loader": "^3.4.2",
|
||||
"sass-loader": "^8.0.2",
|
||||
"node-sass": "^4.13.1",
|
||||
"hard-source-webpack-plugin": "^0.13.1",
|
||||
"jquery": "^3.5.1",
|
||||
"mini-css-extract-plugin": "^0.9.0",
|
||||
"node-sass": "^4.13.1",
|
||||
"optimize-css-assets-webpack-plugin": "^5.0.1",
|
||||
"sass-loader": "^8.0.2",
|
||||
"terser-webpack-plugin": "^2.3.2",
|
||||
"uikit": "^3.6.5",
|
||||
"uikit-icons": "^0.5.0",
|
||||
"webpack": "4.41.5",
|
||||
"webpack-cli": "^3.3.2"
|
||||
}
|
||||
|
||||
3
apps/bwc_web/assets/static/uikit-icons.min.js
vendored
Executable file
3
apps/bwc_web/assets/static/uikit-icons.min.js
vendored
Executable file
File diff suppressed because one or more lines are too long
3
apps/bwc_web/assets/static/uikit.min.js
vendored
Executable file
3
apps/bwc_web/assets/static/uikit.min.js
vendored
Executable file
File diff suppressed because one or more lines are too long
@ -13,8 +13,22 @@ defmodule BwcWeb.CardController do
|
||||
end
|
||||
|
||||
def create(conn,card_params) do
|
||||
{:ok, card} = Bwc.create_card(Map.get(card_params,"card"))
|
||||
redirect(conn, to: Routes.card_path(conn, :show, card))
|
||||
case Bwc.create_card(Map.get(card_params,"card")) do
|
||||
{:ok, card} -> redirect(conn, to: Routes.card_path(conn, :show, card))
|
||||
{:error, card} -> render(conn, "new.html", card: card)
|
||||
end
|
||||
|
||||
end
|
||||
|
||||
def delete(conn, params) do
|
||||
id = Map.get(params, "id")
|
||||
{:ok, card} = Bwc.delete_card(Bwc.get_card(id))
|
||||
render(conn, "delete.json", card: card)
|
||||
end
|
||||
|
||||
def index(conn, _params) do
|
||||
cards = Bwc.list_cards()
|
||||
render(conn, "index.html", cards: cards)
|
||||
end
|
||||
|
||||
end
|
||||
|
||||
@ -19,14 +19,15 @@ defmodule BwcWeb.Router do
|
||||
get "/", PageController, :index
|
||||
get "/create", CardController, :new
|
||||
|
||||
resources "/cards", CardController, only: [:show, :new, :create]
|
||||
resources "/cards", CardController, only: [:show, :new, :create, :index]
|
||||
|
||||
end
|
||||
|
||||
# Other scopes may use custom stacks.
|
||||
# scope "/api", BwcWeb do
|
||||
# pipe_through :api
|
||||
# end
|
||||
scope "/api", BwcWeb do
|
||||
pipe_through :api
|
||||
|
||||
resources "/cards", CardController, only: [:delete]
|
||||
end
|
||||
|
||||
# Enables LiveDashboard only for development
|
||||
#
|
||||
|
||||
45
apps/bwc_web/lib/bwc_web/templates/card/index.html.eex
Normal file
45
apps/bwc_web/lib/bwc_web/templates/card/index.html.eex
Normal file
@ -0,0 +1,45 @@
|
||||
<div class="uk-text-center uk-container uk-flex uk-flex-center uk-margin-top uk-flex-column">
|
||||
<h1>All Cards</h1>
|
||||
<hr/>
|
||||
|
||||
<div class="uk-flex uk-flex-wrap uk-flex-center">
|
||||
<input type="hidden" value="<%= Phoenix.Controller.get_csrf_token() %>" name="_csrf_token"/>
|
||||
|
||||
<%= if Enum.empty? @cards do %>
|
||||
<div class="create">
|
||||
There are no cards.<br/>
|
||||
What are you waiting for?
|
||||
<a href="/create">
|
||||
Create a card!
|
||||
</a>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<%= for card <- @cards do %>
|
||||
|
||||
<div class="uk-flex uk-text-center" id="card-<%=card.id%>">
|
||||
<div class="card-preview uk-panel uk-panel-box uk-panel-box-secondary uk-padding uk-flex">
|
||||
<h3 class="card-title uk-text-xlarge uk-margin-large-bottom"><%= card.title %> </h3>
|
||||
<div class="card-picture uk-flex uk-flex-center">
|
||||
<img class="card-picture" src="<%=card.picture%>" />
|
||||
</div>
|
||||
<div class="card-content uk-flex uk-flex-center">
|
||||
<%=card.description %>
|
||||
</div>
|
||||
</div>
|
||||
<a class="delete-tool" uk-icon="icon: trash; ratio:1" uk-tooltip="title: Delete" href="javascript:deleteCard(<%=card.id %>)"></a>
|
||||
</div>
|
||||
|
||||
|
||||
<% end %>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="create uk-margin-top">
|
||||
|
||||
<hr />
|
||||
What are you waiting for?
|
||||
<a href="/create">
|
||||
Create more cards!
|
||||
</a>
|
||||
</div>
|
||||
@ -1,12 +1,46 @@
|
||||
<h1>New Card</h1>
|
||||
<%= form_for @card, Routes.card_path(@conn, :create), fn f -> %>
|
||||
<%= label f, :title %>
|
||||
<%= text_input f, :title %>
|
||||
<%= label f, :picture %>
|
||||
<%= text_input f, :picture %>
|
||||
<%= label f, :description %>
|
||||
<%= textarea f, :description %>
|
||||
<div>
|
||||
<%= submit "Submit" %>
|
||||
<div class="new-card card-template uk-panel uk-panel-box uk-panel-box-secondary uk-padding uk-flex">
|
||||
<%= form_for @card, Routes.card_path(@conn, :create), fn f -> %>
|
||||
<%= text_input f, :title, class: "card-title uk-text-xlarge uk-margin-large-bottom" %>
|
||||
<%= error_tag f, :title %>
|
||||
<div class="card-picture uk-flex uk-flex-center uk-inline">
|
||||
<%= text_input f, :picture, class: "uk-hidden" %>
|
||||
<img class="card-picture" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjQsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkViZW5lXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iNjAwcHgiIGhlaWdodD0iNDAwcHgiIHZpZXdCb3g9IjAgMCA2MDAgNDAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA2MDAgNDAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxyZWN0IGZpbGw9IiNGNUY1RjUiIHdpZHRoPSI2MDAiIGhlaWdodD0iNDAwIi8+DQo8ZyBvcGFjaXR5PSIwLjciPg0KCTxwYXRoIGZpbGw9IiNEOEQ4RDgiIGQ9Ik0yMjguMTg0LDE0My41djExM2gxNDMuNjMydi0xMTNIMjI4LjE4NHogTTM2MC4yNDQsMjQ0LjI0N0gyNDAuNDM3di04OC40OTRoMTE5LjgwOEwzNjAuMjQ0LDI0NC4yNDcNCgkJTDM2MC4yNDQsMjQ0LjI0N3oiLz4NCgk8cG9seWdvbiBmaWxsPSIjRDhEOEQ4IiBwb2ludHM9IjI0Ni44ODEsMjM0LjcxNyAyNzEuNTcyLDIwOC43NjQgMjgwLjgyNCwyMTIuNzY4IDMxMC4wMTYsMTgxLjY4OCAzMjEuNTA1LDE5NS40MzQgDQoJCTMyNi42ODksMTkyLjMwMyAzNTQuNzQ2LDIzNC43MTcgCSIvPg0KCTxjaXJjbGUgZmlsbD0iI0Q4RDhEOCIgY3g9IjI3NS40MDUiIGN5PSIxNzguMjU3IiByPSIxMC43ODciLz4NCjwvZz4NCjwvc3ZnPg0K" />
|
||||
<div class="image-tools uk-flex uk-overlay-default uk-position-center">
|
||||
<a class="image-tool" id="imageSearch" uk-icon="icon: search; ratio:2" uk-tooltip="title: Search" uk-toggle="target: #imageModal"></a>
|
||||
<!--a class="image-tool" id="imageInsta" uk-icon="icon: instagram; ratio: 2" uk-tooltip="Instagram"></a>
|
||||
<div class="uploader" uk-form-custom style="margin:1em;" uk-tooltip="Upload">
|
||||
<input type="file">
|
||||
<a style="margin:0px;" class="image-tool" id="imageUpload" uk-icon="icon: upload; ratio: 2"></a></div>
|
||||
<a class="image-tool" id="imageDraw" uk-icon="icon: pencil; ratio: 2" uk-tooltip="Draw"></a-->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="card-content uk-flex uk-flex-center">
|
||||
<%= textarea f, :description, class: "card-content-box"%>
|
||||
<%= error_tag f, :description %>
|
||||
</div>
|
||||
<div class="controls uk-margin-top">
|
||||
<div class="uk-flex uk-flex-center">
|
||||
<ul class="uk-subnav uk-subnav-pill" style="margin-bottom:0px;">
|
||||
<li><button id="newCard" class="uk-subnav-pill" href="#">New</a></li>
|
||||
<li>
|
||||
<%= submit "Submit", class: "uk-active uk-subnav-pill", id: "submitCard" %>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
<%end %>
|
||||
</div>
|
||||
|
||||
<div id="imageModal" uk-modal>
|
||||
<div class="uk-modal-dialog uk-modal-body">
|
||||
<form class='uk-search uk-search-large' id="imageModalContent">
|
||||
<a href="#" id="giphySearchButton" class="uk-search-icon-flip" uk-search-icon></a>
|
||||
<input id="giphySearch" class="uk-search-input" placeholder="Search GIPHY..." />
|
||||
</form>
|
||||
<div id="giphySearchResults" class="uk-flex uk-flex-center uk-flex-wrap">
|
||||
|
||||
</div>
|
||||
<button class="uk-modal-close-default" type="button" uk-close></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,10 +1,22 @@
|
||||
<div>
|
||||
<h1><%= @card.title %> </h1>
|
||||
<div id="play_mode" class="game-mode uk-flex uk-text-center">
|
||||
<div id='card-view' class="active-card card-template uk-panel uk-panel-box uk-panel-box-secondary uk-padding uk-flex">
|
||||
<span class="uk-label your-card-" style="display:none;">your card</span>
|
||||
<h1 class="card-title uk-text-xlarge uk-margin-large-bottom"><%= @card.title %> </h1>
|
||||
<div class="card-picture uk-flex uk-flex-center">
|
||||
<img class="card-picture" src="<%=@card.picture%>" />
|
||||
</div>
|
||||
<div class="card-content uk-flex uk-flex-center">
|
||||
<%=@card.description %>
|
||||
</div>
|
||||
</div> <!-- active-card -->
|
||||
|
||||
<div class="picture">
|
||||
<img src="<%= Routes.static_path(@conn, @card.picture) %>"/>
|
||||
</div>
|
||||
<div class="description">
|
||||
<%= @card.description %>
|
||||
<div class="active-card-controls uk-margin-top">
|
||||
<div class="uk-flex uk-flex-center">
|
||||
<ul class="uk-subnav uk-subnav-pill">
|
||||
<li class="card-control reveal-card"><a onClick="revealCard()" id="revealCard" href="#">Reveal Card</a></li>
|
||||
<li class="card-control done-with-card"> <a onClick="doneWithCard()" id="doneWithCard" class="uk-subnav-pill"
|
||||
href="#">Done</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,33 +1,31 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Blank White Cards!</title>
|
||||
<link rel="stylesheet" href="<%= Routes.static_path(@conn, "/css/app.css") %>"/>
|
||||
<link rel="stylesheet" href="<%= Routes.static_path(@conn, "/css/app.css") %>" />
|
||||
<script defer type="text/javascript" src="<%= Routes.static_path(@conn, "/js/app.js") %>"></script>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<section class="container">
|
||||
<nav role="navigation">
|
||||
<ul>
|
||||
<li><a href="https://hexdocs.pm/phoenix/overview.html">Get Started</a></li>
|
||||
<%= if function_exported?(Routes, :live_dashboard_path, 2) do %>
|
||||
<li><%= link "LiveDashboard", to: Routes.live_dashboard_path(@conn, :home) %></li>
|
||||
<% end %>
|
||||
</ul>
|
||||
</nav>
|
||||
<a href="/" class="phx-logo">
|
||||
<img src="<%= Routes.static_path(@conn, "/images/bwc.png") %>" alt="BWC Logo"/>
|
||||
</a>
|
||||
</section>
|
||||
</header>
|
||||
<main role="main" class="container">
|
||||
<p class="alert alert-info" role="alert"><%= get_flash(@conn, :info) %></p>
|
||||
<p class="alert alert-danger" role="alert"><%= get_flash(@conn, :error) %></p>
|
||||
<%= @inner_content %>
|
||||
</main>
|
||||
</body>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="uk-container uk-container-center uk-margin-top uk-margin-large-bottom uk-height-1-1">
|
||||
<div class="uk-text-center uk-container" id="top-bar">
|
||||
<h1 class="uk-heading-line-">
|
||||
<a href="/">
|
||||
<img class="bwc-logo" src="<%= Routes.static_path(@conn, "/images/bwc.png") %>" alt="BWC Logo" />
|
||||
</a>
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<p class="alert alert-info" role="alert"><%= get_flash(@conn, :info) %></p>
|
||||
<p class="alert alert-danger" role="alert"><%= get_flash(@conn, :error) %></p>
|
||||
<div class="uk-text-center uk-container uk-flex uk-flex-center uk-margin-top">
|
||||
<%= @inner_content %>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
||||
@ -1,18 +1,19 @@
|
||||
<div style="margin:0 auto; width: 800px; text-align:center;">
|
||||
<h1></h1>
|
||||
|
||||
<div class="picture">
|
||||
<img height=200px src="<%= Routes.static_path(@conn, "/images/logo.png") %>"/>
|
||||
</div>
|
||||
<div class="description">
|
||||
<h2><%= @status %></h2>
|
||||
<i>Cards in the pot: <%= length(@cards) %></i>
|
||||
</div>
|
||||
<hr/>
|
||||
<div class="create">
|
||||
What are you waiting for?
|
||||
<a href="/create">
|
||||
Create a card!
|
||||
</a>
|
||||
</div>
|
||||
<div class='uk-container uk-container-center uk-flex uk-text-center uk-flex-column'>
|
||||
<div class="logo uk-flex uk-flex-center uk-margin-large-bottom">
|
||||
<img width=400px src="<%= Routes.static_path(@conn, "/images/logo.png") %>" />
|
||||
</div>
|
||||
<div>
|
||||
<h2><%= @status %></h2>
|
||||
<i>Cards in the pot: <%= length(@cards) %></i>
|
||||
<emph>
|
||||
<%= link("(View all)", to: Routes.card_path(@conn, :index)) %>
|
||||
</emph>
|
||||
<hr />
|
||||
<div class="create">
|
||||
What are you waiting for?
|
||||
<a href="/create">
|
||||
Create a card!
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,3 +1,14 @@
|
||||
defmodule BwcWeb.CardView do
|
||||
require Logger
|
||||
use BwcWeb, :view
|
||||
|
||||
def render("delete.json", params) do
|
||||
card = Map.get(params,:card)
|
||||
Logger.debug(card.title)
|
||||
%{
|
||||
data: "Deleted '#{card.title}'.",
|
||||
card: card.id
|
||||
}
|
||||
end
|
||||
|
||||
end
|
||||
|
||||
3
apps/bwc_web/package-lock.json
generated
Normal file
3
apps/bwc_web/package-lock.json
generated
Normal file
@ -0,0 +1,3 @@
|
||||
{
|
||||
"lockfileVersion": 1
|
||||
}
|
||||
@ -27,7 +27,8 @@ config :bwc_web, BwcWeb.Endpoint,
|
||||
url: [host: "localhost"],
|
||||
secret_key_base: "jJqmdDJIM8vfETjEax9POp8CbgJbaID++sXZCrxsjFdIywS9qi6D1jBWSDTElzcd",
|
||||
render_errors: [view: BwcWeb.ErrorView, accepts: ~w(html json), layout: false],
|
||||
live_view: [signing_salt: "IRwB6447"]
|
||||
live_view: [signing_salt: "IRwB6447"],
|
||||
pubsub_server: Bwc.PubSub
|
||||
|
||||
# Sample configuration:
|
||||
#
|
||||
|
||||
11
package-lock.json
generated
Normal file
11
package-lock.json
generated
Normal file
@ -0,0 +1,11 @@
|
||||
{
|
||||
"requires": true,
|
||||
"lockfileVersion": 1,
|
||||
"dependencies": {
|
||||
"uikit": {
|
||||
"version": "3.6.5",
|
||||
"resolved": "https://registry.npmjs.org/uikit/-/uikit-3.6.5.tgz",
|
||||
"integrity": "sha512-ChsoZBuCC4y0CXqJ51tiIPS4zcKgj8yvXDl8njRyMBLCjNRFlHgSjem2T6pQsEEItoN+Vh7NE3iueD70A4LW4A=="
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user