aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorYann Herklotz <ymherklotz@gmail.com>2017-08-15 23:23:37 +0100
committerYann Herklotz <ymherklotz@gmail.com>2017-08-15 23:23:37 +0100
commit3d4fc0e41c4416523843466ba13a08edc87e9af7 (patch)
tree33d5a70631bdff5571eab2036fc914cb069d7606
downloadTicTacToe-3d4fc0e41c4416523843466ba13a08edc87e9af7.tar.gz
TicTacToe-3d4fc0e41c4416523843466ba13a08edc87e9af7.zip
Cool lines are being drawn
-rw-r--r--.gitignore14
-rw-r--r--README.md39
-rw-r--r--dev/user.clj42
-rw-r--r--project.clj105
-rw-r--r--resources/public/css/style.css17
-rw-r--r--resources/public/index.html17
-rw-r--r--src/tic_tac_toe/core.cljs43
-rw-r--r--src/tic_tac_toe/logic.cljs9
8 files changed, 286 insertions, 0 deletions
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..13ba58b
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,14 @@
+/resources/public/js/compiled/**
+figwheel_server.log
+pom.xml
+*jar
+/lib/
+/classes/
+/out/
+/target/
+.lein-deps-sum
+.lein-repl-history
+.lein-plugins/
+.repl
+.nrepl-port
+/.cljs_rhino_repl/
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..42bbc90
--- /dev/null
+++ b/README.md
@@ -0,0 +1,39 @@
+# tic-tac-toe
+
+FIXME: Write a one-line description of your library/project.
+
+## Overview
+
+FIXME: Write a paragraph about the library/project and highlight its goals.
+
+## Setup
+
+To get an interactive development environment run:
+
+ lein figwheel
+
+and open your browser at [localhost:3449](http://localhost:3449/).
+This will auto compile and send all changes to the browser without the
+need to reload. After the compilation process is complete, you will
+get a Browser Connected REPL. An easy way to try it is:
+
+ (js/alert "Am I connected?")
+
+and you should see an alert in the browser window.
+
+To clean all compiled files:
+
+ lein clean
+
+To create a production build run:
+
+ lein do clean, cljsbuild once min
+
+And open your browser in `resources/public/index.html`. You will not
+get live reloading, nor a REPL.
+
+## License
+
+Copyright © 2014 FIXME
+
+Distributed under the Eclipse Public License either version 1.0 or (at your option) any later version.
diff --git a/dev/user.clj b/dev/user.clj
new file mode 100644
index 0000000..11a6018
--- /dev/null
+++ b/dev/user.clj
@@ -0,0 +1,42 @@
+(ns user
+ (:require
+ [figwheel-sidecar.repl-api :as f]))
+
+;; user is a namespace that the Clojure runtime looks for and
+;; loads if its available
+
+;; You can place helper functions in here. This is great for starting
+;; and stopping your webserver and other development services
+
+;; The definitions in here will be available if you run "lein repl" or launch a
+;; Clojure repl some other way
+
+;; You have to ensure that the libraries you :require are listed in your dependencies
+
+;; Once you start down this path
+;; you will probably want to look at
+;; tools.namespace https://github.com/clojure/tools.namespace
+;; and Component https://github.com/stuartsierra/component
+
+
+(defn fig-start
+ "This starts the figwheel server and watch based auto-compiler."
+ []
+ ;; this call will only work are long as your :cljsbuild and
+ ;; :figwheel configurations are at the top level of your project.clj
+ ;; and are not spread across different lein profiles
+
+ ;; otherwise you can pass a configuration into start-figwheel! manually
+ (f/start-figwheel!))
+
+(defn fig-stop
+ "Stop the figwheel server and watch based auto-compiler."
+ []
+ (f/stop-figwheel!))
+
+;; if you are in an nREPL environment you will need to make sure you
+;; have setup piggieback for this to work
+(defn cljs-repl
+ "Launch a ClojureScript REPL that is connected to your build and host environment."
+ []
+ (f/cljs-repl))
diff --git a/project.clj b/project.clj
new file mode 100644
index 0000000..8fc5b3c
--- /dev/null
+++ b/project.clj
@@ -0,0 +1,105 @@
+(defproject tic-tac-toe "0.1.0-SNAPSHOT"
+ :description "FIXME: write this!"
+ :url "http://example.com/FIXME"
+ :license {:name "Eclipse Public License"
+ :url "http://www.eclipse.org/legal/epl-v10.html"}
+
+ :min-lein-version "2.7.1"
+
+ :dependencies [[org.clojure/clojure "1.8.0"]
+ [org.clojure/clojurescript "1.9.854"]
+ [org.clojure/core.async "0.3.443"
+ :exclusions [org.clojure/tools.reader]]
+ [reagent "0.7.0"]]
+
+ :plugins [[lein-figwheel "0.5.12"]
+ [lein-cljsbuild "1.1.7" :exclusions [[org.clojure/clojure]]]]
+
+ :source-paths ["src"]
+
+ :cljsbuild {:builds
+ [{:id "dev"
+ :source-paths ["src"]
+
+ ;; The presence of a :figwheel configuration here
+ ;; will cause figwheel to inject the figwheel client
+ ;; into your build
+ :figwheel {:on-jsload "tic-tac-toe.core/on-js-reload"
+ ;; :open-urls will pop open your application
+ ;; in the default browser once Figwheel has
+ ;; started and compiled your application.
+ ;; Comment this out once it no longer serves you.
+ :open-urls ["http://localhost:3449/index.html"]}
+
+ :compiler {:main tic-tac-toe.core
+ :asset-path "js/compiled/out"
+ :output-to "resources/public/js/compiled/tic_tac_toe.js"
+ :output-dir "resources/public/js/compiled/out"
+ :source-map-timestamp true
+ ;; To console.log CLJS data-structures make sure you enable devtools in Chrome
+ ;; https://github.com/binaryage/cljs-devtools
+ :preloads [devtools.preload]}}
+ ;; This next build is a compressed minified build for
+ ;; production. You can build this with:
+ ;; lein cljsbuild once min
+ {:id "min"
+ :source-paths ["src"]
+ :compiler {:output-to "resources/public/js/compiled/tic_tac_toe.js"
+ :main tic-tac-toe.core
+ :optimizations :advanced
+ :pretty-print false}}]}
+
+ :figwheel {;; :http-server-root "public" ;; default and assumes "resources"
+ ;; :server-port 3449 ;; default
+ ;; :server-ip "127.0.0.1"
+
+ :css-dirs ["resources/public/css"] ;; watch and update CSS
+
+ ;; Start an nREPL server into the running figwheel process
+ ;; :nrepl-port 7888
+
+ ;; Server Ring Handler (optional)
+ ;; if you want to embed a ring handler into the figwheel http-kit
+ ;; server, this is for simple ring servers, if this
+
+ ;; doesn't work for you just run your own server :) (see lein-ring)
+
+ ;; :ring-handler hello_world.server/handler
+
+ ;; To be able to open files in your editor from the heads up display
+ ;; you will need to put a script on your path.
+ ;; that script will have to take a file path and a line number
+ ;; ie. in ~/bin/myfile-opener
+ ;; #! /bin/sh
+ ;; emacsclient -n +$2 $1
+ ;;
+ ;; :open-file-command "myfile-opener"
+
+ ;; if you are using emacsclient you can just use
+ ;; :open-file-command "emacsclient"
+
+ ;; if you want to disable the REPL
+ ;; :repl false
+
+ ;; to configure a different figwheel logfile path
+ ;; :server-logfile "tmp/logs/figwheel-logfile.log"
+
+ ;; to pipe all the output to the repl
+ ;; :server-logfile false
+ }
+
+
+ ;; Setting up nREPL for Figwheel and ClojureScript dev
+ ;; Please see:
+ ;; https://github.com/bhauman/lein-figwheel/wiki/Using-the-Figwheel-REPL-within-NRepl
+ :profiles {:dev {:dependencies [[binaryage/devtools "0.9.4"]
+ [figwheel-sidecar "0.5.12"]
+ [com.cemerick/piggieback "0.2.2"]]
+ ;; need to add dev source path here to get user.clj loaded
+ :source-paths ["src" "dev"]
+ ;; for CIDER
+ ;; :plugins [[cider/cider-nrepl "0.12.0"]]
+ :repl-options {:nrepl-middleware [cemerick.piggieback/wrap-cljs-repl]}
+ ;; need to add the compliled assets to the :clean-targets
+ :clean-targets ^{:protect false} ["resources/public/js/compiled"
+ :target-path]}})
diff --git a/resources/public/css/style.css b/resources/public/css/style.css
new file mode 100644
index 0000000..1c2c78d
--- /dev/null
+++ b/resources/public/css/style.css
@@ -0,0 +1,17 @@
+h1 {
+ font-family: "Arial", Arial, sans-serif;
+ text-align: center;
+}
+
+#app {
+ text-align: center;
+}
+
+#MyCircle {
+ fill: #2f2f2f;
+ transition:.5s;
+}
+
+#MyCircle:hover {
+ fill: #8f8f8f;
+}
diff --git a/resources/public/index.html b/resources/public/index.html
new file mode 100644
index 0000000..792d5f4
--- /dev/null
+++ b/resources/public/index.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>Tic Tac Toe</title>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link href="css/style.css" rel="stylesheet" type="text/css">
+ <link rel="icon" href="https://clojurescript.org/images/cljs-logo-icon-32.png">
+ </head>
+ <body>
+ <div id="app">
+ <h2>Figwheel template</h2>
+ <p>Checkout your developer console.</p>
+ </div>
+ <script src="js/compiled/tic_tac_toe.js" type="text/javascript"></script>
+ </body>
+</html>
diff --git a/src/tic_tac_toe/core.cljs b/src/tic_tac_toe/core.cljs
new file mode 100644
index 0000000..89d4ba8
--- /dev/null
+++ b/src/tic_tac_toe/core.cljs
@@ -0,0 +1,43 @@
+(ns tic-tac-toe.core
+ (:require [reagent.core :as reagent :refer [atom]]
+ [tic-tac-toe.logic :as logic]))
+
+(defonce app-state
+ (atom {:board (logic/new-board logic/board-size)}))
+
+(defn naught [i j]
+ [:circle {:id "naught"
+ :r 0.45
+ :cx (+ 0.5 i)
+ :cy (+ 0.5 j)}])
+
+(defn cross [i j]
+ [:g {:stroke "black"
+ :stroke-width 0.08
+ :stroke-linecap "round"}
+ [:line {:x1 i :y1 j :x2 (+ i 1) :y2 (+ j 1)}]
+ [:line {:x1 i :y1 (+ j 1) :x2 (+ i 1) :y2 j}]])
+
+(defn blank [i j]
+ [:rect {:id "blank"
+ :width 0.9
+ :height 0.9
+ :x (+ 0.05 i)
+ :y (+ 0.05 j)}])
+
+(defn tictactoe []
+ [:div
+ [:h1 "Welcome to Tic Tac Toe"]
+ (into
+ [:svg {:view-box "0 0 3 3"
+ :width 500 :height 500}]
+ (for [i (range logic/board-size)
+ j (range logic/board-size)]
+ (case (get-in @app-state [:board j i])
+ 0 [cross i j]
+ 1 [cross i j]
+ 2 [naught i j])))])
+
+(enable-console-print!)
+(reagent/render-component [tictactoe]
+ (. js/document (getElementById "app")))
diff --git a/src/tic_tac_toe/logic.cljs b/src/tic_tac_toe/logic.cljs
new file mode 100644
index 0000000..44e0da6
--- /dev/null
+++ b/src/tic_tac_toe/logic.cljs
@@ -0,0 +1,9 @@
+(ns tic-tac-toe.logic)
+
+;; Define global variables
+(def board-size 3)
+
+;; Functions
+(defn new-board
+ [size]
+ (vec (repeat size (vec (repeat size 0)))))