summaryrefslogtreecommitdiff
path: root/new-reality/public/assets/js/grid/grid.js
diff options
context:
space:
mode:
Diffstat (limited to 'new-reality/public/assets/js/grid/grid.js')
-rw-r--r--new-reality/public/assets/js/grid/grid.js154
1 files changed, 154 insertions, 0 deletions
diff --git a/new-reality/public/assets/js/grid/grid.js b/new-reality/public/assets/js/grid/grid.js
new file mode 100644
index 0000000..f3747e5
--- /dev/null
+++ b/new-reality/public/assets/js/grid/grid.js
@@ -0,0 +1,154 @@
+var Grid = (function(){
+
+ var Grid = function(opt){
+ var horizontal = this.horizontal = []
+ var vertical = this.vertical = []
+ var x, xmin, xmax
+ var y, ymin, ymax
+ var dx = opt.strokeWidth + opt.side
+ var dy = dx
+ var i
+ var s
+
+ opt = this.opt = defaults(opt, {
+ bg: "#ffffff",
+ stroke: "#000000",
+ strokeWidth: 2,
+ side: 10,
+ delay: 0,
+ shuffleDelay: false,
+ randomizeDelay: false,
+ duration: 500,
+ width: 300,
+ height: 300,
+ halign: "left",
+ valign: "top",
+ snap: null,
+ })
+ if (typeof opt.stroke == 'string') opt.stroke = [opt.stroke]
+ if (typeof opt.delay == 'string') opt.delay = [opt.delay]
+
+ if (opt.snap) {
+ s = this.snap = opt.snap
+ } else {
+ s = this.snap = Snap(opt.width, opt.height)
+ s.attr({ viewBox: "0 0 " + opt.width + " " + opt.height })
+ }
+
+ switch (opt.halign) {
+ case "right":
+ ymin = opt.height % dy
+ ymax = opt.height + 1
+ break
+ default:
+ case "left":
+ ymin = 0
+ ymax = opt.height
+ break
+ }
+
+ switch (opt.valign) {
+ case "bottom":
+ xmin = opt.width % dx
+ xmax = opt.width + 1
+ break
+ default:
+ case "top":
+ xmin = 0
+ xmax = opt.width
+ break
+ }
+
+ this.bg = s.rect(0, 0, "100%", "100%").attr({ fill: opt.bg })
+
+ this.pos = {
+ dx: dx, xmin: xmin, xmax: xmax,
+ dy: dy, ymin: ymin, ymax: ymax,
+ }
+
+ for (i = 0, x = xmin; x < xmax; x += dx, i++) {
+ vertical.push( s.path().attr({
+ strokeWidth: opt.strokeWidth,
+ stroke: opt.stroke[ i % opt.stroke.length ],
+ }) )
+ }
+ for (i = 0, y = ymin; y < ymax; y += dy, i++) {
+ horizontal.push( s.path().attr({
+ strokeWidth: opt.strokeWidth,
+ stroke: opt.stroke[ i % opt.stroke.length ],
+ }) )
+ }
+ }
+
+ Grid.prototype.animate = function(opt, cb){
+ opt = defaults(opt, {
+ h: "right",
+ v: "down",
+ })
+ var duration = this.opt.duration
+ var height = this.opt.height, width = this.opt.width
+ var x = this.pos.xmin, y = this.pos.ymin
+ var right = opt.h == "right"
+ var down = opt.v == "down"
+
+ this.vertical.forEach(function(p, i){
+ var start_path, end_path
+ if (down) {
+ start_path = vpath( x, 0, 0 )
+ end_path = vpath( x, 0, height )
+ }
+ else {
+ start_path = vpath( x, height, 0 )
+ end_path = vpath( x, height, -height )
+ }
+ var delay = this.opt.randomizeDelay
+ ? choice(this.opt.delay)
+ : this.opt.delay[i % this.opt.delay.length]
+ p.attr({ d: start_path })
+ setTimeout(function(){
+ p.animate({ d: end_path }, duration)
+ }, delay)
+ x += this.pos.dx
+ }.bind(this))
+
+ this.horizontal.forEach(function(p, i){
+ var start_path, end_path
+ if (right) {
+ start_path = hpath( 0, y, 0 )
+ end_path = hpath( 0, y, width )
+ }
+ else {
+ start_path = hpath( width, y, 0 )
+ end_path = hpath( width, y, -width )
+ }
+
+ var delay
+ if (this.opt.shuffleDelay) {
+ delay = randrange.apply(null, this.opt.delay)
+ }
+ else if (this.opt.randomizeDelay) {
+ delay = choice(this.opt.delay)
+ }
+ else {
+ delay = this.opt.delay[i % this.opt.delay.length]
+ }
+ p.attr({ d: start_path })
+ setTimeout(function(){
+ p.animate({ d: end_path }, duration)
+ }, delay)
+ y += this.pos.dy
+ }.bind(this))
+
+ var max_delay = Math.max.apply(Math, this.opt.delay)
+ cb && setTimeout(cb, this.opt.duration + max_delay + 20)
+ }
+
+ function hpath (x, y, w) {
+ return "M" + x + " " + y + "h" + w
+ }
+ function vpath (x, y, w) {
+ return "M" + x + " " + y + "v" + w
+ }
+
+ return Grid
+})()