From 7d2f1b15945aa67337b0797e77754f498e2b0fe2 Mon Sep 17 00:00:00 2001 From: Yuki Date: Mon, 11 May 2015 11:28:24 +0530 Subject: [PATCH 1/3] Non-blocking image load --- app/assets/javascripts/settings.coffee | 38 ++++++++++++++++++-------- 1 file changed, 26 insertions(+), 12 deletions(-) diff --git a/app/assets/javascripts/settings.coffee b/app/assets/javascripts/settings.coffee index 6142a7dd..595511ba 100644 --- a/app/assets/javascripts/settings.coffee +++ b/app/assets/javascripts/settings.coffee @@ -4,15 +4,28 @@ evt.preventDefault() $("button[data-target=#modal-passwd]").trigger 'click' +readImage = (file, callback) -> + fr = new FileReader() + fr.addEventListener "load", (e) -> + callback e.target.result + fr.readAsBinaryString file + +freeURL = () -> + +if window.URL? or window.webkitURL? + readImage = (file, callback) -> + callback (window.URL || window.webkitURL).createObjectURL file + freeURL = (url) -> + URL.revokeObjectURL url + # Profile pic ($ document).on 'change', 'input#user_profile_picture[type=file]', -> - input = ($ this)[0] + input = this ($ '#profile-picture-crop-controls').slideUp 400, -> if input.files and input.files[0] - fr = new FileReader() - ($ fr).on 'load', (e) -> + readImage input.files[0], (src) -> cropper = ($ '#profile-picture-cropper') preview = ($ '#profile-picture-preview') @@ -30,6 +43,9 @@ # marginTop: '-' + Math.round(ry * data.y) + 'px' cropper.on 'load', -> + if ({}.toString).call(src) == "[object URL]" + freeURL src + side = if cropper[0].naturalWidth > cropper[0].naturalHeight cropper[0].naturalHeight else @@ -48,17 +64,14 @@ ($ '#profile-picture-crop-controls')[0].dataset.bound = true ($ '#profile-picture-crop-controls').slideDown() - cropper.attr 'src', e.target.result - - fr.readAsDataURL(input.files[0]) + cropper.attr 'src', src ($ document).on 'change', 'input#user_profile_header[type=file]', -> - input = ($ this)[0] + input = this ($ '#profile-header-crop-controls').slideUp 400, -> if input.files and input.files[0] - fr = new FileReader() - ($ fr).on 'load', (e) -> + readImage input.files[0], (src) -> cropper = ($ '#profile-header-cropper') preview = ($ '#profile-header-preview') @@ -69,6 +82,9 @@ ($ '#crop_h_h').val Math.floor(data.h / data.scale) cropper.on 'load', -> + if ({}.toString).call(src) == "[object URL]" + freeURL src + cropper.guillotine width: 1500 height: 350 @@ -82,6 +98,4 @@ ($ '#profile-header-crop-controls')[0].dataset.bound = true ($ '#profile-header-crop-controls').slideDown() - cropper.attr 'src', e.target.result - - fr.readAsDataURL(input.files[0]) + cropper.attr 'src', src From 580e64540382e499c18d66507480361f226f98ef Mon Sep 17 00:00:00 2001 From: Yuki Date: Mon, 11 May 2015 12:31:48 +0530 Subject: [PATCH 2/3] Fix ban.js throwing errors --- app/assets/javascripts/moderation/ban.coffee | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/app/assets/javascripts/moderation/ban.coffee b/app/assets/javascripts/moderation/ban.coffee index 87ec6555..ebb4d7b8 100644 --- a/app/assets/javascripts/moderation/ban.coffee +++ b/app/assets/javascripts/moderation/ban.coffee @@ -1,5 +1,7 @@ -$(document).on "DOMContentLoaded", -> +load = -> parent = $ "#ban-control-super" + return unless parent.length > 0 + parent.find('#_ban').on "change", (event) -> $t = $ this if $t.is(":checked") @@ -56,3 +58,9 @@ $(document).on "DOMContentLoaded", -> console.log jqxhr, status, error showNotification "An error occurred, a developer should check the console for details", false complete: (jqxhr, status) -> + +$(document).on "DOMContentLoaded", -> + load() + +$(document).on "page:load", -> + load() From 2e89758c374e694b574fa534c31f3693ee9dca09 Mon Sep 17 00:00:00 2001 From: Yuki Date: Wed, 27 May 2015 11:11:38 +0530 Subject: [PATCH 3/3] few JS fixes and header parallax (closes #53) --- .../javascripts/application.js.erb.coffee | 7 ++-- app/assets/javascripts/user.coffee | 36 +++++++++++++++++++ 2 files changed, 40 insertions(+), 3 deletions(-) diff --git a/app/assets/javascripts/application.js.erb.coffee b/app/assets/javascripts/application.js.erb.coffee index e322e7fb..1cfd3fa2 100644 --- a/app/assets/javascripts/application.js.erb.coffee +++ b/app/assets/javascripts/application.js.erb.coffee @@ -45,9 +45,10 @@ _ready = -> if typeof sweetAlertInitialize != "undefined" sweetAlertInitialize() - particleground document.getElementById('particles'), - dotColor: '#5e35b1' - lineColor: '#5e35b1' + if document.getElementById('particles')? + particleground document.getElementById('particles'), + dotColor: '#5e35b1' + lineColor: '#5e35b1' $(document).ready _ready $(document).on 'page:load', _ready diff --git a/app/assets/javascripts/user.coffee b/app/assets/javascripts/user.coffee index e12e0407..b08b15f2 100644 --- a/app/assets/javascripts/user.coffee +++ b/app/assets/javascripts/user.coffee @@ -51,3 +51,39 @@ $(document).on "click", "a[data-action=report-user]", (ev) -> btn = $(this) target = btn[0].dataset.target reportDialog "user", target, -> btn.button "reset" + +# parallax +PARALLAX_PREFIX = undefined +if typeof document.documentElement.style.webkitTransform == "string" + PARALLAX_PREFIX = "webkit" +if typeof document.documentElement.style.mozTransform == "string" + PARALLAX_PREFIX = "moz" +if typeof document.documentElement.style.oTransform == "string" + PARALLAX_PREFIX = "o" +if typeof document.documentElement.style.msTransform == "string" + PARALLAX_PREFIX = "ms" +if typeof document.documentElement.style.khtmlTransform == "string" + PARALLAX_PREFIX = "khtml" +if typeof document.documentElement.style.transform == "string" + PARALLAX_PREFIX = "" + +HEADER_PARALLAX = undefined + +if PARALLAX_PREFIX? + PARALLAX_CSS = "transform" + if PARALLAX_PREFIX.length + PARALLAX_CSS = PARALLAX_PREFIX + PARALLAX_CSS.charAt(0).toUpperCase() + PARALLAX_CSS.slice(1) + + window.HEADER_PARALLAX_INERTIA = 0.4; + + HEADER_PARALLAX = -> + header = $("#profile--header:not(.profile--no-header) img")[0] + return unless header? + top = (document.body || document.documentElement).scrollTop * HEADER_PARALLAX_INERTIA + header.style[PARALLAX_CSS] = "translate3d(0px, #{top}px, 0px)"; + + $(window).on "scroll", (event) -> + HEADER_PARALLAX() + +$(document).ready -> + HEADER_PARALLAX() if HEADER_PARALLAX?