Skip to content

Instantly share code, notes, and snippets.

@wemakeweb
Created November 7, 2012 12:03
Show Gist options
  • Select an option

  • Save wemakeweb/4031100 to your computer and use it in GitHub Desktop.

Select an option

Save wemakeweb/4031100 to your computer and use it in GitHub Desktop.
function Animation(e, t, n, r) {
this.offset = r || function() {
return 0
}, r = this.offset(viewportHeight), this.element = e;
var i = e.offsetTop;
this.start = i + r, this.height = e.offsetHeight, this.end = this.height + i, this.state = 0, this.animation = t, this.reset = n
}
window.requestAnimFrame = function() {
return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function(e) {
window.setTimeout(e, 1e3 / 60)
}
}();
var navigation = document.getElementById("navigation"), stopwatchIndicator = document.getElementById("stopwatch-indicator"), stopwatchIndicatorSmall = document.getElementById("stopwatch-indicator-small"), iphoneContent = document.getElementById("iphone-content"), banner = document.getElementById("banner"), quotes = $("#testimonials"), invoiceStamp = document.getElementById("invoice-stamp"), reportsTooltip = document.getElementById("report-tooltip"), globalScrollPos = 0, viewportHeight = window.innerHeight, animations = [];
AnimationStateIdle = 0, AnimationStateAnimating = 1, Animation.prototype.resize = function(e) {
var t = this.element.offsetTop;
this.start = t + this.offset(e), this.height = this.element.offsetHeight, this.end = this.height + t
}, Animation.prototype.animate = function(e, t) {
if (this.end < e) {
this.state == AnimationStateAnimating && (this.reset(), this.state = AnimationStateIdle);
return
}
if (this.start > e) {
this.state == AnimationStateAnimating && (this.reset(), this.state = AnimationStateIdle);
return
}
this.state = AnimationStateAnimating, this.animation.call(this, e)
};
if ($("body").hasClass("index")) {
var rotate = new Animation(document.getElementById("timetracking"), function(e) {
stopwatchIndicator.style.webkitTransform = "rotate(" + Math.floor(e / 2) + "deg)"
}, function() {
}, function(e) {
return -1 * e
});
animations.push(rotate);
var invoice = new Animation(document.getElementById("invoice"), function(e) {
var t = -1 * this.height + (e - this.start);
this.element.style.backgroundPosition = "0px " + Math.max(t / 2 * -1, 0) + "px", invoiceStamp.style.webkitTransform = "scale(" + Math.max(1 + t / 200 * -1, 1) + ")", invoiceStamp.style.opacity = Math.min(1 - t / 300 * -1, 1)
}, function() {
this.element.style.backgroundPosition = "0px 0px"
}, function(e) {
return -1 * e
});
animations.push(invoice);
var report = new Animation(document.getElementById("reports"), function(e) {
var t = -1 * this.height + (e - this.start);
reportsTooltip.style.opacity = Math.max(Math.min(t / 300, 1), 0), reportsTooltip.style.webkitTransform = "scale(" + Math.max(Math.min(t / 300, 1), 0) + ")"
}, function() {
}, function(e) {
return -1 * viewportHeight - 150
});
animations.push(report);
var iphone = new Animation(document.getElementById("iphone"), function(e) {
var t = -1 * this.height + (e - this.start), n = Math.max(t / 2 * -1, 0) + "px 0px";
iphoneContent.style.backgroundPosition = n
}, function() {
iphoneContent.style.backgroundPosition = "0px 0px"
}, function(e) {
return -1 * e + 100
});
animations.push(iphone), function e() {
var t = $(window).scrollTop();
if (t == globalScrollPos) {
window.requestAnimFrame(e);
return
}
t > 0 ? $(navigation).addClass("shadow") : $(navigation).removeClass("shadow"), t > 95 ? $(navigation).addClass("blue-signup") : $(navigation).removeClass("blue-signup"), globalScrollPos = t;
for (var n = animations.length - 1; n >= 0; n--) {
var r = animations[n];
r.animate(t, viewportHeight)
}
window.requestAnimFrame(e)
}()
}
var resizeTimeout;
$(window).on("resize", function() {
resizeTimeout && clearTimeout(resizeTimeout), resizeTimeout = setTimeout(function() {
viewportHeight = window.innerHeight;
for (var e = animations.length - 1; e >= 0; e--) {
var t = animations[e];
t.resize(viewportHeight)
}
}, 100)
}), $(window).load(function() {
$("#banner-icons").on("click", "a", function() {
return scrollTo($(this).attr("href")), !1
})
}), function() {
this.ScreenshotModal = function() {
function e(e, t) {
var n = this;
this.modal = document.getElementById("screenshot-modal"), this.overlay = document.getElementById("screenshot-overlay"), this.screenshots = $(e).children(), this.thumbnails = document.getElementById("screenshot-modal-thumbnails"), this.image = document.getElementById("screenshot-modal-image"), this.update(t), this.show(), this.windowDestroy = function(e) {
if (e.target.getAttribute("id") === "screenshot-overlay")
return n.destroy()
}, this.boundDestroy = function() {
return n.destroy()
}, this.keyupDestroy = function(e) {
if (e.keyCode === 27)
return n.destroy()
}, $(window).on("click", this.windowDestroy), $(document.getElementById("screenshot-modal-close")).on("click", this.boundDestroy), $(document).on("keyup", this.keyupDestroy)
}
return e.prototype.update = function(e) {
var t, n, r, i, s, o, u, a, f = this;
this.empty(), i = this.screenshots[e], n = document.createElement("img"), n.id = "screenshot-image", n.width = "850", n.height = "445", n.alt = i.getAttribute("alt"), n.src = i.getAttribute("data-fullsize"), a = this.screenshots;
for (t = o = 0, u = a.length; o < u; t = ++o)
r = a[t], s = document.createElement("img"), s.width = "100", s.height = "70", s.className = "thumbnail", t === e && (s.className = "selected thumbnail"), s.alt = r.getAttribute("alt"), s.src = r.getAttribute("src"), this.thumbnails.appendChild(s);
return this.image.appendChild(n), $(this.thumbnails).on("click", "img", function(e) {
return f.update($(e.currentTarget).index())
})
}, e.prototype.show = function() {
return $(this.modal).addClass("visible"), $(this.overlay).addClass("visible")
}, e.prototype.destroy = function() {
return $(this.modal).removeClass("visible"), $(this.overlay).removeClass("visible"), this.empty(), $(window).off("click", this.windowDestroy), $(document.getElementById("screenshot-modal-close")).off("click", this.boundDestroy), $(document).off("keyup", this.keyupDestroy)
}, e.prototype.empty = function() {
return $(this.thumbnails).off("click"), this.image.innerHTML = "", this.thumbnails.innerHTML = ""
}, e
}(), this.LoginModal = function() {
function e() {
var e = this;
this.modal = document.getElementById("login-modal"), this.overlay = document.getElementById("screenshot-overlay"), this.domain = document.getElementById("ballpark-login-domain"), this.form = document.getElementById("login-form"), this.$domain = $(this.domain), this.$label = this.$domain.prev("label"), this.show(), this.domain.focus(), this.$domain.on("change blur keyup", function() {
return e.hasValue() ? e.hideLabel() : e.focusLabel()
}), this.$domain.on("focus", function() {
return e.hasValue() ? e.hideLabel() : e.focusLabel()
}), this.$domain.on("blur", function() {
return e.hasValue() ? e.hideLabel() : e.showLabel()
}), $(window).on("click", function(t) {
if (t.target.getAttribute("id") === "screenshot-overlay")
return e.destroy()
}), $(document.getElementById("login-modal-close")).on("click", function() {
return e.destroy()
}), $(document).on("keyup", function(t) {
if (t.keyCode === 27)
return e.destroy()
}), $(this.form).on("submit", function(t) {
return t.preventDefault(), e.hasValue() ? window.location = "https://" + e.value() + ".ballparkapp.com" : e.$domain.parent().addClass("error"), !1
})
}
return e.prototype.hasValue = function() {
return this.value().length > 0
}, e.prototype.value = function() {
return $.trim(this.domain.value)
}, e.prototype.showLabel = function() {
return this.$label.removeClass("focus hastext")
}, e.prototype.focusLabel = function() {
return this.$label.addClass("focus"), this.$label.removeClass("hastext")
}, e.prototype.hideLabel = function() {
return this.$label.addClass("hastext"), this.$label.removeClass("focus")
}, e.prototype.show = function() {
return $(this.modal).addClass("visible"), $(this.overlay).addClass("visible")
}, e.prototype.destroy = function() {
return $(this.modal).removeClass("visible"), $(this.overlay).removeClass("visible"), this.$domain.parent().removeClass("error")
}, e
}(), $(".screenshots").on("click", "img", function() {
var e;
return e = new ScreenshotModal($(this).parent(), $(this).index())
}), $(".screenshots .open").on("click", function() {
var e;
return e = new ScreenshotModal($(this).prev(), 0)
}), $(".login").on("click", function() {
var e, t;
return t = getCookie("loginsubdomain"), t ? ($(this).attr("href", "http://" + t + ".ballparkapp.com"), !0) : (e = new LoginModal, !1)
})
}.call(this), function() {
var e;
this.Quotes = function() {
function e(e) {
var t, n = this;
this.$testimonials = $(e), this.$quotes = this.$testimonials.find(".quotes"), this.$people = this.$testimonials.find(".people"), this.numQuotes = this.$quotes.find("li").length - 1, this.remove(), t = Math.floor(Math.random() * this.numQuotes), this.update(t), this.$people.on("click", "li", function(e) {
return n.update($(e.currentTarget).index() + 1)
});
return
}
return e.prototype.update = function(e) {
return this.currentQuote = this.$testimonials.find("ul.quotes li.selected").index(), this.nextQuote = this.currentQuote + 1 > this.numQuotes ? 0 : this.currentQuote + 1, this.numQuotes = this.$quotes.find("li").length - 1, !!e && e - 1 <= this.numQuotes && (this.nextQuote = e - 1), this.$quotes.find("li").removeClass("selected").eq(this.nextQuote).addClass("selected"), this.$people.find("li").removeClass("selected").eq(this.nextQuote).addClass("selected")
}, e.prototype.remove = function() {
var e;
if (this.numQuotes > 3)
return e = Math.floor(Math.random() * this.numQuotes), $(this.$quotes.find("li")[e]).remove(), $(this.$people.find("li")[e]).remove(), this.numQuotes = this.$quotes.find("li").length - 1, this.remove()
}, e
}(), e = new Quotes(document.getElementById("testimonials"))
}.call(this);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment