more ideas and some simple bootstrap support

AndreaCrotti · Aug 5, 2018 · b7bb8a5 · b7bb8a5
1 parent 6b2f20b
commit b7bb8a5
Show file tree

Hide file tree

Showing 5 changed files with 53 additions and 9 deletions.
diff --git a/README.md b/README.md
@@ -6,6 +6,24 @@ Compute the Elo ranking from Fifa games.
 
 Deploy this to Heroku.
 
+## Import data from a Google Spreadsheet
+
+Download a csv and run:
+
+    lein run -m elo.db sample.csv
+
+This will populate the local database with data from the CSV file.
+
+## TDOO
+
+- [ ] add some proper styliing
+- [ ] add a user table (use email as PK or UIUDS)?
+- [ ] eventually paginatate list of all the games
+- [ ] fetch all possible list of teams and auto complete on input
+- [ ] auto complete on player names
+- [ ] set some defualt values in the spreadsheet
+- [ ] add authentication using Google Apps to limit to a company
+
 ## License
 
 Copyright © 2018 Andrea Crotti

diff --git a/project.clj b/project.clj
@@ -29,6 +29,7 @@
                  [org.clojure/clojurescript "1.10.339"]
                  [cljs-react-material-ui "0.2.48"]
                  [re-frame "0.10.5"]
+                 [reagent-forms "0.5.42"]
 
                  [ns-tracker "0.3.1"]
                  [day8.re-frame/http-fx "0.1.6"]

diff --git a/src/clj/elo/api.clj b/src/clj/elo/api.clj
@@ -36,6 +36,11 @@
                   :description "FIFA championship little helper"}]
     [:title "FIFA championship"]
 
+    [:link {:rel "stylesheet"
+            :href "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
+            :integrity "sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
+            :crossorigin "anonymous"}]
+
     [:link {:href (cache-buster "css/screen.css")
             :rel "stylesheet"
             :type "text/css"}]]

diff --git a/src/clj/elo/css.clj b/src/clj/elo/css.clj
@@ -3,7 +3,21 @@
 
 (defstyles screen
   ;; could maybe even split creating multiple CSS files?
-  [[:.players_form
+  [[:.content
+    {:display "grid"
+     :width "90%"
+     :padding-left "20px"
+     :padding-top "30px"
+     ;; :grid-template-columns "auto"
+     ;; :grid-template-rows "auto auto auto"
+     :grid-gap "20px"
+
+     }]
+
+   [:.rankings__table
+    {:width "300px"}]
+
+   [:.players_form
     {:display "grid"
      :width "80%"
      :padding-left "15px"

diff --git a/src/cljs/elo/views.cljs b/src/cljs/elo/views.cljs
@@ -37,8 +37,12 @@
     [:label "Team"]
     [:input {:type "text"
              :placeholder "Team Name"
-             :on-change (set-val :p1_team)}]]
+             :on-change (set-val :p1_team)}]
 
+    #_[:input.form-control {:field :text
+                            :id "p1_team"
+                            :placeholder "Team Name"
+                            :on-change (set-val :p1_team)}]]
    [:div
     [:label "Team"]
     [:input {:type "text"
@@ -59,8 +63,9 @@
                 [:th "Goals"]
                 [:th "Played At"]]]
 
-    [:table
-     (into [:tbody header]
+    [:table.table
+     [:thead header]
+     (into [:tbody]
            (for [{:keys [p1_name p2_name p1_team p2_team p1_goals p2_goals played_at]} games]
              [:tr
               [:td p1_name]
@@ -75,8 +80,9 @@
   [rankings]
   (let [header [:tr [:th "Position"] [:th "Player"] [:th "Ranking"]]
         sorted (sort-by #(- (second %)) rankings)]
-    [:table
-     (into [:tbody header]
+    [:table.table
+     [:thead header]
+     (into [:tbody]
            (for [n (range (count sorted))]
              (let [[p ranking] (nth sorted n)]
                [:tr [:td (inc n)] [:td p] [:td (int ranking)]])))]))
@@ -94,6 +100,6 @@
                     {:palette {:text-color (color :green600)}})}
 
        [:div.content
-        [:div players-form]
-        [:div.games__table (games-table @games)]
-        [:div.rankings__table (rankings-table @rankings)]]])))
+        [:div.players__form_container players-form]
+        [:div.rankings__table (rankings-table @rankings)]
+        [:div.games__table (games-table @games)]]])))