g1smo
/
sliva
1
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Animacija prestavljena v cljs - nek glitch

master
Jure Podgoršek 2018-03-22 06:06:29 +01:00
parent 9ddc09cb04
commit aaa7c59957
3 changed files with 112 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
project.clj
View File

@ -4,8 +4,8 @@
: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.9.0-beta4"]

1
resources/public/index.html
View File

@ -9,6 +9,7 @@
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<body style="margin: 0">
<div id="container"></div>
<script type="text/javascript" src="js/three.min.js"></script>
<script src="js/compiled/sliva.js" type="text/javascript"></script>
</body>

111
src/sliva/core.cljs
View File

@ -3,12 +3,119 @@
(enable-console-print!)
(defonce app-state (atom {:text "Hello world!"}))
(console.log "Hello, Sky!")
(console.log (:text @app-state))
;;;;; ☭☭☭☭☭☭☭☭☭☭☭☭☭☭ ;;;;;;
;; ☭☭☭☭ Parametri razni ☭☭☭☭ ;;
;;;;; ☭☭☭☭☭☭☭☭☭☭☭☭☭☭ ;;;;;;
(def odmik-kamere 100)
(def rotacija-kamere 1)
(def FOV 140)
(def lik-sirina 2)
(def obj-limit 1000)
(def objekti (atom []))
(def stevec (atom 0))
(def rotacija-x 0.006)
(def rotacija-y 0.001)
(def rotacija-z 0.003)
(def zamik-barve 0.0000666)
(def zacetna-barva 0.333)
(def saturacija 1)
(def svetlost 0.4)
(def w-diff 0.5)
(def gostota-obj 2)
;; Inicializacija ;;
(def scena (THREE.Scene.))
(def kamera (THREE.PerspectiveCamera. FOV (/ js/window.innerWidth js/innerHeight 0.1 2000)))
(aset kamera "position" "z" odmik-kamere)
(def izris (THREE.WebGLRenderer. (js-obj "alpha" true)))
(.setSize izris js/window.innerWidth js/window.innerHeight)
;; Crno ozadje
(.setClearColor izris 0x000000 1)
(defn dodaj-obj [sirina]
(let [barva (js/THREE.Color.)
mat (js/THREE.LineBasicMaterial. (js-obj "color" barva))
geo (js/THREE.Geometry.)
zamik (/ sirina 2)
-zamik (* -1 zamik)]
;; Nastavi barvo novega objekta
(.setHSL barva (* @stevec zacetna-barva) saturacija svetlost)
;; Kvadratek (za nov objekt)
(.push geo.vertices (js/THREE.Vector3. -zamik 0 0) (js/THREE.Vector3. 0 zamik 0))
(.push geo.vertices (js/THREE.Vector3. -zamik 0 0) (js/THREE.Vector3. 0 -zamik 0))
(.push geo.vertices (js/THREE.Vector3. zamik 0 0) (js/THREE.Vector3. 0 zamik 0))
(.push geo.vertices (js/THREE.Vector3. zamik 0 0) (js/THREE.Vector3. 0 -zamik 0))
(let [obj (js/THREE.Line. geo mat js/THREE.LineSegments)]
(.add scena obj)
;; pucaj sceno ane
(swap! objekti conj obj)
(swap! objekti #(take obj-limit %1)))))
(defn obj-anim [obj]
(.rotateY obj rotacija-y)
(.rotateZ obj rotacija-z)
(.rotateX obj rotacija-x)
(let [new-scale (+ obj.scale.x w-diff)]
(console.log obj.scale w-diff obj.scale.x new-scale)
(aset obj "scale" "x" new-scale)
(aset obj "scale" "y" new-scale)
(aset obj "scale" "z" new-scale))
(.offsetHSL obj.material.color zamik-barve 0 0))
(defn cam-rotate []
(.translateX kamera rotacija-kamere)
(.translateZ kamera (- odmik-kamere
(.sqrt js/Math (+ (.pow js/Math odmik-kamere 2)
(.pow js/Math rotacija-kamere 2))))))
(defn render []
(js/requestAnimationFrame render)
(swap! stevec inc)
(if (= 0 (rem @stevec gostota-obj)) (dodaj-obj lik-sirina))
(.render izris scena kamera)
(run! obj-anim @objekti))
;;(cam-rotate))
;; Zacetek ;;
(aset js/document "onreadystatechange"
(fn []
(if (= js/document.readyState "complete")
(let [container (.getElementById js/document "container")]
(.appendChild container izris.domElement)
(render)))))
(defn on-js-reload []
;; optionally touch your app-state to force rerendering depending on
;; your application
;; (swap! app-state update-in [:__figwheel_counter] inc)
)
;; Hendlaj risajz
(defn on-window-resize[]
(aset kamera "aspect" (/ js/window.innerWidth js/window.innerHeight))
(.updateProjectionMatrix kamera)
(.setSize izris js/window.innerWidth js/window.innerHeight))
(.addEventListener js/window "resize" on-window-resize false)