Skip to content

Commit

Permalink
HUE-417. Beeswax views with big white bar at the bottom
Browse files Browse the repository at this point in the history
This was a change with how SplitView calculates its target size. Previously we always filled the window, but to allow SplitView to nest for multi-split layouts we had to switch to measuring the parent element of the splitview element. This introduced this sizing problem. The new requirement is that the splitview has to be the root element or, if not, the parent of the splitview needs to have a SizeTo filter to configure its height. This happens in our code often when we have a div.view in the root. The simple fix, when possible, is to also make this div the splitview element. I've adjusted this in all our current usages.
  • Loading branch information
anutron committed Feb 3, 2011
1 parent 8251873 commit 81b61d6
Show file tree
Hide file tree
Showing 8 changed files with 385 additions and 394 deletions.
222 changes: 112 additions & 110 deletions apps/beeswax/src/beeswax/templates/describe_table.mako
Original file line number Diff line number Diff line change
Expand Up @@ -16,122 +16,124 @@
<%namespace name="wrappers" file="header_footer.mako" />
<%namespace name="comps" file="beeswax_components.mako" />
${wrappers.head("Beeswax Table Metadata: " + table.tableName, section='tables')}
<div id="describe_table" class="view">
<%def name="column_table(cols)">
<div class="bw-col_table_wrapper">
<table class="sortable" data-filters="HtmlTable" cellpadding="0" cellspacing="0">
<thead>
<%def name="column_table(cols)">
<div class="bw-col_table_wrapper">
<table class="sortable" data-filters="HtmlTable" cellpadding="0" cellspacing="0">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Comment</th>
</tr>
</thead>
<tbody>
% for column in cols:
<tr>
<th>Name</th>
<th>Type</th>
<th>Comment</th>
<td>${ column.name }</td>
<td>${ column.type }</td>
<td>${ column.comment or "" }</td>
</tr>
</thead>
<tbody>
% for column in cols:
<tr>
<td>${ column.name }</td>
<td>${ column.type }</td>
<td>${ column.comment or "" }</td>
</tr>
% endfor
</tbody>
</table>
</div>
</%def>
% endfor
</tbody>
</table>
</div>
</%def>

<div class="resizable" data-filters="SplitView">
<div class="left_col">
<h2>${table.tableName}</h2>
<div class="jframe_padded">
<dl>
% if table.parameters.get("comment", False):
<dt class="hue-dt_cap">Description</dt>
<dd class="hue-dd_bottom">${ table.parameters.get("comment") }</dd>
% endif
<dt class="hue-dt_cap">Actions</dt>
<dd class="hue-dd_bottom bw-actions">
<ul>
<li class="jframe-clear" data-filters="CollapsingElements"><a class="bw-load_data collapser">Import Data</a>
<div class="collapsible jframe-hidden">
<form action="${ url("beeswax.views.load_table", table=table_name) }">
<dl>
<div class="bw-dataNote">
Note that loading data will move data from its location into the table's storage location.
</div>
## Any existing data will be erased!
<div class="bw-overwriteLabel">Overwrite existing data ? <input type="checkbox" name="overwrite" class="bw-overwriteCheckbox"/></div>
##Path (on HDFS) of files to load.
${comps.field(load_form["path"], title_klass='bw-pathLabel', attrs=dict(
klass='bw-loadPath',
data_filters="OverText",
alt='/user/data'))}
<div class="clearfix" data-filters="ArtButtonBar">
<a class="hue-choose_file" data-filters="ArtButton"
data-icon-styles="{'width': 16, 'height': 16, 'top': 1, 'left': 4 }" data-chooseFor="path">Choose File</a>
<input type="submit" class="bw-loadSubmit" data-filters="ArtButton" value="Submit"/>
</div>

% for pf in load_form.partition_columns:
${comps.field(load_form[pf], render_default=True)}
% endfor
## This table is partitioned. Therefore,
## you must specify what partition
## this data corresponds to.
</dl>
</form>
</div>
</li>
<li class="jframe-clear"><a href="${ url("beeswax.views.read_table", table=table_name) }" class="bw-browse_data">Browse Data</a></li>
<li class="jframe-clear"><a href="${ url("beeswax.views.drop_table", table=table_name) }" class="bw-drop_table">Drop Table</a></li>
<li class="jframe-clear"><a href="${hdfs_link}" target="FileBrowser" class="tip bw-location_link" data-filters="PointyTip" data-tip-direction="11" rel="${ table.sd.location }">View File Location</a></li>
</ul>
</dd>
</dl>
</div>
<div id="describe_table resizable" class="view" data-filters="SplitView">
<div class="left_col">
<h2>${table.tableName}</h2>
<div class="jframe_padded">
<dl>
% if table.parameters.get("comment", False):
<dt class="hue-dt_cap">Description</dt>
<dd class="hue-dd_bottom">${ table.parameters.get("comment") }</dd>
% endif
<dt class="hue-dt_cap">Actions</dt>
<dd class="hue-dd_bottom bw-actions">
<ul>
<li class="jframe-clear" data-filters="CollapsingElements"><a class="bw-load_data collapser">Import Data</a>
<div class="collapsible jframe-hidden">
<form action="${ url("beeswax.views.load_table", table=table_name) }">
<dl>
<div class="bw-dataNote">
Note that loading data will move data from its location into the table's storage location.
</div>
## Any existing data will be erased!
<div class="bw-overwriteLabel">Overwrite existing data ? <input type="checkbox" name="overwrite" class="bw-overwriteCheckbox"/></div>
##Path (on HDFS) of files to load.
${comps.field(load_form["path"], title_klass='bw-pathLabel', attrs=dict(
klass='bw-loadPath',
data_filters="OverText",
alt='/user/data'))}
<div class="clearfix" data-filters="ArtButtonBar">
<a class="hue-choose_file" data-filters="ArtButton"
data-icon-styles="{'width': 16, 'height': 16, 'top': 1, 'left': 4 }" data-chooseFor="path">Choose File</a>
<input type="submit" class="bw-loadSubmit" data-filters="ArtButton" value="Submit"/>
</div>

% for pf in load_form.partition_columns:
${comps.field(load_form[pf], render_default=True)}
% endfor
## This table is partitioned. Therefore,
## you must specify what partition
## this data corresponds to.
</dl>
</form>
</div>
</li>
<li class="jframe-clear"><a href="${ url("beeswax.views.read_table", table=table_name) }" class="bw-browse_data">Browse Data</a></li>
<li class="jframe-clear"><a href="${ url("beeswax.views.drop_table", table=table_name) }" class="bw-drop_table">Drop Table</a></li>
<li class="jframe-clear"><a href="${hdfs_link}" target="FileBrowser" class="tip bw-location_link" data-filters="PointyTip" data-tip-direction="11" rel="${ table.sd.location }">View File Location</a></li>
</ul>
</dd>
</dl>
</div>
<div class="right_col">
<div data-filters="Tabs">
<ul class="toolbar tabs">
% if top_rows is not None:
<li><span>Sample</span></li>
% endif
<li><span>Columns</span></li>
% if len(table.partitionKeys) > 0:
<li><span>Partition Columns</span></li>
% endif
</ul>
<ul class="tab_sections jframe-clear">
% if top_rows is not None:
<li class="bw-table_sample">
<table data-filters="HtmlTable" cellpadding="0" cellspacing="0">
<thead>
</div>
<div class="right_col">
<div data-filters="Tabs">
<ul class="toolbar tabs">
% if top_rows is not None:
<li><span>Sample</span></li>
% endif
<li><span>Columns</span></li>
% if len(table.partitionKeys) > 0:
<li><span>Partition Columns</span></li>
% endif
</ul>
<ul class="tab_sections jframe-clear">
% if top_rows is not None:
<li class="bw-table_sample">
<table data-filters="HtmlTable" cellpadding="0" cellspacing="0">
<thead>
<tr>
% for col in table.sd.cols:
<th>${col.name}</th>
% endfor
</tr>
</thead>
<tbody>
% for i, row in enumerate(top_rows):
<tr>
% for col in table.sd.cols:
<th>${col.name}</th>
% for item in row:
<td>${ item }</td>
% endfor
</tr>
</thead>
<tbody>
% for i, row in enumerate(top_rows):
<tr>
% for item in row:
<td>${ item }</td>
% endfor
</tr>
% endfor
</tbody>
</table>
</li>
% endif
<li>${column_table(table.sd.cols)}</li>
% if len(table.partitionKeys) > 0:
<li>
${column_table(table.partitionKeys)}
<a href="${ url("beeswax.views.describe_partitions", table=table_name) }">Show Partitions</a>
</li>
% endif
</ul>
</div>
% endfor
</tbody>
</table>
</li>
% endif
<li>${column_table(table.sd.cols)}</li>
% if len(table.partitionKeys) > 0:
<li>
${column_table(table.partitionKeys)}
<a href="${ url("beeswax.views.describe_partitions", table=table_name) }">Show Partitions</a>
</li>
% endif
</ul>
</div>
</div>
</div>


${wrappers.foot()}
2 changes: 1 addition & 1 deletion apps/beeswax/src/beeswax/templates/execute.mako
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ ${wrappers.head('Hive Query', section='query')}
% endif

<div class="view" id="execute">
<form action="${action}" method="POST" data-filters="FormValidator">
<form action="${action}" method="POST" data-filters="FormValidator, SizeTo" data-size-to-height="0" style="overflow:hidden">
<div class="resizable" data-filters="SplitView">
<%
if form.settings.forms or form.file_resources.forms or form.functions.forms:
Expand Down
38 changes: 18 additions & 20 deletions apps/beeswax/src/beeswax/templates/explain.mako
Original file line number Diff line number Diff line change
Expand Up @@ -17,27 +17,25 @@
<%namespace name="wrappers" file="header_footer.mako" />
<%namespace name="util" file="util.mako" />
${wrappers.head('Query Explanation', section='saved queries')}
<div class="view" id="watch_wait">
<div class="resizable" data-filters="SplitView">
<div class="left_col">
${util.render_query_context(query_context)}
</div>
<div class="right_col jframe_padded">
<div data-filters="Tabs">
<ul class="toolbar bw-results_tabs tabs jframe-right clearfix">
<li><span>Explanation</span></li>
<li><span>Query</span></li>
</ul>
<div class="view, resizable" id="watch_wait" data-filters="SplitView">
<div class="left_col">
${util.render_query_context(query_context)}
</div>
<div class="right_col jframe_padded">
<div data-filters="Tabs">
<ul class="toolbar bw-results_tabs tabs jframe-right clearfix">
<li><span>Explanation</span></li>
<li><span>Query</span></li>
</ul>

<ul class="tab_sections jframe-clear">
<li>
<pre>${explanation}</pre>
</li>
<li>
<pre>${query}</pre>
</li>
</ul>
</div>
<ul class="tab_sections jframe-clear">
<li>
<pre>${explanation}</pre>
</li>
<li>
<pre>${query}</pre>
</li>
</ul>
</div>
</div>
</div>
Expand Down
Loading

0 comments on commit 81b61d6

Please sign in to comment.