diff options
-rw-r--r-- | share/www/browse/document.html | 25 | ||||
-rw-r--r-- | share/www/script/browse.js | 3 | ||||
-rw-r--r-- | share/www/style/layout.css | 18 |
3 files changed, 45 insertions, 1 deletions
diff --git a/share/www/browse/document.html b/share/www/browse/document.html index 22f055b7..98d8ec48 100644 --- a/share/www/browse/document.html +++ b/share/www/browse/document.html @@ -41,6 +41,24 @@ specific language governing permissions and limitations under the License. .attr("href", "database.html?" + encodeURIComponent(page.db.name)); $("h1 strong").text(page.docId); page.updateFieldListing(); + + $("#tabs li.tabular a").click(function() { + $("#tabs li").removeClass("active"); + $(this).parent().addClass("active"); + $("#fields thead th:first").text("Field").attr("colspan", 1).next().show(); + $("#fields tbody.content").show(); + $("#fields tbody.source").hide(); + }); + $("#tabs li.source a").click(function() { + $("#tabs li").removeClass("active"); + $(this).parent().addClass("active"); + $("#fields thead th:first").text("Source").attr("colspan", 2).next().hide(); + $("#fields tbody.content").hide(); + $("#fields tbody.source").find("td").each(function() { + $(this).html($("<code></code>").text(prettyPrintJSON(page.doc))); + }).end().show(); + }); + $("#toolbar button.save").click(page.saveDocument); $("#toolbar button.add").click(page.addField); $("#toolbar button.delete").click(page.deleteDocument); @@ -61,6 +79,10 @@ specific language governing permissions and limitations under the License. <li><button class="delete">Delete Document</button></li> </ul> + <ul id="tabs"> + <li class="active tabular"><a href="#tabular">Fields</a></li> + <li class="source"><a href="#source">Source</a></li> + </ul> <table id="fields" class="listing" cellspacing="0"> <col class="field"><col class="value"> <caption>Fields</caption> @@ -72,6 +94,9 @@ specific language governing permissions and limitations under the License. </thead> <tbody class="content"> </tbody> + <tbody class="source" style="display: none"> + <tr><td colspan="2"></td></tr> + </tbody> <tbody class="footer"> <tr> <td colspan="2"> diff --git a/share/www/script/browse.js b/share/www/script/browse.js index 8ef8ccfb..8291d914 100644 --- a/share/www/script/browse.js +++ b/share/www/script/browse.js @@ -507,6 +507,9 @@ function CouchDocumentPage() { page = this; this.addField = function() { + if (!$("#fields tbody.content:visible").length) { + $("#tabs li.tabular a").click(); // switch to tabular view + } var fieldName = "unnamed"; var fieldIdx = 1; while (page.doc.hasOwnProperty(fieldName)) { diff --git a/share/www/style/layout.css b/share/www/style/layout.css index 2ff012c7..3ea1cbcf 100644 --- a/share/www/style/layout.css +++ b/share/www/style/layout.css @@ -315,9 +315,22 @@ ul.suggest-dropdown li.selected { cursor: pointer; background: Highlight; } #documents tbody.content td.value { font-size: 10px; } +/* Document display tabs */ + +#tabs { float: right; list-style: none; margin: -1.4em 0 0; } +#tabs li { display: inline; font-size: 95%; padding: 0; } +#tabs li.active { font-weight: bold; } +#tabs :link, #tabs :visited { background: #dadada; color: #666; + border: 1px solid #a7a7a7; float: left; margin: 0 0 0 .5em; + padding: .5em 2em .3em; position: relative; top: 1px; +} +#tabs .active :link, #tabs .active :visited { background: #e9e9e9; + border-bottom-color: #e9e9e9; color: #333; +} + /* Document fields table */ -#fields { table-layout: fixed; } +#fields { clear: right; table-layout: fixed; } #fields col.field { width: 33%; } #fields tbody.content th { padding-left: 25px; padding-right: 48px; } #fields tbody.content th button { @@ -400,6 +413,9 @@ ul.suggest-dropdown li.selected { cursor: pointer; background: Highlight; #fields tbody.content td ul.attachments li button.delete { background-image: url(../image/delete-mini.gif); } +#fields tbody.source td code { display: block; overflow: auto; + white-space: pre-wrap; width: 100%; +} /* Test suite */ |