-
Notifications
You must be signed in to change notification settings - Fork 8.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Fix onebox loading on every keystroke after a request fails.
- Loading branch information
Showing
5 changed files
with
161 additions
and
92 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,89 +1,106 @@ | ||
/** | ||
A helper for looking up oneboxes and displaying them | ||
For now it only stores in a var, in future we can change it so it uses localStorage. | ||
For now it only stores in a local Javascript Object, in future we can change it so it uses localStorage | ||
or some other mechanism. | ||
@class Notification | ||
@extends Discourse.Model | ||
@class Onebox | ||
@namespace Discourse | ||
@module Discourse | ||
**/ | ||
Discourse.Onebox = (function() { | ||
|
||
var cache, load, localCache, lookup, lookupCache; | ||
localCache = {}; | ||
|
||
cache = function(url, contents) { | ||
localCache[url] = contents; | ||
return null; | ||
}; | ||
|
||
lookupCache = function(url) { | ||
var cached; | ||
cached = localCache[url]; | ||
if (cached && cached.then) { | ||
return null; | ||
} else { | ||
return cached; | ||
} | ||
}; | ||
Discourse.Onebox = { | ||
|
||
lookup = function(url, refresh, callback) { | ||
var cached; | ||
cached = localCache[url]; | ||
if (refresh && cached && !cached.then) { | ||
cached = null; | ||
} | ||
if (cached) { | ||
if (cached.then) { | ||
cached.then(callback(lookupCache(url))); | ||
} else { | ||
callback(cached); | ||
} | ||
return false; | ||
} else { | ||
cache(url, jQuery.get("/onebox", { | ||
url: url, | ||
refresh: refresh | ||
}, function(html) { | ||
cache(url, html); | ||
return callback(html); | ||
})); | ||
return true; | ||
} | ||
}; | ||
// The cache is just a JS Object | ||
localCache: {}, | ||
|
||
// A cache of failed URLs | ||
failedCache: {}, | ||
|
||
/** | ||
Perform a lookup of a onebox based an anchor element. It will insert a loading | ||
indicator and remove it when the loading is complete or fails. | ||
@method load | ||
@param {HTMLElement} e the anchor element whose onebox we want to look up | ||
@param {Boolean} refresh true if we want to force a refresh of the onebox | ||
**/ | ||
load: function(e, refresh) { | ||
|
||
load = function(e, refresh) { | ||
var $elem, loading, url; | ||
if (!refresh) refresh = false; | ||
var $elem = $(e); | ||
|
||
url = e.href; | ||
$elem = $(e); | ||
if ($elem.data('onebox-loaded')) { | ||
return; | ||
// If the onebox has loaded, return | ||
if ($elem.data('onebox-loaded')) return; | ||
if ($elem.hasClass('loading-onebox')) return; | ||
|
||
var url = e.href; | ||
|
||
// Unless we're forcing a refresh... | ||
if (!refresh) { | ||
// If we have it in our cache, return it. | ||
var cached = this.localCache[url]; | ||
if (cached) return cached; | ||
|
||
// If the request failed, don't do anything | ||
var failed = this.failedCache[url]; | ||
if (failed) return; | ||
} | ||
loading = lookup(url, refresh, function(html) { | ||
|
||
// Add the loading CSS class | ||
$elem.addClass('loading-onebox'); | ||
|
||
// Retrieve the onebox | ||
var promise = $.ajax({ | ||
type: 'GET', | ||
url: "/onebox", | ||
data: { url: url, refresh: refresh } | ||
}); | ||
|
||
// We can call this when loading is complete | ||
var loadingFinished = function() { | ||
$elem.removeClass('loading-onebox'); | ||
$elem.data('onebox-loaded'); | ||
if (!html) { | ||
return; | ||
} | ||
if (html.trim().length === 0) { | ||
return; | ||
} | ||
return $elem.replaceWith(html); | ||
}); | ||
if (loading) { | ||
return $elem.addClass('loading-onebox'); | ||
} | ||
}; | ||
|
||
return { | ||
load: load, | ||
lookup: lookup, | ||
lookupCache: lookupCache | ||
}; | ||
var onebox = this; | ||
promise.then(function(html) { | ||
|
||
// successfully loaded onebox | ||
loadingFinished(); | ||
|
||
onebox.localCache[url] = html; | ||
$elem.replaceWith(html); | ||
|
||
}, function() { | ||
// If the request failed log it as such | ||
onebox.failedCache[url] = true; | ||
loadingFinished(); | ||
}); | ||
|
||
}, | ||
|
||
/** | ||
Return the cached contents of a Onebox | ||
@method lookupCache | ||
@param {String} url the url of the onebox | ||
@return {String} the cached contents of the onebox or null if not found | ||
**/ | ||
lookupCache: function(url) { | ||
return this.localCache[url]; | ||
}, | ||
|
||
/** | ||
Store the contents of a Onebox in our local cache. | ||
@method cache | ||
@private | ||
@param {String} url the url of the onebox we crawled | ||
@param {String} contents the contents we want to cache | ||
**/ | ||
cache: function(url, contents) { | ||
this.localCache[url] = contents; | ||
} | ||
|
||
})(); | ||
}; | ||
|
||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters