--- /dev/null
+/* InstantClick 2.1 | (C) 2014 Alexandre Dieulot | http://instantclick.io/license.html */
+var InstantClick = function(document, location) {
+ // Internal variables
+ var $currentLocationWithoutHash
+ var $urlToPreload
+ var $preloadTimer
+
+ // Preloading-related variables
+ var $history = {}
+ var $xhr
+ var $url = false
+ var $title = false
+ var $hasBody = true
+ var $body = false
+ var $timing = {}
+ var $isPreloading = false
+ var $isWaitingForCompletion = false
+
+ // Variables defined by public functions
+ var $useWhitelist
+ var $preloadOnMousedown
+ var $delayBeforePreload
+ var $eventsCallbacks = {
+ change: []
+ }
+
+
+ ////////// HELPERS //////////
+
+
+ function removeHash(url) {
+ var index = url.indexOf('#')
+ if (index < 0) {
+ return url
+ }
+ return url.substr(0, index)
+ }
+
+ function getLinkTarget(target) {
+ while (target.nodeName != 'A') {
+ target = target.parentNode
+ }
+ return target
+ }
+
+ function triggerPageEvent(eventType) {
+ for (var i = 0; i < $eventsCallbacks[eventType].length; i++) {
+ $eventsCallbacks[eventType][i]()
+ }
+ }
+
+ function changePage(title, body, newUrl, scrollY_) {
+ var doc = document.implementation.createHTMLDocument('')
+ doc.documentElement.innerHTML = body
+ document.documentElement.replaceChild(doc.body, document.body)
+ /* We cannot just use `document.body = doc.body` as it causes Safari 5.1, 6.0,
+ and Mobile 7.0 to execute script tags directly.
+ */
+
+ var elem = document.createElement('i')
+ elem.innerHTML = title
+ document.title = elem.textContent
+
+ if (newUrl) {
+ history.pushState(null, null, newUrl)
+
+ var hashIndex = newUrl.indexOf('#')
+ var hashElem = hashIndex > -1 && document.getElementById(newUrl.substr(hashIndex + 1))
+ var offset = 0
+ if (hashElem) {
+ for (; hashElem.offsetParent; hashElem = hashElem.offsetParent) {
+ offset += hashElem.offsetTop
+ }
+ }
+ scrollTo(0, offset)
+
+ $currentLocationWithoutHash = removeHash(newUrl)
+ }
+ else {
+ scrollTo(0, scrollY_)
+ }
+
+ instantanize()
+
+ triggerPageEvent('change')
+ }
+
+ function setPreloadingAsHalted() {
+ $isPreloading = false
+ $isWaitingForCompletion = false
+ }
+
+
+ ////////// EVENT HANDLERS //////////
+
+
+ function mousedown(e) {
+ preload(getLinkTarget(e.target).href)
+ }
+
+ function mouseover(e) {
+ var a = getLinkTarget(e.target)
+ a.addEventListener('mouseout', mouseout)
+ if (!$delayBeforePreload) {
+ preload(a.href)
+ }
+ else {
+ $urlToPreload = a.href
+ $preloadTimer = setTimeout(preload, $delayBeforePreload)
+ }
+ }
+
+ function click(e) {
+ if (e.which > 1 || e.metaKey || e.ctrlKey) { // Opening in new tab
+ return
+ }
+ e.preventDefault()
+ display(getLinkTarget(e.target).href)
+ }
+
+ function mouseout() {
+ if ($preloadTimer) {
+ clearTimeout($preloadTimer)
+ $preloadTimer = false
+ return
+ }
+
+ if (!$isPreloading || $isWaitingForCompletion) {
+ return
+ }
+ $xhr.abort()
+ setPreloadingAsHalted()
+ }
+
+ function readystatechange() {
+ if ($xhr.readyState < 4) {
+ return
+ }
+ if ($xhr.status == 0) {
+ /* Request aborted */
+ return
+ }
+
+ $timing.ready = +new Date - $timing.start
+
+ var text = $xhr.responseText
+
+ var titleIndex = text.indexOf('<title')
+ if (titleIndex > -1) {
+ $title = text.substr(text.indexOf('>', titleIndex) + 1)
+ $title = $title.substr(0, $title.indexOf('</title'))
+ }
+
+ var bodyIndex = text.indexOf('<body')
+ if (bodyIndex > -1) {
+ $body = text.substr(bodyIndex)
+ var closingIndex = $body.indexOf('</body')
+ if (closingIndex > -1) {
+ $body = $body.substr(0, closingIndex)
+ }
+
+ var urlWithoutHash = removeHash($url)
+ $history[urlWithoutHash] = {
+ body: $body,
+ title: $title,
+ scrollY: urlWithoutHash in $history ? $history[urlWithoutHash].scrollY : 0
+ }
+ }
+ else {
+ $hasBody = false
+ }
+
+ if ($isWaitingForCompletion) {
+ $isWaitingForCompletion = false
+ display($url)
+ }
+ }
+
+
+ ////////// MAIN FUNCTIONS //////////
+
+
+ function instantanize(isInitializing) {
+ var as = document.getElementsByTagName('a'), a, domain = location.protocol + '//' + location.host
+ for (var i = as.length - 1; i >= 0; i--) {
+ a = as[i]
+ if (a.target || // target="_blank" etc.
+ a.hasAttribute('download') ||
+ a.href.indexOf(domain + '/') != 0 || // another domain (or no href attribute)
+ a.href.indexOf('#') > -1 && removeHash(a.href) == $currentLocationWithoutHash || // link to an anchor
+ ($useWhitelist ? !a.hasAttribute('data-instant') : a.hasAttribute('data-no-instant'))) {
+ continue
+ }
+ if ($preloadOnMousedown) {
+ a.addEventListener('mousedown', mousedown)
+ }
+ else {
+ a.addEventListener('mouseover', mouseover)
+ }
+ a.addEventListener('click', click)
+ }
+ if (!isInitializing) {
+ var scripts = document.getElementsByTagName('script'), script, copy, parentNode, nextSibling
+ for (i = 0, j = scripts.length; i < j; i++) {
+ script = scripts[i]
+ if (script.hasAttribute('data-no-instant')) {
+ continue
+ }
+ copy = document.createElement('script')
+ if (script.src) {
+ copy.src = script.src
+ }
+ if (script.innerHTML) {
+ copy.innerHTML = script.innerHTML
+ }
+ parentNode = script.parentNode
+ nextSibling = script.nextSibling
+ parentNode.removeChild(script)
+ parentNode.insertBefore(copy, nextSibling)
+ }
+ }
+ }
+
+ function preload(url) {
+ if (!$preloadOnMousedown && 'display' in $timing && +new Date - ($timing.start + $timing.display) < 100) {
+ /* After a page is displayed, if the user's cursor happens to be above a link
+ a mouseover event will be in most browsers triggered automatically, and in
+ other browsers it will be triggered when the user moves his mouse by 1px.
+
+ Here are the behavior I noticed, all on Windows:
+ - Safari 5.1: auto-triggers after 0 ms
+ - IE 11: auto-triggers after 30-80 ms (looks like it depends on page's size)
+ - Firefox: auto-triggers after 10 ms
+ - Opera 18: auto-triggers after 10 ms
+
+ - Chrome: triggers when cursor moved
+ - Opera 12.16: triggers when cursor moved
+
+ To remedy to this, we do not start preloading if last display occurred less than
+ 100 ms ago. If they happen to click on the link, they will be redirected.
+ */
+
+ return
+ }
+ if ($preloadTimer) {
+ $clearTimeout($preloadTimer)
+ $preloadTimer = false
+ }
+
+ if (!url) {
+ url = $urlToPreload
+ }
+
+ if ($isPreloading && (url == $url || $isWaitingForCompletion)) {
+ return
+ }
+ $isPreloading = true
+ $isWaitingForCompletion = false
+
+ $url = url
+ $body = false
+ $hasBody = true
+ $timing = {
+ start: +new Date
+ }
+ $xhr.open('GET', url)
+ $xhr.send()
+ }
+
+ function display(url) {
+ if (!('display' in $timing)) {
+ $timing.display = +new Date - $timing.start
+ }
+ if ($preloadTimer) {
+ /* Happens when there’s a delay before preloading and that delay
+ hasn't expired (preloading didn't kick in).
+ */
+
+ if ($url && $url != url) {
+ /* Happens when the user clicks on a link before preloading
+ kicks in while another link is already preloading.
+ */
+
+ location.href = url
+ return
+ }
+ preload(url)
+ $isWaitingForCompletion = true
+ return
+ }
+ if (!$isPreloading || $isWaitingForCompletion) {
+ /* If the page isn't preloaded, it likely means
+ the user has focused on a link (with his Tab
+ key) and then pressed Return, which triggered a click.
+ Because very few people do this, it isn't worth handling this
+ case and preloading on focus (also, focusing on a link
+ doesn't mean it's likely that you'll "click" on it), so we just
+ redirect them when they "click".
+ It could also mean the user hovered over a link less than 100 ms
+ after a page display, thus we didn't start the preload (see
+ comments in `preload()` for the rationale behind this.)
+
+ If the page is waiting for completion, the user clicked twice
+ while the page was preloading.
+ Two possibilities:
+ 1) He clicks on the same link again, either because it's slow
+ to load (there's no browser loading indicator with
+ InstantClick, so he might think his click hasn't registered
+ if the page isn't loading fast enough) or because he has
+ a habit of double clicking on the web;
+ 2) He clicks on another link.
+
+ In the first case, we redirect him (send him to the page the old
+ way) so that he can have the browser's loading indicator back.
+ In the second case, we redirect him because we haven't preloaded
+ that link, since we were already preloading the last one.
+
+ Determining if it's a double click might be overkill as there is
+ (hopefully) not that many people that double click on the web.
+ Fighting against the perception that the page is stuck is
+ interesting though, a seemingly good way to do that would be to
+ later incorporate a progress bar.
+ */
+
+ location.href = url
+ return
+ }
+ if (!$hasBody) {
+ location.href = $url
+ return
+ }
+ if (!$body) {
+ $isWaitingForCompletion = true
+ return
+ }
+ $history[$currentLocationWithoutHash].scrollY = pageYOffset
+ setPreloadingAsHalted()
+ changePage($title, $body, $url)
+ }
+
+
+ ////////// PUBLIC VARIABLE AND FUNCTIONS //////////
+
+
+ var supported = 'pushState' in history
+
+ function init() {
+ if ($currentLocationWithoutHash) {
+ /* Already initialized */
+ return
+ }
+ if (!supported) {
+ triggerPageEvent('change')
+ return
+ }
+ for (var i = arguments.length - 1; i >= 0; i--) {
+ var arg = arguments[i]
+ if (arg === true) {
+ $useWhitelist = true
+ }
+ else if (arg == 'mousedown') {
+ $preloadOnMousedown = true
+ }
+ else if (typeof arg == 'number') {
+ $delayBeforePreload = arg
+ }
+ }
+ $currentLocationWithoutHash = removeHash(location.href)
+ $history[$currentLocationWithoutHash] = {
+ body: document.body.outerHTML,
+ title: document.title,
+ scrollY: pageYOffset
+ }
+ $xhr = new XMLHttpRequest()
+ $xhr.addEventListener('readystatechange', readystatechange)
+
+ instantanize(true)
+
+ triggerPageEvent('change')
+
+ addEventListener('popstate', function() {
+ var loc = removeHash(location.href)
+ if (loc == $currentLocationWithoutHash) {
+ return
+ }
+ if (!(loc in $history)) {
+ location.href = location.href // Reloads the page and makes use of cache for assets, unlike location.reload()
+ return
+ }
+ $history[$currentLocationWithoutHash].scrollY = pageYOffset
+ $currentLocationWithoutHash = loc
+ changePage($history[loc].title, $history[loc].body, false, $history[loc].scrollY)
+ })
+ }
+
+ function on(eventType, callback) {
+ $eventsCallbacks[eventType].push(callback)
+ }
+
+ /* The debug function isn't included by default to reduce file size.
+ To enable it, add a slash at the beginning of the comment englobing
+ the debug function, and uncomment "debug: debug," in the return
+ statement below the function. */
+
+ /*
+ function debug() {
+ return {
+ currentLocationWithoutHash: $currentLocationWithoutHash,
+ history: $history,
+ xhr: $xhr,
+ url: $url,
+ title: $title,
+ hasBody: $hasBody,
+ body: $body,
+ timing: $timing,
+ isPreloading: $isPreloading,
+ isWaitingForCompletion: $isWaitingForCompletion
+ }
+ }
+ //*/
+
+
+ return {
+ // debug: debug,
+ supported: supported,
+ init: init,
+ on: on
+ }
+
+}(document, location);
projects / odoo / odoo.git / commitdiff