Chromium Code Reviews Chromium Code Reviews
Issue 1206833003:
Devtools[LayoutEditor]: Pass data about property change from InspectorOverlayPage (Closed)
Base URL: svn://svn.chromium.org/blink/trunk| OLD | NEW |
|---|---|
| 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 639 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 650 context.beginPath(); | 650 context.beginPath(); |
| 651 context.arc(anchorInfo.x, anchorInfo.y, handleWidth, 0, 2 * Math.PI); | 651 context.arc(anchorInfo.x, anchorInfo.y, handleWidth, 0, 2 * Math.PI); |
| 652 context.fill(); | 652 context.fill(); |
| 653 context.stroke(); | 653 context.stroke(); |
| 654 context.restore(); | 654 context.restore(); |
| 655 | 655 |
| 656 var anchorElement = document.createElement("div"); | 656 var anchorElement = document.createElement("div"); |
| 657 anchorElement.className = "editor-anchor"; | 657 anchorElement.className = "editor-anchor"; |
| 658 anchorElement.style.left = anchorInfo.x - handleWidth + "px"; | 658 anchorElement.style.left = anchorInfo.x - handleWidth + "px"; |
| 659 anchorElement.style.top = anchorInfo.y - handleWidth + "px"; | 659 anchorElement.style.top = anchorInfo.y - handleWidth + "px"; |
| 660 anchorElement.addEventListener("mousedown", onAnchorMouseDown.bind(null, anc horInfo)); | |
| 660 return anchorElement; | 661 return anchorElement; |
| 661 } | 662 } |
| 662 | 663 |
| 664 function calculateDelta(deltaVector, moveDelta) | |
| 665 { | |
| 666 return (deltaVector.x * moveDelta.x + deltaVector.y * moveDelta.y) / Math.sq rt(deltaVector.x * deltaVector.x + deltaVector.y * deltaVector.y); | |
|
dgozman
2015/06/25 12:30:59
This will break with zero delta vector.
sergeyv
2015/06/25 12:54:30
It can't be zero
| |
| 667 } | |
| 668 | |
| 669 function onAnchorMouseDown(anchorInfo, event) | |
| 670 { | |
| 671 // Only drag upon left button. Right will likely cause a context menu. So wi ll ctrl-click on mac. | |
| 672 if (event.button || (window.platform == "mac" && event.ctrlKey)) | |
| 673 return; | |
| 674 | |
| 675 event.preventDefault(); | |
| 676 window.boundDragMove = onDragMove.bind(null, new Point(event.screenX, event. screenY), anchorInfo.deltaVector); | |
| 677 document.addEventListener("mousemove", boundDragMove); | |
| 678 document.addEventListener("mouseup", onDragEnd); | |
| 679 InspectorOverlayHost.startPropertyChange(anchorInfo.propertyName); | |
| 680 } | |
| 681 | |
| 682 function onDragMove(mouseDownPoint, deltaVector, event) | |
| 683 { | |
| 684 if (event.buttons !== 1) { | |
| 685 onDragEnd(event); | |
| 686 return; | |
| 687 } | |
| 688 event.preventDefault(); | |
| 689 InspectorOverlayHost.changeProperty(calculateDelta(deltaVector, new Point(ev ent.screenX - mouseDownPoint.x, event.screenY - mouseDownPoint.y))); | |
| 690 } | |
| 691 | |
| 692 function onDragEnd(event) | |
| 693 { | |
| 694 document.removeEventListener("mousemove", boundDragMove); | |
| 695 delete window.boundDragMove; | |
| 696 document.removeEventListener("mouseup", onDragEnd); | |
| 697 event.preventDefault(); | |
| 698 InspectorOverlayHost.endPropertyChange(); | |
| 699 } | |
| 700 | |
| 701 function Point(x, y) | |
| 702 { | |
| 703 this.x = x; | |
| 704 this.y = y; | |
| 705 } | |
| 706 | |
| 663 window.addEventListener("DOMContentLoaded", onLoaded); | 707 window.addEventListener("DOMContentLoaded", onLoaded); |
| 664 document.addEventListener("keydown", onDocumentKeyDown); | 708 document.addEventListener("keydown", onDocumentKeyDown); |
| 665 | 709 |
| 666 </script> | 710 </script> |
| 667 </head> | 711 </head> |
| 668 <body class="fill"> | 712 <body class="fill"> |
| 669 <div class="controls-line"> | 713 <div class="controls-line"> |
| 670 <div class="message-box"><div id="paused-in-debugger"></div></div> | 714 <div class="message-box"><div id="paused-in-debugger"></div></div> |
| 671 <div class="button" id="resume-button" title="Resume script execution (F8)." ><div class="glyph"></div></div> | 715 <div class="button" id="resume-button" title="Resume script execution (F8)." ><div class="glyph"></div></div> |
| 672 <div class="button" id="step-over-button" title="Step over next function cal l (F10)."><div class="glyph"></div></div> | 716 <div class="button" id="step-over-button" title="Step over next function cal l (F10)."><div class="glyph"></div></div> |
| 673 </div> | 717 </div> |
| 674 </body> | 718 </body> |
| 675 <canvas id="canvas" class="fill"></canvas> | 719 <canvas id="canvas" class="fill"></canvas> |
| 676 <div id="element-title"> | 720 <div id="element-title"> |
| 677 <span id="tag-name"></span><span id="node-id"></span><span id="class-name"></s pan> | 721 <span id="tag-name"></span><span id="node-id"></span><span id="class-name"></s pan> |
| 678 <span id="node-width"></span><span class="px">px</span><span class="px"> × ; </span><span id="node-height"></span><span class="px">px</span> | 722 <span id="node-width"></span><span class="px">px</span><span class="px"> × ; </span><span id="node-height"></span><span class="px">px</span> |
| 679 </div> | 723 </div> |
| 680 <div id="editor" class="fill"></div> | 724 <div id="editor" class="fill"></div> |
| 681 <div id="log"></div> | 725 <div id="log"></div> |
| 682 </html> | 726 </html> |
| OLD | NEW |
