Skip to content

Commit

Permalink
Merge pull request #109 from mistercrunch/hash_change
Browse files Browse the repository at this point in the history
Getting browser history to work on the explore view
  • Loading branch information
mistercrunch committed Jan 11, 2016
2 parents ac8a78e + f0cdf43 commit 2dbad2d
Show file tree
Hide file tree
Showing 8 changed files with 96 additions and 75 deletions.
1 change: 1 addition & 0 deletions .gitignore
Expand Up @@ -2,6 +2,7 @@
.DS_Store
.coverage
_build
_static
panoramix/bin/panoramixc
build
*.db
Expand Down
1 change: 1 addition & 0 deletions TODO.md
Expand Up @@ -2,6 +2,7 @@
List of TODO items for Panoramix

## Features
* **URL shortner**
* **Dashboard URL filters:** `{dash_url}#fltin__fieldname__value1,value2`
* **Browser history in explore.html:** use location.hash to manage query history
* **Default slice:** choose a default slice for the dataset instead of default endpoint
Expand Down
1 change: 1 addition & 0 deletions docs/img
Binary file removed docs/img/tux_panoramix.png
Binary file not shown.
96 changes: 83 additions & 13 deletions panoramix/static/panoramix.js
Expand Up @@ -19,11 +19,19 @@ var px = (function() {
$('#timer').text(num.toFixed(2) + " sec");
}
var qrystr = '';
var always = function(data) {
//Private f, runs after done and error
clearInterval(timer);
$('#timer').removeClass('btn-warning');
}
slice = {
jsonEndpoint: function() {
data: data,
container: container,
container_id: container_id,
selector: selector,
querystring: function(){
var parser = document.createElement('a');
parser.href = data.json_endpoint;
// Shallow copy
if (dashboard !== undefined){
qrystr = parser.search + "&extra_filters=" + JSON.stringify(dashboard.filters);
}
Expand All @@ -33,7 +41,12 @@ var px = (function() {
else {
qrystr = '?' + $('#query').serialize();
}
var endpoint = parser.pathname + qrystr + "&json=true";
return qrystr;
},
jsonEndpoint: function() {
var parser = document.createElement('a');
parser.href = data.json_endpoint;
var endpoint = parser.pathname + this.querystring() + "&json=true";
return endpoint;
},
done: function (data) {
Expand All @@ -45,28 +58,29 @@ var px = (function() {
$('#timer').removeClass('btn-warning');
$('#timer').addClass('btn-success');
$('span.query').removeClass('disabled');
$('#json').click(function(){window.location=data.json_endpoint()});
$('#standalone').click(function(){window.location=data.standalone_endpoint});
$('#csv').click(function(){window.location=data.csv_endpoint});
$('.btn-group.results span').removeAttr('disabled');
always(data);
},
error: function (msg) {
clearInterval(timer);
token.find("img.loading").hide();
var err = '<div class="alert alert-danger">' + msg + '</div>';
container.html(err);
container.show();
$('#timer').removeClass('btn-warning');
$('span.query').removeClass('disabled');
$('#timer').addClass('btn-danger');
always(data);
},
data: data,
container: container,
container_id: container_id,
selector: selector,
width: function(){
return token.width();
},
height: function(){
return token.height();
},
render: function() {
$('.btn-group.results span').attr('disabled','disabled');
token.find("img.loading").show();
container.hide();
container.html('');
Expand All @@ -75,9 +89,6 @@ var px = (function() {
$('#timer').removeClass('btn-danger btn-success');
$('#timer').addClass('btn-warning');
viz.render();
$('#json').click(function(){window.location=slice.jsonEndpoint()});
$('#standalone').click(function(){window.location=slice.data.standalone_endpoint});
$('#csv').click(function(){window.location=slice.data.csv_endpoint});
},
resize: function() {
token.find("img.loading").show();
Expand Down Expand Up @@ -146,11 +157,62 @@ var px = (function() {
}

function registerViz(name, initViz) {

visualizations[name] = initViz;
}

function initExploreView() {

function get_collapsed_fieldsets(){
collapsed_fieldsets = $("#collapsed_fieldsets").val();
if (collapsed_fieldsets != undefined && collapsed_fieldsets != "")
collapsed_fieldsets = collapsed_fieldsets.split('||');
else
collapsed_fieldsets = [];
return collapsed_fieldsets;
}

function toggle_fieldset(legend, animation) {
var parent = legend.parent();
fieldset = parent.find(".legend_label").text();
collapsed_fieldsets = get_collapsed_fieldsets();

if (!parent.hasClass("collapsed")){
if (animation)
parent.find(".fieldset_content").slideUp();
else
parent.find(".fieldset_content").hide();

parent.addClass("collapsed");
parent.find("span.collapser").text("[+]");
var index = collapsed_fieldsets.indexOf(fieldset);
if (index === -1 && fieldset !== "" && fieldset !== undefined) {
collapsed_fieldsets.push(fieldset);
}
} else {
if (animation)
parent.find(".fieldset_content").slideDown();
else
parent.find(".fieldset_content").show();
parent.removeClass("collapsed");
parent.find("span.collapser").text("[-]");

// removing from array, js is overcomplicated
var index = collapsed_fieldsets.indexOf(fieldset);
if (index !== -1) {
collapsed_fieldsets.splice(index, 1);
}
}
$("#collapsed_fieldsets").val(collapsed_fieldsets.join("||"));
}

$('legend').click(function () {
toggle_fieldset($(this), true);
});
$("#viz_type").change(function() {$("#query").submit();});
collapsed_fieldsets = get_collapsed_fieldsets();
for(var i=0; i < collapsed_fieldsets.length; i++){
toggle_fieldset($('legend:contains("' + collapsed_fieldsets[i] + '")'), false);
}
function getParam(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
Expand Down Expand Up @@ -205,10 +267,18 @@ var px = (function() {
i++;
});
}
$(window).bind("popstate", function(event) {
// Browser back button
var returnLocation = history.location || document.location;
// Could do something more lightweight here, but we're not optimizing
// for the use of the back button anyways
returnLocation.reload();
});

function druidify(){
prepForm();
$('div.alert').remove();
history.pushState({}, document.title, slice.querystring());
slice.render();
}

Expand Down
3 changes: 2 additions & 1 deletion panoramix/static/widgets/viz_table.js
Expand Up @@ -44,7 +44,8 @@ px.registerViz('table', function(slice) {
}
})
.attr('title', function(d){
return fC(d.val);
if (!isNaN(d.val))
return fC(d.val);
})
.attr('data-sort', function(d){
if (d.isMetric)
Expand Down
67 changes: 6 additions & 61 deletions panoramix/templates/panoramix/explore.html
Expand Up @@ -17,6 +17,8 @@
</div>
{% endmacro %}

{% block title %}TEST{% endblock %}

<div class="datasource">
<form id="query" method="GET" style="display: none;">
<div class="header">
Expand All @@ -35,7 +37,7 @@
</a>
</span>
<span>{{ form.get_field("viz_type")(class_="select2") }}</span>
<div class="btn-group pull-right" role="group">
<div class="btn-group results pull-right" role="group">
<span class="btn btn-default" id="standalone" title="Standalone version, use to embed anywhere" data-toggle="tooltip">
<i class="fa fa-code"></i>
</span>
Expand Down Expand Up @@ -206,67 +208,10 @@ <h4 class="modal-title">Datasource Description</h4>
var slice = px.Slice(data);
$('.slice').data('slice', slice);
slice.render();
});

function get_collapsed_fieldsets(){
collapsed_fieldsets = $("#collapsed_fieldsets").val();
if (collapsed_fieldsets != undefined && collapsed_fieldsets != "")
collapsed_fieldsets = collapsed_fieldsets.split('||');
else
collapsed_fieldsets = [];
return collapsed_fieldsets;
}

function toggle_fieldset(legend, animation) {
var parent = legend.parent();
fieldset = parent.find(".legend_label").text();
collapsed_fieldsets = get_collapsed_fieldsets();

if (!parent.hasClass("collapsed")){
if (animation)
parent.find(".fieldset_content").slideUp();
else
parent.find(".fieldset_content").hide();

parent.addClass("collapsed");
parent.find("span.collapser").text("[+]");
var index = collapsed_fieldsets.indexOf(fieldset);
if (index === -1 && fieldset !== "" && fieldset !== undefined) {
collapsed_fieldsets.push(fieldset);
}
} else {
if (animation)
parent.find(".fieldset_content").slideDown();
else
parent.find(".fieldset_content").show();
parent.removeClass("collapsed");
parent.find("span.collapser").text("[-]");

// removing from array, js is overcomplicated
var index = collapsed_fieldsets.indexOf(fieldset);
if (index !== -1) {
collapsed_fieldsets.splice(index, 1);
}
}
$("#collapsed_fieldsets").val(collapsed_fieldsets.join("||"));
}

$('legend').click(function () {
toggle_fieldset($(this), true);
});
$('#json').click(function () {
window.location = '{{ viz.json_endpoint | safe }}';
});
$('#csv').click(function () {
window.location = '{{ viz.csv_endpoint | safe }}';
});
$('#standalone').click(function () {
window.location = '{{ viz.standalone_endpoint | safe }}';
});
$("#viz_type").change(function() {$("#query").submit();});
collapsed_fieldsets = get_collapsed_fieldsets();
for(var i=0; i < collapsed_fieldsets.length; i++){
toggle_fieldset($('legend:contains("' + collapsed_fieldsets[i] + '")'), false);
}
$(window).on('hashchange', function() {
console.log("change occurred");
});
</script>
{% endblock %}
2 changes: 2 additions & 0 deletions panoramix/viz.py
Expand Up @@ -245,6 +245,8 @@ def data(self):
content = {
'viz_name': self.viz_type,
'json_endpoint': self.json_endpoint,
'csv_endpoint': self.csv_endpoint,
'standalone_endpoint': self.standalone_endpoint,
'token': self.token,
'form_data': self.form_data,
}
Expand Down

0 comments on commit 2dbad2d

Please sign in to comment.