snake_no_deps.cljs

(ns snake.core
  (:require ))

(enable-console-print!)

(def horace "HI IM HORACE")

(println "HORACE: " horace)
(println "Edits to this text should show up in your developer console.")

(defn by-id [id]
  (.getElementById js/document id))

(def canvas (by-id "canvas"))
(def canvas-ctx (.getContext canvas "2d"))
(set! (.-fillStyle canvas-ctx) "rgb(200,0,0)")

(defn draw-rect [ctx x y w h]
  (.fillRect ctx x y w h))

(defn clear-canvas [ctx]
  (.clearRect ctx 0 0 400 400))

;; canvas
;; model the snake ???
;; update its position
;; handle key-presses somehow
;; define your app data so that it doesn't get over-written on reload

(defonce app-state (atom {:text "Hello world!"
                          :snake [[10 10]
                                  [20 10]
                                  [30 10]]
                          :dir :east
                          :counter 1}))
;; db of app state
;; reference types

(def dir-mappings
  {:east [10 0]
   :south [0 10]
   :west [-10 0]
   :north [0 -10]})

(defn shift-coords [left right]
  (map + left right)
  [(+ (first left)
      (first right))
   (+ (last left)
      (last right))])

(defn move-snake [dir snake-cells]
  (let [shift (dir dir-mappings)]
    (map (fn [coords]
           (shift-coords coords shift))
         snake-cells)))

(defn draw-fn []
  (clear-canvas canvas-ctx)
  (println "DRAWING !!!" (:counter @app-state))
  (swap! app-state update-in [:counter] inc)

  (let [current-dir (:dir @app-state)]
    (swap! app-state
           update-in
           [:snake]
           move-snake
           current-dir))

  ;; drawing the snake
  (doseq [[x y] (:snake @app-state)]
    (draw-rect canvas-ctx x y 10 10))

  (swap! app-state update-in [:snake] move-snake)

  (.requestAnimationFrame js/window draw-fn))

;; request the first frame to start the
;; render loop
(.requestAnimationFrame js/window draw-fn)

(defn on-js-reload []
  ;; optionally touch your app-state to force rerendering depending on
  ;; your application
  ;; (swap! app-state update-in [:__figwheel_counter] inc)
)

snake_quil.cljs

(ns snake-quil.core
  (:require [quil.core :as q :include-macros true]
            [quil.middleware :as m]))

(enable-console-print!)

(defn setup []
  (q/frame-rate 60)
  (q/color-mode :hsb)
  {:color 0
   :dir :east
   :snake [[50 50] [60 50] [70 50]]})

(def speed 2)

(defn move-head [[x y] dir]
  (case dir
    :north [x (- y speed)]
    :east  [(+ speed x) y]
    :south [x (+ y speed)]
    :west  [(- x speed) y]))

(defn update-state [state]
  (let [new-head (move-head (first (:snake state))
                            (:dir state))
        scooted (conj (drop-last 1 (:snake state))
                      new-head)]
    {:color (mod (+ (:color state) 0.7) 255)
     :dir (:dir state)
     :snake scooted}))

(defn draw-state [state]
  (q/background 240)
  (q/fill (:color state) 255 255)
  (doseq [[x y] (:snake state)]
    (q/rect x y 10 10)))

(def key-map {:w :north
              :d :east
              :a :west
              :s :south})

(defn key-pressed [state key-info]
  (println "key presseeddd")
  (println "key info: " key-info)
  (println "started with state: ")
  (println state)
  (if-let [key-dir ((:key key-info) key-map)]
    (let [new-state (assoc state :dir ((:key key-info) key-map))]
      (println "new state: ")
      (println new-state)
      new-state)
    state))

(q/defsketch snake-quil
  :host "snake-quil"
  :size [500 500]
  ; setup function called only once, during sketch initialization.
  :setup setup
  ; update-state is called on each iteration before draw-state.
  :update update-state
  :draw draw-state
  :key-pressed key-pressed
  ; This sketch uses functional-mode middleware.
  ; Check quil wiki for more info about middlewares and particularly
  ; fun-mode.
  :middleware [m/fun-mode])

(defn inc-and-scoot [seq]
  (let [new-head (inc (first seq))]
    (conj (drop-last 1 seq) new-head)))