Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(84)

Side by Side Diff: Source/core/inspector/InspectorOverlayPage.html

Issue 214443005: DevTools: Fix how highlighted element title is shown when element is highlighted in inspected page. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Created 6 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
« no previous file with comments | « no previous file | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!-- 1 <!--
2 Copyright (C) 2012 Google Inc. All rights reserved. 2 Copyright (C) 2012 Google Inc. All rights reserved.
3 3
4 Redistribution and use in source and binary forms, with or without 4 Redistribution and use in source and binary forms, with or without
5 modification, are permitted provided that the following conditions 5 modification, are permitted provided that the following conditions
6 are met: 6 are met:
7 7
8 1. Redistributions of source code must retain the above copyright 8 1. Redistributions of source code must retain the above copyright
9 notice, this list of conditions and the following disclaimer. 9 notice, this list of conditions and the following disclaimer.
10 2. Redistributions in binary form must reproduce the above copyright 10 2. Redistributions in binary form must reproduce the above copyright
(...skipping 407 matching lines...) Expand 10 before | Expand all | Expand 10 after
418 document.getElementById("class-name").textContent = className || ""; 418 document.getElementById("class-name").textContent = className || "";
419 document.getElementById("node-width").textContent = elementInfo.nodeWidth; 419 document.getElementById("node-width").textContent = elementInfo.nodeWidth;
420 document.getElementById("node-height").textContent = elementInfo.nodeHeight; 420 document.getElementById("node-height").textContent = elementInfo.nodeHeight;
421 var elementTitle = document.getElementById("element-title"); 421 var elementTitle = document.getElementById("element-title");
422 422
423 var marginQuad = highlight.quads[0]; 423 var marginQuad = highlight.quads[0];
424 424
425 var titleWidth = elementTitle.offsetWidth + 6; 425 var titleWidth = elementTitle.offsetWidth + 6;
426 var titleHeight = elementTitle.offsetHeight + 4; 426 var titleHeight = elementTitle.offsetHeight + 4;
427 427
428 var anchorTop = marginQuad[0].y; 428 var anchorTop = Math.min(marginQuad[0].y, marginQuad[1].y, marginQuad[2].y, marginQuad[3].y);
429 var anchorBottom = marginQuad[3].y 429 var anchorBottom = Math.max(marginQuad[0].y, marginQuad[1].y, marginQuad[2]. y, marginQuad[3].y);
430 var anchorLeft = Math.min(marginQuad[0].x, marginQuad[1].x, marginQuad[2].x, marginQuad[3].x);
430 431
431 const arrowHeight = 7; 432 const arrowHeight = 7;
432 var renderArrowUp = false; 433 var renderArrowUp = false;
433 var renderArrowDown = false; 434 var renderArrowDown = false;
434 435
435 var boxX = Math.max(2, marginQuad[0].x); 436 var boxX = Math.max(2, anchorLeft);
436 if (boxX + titleWidth > canvasWidth) 437 if (boxX + titleWidth > canvasWidth)
437 boxX = canvasWidth - titleWidth - 2; 438 boxX = canvasWidth - titleWidth - 2;
438 439
439 var boxY; 440 var boxY;
440 if (anchorTop > canvasHeight) { 441 if (anchorTop > canvasHeight) {
441 boxY = canvasHeight - titleHeight - arrowHeight; 442 boxY = canvasHeight - titleHeight - arrowHeight;
442 renderArrowDown = true; 443 renderArrowDown = true;
443 } else if (anchorBottom < 0) { 444 } else if (anchorBottom < 0) {
444 boxY = arrowHeight; 445 boxY = arrowHeight;
445 renderArrowUp = true; 446 renderArrowUp = true;
(...skipping 241 matching lines...) Expand 10 before | Expand all | Expand 10 after
687 <button id="step-over-button" title="Step over next function call (F10)."><d iv class="glyph"></div></button> 688 <button id="step-over-button" title="Step over next function call (F10)."><d iv class="glyph"></div></button>
688 </div> 689 </div>
689 </body> 690 </body>
690 <canvas id="canvas" class="fill"></canvas> 691 <canvas id="canvas" class="fill"></canvas>
691 <div id="element-title"> 692 <div id="element-title">
692 <span id="tag-name"></span><span id="node-id"></span><span id="class-name"></s pan> 693 <span id="tag-name"></span><span id="node-id"></span><span id="class-name"></s pan>
693 <span id="node-width"></span><span class="px">px</span><span class="px"> &#xD7 ; </span><span id="node-height"></span><span class="px">px</span> 694 <span id="node-width"></span><span class="px">px</span><span class="px"> &#xD7 ; </span><span id="node-height"></span><span class="px">px</span>
694 </div> 695 </div>
695 <div id="log"></div> 696 <div id="log"></div>
696 </html> 697 </html>
OLDNEW
« no previous file with comments | « no previous file | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698