knight/datahub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[#67,app][s]: embed support.

Browse Source
This commit is contained in:
Rufus Pollock 2012-04-17 05:24:06 +01:00
parent 27b5cf243f
commit bdbfdd7c34
2 changed files with 29 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/index.html
View File

@ -162,6 +162,8 @@
<div class="modal-body">
<h4>Sharable Link to current View</h4>
<textarea class="view-link" style="width: 100%; height: 100px;"></textarea>
<h4>Embed this View</h4>
<textarea class="view-embed" style="width: 100%; height: 200px;"></textarea>
</div>
</div>

32
app/js/app.js
View File

@ -24,6 +24,10 @@ var ExplorerApp = Backbone.View.extend({
} catch(e) {}
state[key] = value;
});
if (state.embed) {
$('.navbar').hide();
$('body').attr('style', 'padding-top: 0px');
}
}
var dataset = null;
if (state.dataset || state.url) {
@ -53,6 +57,7 @@ var ExplorerApp = Backbone.View.extend({
state: state
});
this._setupPermaLink(this.dataExplorer);
this._setupEmbed(this.dataExplorer);
// HACK (a bit). Issue is that Backbone will not trigger the route
// if you are already at that location so we have to make sure we genuinely switch
@ -63,15 +68,32 @@ var ExplorerApp = Backbone.View.extend({
},
_setupPermaLink: function(explorer) {
var self = this;
var $viewLink = this.el.find('.js-share-and-embed-dialog .view-link');
function makePermaLink(state) {
var qs = recline.View.composeQueryString(state.toJSON());
return window.location.origin + window.location.pathname + qs;
explorer.state.bind('change', function() {
$viewLink.val(self.makePermaLink(explorer.state));
});
$viewLink.val(self.makePermaLink(explorer.state));
},
_setupEmbed: function(explorer) {
var self = this;
var $embedLink = this.el.find('.js-share-and-embed-dialog .view-embed');
function makeEmbedLink(state) {
var link = self.makePermaLink(state);
link = link + '&amp;embed=true';
var out = $.mustache('<iframe src="{{link}}" width="100%" min-height="500px;"></iframe>', {link: link});
return out;
}
explorer.state.bind('change', function() {
$viewLink.val(makePermaLink(explorer.state));
$embedLink.val(makeEmbedLink(explorer.state));
});
$viewLink.val(makePermaLink(explorer.state));
$embedLink.val(makeEmbedLink(explorer.state));
},
makePermaLink: function(state) {
var qs = recline.View.composeQueryString(state.toJSON());
return window.location.origin + window.location.pathname + qs;
},
// setup the loader menu in top bar