Commit 650b16f3 authored by eric@webkit.org's avatar eric@webkit.org
Browse files

2009-11-26 Daniel Bates <dbates@webkit.org>

        Reviewed by Pavel Feldman.

        https://bugs.webkit.org/show_bug.cgi?id=21554

        Tests that the tooltip text for an image is its dimensions.

        * inspector/elements-img-tooltip-expected.txt: Added.
        * inspector/elements-img-tooltip.html: Added.
2009-11-26  Daniel Bates  <dbates@webkit.org>

        Reviewed by Pavel Feldman.

        https://bugs.webkit.org/show_bug.cgi?id=21554

        Implements support for hovering over <img> src to display the height and width of that image
        in a tooltip. Displays both the displayable and natural dimensions of the image.

        Test: inspector/elements-img-tooltip.html

        * inspector/front-end/ElementsTreeOutline.js:
        (WebInspector.ElementsTreeElement.prototype.createTooltipForImageNode): Added.
        (WebInspector.ElementsTreeElement.prototype._updateTitle.callback):
        (WebInspector.ElementsTreeElement.prototype._updateTitle):
        (WebInspector.ElementsTreeElement.prototype._nodeTitleInfo):
        * inspector/front-end/ObjectProxy.js:
        (WebInspector.ObjectProxy.getPropertiesAsync): Added.
        * inspector/front-end/inspector.js:
        (WebInspector.linkifyURLAsNode): Added tooltipText argument.
        (WebInspector.linkifyURL): Ditto.

git-svn-id: http://svn.webkit.org/repository/webkit/trunk@51420 268f45cc-cd09-0410-ab3c-d52691b4dbfc
parent e2f2dd85
2009-11-26 Daniel Bates <dbates@webkit.org>
Reviewed by Pavel Feldman.
https://bugs.webkit.org/show_bug.cgi?id=21554
Tests that the tooltip text for an image is its dimensions.
* inspector/elements-img-tooltip-expected.txt: Added.
* inspector/elements-img-tooltip.html: Added.
2009-11-21 Holger Hans Peter Freyther <zecke@selfish.org>
 
Reviewed by Kenneth Rohde Christiansen.
Tests that the tooltip text for the image (below) is "215×174 pixels".
PASSED, tooltip text is "215×174 pixels".
<html>
<head>
<script src="inspector-test.js"></script>
<script src="elements-tests.js"></script>
<script>
var EXPECTED_TOOLTIP_TEXT = "215\xd7174 pixels";
function doit()
{
function callback(tooltipText)
{
if (!tooltipText)
output("FAILED, tooltip text should have been \"" + EXPECTED_TOOLTIP_TEXT + "\". Was " + tooltipText + ".");
else if (tooltipText == EXPECTED_TOOLTIP_TEXT)
output("PASSED, tooltip text is \"" + EXPECTED_TOOLTIP_TEXT + "\".");
else
output("FAILED, tooltip text should have been \"" + EXPECTED_TOOLTIP_TEXT + "\". Was \"" + tooltipText + "\".");
notifyDone();
}
evaluateInWebInspector("frontend_dumpTooltip", callback);
}
// Frontend functions.
function frontend_dumpTooltip(testController)
{
testController.waitUntilDone();
frontend_expandDOMSubtree(WebInspector.domAgent.document);
testController.runAfterPendingDispatches(function() {
frontend_dumpTooltipContinuation(testController);
});
}
function frontend_dumpTooltipContinuation(testController)
{
if (!WebInspector.ElementsTreeElement.prototype.createTooltipForImageNode) {
testController.notifyDone();
return;
}
function callback(tooltipText)
{
testController.notifyDone(tooltipText);
}
var innerMapping = WebInspector.domAgent._idToDOMNode;
for (var nodeId in innerMapping) {
if (innerMapping[nodeId].nodeName === "IMG") {
WebInspector.ElementsTreeElement.prototype.createTooltipForImageNode(innerMapping[nodeId], callback);
return;
}
}
}
</script>
</head>
<body onload="onload()">
<p>
Tests that the tooltip text for the image (below) is &quot;<script>document.write(EXPECTED_TOOLTIP_TEXT)</script>&quot;.
</p>
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAANcAAACuCAIAAAAqMg/rAAAAAXNSR0IArs4c6QAAAU9JREFUeNrt0jERAAAIxDDAv+dHAxNLIqHXTlLwaiTAheBCXAguxIXgQlwILsSF4EJcCC7EheBCXAguxIXgQlwILsSF4EJcCC7EheBCXAguxIXgQlwILsSF4EJcCC7EheBCXAguxIXgQlwILsSF4EJcCC7EheBCXAguxIXgQlwILsSF4EJcCC7EheBCXAguxIXgQlwILsSF4EJcCC7EheBCXAguxIXgQlwILsSF4EJcCC7EheBCXAguxIXgQlwILsSF4EJcCC7EheBCXAguxIXgQlwILsSF4EJcCC7EheBCXAguxIXgQlwILsSF4EJcCC7EheBCXAguxIXgQlwILsSFEuBCcCEuBBfiQnAhLgQX4kJwIS4EF+JCcCEuBBfiQnAhLgQX4kJwIS4EF+JCcCEuBBfiQnAhLgQX4kJwIS4EF+JCcCEuBBfiQnAhLoSDBZXqBFnkRyeqAAAAAElFTkSuQmCC"/>
</body>
</html>
2009-11-26 Daniel Bates <dbates@webkit.org>
Reviewed by Pavel Feldman.
https://bugs.webkit.org/show_bug.cgi?id=21554
Implements support for hovering over <img> src to display the height and width of that image
in a tooltip. Displays both the displayable and natural dimensions of the image.
Test: inspector/elements-img-tooltip.html
* inspector/front-end/ElementsTreeOutline.js:
(WebInspector.ElementsTreeElement.prototype.createTooltipForImageNode): Added.
(WebInspector.ElementsTreeElement.prototype._updateTitle.callback):
(WebInspector.ElementsTreeElement.prototype._updateTitle):
(WebInspector.ElementsTreeElement.prototype._nodeTitleInfo):
* inspector/front-end/ObjectProxy.js:
(WebInspector.ObjectProxy.getPropertiesAsync): Added.
* inspector/front-end/inspector.js:
(WebInspector.linkifyURLAsNode): Added tooltipText argument.
(WebInspector.linkifyURL): Ditto.
2009-11-26 Kevin Ollivier <kevino@theolliviers.com>
 
wx build fix after drawPattern API change.
......@@ -325,6 +325,26 @@ WebInspector.ElementsTreeElement.prototype = {
}
},
createTooltipForImageNode: function(node, callback)
{
function createTooltipThenCallback(properties)
{
if (!properties) {
callback();
return;
}
var tooltipText = null;
if (properties.offsetHeight === properties.naturalHeight && properties.offsetWidth === properties.naturalWidth)
tooltipText = WebInspector.UIString("%d\u00d7%d pixels", properties.offsetWidth, properties.offsetHeight);
else
tooltipText = WebInspector.UIString("%d\u00d7%d pixels (Natural: %d\u00d7%d pixels)", properties.offsetWidth, properties.offsetHeight, properties.naturalWidth, properties.naturalHeight);
callback(tooltipText);
}
var objectProxy = new WebInspector.ObjectProxy(node.id);
WebInspector.ObjectProxy.getPropertiesAsync(objectProxy, ["naturalHeight", "naturalWidth", "offsetHeight", "offsetWidth"], createTooltipThenCallback);
},
toggleNewAttributeButton: function(visible)
{
function removeAddAttributeSpan()
......@@ -787,14 +807,24 @@ WebInspector.ElementsTreeElement.prototype = {
if (this._editing)
return;
var title = this._nodeTitleInfo(this.representedObject, this.hasChildren, WebInspector.linkifyURL).title;
this.title = "<span class=\"highlight\">" + title + "</span>";
delete this.selectionElement;
this.updateSelection();
this._preventFollowingLinksOnDoubleClick();
var self = this;
function callback(tooltipText)
{
var title = self._nodeTitleInfo(self.representedObject, self.hasChildren, WebInspector.linkifyURL, tooltipText).title;
self.title = "<span class=\"highlight\">" + title + "</span>";
delete self.selectionElement;
self.updateSelection();
self._preventFollowingLinksOnDoubleClick();
};
// TODO: Replace with InjectedScriptAccess.getBasicProperties(obj, [names]).
if (this.representedObject.nodeName.toLowerCase() !== "img")
callback();
else
this.createTooltipForImageNode(this.representedObject, callback);
},
_nodeTitleInfo: function(node, hasChildren, linkify)
_nodeTitleInfo: function(node, hasChildren, linkify, tooltipText)
{
var info = {title: "", hasChildren: hasChildren};
......@@ -814,7 +844,7 @@ WebInspector.ElementsTreeElement.prototype = {
var value = attr.value;
if (linkify && (attr.name === "src" || attr.name === "href")) {
var value = value.replace(/([\/;:\)\]\}])/g, "$1\u200B");
info.title += linkify(attr.value, value, "webkit-html-attribute-value", node.nodeName.toLowerCase() == "a");
info.title += linkify(attr.value, value, "webkit-html-attribute-value", node.nodeName.toLowerCase() == "a", tooltipText);
} else {
var value = value.escapeHTML();
value = value.replace(/([\/;:\)\]\}])/g, "$1&#8203;");
......
......@@ -45,6 +45,24 @@ WebInspector.ObjectProxy.wrapPrimitiveValue = function(value)
return proxy;
}
WebInspector.ObjectProxy.getPropertiesAsync = function(objectProxy, propertiesToQueryFor, callback)
{
function createPropertiesMapThenCallback(propertiesPayload)
{
if (!propertiesPayload) {
callback();
return;
}
var result = [];
for (var i = 0; i < propertiesPayload.length; ++i)
if (propertiesToQueryFor.indexOf(propertiesPayload[i].name) !== -1)
result[propertiesPayload[i].name] = propertiesPayload[i].value.description;
callback(result);
};
InjectedScriptAccess.getProperties(objectProxy, true, createPropertiesMapThenCallback);
}
WebInspector.ObjectPropertyProxy = function(name, value)
{
this.name = name;
......
......@@ -1498,7 +1498,7 @@ WebInspector.showProfileForURL = function(url)
WebInspector.panels.profiles.showProfileForURL(url);
}
WebInspector.linkifyURLAsNode = function(url, linkText, classes, isExternal)
WebInspector.linkifyURLAsNode = function(url, linkText, classes, isExternal, tooltipText)
{
if (!linkText)
linkText = url;
......@@ -1508,18 +1508,18 @@ WebInspector.linkifyURLAsNode = function(url, linkText, classes, isExternal)
var a = document.createElement("a");
a.href = url;
a.className = classes;
a.title = url;
a.title = tooltipText || url;
a.target = "_blank";
a.textContent = linkText;
return a;
}
WebInspector.linkifyURL = function(url, linkText, classes, isExternal)
WebInspector.linkifyURL = function(url, linkText, classes, isExternal, tooltipText)
{
// Use the DOM version of this function so as to avoid needing to escape attributes.
// FIXME: Get rid of linkifyURL entirely.
return WebInspector.linkifyURLAsNode(url, linkText, classes, isExternal).outerHTML;
return WebInspector.linkifyURLAsNode(url, linkText, classes, isExternal, tooltipText).outerHTML;
}
WebInspector.addMainEventListeners = function(doc)
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment