A bit of branding and re-laying out the front page.
git-svn-id: http://google-refine.googlecode.com/svn/trunk@215 7d457c2a-affb-35e4-300a-418c747d4874
This commit is contained in:
David Huynh
parent
5c845f06bf
commit
fe78fb8e30
BIN
src/main/webapp/images/gridworks.png
Normal file
BIN
src/main/webapp/images/gridworks.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.8 KiB |
BIN
src/main/webapp/images/metaweb-headerlogo.png
Normal file
BIN
src/main/webapp/images/metaweb-headerlogo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
src/main/webapp/images/metaweb-sprite-vertical.png
Normal file
BIN
src/main/webapp/images/metaweb-sprite-vertical.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 953 B |
@ -1 +1 @@
|
|||||||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Gridworks</title>
<link rel="stylesheet" href="/styles/common.css" />
<link rel="stylesheet" href="/styles/index.css" />
<script type="text/javascript" src="externals/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="externals/date.js"></script>
<script type="text/javascript" src="scripts/util/string.js"></script>
<script type="text/javascript" src="scripts/index.js"></script>
</head>
<body>
<div id="header">
<h1>Gridworks</h1>
</div>
<div id="body">
<div id="projects"></div>
<h2>New Project</h2>
<p>Create a new project by uploading a tab-separated value or comma-separated value file.</p>
<form id="file-upload-form" method="post" enctype="multipart/form-data" action="/command/create-project-from-upload" accept-charset="UTF-8">
h1>Gridworks</h1>
h1>Gridworks</h1>
h1>Gridworks</h1>
h1>Gridworks</h1>
</div>
h1>Gridworks</h1>
h1>Gridworks</h1>
<div id="body">
h1>Gridworks</h1>
<div id="projects"></div>
h1>Gridworks</h1>
<h2>New Project</h2>
h1>Gridworks</h1>
<p>Create a new project by uploading a tab-separated value or comma-separated value file.</p>
h1>Gridworks</h1>
<div id="projects"></div>
h1>Gridworks</h1>
<input id="limit-input" name="limit" size="5" /> data rows
h1>Gridworks</h1>
<div id="projects"></div>
<tr><td></td><td id="submit-container">
<input type="submit" value="Create Project" id="upload-file-button" />
h1>Gridworks</h1>
<div id="projects"></div>
</table>
</form>
</div>
</body>
</html>
|
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Gridworks</title>
<link rel="stylesheet" href="/styles/common.css" />
<link rel="stylesheet" href="/styles/index.css" />
<script type="text/javascript" src="externals/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="externals/date.js"></script>
<script type="text/javascript" src="scripts/util/string.js"></script>
<script type="text/javascript" src="scripts/index.js"></script>
</head>
<body>
<div id="header">
<a id="logo" href="http://www.metaweb.com/"><img alt="Metaweb" src="images/metaweb-headerlogo.png" /></a>
</div>
<div id="body">
<div id="body-empty">
<table><tr>
<td id="body-empty-logo-container"><img src="images/gridworks.png" /> Gridworks</td>
<td id="body-empty-create-project-panel-container"></td>
</tr></table>
</div>
h1>Gridworks</h1>
</div>
<h2>New Project</h2>
</div>
<td id="body-nonempty-projects-container">
<div id="body">
<div id="projects"></div>
<h2>New Project</h2>
</tr></table>
<p>Create a new project by uploading a tab-separated value or comma-separated value file.</p>
</div>
</div>
<form id="file-upload-form" method="post" enctype="multipart/form-data" action="/command/create-project-from-upload" accept-charset="UTF-8">
<div id="body">
<div id="body">
h1>Gridworks</h1>
</div>
<div id="body">
</div>
<div id="create-project-panel">
<form id="file-upload-form" method="post" enctype="multipart/form-data" action="/command/create-project-from-upload" accept-charset="UTF-8">
<div id="body">
<div id="projects"></div>
<div id="body">
<h2>New Project</h2>
<div id="body">
<p>Create a new project by uploading a tab-separated value or comma-separated value file.</p>
</td></tr>
<tr><td>Project Name:</td><td>
<div id="projects"></div>
</td></tr>
<div id="projects"></div>
h1>Gridworks</h1>
<input id="limit-input" name="limit" size="5" /> data rows (optional)
<div id="body">
<tr><td>Skip:</td><td>
<div id="projects"></div>
<div id="body">
</td></tr>
<tr><td></td><td>
<div id="projects"></div>
<h2>New Project</h2>
</td></tr>
</table>
</form>
</div>
</div>
</body>
</html>
|
||||||
@ -1 +1 @@
|
|||||||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Gridworks</title>
<link type="text/css" rel="stylesheet" href="externals/suggest/css/suggest-1.0.3.min.css" />
<link type="text/css" rel="stylesheet" href="externals/jquery-ui/css/ui-lightness/jquery-ui-1.7.2.custom.css" />
<link rel="stylesheet" href="/styles/common.css" />
<link rel="stylesheet" href="/styles/util/menu.css" />
<link rel="stylesheet" href="/styles/util/dialog.css" />
<link rel="stylesheet" href="/styles/util/custom-suggest.css" />
<link rel="stylesheet" href="/styles/project.css" />
<link rel="stylesheet" href="/styles/project/history.css" />
<link rel="stylesheet" href="/styles/project/browsing.css" />
<link rel="stylesheet" href="/styles/project/process.css" />
<link rel="stylesheet" href="/styles/project/menu-bar.css" />
<link rel="stylesheet" href="/styles/views/data-table-view.css" />
<link rel="stylesheet" href="/styles/dialogs/expression-preview-dialog.css" />
<link rel="stylesheet" href="/styles/dialogs/recon-dialog.css" />
<link rel="stylesheet" href="/styles/dialogs/facet-based-edit-dialog.css" />
<link rel="stylesheet" href="/styles/protograph/schema-alignment-dialog.css" />
<script type="text/javascript" src="externals/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="externals/suggest/suggest-1.0.3.min.js"></script>
<script type="text/javascript" src="externals/jquery-ui/jquery-ui-1.7.2.custom.min.js"></script>
<script type="text/javascript" src="externals/date.js"></script>
<script type="text/javascript" src="scripts/util/misc.js"></script>
<script type="text/javascript" src="scripts/util/url.js"></script>
<script type="text/javascript" src="scripts/util/string.js"></script>
<script type="text/javascript" src="scripts/util/ajax.js"></script>
<script type="text/javascript" src="scripts/util/menu.js"></script>
<script type="text/javascript" src="scripts/util/dialog.js"></script>
<script type="text/javascript" src="scripts/util/dom.js"></script>
<script type="text/javascript" src="scripts/util/custom-suggest.js"></script>
<script type="text/javascript" src="scripts/project.js"></script>
<script type="text/javascript" src="scripts/project/history-widget.js"></script>
<script type="text/javascript" src="scripts/project/process-widget.js"></script>
<script type="text/javascript" src="scripts/project/menu-bar.js"></script>
<script type="text/javascript" src="scripts/project/browsing-engine.js"></script>
<script type="text/javascript" src="scripts/project/scripting.js"></script>
<script type="text/javascript" src="scripts/facets/list-facet.js"></script>
<script type="text/javascript" src="scripts/facets/range-facet.js"></script>
<script type="text/javascript" src="scripts/facets/text-search-facet.js"></script>
<script type="text/javascript" src="scripts/views/data-table-view.js"></script>
<script type="text/javascript" src="scripts/views/data-table-cell-ui.js"></script>
<script type="text/javascript" src="scripts/views/data-table-column-header-ui.js"></script>
<script type="text/javascript" src="scripts/dialogs/recon-dialog.js"></script>
<script type="text/javascript" src="scripts/dialogs/expression-preview-dialog.js"></script>
<script type="text/javascript" src="scripts/dialogs/facet-based-edit-dialog.js"></script>
<script type="text/javascript" src="scripts/protograph/schema-alignment.js"></script>
<script type="text/javascript" src="scripts/protograph/schema-alignment-ui-node.js"></script>
<script type="text/javascript" src="scripts/protograph/schema-alignment-ui-link.js"></script>
</head>
<body>
<div id="header">
<div id="path"><a class="app-path-section" href="./index.html">Gridworks</a> » </div>
</div>
<div id="body">
<div id="loading-message"><img src="images/large-spinner.gif" /> starting up ...</div>
</div>
</body>
</html>
|
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Gridworks</title>
<link type="text/css" rel="stylesheet" href="externals/suggest/css/suggest-1.0.3.min.css" />
<link type="text/css" rel="stylesheet" href="externals/jquery-ui/css/ui-lightness/jquery-ui-1.7.2.custom.css" />
<link rel="stylesheet" href="/styles/common.css" />
<link rel="stylesheet" href="/styles/util/menu.css" />
<link rel="stylesheet" href="/styles/util/dialog.css" />
<link rel="stylesheet" href="/styles/util/custom-suggest.css" />
<link rel="stylesheet" href="/styles/project.css" />
<link rel="stylesheet" href="/styles/project/history.css" />
<link rel="stylesheet" href="/styles/project/browsing.css" />
<link rel="stylesheet" href="/styles/project/process.css" />
<link rel="stylesheet" href="/styles/project/menu-bar.css" />
<link rel="stylesheet" href="/styles/views/data-table-view.css" />
<link rel="stylesheet" href="/styles/dialogs/expression-preview-dialog.css" />
<link rel="stylesheet" href="/styles/dialogs/recon-dialog.css" />
<link rel="stylesheet" href="/styles/dialogs/facet-based-edit-dialog.css" />
<link rel="stylesheet" href="/styles/protograph/schema-alignment-dialog.css" />
<script type="text/javascript" src="externals/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="externals/suggest/suggest-1.0.3.min.js"></script>
<script type="text/javascript" src="externals/jquery-ui/jquery-ui-1.7.2.custom.min.js"></script>
<script type="text/javascript" src="externals/date.js"></script>
<script type="text/javascript" src="scripts/util/misc.js"></script>
<script type="text/javascript" src="scripts/util/url.js"></script>
<script type="text/javascript" src="scripts/util/string.js"></script>
<script type="text/javascript" src="scripts/util/ajax.js"></script>
<script type="text/javascript" src="scripts/util/menu.js"></script>
<script type="text/javascript" src="scripts/util/dialog.js"></script>
<script type="text/javascript" src="scripts/util/dom.js"></script>
<script type="text/javascript" src="scripts/util/custom-suggest.js"></script>
<script type="text/javascript" src="scripts/project.js"></script>
<script type="text/javascript" src="scripts/project/history-widget.js"></script>
<script type="text/javascript" src="scripts/project/process-widget.js"></script>
<script type="text/javascript" src="scripts/project/menu-bar.js"></script>
<script type="text/javascript" src="scripts/project/browsing-engine.js"></script>
<script type="text/javascript" src="scripts/project/scripting.js"></script>
<script type="text/javascript" src="scripts/facets/list-facet.js"></script>
<script type="text/javascript" src="scripts/facets/range-facet.js"></script>
<script type="text/javascript" src="scripts/facets/text-search-facet.js"></script>
<script type="text/javascript" src="scripts/views/data-table-view.js"></script>
<script type="text/javascript" src="scripts/views/data-table-cell-ui.js"></script>
<script type="text/javascript" src="scripts/views/data-table-column-header-ui.js"></script>
<script type="text/javascript" src="scripts/dialogs/recon-dialog.js"></script>
<script type="text/javascript" src="scripts/dialogs/expression-preview-dialog.js"></script>
<script type="text/javascript" src="scripts/dialogs/facet-based-edit-dialog.js"></script>
<script type="text/javascript" src="scripts/protograph/schema-alignment.js"></script>
<script type="text/javascript" src="scripts/protograph/schema-alignment-ui-node.js"></script>
<script type="text/javascript" src="scripts/protograph/schema-alignment-ui-link.js"></script>
</head>
<body>
<div id="header">
<a id="logo" href="http://www.metaweb.com/"><img alt="Metaweb" src="images/metaweb-headerlogo.png" /></a>
<div id="path"><a class="app-path-section" href="./index.html">Gridworks</a> » </div>
</div>
<div id="body">
<div id="loading-message"><img src="images/large-spinner.gif" /> starting up ...</div>
</div>
<div id="footer">
<a href="about.html">About Gridworks</a>
•
© 2010 <a href="http://www.metaweb.com/">Metaweb Technologies, Inc.</a>
</div>
</body>
</html>
|
||||||
@ -38,40 +38,53 @@ function renderProjects(data) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (projects.length > 0) {
|
if (projects.length == 0) {
|
||||||
|
$('#body-empty').show();
|
||||||
|
$('#create-project-panel').remove().appendTo($('#body-empty-create-project-panel-container'));
|
||||||
|
} else {
|
||||||
|
$('#body-nonempty').show();
|
||||||
|
$('#create-project-panel').remove().appendTo($('#body-nonempty-create-project-panel-container'));
|
||||||
|
|
||||||
projects.sort(function(a, b) { return b.date.getTime() - a.date.getTime(); });
|
projects.sort(function(a, b) { return b.date.getTime() - a.date.getTime(); });
|
||||||
|
if (projects.length > 10) {
|
||||||
|
$('#body-nonempty-logo-container').css("vertical-align", "top");
|
||||||
|
$('#body-nonempty-create-project-panel-container').css("vertical-align", "top");
|
||||||
|
}
|
||||||
|
|
||||||
var container = $("#projects").empty().show();
|
var container = $("#projects").empty().show();
|
||||||
|
$('<h1>').text("Projects").appendTo(container);
|
||||||
$('<h2></h2>').text("Projects").appendTo(container);
|
|
||||||
|
|
||||||
var table = $('<table><tr><td></td><td>last modified</td><td></td></tr></table>').attr("cellspacing", "5")[0];
|
|
||||||
|
|
||||||
for (var i = 0; i < projects.length; i++) {
|
|
||||||
var project = projects[i];
|
|
||||||
var tr = table.insertRow(table.rows.length);
|
|
||||||
var td0 = tr.insertCell(0);
|
|
||||||
var td1 = tr.insertCell(1);
|
|
||||||
var td2 = tr.insertCell(2);
|
|
||||||
|
|
||||||
$('<a></a>').text(project.name).attr("href", "/project.html?project=" + project.id).appendTo(td0);
|
var renderProject = function(project) {
|
||||||
$('<span></span>').text(formatDate(project.date)).appendTo(td1);
|
var div = $('<div>').addClass("project").appendTo(container);
|
||||||
$('<a></a>').attr("title","Delete this project").attr("href","").html("<img src='/images/close.png' />").click(function() {
|
|
||||||
if (window.confirm("Are you sure you want to delete this project?")) {
|
$('<a></a>')
|
||||||
$.ajax({
|
.addClass("delete-project")
|
||||||
type: "POST",
|
.attr("title","Delete this project")
|
||||||
url: "/command/delete-project",
|
.attr("href","")
|
||||||
data: { "project" : project.id },
|
.html("<img src='/images/close.png' />")
|
||||||
dataType: "json",
|
.click(function() {
|
||||||
success: function (data) {
|
if (window.confirm("Are you sure you want to delete project \"" + project.name + "\"?")) {
|
||||||
if (data && typeof data['code'] != 'undefined' && data.code == "ok") {
|
$.ajax({
|
||||||
window.location.reload()
|
type: "POST",
|
||||||
|
url: "/command/delete-project",
|
||||||
|
data: { "project" : project.id },
|
||||||
|
dataType: "json",
|
||||||
|
success: function (data) {
|
||||||
|
if (data && typeof data['code'] != 'undefined' && data.code == "ok") {
|
||||||
|
window.location.reload()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
});
|
||||||
});
|
}
|
||||||
}
|
return false;
|
||||||
return false;
|
}).appendTo(div);
|
||||||
}).appendTo(td2);
|
|
||||||
|
$('<a></a>').text(project.name).attr("href", "/project.html?project=" + project.id).appendTo(div);
|
||||||
|
$('<span></span>').text(formatDate(project.date)).addClass("last-modified").appendTo(div);
|
||||||
|
};
|
||||||
|
|
||||||
|
for (var i = 0; i < projects.length; i++) {
|
||||||
|
renderProject(projects[i]);
|
||||||
}
|
}
|
||||||
|
|
||||||
$(table).appendTo(container);
|
$(table).appendTo(container);
|
||||||
|
|||||||
@ -7,6 +7,7 @@ body {
|
|||||||
font-size: 120%;
|
font-size: 120%;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
background: #eee;
|
||||||
}
|
}
|
||||||
|
|
||||||
table {
|
table {
|
||||||
@ -22,27 +23,30 @@ input {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#header {
|
#header {
|
||||||
padding: 5px 20px;
|
background: url(../images/metaweb-sprite-vertical.png) repeat-x scroll 0 0 #025B8D;
|
||||||
background: #666;
|
border-bottom: 1px solid #FCE166;
|
||||||
color: #eee;
|
color: #FFFFFF;
|
||||||
|
height: 47px;
|
||||||
|
padding-left: 20px;
|
||||||
|
padding-right: 20px;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
#header .app-path-section {
|
#logo {
|
||||||
font-weight: bold;
|
display: block;
|
||||||
|
padding: 13px 0;
|
||||||
}
|
}
|
||||||
#header a.app-path-section {
|
#footer {
|
||||||
text-decoration: none;
|
font-size: 80%;
|
||||||
color: #eee;
|
margin: 10px;
|
||||||
|
color: #888;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
#header a.app-path-section:hover {
|
#footer a {
|
||||||
text-decoration: underline;
|
color: #448;
|
||||||
}
|
|
||||||
|
|
||||||
#header h1 {
|
|
||||||
margin: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#body {
|
#body {
|
||||||
padding: 20px;
|
background: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.action {
|
a.action {
|
||||||
|
|||||||
@ -1,16 +1,83 @@
|
|||||||
#projects {
|
#body-empty, #body-nonempty {
|
||||||
float:right;
|
|
||||||
margin: 20px;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
background: #fffee0;
|
|
||||||
padding: 20px;
|
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
#file-upload-form > table > tbody > tr > td {
|
#body-template {
|
||||||
vertical-align: baseline;
|
display: none;
|
||||||
|
}
|
||||||
|
#body-empty, #body-nonempty {
|
||||||
|
width: 800px;
|
||||||
|
padding: 100px 0;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
#body-empty > table, #body-nonempty > table {
|
||||||
|
width: 100%;
|
||||||
|
border-collapse: collapse:
|
||||||
|
}
|
||||||
|
#body-empty > table > tbody > tr > td, #body-nonempty > table > tbody > tr > td {
|
||||||
|
padding: 20px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
#body-empty-logo-container, #body-nonempty-logo-container {
|
||||||
|
width: 1%;
|
||||||
|
white-space: pre;
|
||||||
|
font-size: 400%;
|
||||||
|
}
|
||||||
|
#body-empty-create-project-panel-container, #body-nonempty-create-project-panel-container {
|
||||||
|
border-left: 3px solid #eee;
|
||||||
}
|
}
|
||||||
|
|
||||||
#submit-container {
|
#body-nonempty {
|
||||||
padding: 20px 0px;
|
width: 1000px;
|
||||||
}
|
}
|
||||||
|
#body-nonempty-logo-container {
|
||||||
|
font-size: 300%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#body-nonempty-projects-container {
|
||||||
|
border-left: 3px solid #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
#create-project-panel-layout {
|
||||||
|
width: 100%;
|
||||||
|
border-collapse: collapse;
|
||||||
|
}
|
||||||
|
#create-project-panel-layout > tbody > tr > td {
|
||||||
|
padding-right: 7px;
|
||||||
|
padding-bottom: 7px;
|
||||||
|
}
|
||||||
|
#create-project-panel-layout > tbody > tr > td:last-child {
|
||||||
|
padding-right: 0px;
|
||||||
|
}
|
||||||
|
#create-project-panel-layout > tbody > tr:last-child > td {
|
||||||
|
padding-bottom: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#projects {
|
||||||
|
white-space: pre;
|
||||||
|
}
|
||||||
|
#projects h1 {
|
||||||
|
margin: 0;
|
||||||
|
margin-bottom: 1em;
|
||||||
|
font-size: 120%;
|
||||||
|
color: #aaa
|
||||||
|
}
|
||||||
|
#projects a {
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #004;
|
||||||
|
}
|
||||||
|
#projects a:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
color: #008;
|
||||||
|
}
|
||||||
|
.project {
|
||||||
|
margin: 0.25em 0;
|
||||||
|
}
|
||||||
|
.delete-project {
|
||||||
|
margin-right: 0.5em;
|
||||||
|
}
|
||||||
|
.last-modified {
|
||||||
|
margin: 0 0.25em;
|
||||||
|
color: #aaa;
|
||||||
|
}
|
||||||
|
|||||||
@ -1,3 +1,7 @@
|
|||||||
|
#body {
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
#loading-message {
|
#loading-message {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 300%;
|
font-size: 300%;
|
||||||
@ -6,3 +10,26 @@
|
|||||||
font-style: italic;
|
font-style: italic;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#logo {
|
||||||
|
padding: 13px 0;
|
||||||
|
padding-right: 13px;
|
||||||
|
border-right: 1px solid #ccc;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
#path {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 170px;
|
||||||
|
margin-top: -0.5em;
|
||||||
|
line-height: 1em;
|
||||||
|
}
|
||||||
|
#path .app-path-section {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
#path a.app-path-section {
|
||||||
|
text-decoration: none;
|
||||||
|
color: #eee;
|
||||||
|
}
|
||||||
|
#path a.app-path-section:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user