Popover to generate iframe html tag when standalone button is clicked (#575)

* fixed

* basic implementation of the iframe embed popover

* remove unecessary comments

* remove public embed iframe

* remove debug print line and public access

* remove uncessary extra line and use better text explain

* maintain the style of airbnb/master

* fixed style

* re-run the test locally. Made sure it passed
This commit is contained in:
Junxian Wu
2016-06-11 07:48:30 -07:00
committed by Maxime Beauchemin
parent a8136bb9f5
commit 4661b0210d
3 changed files with 55 additions and 4 deletions

View File

@@ -194,6 +194,60 @@ function initExploreView() {
});
});
$('#standalone').click(function () {
var src_link = window.location.origin + slice.data.standalone_endpoint;
var dataToCopy = '';
var close = '<a style="cursor: pointer;"><i class="fa fa-close" id="close_standalone"></i></a>';
var copy = '<a style="cursor: pointer;"><i class="fa fa-clipboard" title="Copy to clipboard" id="copy_embed"></i></a>';
var spaces = '&nbsp;&nbsp;&nbsp;';
var widthInput = '<input type="number" id="standalone_width" placeholder="width">';
var heightInput = '<input type="number" id="standalone_height" placeholder="height">';
var popover = "<input id='standalone_text' value='' disabled></input>";
popover = popover + spaces + copy + spaces + close + spaces + widthInput + spaces + heightInput;
var $standalone = $(this);
$standalone.popover({
content: popover,
title: 'embed html',
placement: 'left',
html: true,
trigger: 'manual'
})
.popover('show');
$('#copy_embed').tooltip().click(function () {
var success = copyURLToClipboard(dataToCopy);
if (success) {
$(this).attr("data-original-title", "Copied!").tooltip('fixTitle').tooltip('show');
window.setTimeout(destroyPopover, 1200);
}
});
$('#close_standalone').click(destroyPopover);
function destroyPopover() {
$standalone.popover('destroy');
}
var $standalone_width = $('#standalone_width');
var $standalone_height = $('#standalone_height');
var $standalone_text = $('#standalone_text');
$standalone_height.change(function () {
generateEmbedHTML();
});
$standalone_width.change(function () {
generateEmbedHTML();
});
generateEmbedHTML();
function generateEmbedHTML() {
var width = $standalone_width.val();
var height = $standalone_height.val();
dataToCopy = '<iframe src="' + src_link + '" width="' + width + '" height="' + height +'"';
dataToCopy = dataToCopy + ' seamless frameBorder="0" scrolling="no"></iframe>';
$standalone_text.val(dataToCopy);
}
});
$("#viz_type").change(function () {
$("#query").submit();
});