+2011-02-04 Mikhail Naganov <mnaganov@chromium.org>
+
+ Reviewed by Pavel Feldman.
+
+ Web Inspector: Add "show more" data grid node and waiting message UI components.
+ https://bugs.webkit.org/show_bug.cgi?id=53763
+
+ - "show more" data grid node is used for on-demand population of
+ data grid contents (similar to DOM tree capability for limiting
+ displayed nodes count);
+
+ - waiting message is used for informing user about long lasting
+ operations (with a possibility to cancel them).
+
+ * English.lproj/localizedStrings.js:
+ * WebCore.gypi:
+ * WebCore.vcproj/WebCore.vcproj:
+ * inspector/front-end/PleaseWaitMessage.js: Added.
+ (WebInspector.PleaseWaitMessage):
+ * inspector/front-end/ShowMoreDataGridNode.js: Added.
+ (WebInspector.ShowMoreDataGridNode):
+ * inspector/front-end/WebKit.qrc:
+ * inspector/front-end/inspector.css:
+ (.data-grid button):
+ (.please-wait-msg):
+ * inspector/front-end/inspector.html:
+
2011-02-04 Adele Peterson <adele@apple.com>
Reviewed by Dan Bernstein.
'inspector/front-end/Panel.js',
'inspector/front-end/PanelEnablerView.js',
'inspector/front-end/Placard.js',
+ 'inspector/front-end/PleaseWaitMessage.js',
'inspector/front-end/Popover.js',
'inspector/front-end/ProfileDataGridTree.js',
'inspector/front-end/ProfilesPanel.js',
'inspector/front-end/ScriptFormatterWorker.js',
'inspector/front-end/ScriptsPanel.js',
'inspector/front-end/ShortcutsHelp.js',
+ 'inspector/front-end/ShowMoreDataGridNode.js',
'inspector/front-end/Section.js',
'inspector/front-end/Settings.js',
'inspector/front-end/SidebarPane.js',
RelativePath="..\inspector\front-end\Placard.js"
>
</File>
+ <File
+ RelativePath="..\inspector\front-end\PleaseWaitMessage.js"
+ >
+ </File>
<File
RelativePath="..\inspector\front-end\popover.css"
>
RelativePath="..\inspector\front-end\ShortcutsHelp.js"
>
</File>
+ <File
+ RelativePath="..\inspector\front-end\ShowMoreDataGridNode.js"
+ >
+ </File>
<File
RelativePath="..\inspector\front-end\SidebarPane.js"
>
--- /dev/null
+/*
+ * Copyright (C) 2011 Google Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions are
+ * met:
+ *
+ * * Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * * Redistributions in binary form must reproduce the above
+ * copyright notice, this list of conditions and the following disclaimer
+ * in the documentation and/or other materials provided with the
+ * distribution.
+ * * Neither the name of Google Inc. nor the names of its
+ * contributors may be used to endorse or promote products derived from
+ * this software without specific prior written permission.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+ * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+ * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+ * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+ * OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+ * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+ * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+ * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+ * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+ * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WebInspector.PleaseWaitMessage = function()
+{
+ this.element = document.createElement("div");
+ this.element.className = "please-wait-msg";
+ this.element.textContent = WebInspector.UIString("Please wait\u2026");
+
+ this.cancelButton = document.createElement("button");
+ this.cancelButton.textContent = WebInspector.UIString("Cancel");
+ this.cancelButton.addEventListener("click", this._cancelClicked.bind(this), false);
+}
+
+WebInspector.PleaseWaitMessage.prototype = {
+ _cancelClicked: function()
+ {
+ if (this._cancelCallback) {
+ var cancelCallback = this._cancelCallback;
+ delete this._cancelCallback;
+ cancelCallback();
+ }
+ },
+
+ hide: function()
+ {
+ var instance = WebInspector.PleaseWaitMessage.prototype.instance;
+ var message = instance.element;
+ if (message.parentNode)
+ message.parentNode.removeChild(message);
+ },
+
+ get instance()
+ {
+ if (!"_instance" in WebInspector.PleaseWaitMessage.prototype)
+ WebInspector.PleaseWaitMessage.prototype._instance = new WebInspector.PleaseWaitMessage();
+ return WebInspector.PleaseWaitMessage.prototype._instance;
+ },
+
+ show: function(element, cancelCallback)
+ {
+ var instance = WebInspector.PleaseWaitMessage.prototype.instance;
+ var message = instance.element;
+ if (message.parentNode === element)
+ return;
+ else if (message.parentNode)
+ message.parentNode.removeChild(message);
+ if (message.childNodes.length > 1)
+ message.removeChild(instance.cancelButton);
+ if (cancelCallback) {
+ message.appendChild(instance.cancelButton);
+ instance._cancelCallback = cancelCallback;
+ }
+ element.appendChild(message);
+ },
+
+ startAction: function(element, actionCallback, cancelCallback)
+ {
+ var instance = WebInspector.PleaseWaitMessage.prototype.instance;
+ var message = instance.element;
+ if (message.parentNode === element) {
+ actionCallback();
+ return;
+ }
+
+ function doAction()
+ {
+ try {
+ actionCallback();
+ } finally {
+ if (message.parentNode)
+ message.parentNode.removeChild(message);
+ }
+ }
+
+ WebInspector.PleaseWaitMessage.prototype.show(element, cancelCallback);
+ setTimeout(doAction, 0);
+ }
+};
+
--- /dev/null
+/*
+ * Copyright (C) 2011 Google Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions are
+ * met:
+ *
+ * * Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ * * Redistributions in binary form must reproduce the above
+ * copyright notice, this list of conditions and the following disclaimer
+ * in the documentation and/or other materials provided with the
+ * distribution.
+ * * Neither the name of Google Inc. nor the names of its
+ * contributors may be used to endorse or promote products derived from
+ * this software without specific prior written permission.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+ * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+ * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+ * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+ * OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+ * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+ * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+ * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+ * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+ * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+WebInspector.ShowMoreDataGridNode = function(callback, nextCount, allCount)
+{
+ function populate(count)
+ {
+ var index = this.parent.children.indexOf(this);
+ this.parent.removeChild(this);
+ callback(count, index);
+ }
+
+ this.showNext = document.createElement("button");
+ this.showNext.setAttribute("type", "button");
+ this.showNext.textContent = WebInspector.UIString("Show next %d", nextCount);
+ this.showNext.addEventListener("click", populate.bind(this, nextCount), false);
+
+ if (allCount) {
+ this.showAll = document.createElement("button");
+ this.showAll.setAttribute("type", "button");
+ this.showAll.textContent = WebInspector.UIString("Show all %d", allCount);
+ this.showAll.addEventListener("click", populate.bind(this, allCount), false);
+ }
+
+ WebInspector.DataGridNode.call(this, {summaryRow:true}, false);
+ this.selectable = false;
+}
+
+WebInspector.ShowMoreDataGridNode.prototype = {
+ createCells: function()
+ {
+ var cell = document.createElement("td");
+ if (this.depth)
+ cell.style.setProperty("padding-left", (this.depth * this.dataGrid.indentWidth) + "px");
+ cell.appendChild(this.showNext);
+ if (this.showAll)
+ cell.appendChild(this.showAll);
+ this._element.appendChild(cell);
+
+ var columns = this.dataGrid.columns;
+ var count = 0;
+ for (var c in columns)
+ ++count;
+ while (--count > 0) {
+ cell = document.createElement("td");
+ this._element.appendChild(cell);
+ }
+ }
+};
+
+WebInspector.ShowMoreDataGridNode.prototype.__proto__ = WebInspector.DataGridNode.prototype;
<file>Panel.js</file>
<file>PanelEnablerView.js</file>
<file>Placard.js</file>
+ <file>PleaseWaitMessage.js</file>
<file>Popover.js</file>
<file>ProfileDataGridTree.js</file>
<file>ProfilesPanel.js</file>
<file>Section.js</file>
<file>Settings.js</file>
<file>ShortcutsHelp.js</file>
+ <file>ShowMoreDataGridNode.js</file>
<file>SidebarPane.js</file>
<file>SidebarTreeElement.js</file>
<file>SourceCSSTokenizer.js</file>
content: url(Images/treeDownTriangleBlack.png);
}
+.data-grid button {
+ line-height: 19px;
+}
+
body.inactive .data-grid th.sort-ascending, body.inactive .data-grid th.sort-descending {
background-image: url(Images/glossyHeader.png);
border-right: 1px solid rgb(179, 179, 179);
.cursor-auto {
cursor: auto;
}
+
+.please-wait-msg {
+ position: absolute;
+ left: 0;
+ top: 0;
+ border: 4px black solid;
+ border-radius: 4px;
+ background-color: black;
+ opacity: 0.85;
+ color: white;
+ font-size: 12px;
+ font-weight: bold;
+ z-index: 10000;
+}
<script type="text/javascript" src="Popover.js"></script>
<script type="text/javascript" src="TabbedPane.js"></script>
<script type="text/javascript" src="Placard.js"></script>
+ <script type="text/javascript" src="PleaseWaitMessage.js"></script>
<script type="text/javascript" src="View.js"></script>
<script type="text/javascript" src="Drawer.js"></script>
<script type="text/javascript" src="ConsoleView.js"></script>
<script type="text/javascript" src="DOMStorage.js"></script>
<script type="text/javascript" src="DOMStorageItemsView.js"></script>
<script type="text/javascript" src="DataGrid.js"></script>
+ <script type="text/javascript" src="ShowMoreDataGridNode.js"></script>
<script type="text/javascript" src="CookiesTable.js"></script>
<script type="text/javascript" src="CookieItemsView.js"></script>
<script type="text/javascript" src="ApplicationCacheItemsView.js"></script>