s434730/RandomSec
3
0
Fork 0

Prevent really long expressions from stretching the expression preview dialogs.

Browse Source 
git-svn-id: http://google-refine.googlecode.com/svn/trunk@1772 7d457c2a-affb-35e4-300a-418c747d4874
This commit is contained in:
David Huynh 2010-11-03 19:15:48 +00:00
parent faaca5beea
commit 232d97f832
2 changed files with 32 additions and 19 deletions
main/webapp/modules/core
scripts/dialogs
expression-preview-dialog.js
styles/dialogs
expression-preview-dialog.less

18
main/webapp/modules/core/scripts/dialogs/expression-preview-dialog.js
View File

@ -135,6 +135,8 @@ ExpressionPreviewDialog.Widget = function(
}) })
.select() .select()
.focus(); .focus();
this._tabContentWidth = this._elmts.expressionPreviewPreviewContainer.width() + "px";
this.update(); this.update();
this._renderExpressionHistoryTab(); this._renderExpressionHistoryTab();
@ -178,10 +180,10 @@ ExpressionPreviewDialog.Widget.prototype._renderHelpTab = function() {
}; };
ExpressionPreviewDialog.Widget.prototype._renderHelp = function(data) { ExpressionPreviewDialog.Widget.prototype._renderHelp = function(data) {
var elmt = this._elmts.expressionPreviewHelpTabBody.empty(); var elmt = this._elmts.expressionPreviewHelpTabBody.empty().width(this._tabContentWidth);
$('<h3></h3>').text("Variables").appendTo(elmt); $('<h3></h3>').text("Variables").appendTo(elmt);
var varTable = $('<table width="100%" cellspacing="5"></table>').appendTo(elmt)[0]; var varTable = $('<table cellspacing="5"></table>').appendTo(elmt)[0];
var vars = [ var vars = [
{ name: "cell", { name: "cell",
description: "The current cell. It has a few fields: 'value' and 'recon'." description: "The current cell. It has a few fields: 'value' and 'recon'."
@ -260,13 +262,13 @@ ExpressionPreviewDialog.Widget.prototype._renderExpressionHistoryTab = function(
ExpressionPreviewDialog.Widget.prototype._renderExpressionHistory = function(data) { ExpressionPreviewDialog.Widget.prototype._renderExpressionHistory = function(data) {
var self = this; var self = this;
var elmt = this._elmts.expressionPreviewHistoryContainer.empty(); var elmt = this._elmts.expressionPreviewHistoryContainer.empty().width(this._tabContentWidth);
var table = $( var table = $(
'<table width="100%" cellspacing="5">' + '<table>' +
'<tr><th></th><th>From</th><th colspan="2">Expression</th><th></th></tr>' + '<tr><th></th><th>From</th><th colspan="2">Expression</th><th></th></tr>' +
'</table>' '</table>'
).appendTo(elmt)[0]; ).appendTo($('<div>').addClass("expression-preview-table-wrapper").appendTo(elmt))[0];
var renderEntry = function(entry) { var renderEntry = function(entry) {
var tr = table.insertRow(table.rows.length); var tr = table.insertRow(table.rows.length);
@ -333,8 +335,10 @@ ExpressionPreviewDialog.Widget.prototype._prepareUpdate = function(params) {
}; };
ExpressionPreviewDialog.Widget.prototype._renderPreview = function(expression, data) { ExpressionPreviewDialog.Widget.prototype._renderPreview = function(expression, data) {
var container = this._elmts.expressionPreviewPreviewContainer.empty(); var container = this._elmts.expressionPreviewPreviewContainer.empty().width(this._tabContentWidth);
var table = $('<table width="100%"></table>').appendTo(container)[0];
var table = $('<table></table>').appendTo(
$('<div>').addClass("expression-preview-table-wrapper").appendTo(container))[0];
var tr = table.insertRow(0); var tr = table.insertRow(0);
$(tr.insertCell(0)).addClass("expression-preview-heading").text("row"); $(tr.insertCell(0)).addClass("expression-preview-heading").text("row");

33
main/webapp/modules/core/styles/dialogs/expression-preview-dialog.less
View File

@ -50,16 +50,30 @@ textarea.expression-preview-code {
color: red; color: red;
} }
#expression-preview-tabs-preview, #expression-preview-tabs-help, #expression-preview-tabs-history { #expression-preview-tabs-preview,
padding: 5px; #expression-preview-tabs-help,
#expression-preview-tabs-history {
padding: @padding_tight;
overflow: hidden;
} }
.expression-preview-container { #expression-preview-tabs-preview > div,
#expression-preview-tabs-help > div,
#expression-preview-tabs-history > div {
height: 200px; height: 200px;
padding: 5px;
overflow: auto; overflow: auto;
} }
#expression-preview-tabs-preview td, #expression-preview-tabs-preview th,
#expression-preview-tabs-help td, #expression-preview-tabs-help th,
#expression-preview-tabs-history td, #expression-preview-tabs-history th {
padding: @padding_tight;
}
.expression-preview-table-wrapper {
padding: @padding_normal;
}
.expression-preview-container td { .expression-preview-container td {
padding: 2px 5px; padding: 2px 5px;
border-top: 1px solid #ccc; border-top: 1px solid #ccc;
@ -80,15 +94,10 @@ td.expression-preview-value {
color: #aaa; color: #aaa;
} }
.expression-preview-help-container {
height: 200px;
padding: 5px;
overflow: auto;
}
.expression-preview-help-container h3 { .expression-preview-help-container h3 {
background: white; margin-top: @padding_looser;
padding: 3px 10px; margin-bottom: @padding_normal;
border-bottom: 1px solid @light_grey;
} }
.expression-preview-doc-item-title { .expression-preview-doc-item-title {