Godwin
8 years ago
8 changed files with 442 additions and 309 deletions
@ -1,244 +1,290 @@ |
|||||
(function() { |
(function() { |
||||
window.onerror = function(message, url, lineNumber) { |
window.onerror = function(message, url, lineNumber) { |
||||
//save error and send to server for example.
|
//save error and send to server for example.
|
||||
var request = new XMLHttpRequest(); |
var request = new XMLHttpRequest(); |
||||
request.open('POST', '/js_error', true); |
request.open('POST', '/js_error', true); |
||||
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8'); |
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8'); |
||||
request.send( |
request.send( |
||||
'message=' + encodeURI(message) + |
'message=' + encodeURI(message) + |
||||
'&url=' + encodeURI(url) + |
'&url=' + encodeURI(url) + |
||||
'&lineNumber=' + encodeURI(lineNumber) + |
'&lineNumber=' + encodeURI(lineNumber) + |
||||
'&location=' + encodeURI(window.location.href) |
'&location=' + encodeURI(window.location.href) |
||||
); |
); |
||||
return false; |
return false; |
||||
}; |
}; |
||||
window.forEach = function(a, f) { Array.prototype.forEach.call(a, f) }; |
window.forEach = function(a, f) { Array.prototype.forEach.call(a, f) }; |
||||
window.forEachElement = function(s, f, p) { forEach((p || document).querySelectorAll(s), f) }; |
window.forEachElement = function(s, f, p) { forEach((p || document).querySelectorAll(s), f) }; |
||||
|
|
||||
var overlay = document.getElementById('content-overlay'); |
var overlay = document.getElementById('content-overlay'); |
||||
if (overlay) { |
if (overlay) { |
||||
var body = document.querySelector('body'); |
var body = document.querySelector('body'); |
||||
var primaryContent = document.getElementById('primary-content'); |
var primaryContent = document.getElementById('primary-content'); |
||||
primaryContent.addEventListener('keydown', function(event) { |
primaryContent.addEventListener('keydown', function(event) { |
||||
if (body.classList.contains('has-overlay')) { |
if (body.classList.contains('has-overlay')) { |
||||
event.stopPropagation(); |
event.stopPropagation(); |
||||
return false; |
return false; |
||||
} |
} |
||||
}); |
}); |
||||
document.addEventListener('focus', function(event) { |
document.addEventListener('focus', function(event) { |
||||
if (overlay.querySelector('.dlg.open') && !overlay.querySelector('.dlg.open :focus')) { |
if (overlay.querySelector('.dlg.open') && !overlay.querySelector('.dlg.open :focus')) { |
||||
overlay.querySelector('.dlg.open').focus(); |
overlay.querySelector('.dlg.open').focus(); |
||||
} |
} |
||||
}, true); |
}, true); |
||||
window.openOverlay = function(dlg, primaryContent, body) { |
window.openOverlay = function(dlg, primaryContent, body) { |
||||
primaryContent.setAttribute('aria-hidden', 'true'); |
primaryContent.setAttribute('aria-hidden', 'true'); |
||||
body.classList.add('has-overlay'); |
body.classList.add('has-overlay'); |
||||
var type = dlg.getAttribute('data-type'); |
var type = dlg.getAttribute('data-type'); |
||||
if (type) { |
if (type) { |
||||
body.classList.add('is-' + type + '-dlg'); |
body.classList.add('is-' + type + '-dlg'); |
||||
} |
} |
||||
dlg.removeAttribute('aria-hidden'); |
dlg.removeAttribute('aria-hidden'); |
||||
dlg.setAttribute('role', 'alertdialog'); |
dlg.setAttribute('role', 'alertdialog'); |
||||
dlg.setAttribute('tabindex', '0'); |
dlg.setAttribute('tabindex', '0'); |
||||
dlg.focus(); |
dlg.focus(); |
||||
setTimeout(function() { dlg.classList.add('open'); }, 100); |
setTimeout(function() { dlg.classList.add('open'); }, 100); |
||||
} |
} |
||||
window.closeOverlay = function(dlg, primaryContent, body) { |
window.closeOverlay = function(dlg, primaryContent, body) { |
||||
setTimeout(function() { |
setTimeout(function() { |
||||
body.classList.remove('has-overlay'); |
body.classList.remove('has-overlay'); |
||||
body.removeAttribute('style'); |
body.removeAttribute('style'); |
||||
}, 250); |
}, 250); |
||||
var type = dlg.getAttribute('data-type'); |
var type = dlg.getAttribute('data-type'); |
||||
if (type) { |
if (type) { |
||||
body.classList.remove('is-' + type + '-dlg'); |
body.classList.remove('is-' + type + '-dlg'); |
||||
} |
} |
||||
primaryContent.removeAttribute('aria-hidden'); |
primaryContent.removeAttribute('aria-hidden'); |
||||
dlg.setAttribute('aria-hidden', 'true'); |
dlg.setAttribute('aria-hidden', 'true'); |
||||
dlg.removeAttribute('tabindex'); |
dlg.removeAttribute('tabindex'); |
||||
dlg.classList.remove('open'); |
dlg.classList.remove('open'); |
||||
dlg.removeAttribute('role'); |
dlg.removeAttribute('role'); |
||||
} |
} |
||||
|
|
||||
function openDlg(dlg, link) { |
function openDlg(dlg, link) { |
||||
document.getElementById('overlay').onclick = |
document.getElementById('overlay').onclick = |
||||
dlg.querySelector('.close').onclick = function() { closeDlg(dlg); }; |
dlg.querySelector('.close').onclick = function() { closeDlg(dlg); }; |
||||
body.setAttribute('style', 'width: ' + body.clientWidth + 'px'); |
body.setAttribute('style', 'width: ' + body.clientWidth + 'px'); |
||||
var msg = link.querySelector('.message'); |
var msg = link.querySelector('.message'); |
||||
if (msg) { |
if (msg) { |
||||
dlg.querySelector('.message').innerHTML = msg.innerHTML |
dlg.querySelector('.message').innerHTML = msg.innerHTML |
||||
} |
} |
||||
if (link.dataset.infoTitle) { |
if (link.dataset.infoTitle) { |
||||
dlg.querySelector('.title').innerHTML = decodeURI(link.dataset.infoTitle); |
dlg.querySelector('.title').innerHTML = decodeURI(link.dataset.infoTitle); |
||||
} |
} |
||||
confirmBtn = dlg.querySelector('.confirm'); |
confirmBtn = dlg.querySelector('.confirm'); |
||||
if (confirmBtn) { |
if (confirmBtn) { |
||||
confirmBtn.addEventListener('click', function(event) { |
confirmBtn.addEventListener('click', function(event) { |
||||
event.preventDefault(); |
event.preventDefault(); |
||||
if (link.tagName == 'BUTTON') { |
if (link.tagName == 'BUTTON') { |
||||
var form = link.parentElement |
var form = link.parentElement |
||||
while (form && form.tagName != 'FORM') { |
while (form && form.tagName != 'FORM') { |
||||
var form = form.parentElement |
var form = form.parentElement |
||||
} |
} |
||||
if (form) { |
if (form) { |
||||
var input = document.createElement('input'); |
var input = document.createElement('input'); |
||||
input.type = 'hidden'; |
input.type = 'hidden'; |
||||
input.name = 'button'; |
input.name = 'button'; |
||||
input.value = link.value; |
input.value = link.value; |
||||
form.appendChild(input); |
form.appendChild(input); |
||||
form.submit(); |
form.submit(); |
||||
} |
} |
||||
} else { |
} else { |
||||
window.location.href = link.getAttribute('href'); |
window.location.href = link.getAttribute('href'); |
||||
} |
} |
||||
}); |
}); |
||||
} |
} |
||||
window.openOverlay(dlg, primaryContent, body); |
window.openOverlay(dlg, primaryContent, body); |
||||
} |
} |
||||
function closeDlg(dlg) { |
function closeDlg(dlg) { |
||||
window.closeOverlay(dlg, primaryContent, body); |
window.closeOverlay(dlg, primaryContent, body); |
||||
} |
} |
||||
|
|
||||
var confirmationDlg = document.getElementById('confirmation-dlg'); |
var confirmationDlg = document.getElementById('confirmation-dlg'); |
||||
forEachElement('[data-confirmation]', function(link) { |
forEachElement('[data-confirmation]', function(link) { |
||||
link.addEventListener('click', function(event) { |
link.addEventListener('click', function(event) { |
||||
event.preventDefault(); |
event.preventDefault(); |
||||
openDlg(confirmationDlg, link); |
openDlg(confirmationDlg, link); |
||||
return false; |
return false; |
||||
}); |
}); |
||||
}); |
}); |
||||
var infoDlg = document.getElementById('info-dlg'); |
var infoDlg = document.getElementById('info-dlg'); |
||||
forEachElement('[data-info-text]', function(link) { |
forEachElement('[data-info-text]', function(link) { |
||||
link.addEventListener('click', function(event) { |
link.addEventListener('click', function(event) { |
||||
event.preventDefault(); |
event.preventDefault(); |
||||
openDlg(infoDlg, link); |
openDlg(infoDlg, link); |
||||
return false; |
return false; |
||||
}); |
}); |
||||
}); |
}); |
||||
var loginDlg = document.getElementById('login-dlg'); |
var loginDlg = document.getElementById('login-dlg'); |
||||
forEachElement('[data-sign-in]', function(link) { |
forEachElement('[data-sign-in]', function(link) { |
||||
link.addEventListener('click', function(event) { |
link.addEventListener('click', function(event) { |
||||
event.preventDefault(); |
event.preventDefault(); |
||||
openDlg(loginDlg, link); |
openDlg(loginDlg, link); |
||||
return false; |
return false; |
||||
}); |
}); |
||||
}); |
}); |
||||
var contactDlg = document.getElementById('contact-dlg'); |
var contactDlg = document.getElementById('contact-dlg'); |
||||
var contactLink = document.getElementById('contact-link'); |
var contactLink = document.getElementById('contact-link'); |
||||
contactLink.addEventListener('click', function(event) { |
contactLink.addEventListener('click', function(event) { |
||||
event.preventDefault(); |
event.preventDefault(); |
||||
openDlg(contactDlg, contactLink); |
openDlg(contactDlg, contactLink); |
||||
return false; |
return false; |
||||
}); |
}); |
||||
} |
} |
||||
|
|
||||
var htmlNode = document.documentElement; |
var htmlNode = document.documentElement; |
||||
document.addEventListener('keydown', function(event) { |
document.addEventListener('keydown', function(event) { |
||||
if (htmlNode.dataset.input != 'kb' && |
if (htmlNode.dataset.input != 'kb' && |
||||
((["input", "textarea", "select", "option"].indexOf(event.target.nodeName.toLowerCase()) < 0 && |
((["input", "textarea", "select", "option"].indexOf(event.target.nodeName.toLowerCase()) < 0 && |
||||
!event.target.attributes.contenteditable) || event.key == "Tab")) { |
!event.target.attributes.contenteditable) || event.key == "Tab")) { |
||||
htmlNode.setAttribute('data-input', 'kb'); |
htmlNode.setAttribute('data-input', 'kb'); |
||||
} |
} |
||||
}); |
}); |
||||
|
|
||||
document.addEventListener('mousemove', function(event) { |
document.addEventListener('mousemove', function(event) { |
||||
if (htmlNode.dataset.input != 'mouse' && (event.movementX || event.movementY)) { |
if (htmlNode.dataset.input != 'mouse' && (event.movementX || event.movementY)) { |
||||
htmlNode.setAttribute('data-input', 'mouse'); |
htmlNode.setAttribute('data-input', 'mouse'); |
||||
} |
} |
||||
}); |
}); |
||||
|
|
||||
var errorField = document.querySelector('.input-field.has-error input, .input-field.has-error textarea'); |
var errorField = document.querySelector('.input-field.has-error input, .input-field.has-error textarea'); |
||||
if (errorField) { |
if (errorField) { |
||||
errorField.focus(); |
errorField.focus(); |
||||
} |
} |
||||
|
|
||||
window.initNodeFunctions = [ function(node) { |
window.initNodeFunctions = [ function(node) { |
||||
forEachElement('.number-field,.email-field,.text-field,.password-field,.search-field', function(field) { |
forEachElement('.number-field,.email-field,.text-field,.password-field,.search-field', function(field) { |
||||
var input = field.querySelector('input'); |
var input = field.querySelector('input'); |
||||
var positionLabel = function(input) { |
var positionLabel = function(input) { |
||||
field.classList[input.value ? 'remove' : 'add']('empty'); |
field.classList[input.value ? 'remove' : 'add']('empty'); |
||||
} |
} |
||||
positionLabel(input); |
positionLabel(input); |
||||
input.addEventListener('keyup', function(event) { |
input.addEventListener('keyup', function(event) { |
||||
positionLabel(event.target); |
positionLabel(event.target); |
||||
}); |
}); |
||||
input.addEventListener('blur', function(event) { |
input.addEventListener('blur', function(event) { |
||||
positionLabel(event.target); |
positionLabel(event.target); |
||||
field.classList.remove('focused'); |
field.classList.remove('focused'); |
||||
}); |
}); |
||||
input.addEventListener('focus', function(event) { |
input.addEventListener('focus', function(event) { |
||||
field.classList.add('focused'); |
field.classList.add('focused'); |
||||
}); |
}); |
||||
}, node || document); |
}, node || document); |
||||
forEachElement('form.js-xhr', function(form) { |
forEachElement('form.js-xhr', function(form) { |
||||
if (form.addEventListener) { |
if (form.addEventListener) { |
||||
form.addEventListener('submit', function(event) { |
form.addEventListener('submit', function(event) { |
||||
event.preventDefault(); |
event.preventDefault(); |
||||
form.classList.add('requesting'); |
form.classList.add('requesting'); |
||||
var data = new FormData(form); |
var data = new FormData(form); |
||||
var request = new XMLHttpRequest(); |
var request = new XMLHttpRequest(); |
||||
request.onreadystatechange = function() { |
request.onreadystatechange = function() { |
||||
if (request.readyState == 4) { |
if (request.readyState == 4) { |
||||
form.classList.remove('requesting'); |
form.classList.remove('requesting'); |
||||
if (request.status == 200) { |
if (request.status == 200) { |
||||
var response = JSON.parse(request.responseText); |
var response = JSON.parse(request.responseText); |
||||
for (var i = 0; i < response.length; i++) { |
for (var i = 0; i < response.length; i++) { |
||||
var element; |
var element; |
||||
if (response[i].selector) { |
if (response[i].selector) { |
||||
element = form.querySelector(response[i].selector); |
element = form.querySelector(response[i].selector); |
||||
} |
} |
||||
if (response[i].globalSelector) { |
if (response[i].globalSelector) { |
||||
element = document.querySelector(response[i].globalSelector); |
element = document.querySelector(response[i].globalSelector); |
||||
} |
} |
||||
|
|
||||
if (response[i].html) { |
if (response[i].html) { |
||||
element.innerHTML = response[i].html; |
element.innerHTML = response[i].html; |
||||
window.initNode(element); |
window.initNode(element); |
||||
} |
} |
||||
if (response[i].className) { |
if (response[i].className) { |
||||
element.className = response[i].className; |
element.className = response[i].className; |
||||
} |
} |
||||
} |
} |
||||
} |
} |
||||
} |
} |
||||
} |
} |
||||
request.open('POST', form.getAttribute('action'), true); |
request.open('POST', form.getAttribute('action'), true); |
||||
request.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); |
request.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); |
||||
request.send(data); |
request.send(data); |
||||
}, false); |
}, false); |
||||
} |
} |
||||
}, node || document); |
}, node || document); |
||||
forEachElement('[data-opens]', function(control) { |
forEachElement('[data-opens]', function(control) { |
||||
control.addEventListener('click', function(event) { |
control.addEventListener('click', function(event) { |
||||
var opens = document.querySelector(control.getAttribute('data-opens')); |
var opens = document.querySelector(control.getAttribute('data-opens')); |
||||
if (!opens.classList.contains('open')){ |
if (!opens.classList.contains('open')){ |
||||
event.preventDefault(); |
event.preventDefault(); |
||||
opens.className += ' open'; |
opens.className += ' open'; |
||||
if (control.getAttribute('data-focus')) { |
if (control.getAttribute('data-focus')) { |
||||
var input = opens.querySelector(control.getAttribute('data-focus')); |
var input = opens.querySelector(control.getAttribute('data-focus')); |
||||
if (input) { |
if (input) { |
||||
input.focus(); |
input.focus(); |
||||
} |
} |
||||
} |
} |
||||
return false; |
return false; |
||||
} |
} |
||||
}); |
}); |
||||
}); |
}); |
||||
} ]; |
} ]; |
||||
window.initNode = function(node) { |
window.initNode = function(node) { |
||||
forEach(initNodeFunctions, function(fn) { |
forEach(initNodeFunctions, function(fn) { |
||||
fn(node); |
fn(node); |
||||
}); |
}); |
||||
}; |
}; |
||||
initNode(); |
initNode(); |
||||
document.addEventListener('DOMContentLoaded', function() { |
document.addEventListener('DOMContentLoaded', function() { |
||||
var errors = document.getElementsByClassName('has-error'); |
var errors = document.getElementsByClassName('has-error'); |
||||
if (errors.length <= 0) { |
if (errors.length <= 0) { |
||||
errors = document.getElementsByClassName('info-message'); |
errors = document.getElementsByClassName('info-message'); |
||||
} |
} |
||||
|
|
||||
if (errors.length > 0) { |
if (errors.length > 0) { |
||||
errors[0].scrollIntoView(); |
errors[0].scrollIntoView(); |
||||
} |
} |
||||
}); |
}); |
||||
})(); |
})(); |
||||
|
|
||||
|
function generateScreenshot() { |
||||
|
var css = ''; |
||||
|
var svgs = document.getElementsByTagName('svg'); |
||||
|
for (var i = 0; i < document.styleSheets.length; i++) { |
||||
|
if (document.styleSheets[i].href && !document.styleSheets[i].href.match(/web\-fonts/)) { |
||||
|
var rules = document.styleSheets[i].rules || document.styleSheets[i].cssRules; |
||||
|
for (var j = 0; j < rules.length; j++) { |
||||
|
cssText = rules[j].cssText; |
||||
|
if (rules[j].selectorText) { |
||||
|
if (rules[j].selectorText.match(/(^|\s)svg[^\w]/) || cssText.match(/\s(fill|stroke(\-width)?):/)) { |
||||
|
css += cssText; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
for (var i = 0; i < svgs.length; i++) { |
||||
|
var svg = svgs[i]; |
||||
|
// svg.innerHTML = '<style type="text/css"><![CDATA[' + css + ']]></style>' + svg.innerHTML;
|
||||
|
svg.innerHTML = '<style type="text/css"><![CDATA[' + css + ']]></style>' + svg.innerHTML; |
||||
|
svg.setAttribute('height', svg.clientHeight); |
||||
|
svg.setAttribute('width', svg.clientWidth); |
||||
|
var canvas = document.createElement('canvas'); |
||||
|
canvg(canvas, svg.outerHTML); |
||||
|
console.log(svg.outerHTML); |
||||
|
svg.style.backgroundImage = 'url(' + encodeURI(canvas.toDataURL('image/png')) + ')'; |
||||
|
} |
||||
|
|
||||
|
html2canvas(document.body, { |
||||
|
logging: true, |
||||
|
profile: true, |
||||
|
useCORS: true}).then(function(canvas) { |
||||
|
var data = canvas.toDataURL('image/jpeg', 0.9); |
||||
|
var src = encodeURI(data); |
||||
|
|
||||
|
window.open(src, '_blank'); |
||||
|
|
||||
|
// reset the svg height and width
|
||||
|
for (var i = 0; i < svgs.length; i++) { |
||||
|
var svg = svgs[i]; |
||||
|
svg.removeAttribute('height'); |
||||
|
svg.removeAttribute('width'); |
||||
|
svg.removeAttribute('style'); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
|||||
@ -1,21 +1,24 @@ |
|||||
# config/initializers/geocoder.rb |
# config/initializers/geocoder.rb |
||||
Geocoder.configure( |
config = { |
||||
# geocoding service (see below for supported options): |
# geocoding service (see below for supported options): |
||||
:lookup => :google, |
lookup: :google, |
||||
|
|
||||
# IP address geocoding service (see below for supported options): |
# IP address geocoding service (see below for supported options): |
||||
:ip_lookup => :freegeoip, |
ip_lookup: :freegeoip, |
||||
|
|
||||
# to use an API key: |
# to use an API key: |
||||
# :api_key => "AIzaSyDitM1lyVWkrumteDvSkje6GiIKYyHlAXM", |
|
||||
|
|
||||
# geocoding service request timeout, in seconds (default 3): |
# geocoding service request timeout, in seconds (default 3): |
||||
:timeout => 5, |
timeout: 5, |
||||
|
|
||||
# set default units to kilometers: |
# set default units to kilometers: |
||||
:units => :km, |
units: :km |
||||
|
} |
||||
|
|
||||
# caching (see below for details): |
# use our api key on the server |
||||
#:cache => Redis.new, |
if Rails.env.preview? || Rails.env.production? |
||||
#:cache_prefix => "..." |
config[:api_key] = "AIzaSyDurfjX9f_NgYsJLyUuGqwdKuI745CE_OE" |
||||
) |
config[:use_https] = true |
||||
|
end |
||||
|
|
||||
|
Geocoder.configure(config) |
||||
|
|||||
Loading…
Reference in new issue