Changeset 32343 in webkit
- Timestamp:
- Apr 21, 2008 1:53:40 PM (16 years ago)
- Location:
- trunk/WebCore
- Files:
-
- 11 added
- 7 edited
Legend:
- Unmodified
- Added
- Removed
-
trunk/WebCore/ChangeLog
r32342 r32343 1 2008-04-21 Timothy Hatcher <timothy@apple.com> 2 3 Adds the UI portions of the Scripts panel to the Web Inspector. 4 The Scripts panel has not been added to the toolbar yet. 5 6 https://bugs.webkit.org/show_bug.cgi?id=18601 7 8 Reviewed by Adam Roben. 9 10 * English.lproj/InspectorLocalizedStrings.js: Changed "Show inherited properties" 11 to "Show inherited". Adds new strings for the Scripts' panel tooltips. 12 * page/inspector/BreakpointsSidebarPane.js: Added. 13 * page/inspector/CallStackSidebarPane.js: Added. 14 * page/inspector/Images/back.png: Added. 15 * page/inspector/Images/debuggerContinue.png: Added. 16 * page/inspector/Images/debuggerPause.png: Added. 17 * page/inspector/Images/debuggerStepInto.png: Added. 18 * page/inspector/Images/debuggerStepOut.png: Added. 19 * page/inspector/Images/debuggerStepOver.png: Added. 20 * page/inspector/Images/forward.png: Added. 21 * page/inspector/Images/statusbarResizerHorizontal.png: Added. 22 * page/inspector/PropertiesSection.js: 23 (WebInspector.PropertiesSection): Flip the order the subtile is appended 24 so it can float right in the CSS. 25 * page/inspector/ScriptsPanel.js: Added. 26 * page/inspector/StylesSidebarPane.js: 27 (WebInspector.StylePropertiesSection): Changed "Show inherited properties" 28 to "Show inherited". 29 * page/inspector/inspector.css: Added new CSS rules for the Scripts panel. 30 Also changes the look of the section to match the mockup, this affects 31 Styles and Properties in Elements. 32 * page/inspector/inspector.html: Import new files. 33 * page/inspector/inspector.js: 34 (Preferences.minScriptsSidebarWidth): Added. 35 1 36 2008-04-21 Kevin McCullough <kmccullough@apple.com> 2 37 -
trunk/WebCore/English.lproj/InspectorLocalizedStrings.js
r31922 r32343 1 1 WebInspector.localizedStrings = { 2 2 "%.0fB": "%.0fB", 3 "%.0fms": "%.0fms", 4 "%.1f days": "%.1f days", 5 "%.1fhrs": "%.1fhrs", 6 "%.1fmin": "%.1fmin", 3 7 "%.2fKB": "%.2fKB", 8 "%.2fs": "%.2fs", 4 9 "%.3fMB": "%.3fMB", 5 "%.0fms": "%.0fms",6 "%.2fs": "%.2fs",7 "%.1fmin": "%.1fmin",8 "%.1fhrs": "%.1fhrs",9 "%.1f days": "%.1f days",10 10 "%d × %d": "%1$d × %2$d", 11 11 "%s (line %d)": "%s (line %d)", … … 16 16 "An error occurred trying to\nread the “%s” table.": "An error occurred trying to\nread the “%s” table.", 17 17 "An unexpected error %s occured.": "An unexpected error %s occured.", 18 "Breakpoints": "Breakpoints", 19 "Call Stack": "Call Stack", 18 20 "Clear console log.": "Clear console log.", 19 21 "Computed Style": "Computed Style", … … 24 26 "Dock to main window.": "Dock to main window.", 25 27 "Dock to main window.": "Dock to main window.", 28 "Documents": "Documents", 26 29 "Elements": "Elements", 27 30 "File size": "File size", 31 "Fonts": "Fonts", 28 32 "GRAPHS": "GRAPHS", 29 33 "Hide console.": "Hide console.", 34 "Images": "Images", 30 35 "Inline Style Attribute": "Inline Style Attribute", 31 36 "MIME type": "MIME type", … … 33 38 "Option-click to show %s.": "Option-click to show %s.", 34 39 "Option-click to visit %s.": "Option-click to visit %s.", 40 "Other": "Other", 41 "Pause script execution.": "Pause script execution.", 35 42 "Properties": "Properties", 36 43 "Prototype": "Prototype", … … 39 46 "Resource interpreted as %s but transferred with MIME type %s.": "Resource interpreted as %1$s but transferred with MIME type %2$s.", 40 47 "Resources": "Resources", 48 "Scripts": "Scripts", 41 49 "Search": "Search", 42 50 "Show console.": "Show console.", 43 "Show inherited properties": "Show inherited properties", 51 "Show inherited": "Show inherited", 52 "Show the next script resource.": "Show the next script resource.", 53 "Show the previous script resource.": "Show the previous script resource.", 44 54 "Size": "Size", 45 55 "Sort by Size": "Sort by Size", 46 56 "Sort by Time": "Sort by Time", 47 57 "Source": "Source", 58 "Step into next function call.": "Step into next function call.", 59 "Step out of current function.": "Step out of current function.", 60 "Step over next function call.": "Step over next function call.", 48 61 "Styles": "Styles", 62 "Stylesheets": "Stylesheets", 49 63 "The “%s”\ntable is empty.": "The “%s”\ntable is empty.", 50 64 "Time": "Time", … … 52 66 "Undock into separate window.": "Undock into separate window.", 53 67 "Use large resource rows.": "Use large resource rows.", 68 "XHR": "XHR", 54 69 "You could save bandwidth by having your web server compress this transfer with gzip or zlib.": "You could save bandwidth by having your web server compress this transfer with gzip or zlib.", 55 70 "document": "document", 56 "Documents": "Documents",57 71 "element’s “%s” attribute": "element’s “%s” attribute", 58 72 "font": "font", 59 "Fonts": "Fonts",60 73 "image": "image", 61 "Images": "Images",62 74 "inline stylesheet": "inline stylesheet", 63 "Other": "Other",64 75 "script": "script", 65 "Scripts": "Scripts",66 76 "stylesheet": "stylesheet", 67 "Stylesheets": "Stylesheets",68 77 "user agent stylesheet": "user agent stylesheet", 69 "XHR": "XHR",70 78 }; 71 -
trunk/WebCore/page/inspector/PropertiesSection.js
r28002 r32343 41 41 this.subtitleElement.className = "subtitle"; 42 42 43 this.headerElement.appendChild(this.subtitleElement); 43 44 this.headerElement.appendChild(this.titleElement); 44 this.headerElement.appendChild(this.subtitleElement); 45 45 46 this.headerElement.addEventListener("click", this.toggleExpanded.bind(this), false); 46 47 -
trunk/WebCore/page/inspector/StylesSidebarPane.js
r32224 r32343 251 251 252 252 showInheritedLabel.appendChild(showInheritedInput); 253 showInheritedLabel.appendChild(document.createTextNode(WebInspector.UIString("Show inherited properties")));253 showInheritedLabel.appendChild(document.createTextNode(WebInspector.UIString("Show inherited"))); 254 254 this.subtitleElement.appendChild(showInheritedLabel); 255 255 } else { -
trunk/WebCore/page/inspector/inspector.css
r31972 r32343 252 252 padding: 0; 253 253 margin-left: -1px; 254 margin-right: 0; 254 255 vertical-align: top; 255 256 border: 0 transparent none; … … 271 272 button.status-bar-item:active { 272 273 background-position: 32px 0; 274 } 275 276 button.status-bar-item:disabled { 277 background-position: 0 0 !important; 273 278 } 274 279 … … 809 814 810 815 .section { 811 display: block; 812 -webkit-box-shadow: rgba(0, 0, 0, .5) 2px 2px 5px; 813 -webkit-border-radius: 8px; 814 background-color: white; 815 font-size: 11px; 816 margin-bottom: 8px; 816 position: relative; 817 margin-top: 1px; 817 818 } 818 819 819 820 .section .header { 820 padding: 2px 8px 4px;821 b order: 2px solid rgba(255, 255, 255, 0.5);822 background-color: rgb(214, 221, 229);823 background-image: url(Images/gradient.png);824 background-repeat: repeat-x; 825 background-position: bottom; 826 -webkit-background-size: auto 100%; 827 -webkit-border-radius: 8px;828 t ext-shadow: rgba(255, 255, 255, 0.75) 0 1px 0;829 } 830 831 .section.expanded .header { 832 border-bottom: 2px ridge rgba(214, 221, 229, 0.5);833 -webkit-border-top-right-radius: 8px; 834 -webkit-border-top-left-radius: 8px; 835 -webkit-border-bottom-right-radius: 0; 836 -webkit-border-bottom-left-radius: 0;821 padding: 3px 8px 4px 16px; 822 background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(160, 172, 205)), to(rgb(132, 146, 190))); 823 min-height: 18px; 824 white-space: nowrap; 825 } 826 827 .section .header::before { 828 position: absolute; 829 top: 4px; 830 left: 6px; 831 width: 8px; 832 height: 8px; 833 content: url(Images/treeRightTriangleWhite.png); 834 } 835 836 .section.expanded .header::before { 837 content: url(Images/treeDownTriangleWhite.png); 837 838 } 838 839 839 840 .section .header .title { 841 color: white; 840 842 font-weight: bold; 841 843 word-wrap: break-word; 844 white-space: normal; 842 845 } 843 846 … … 851 854 852 855 .section .header input[type=checkbox] { 853 height: 1 em;854 width: 1 em;856 height: 10px; 857 width: 10px; 855 858 margin-left: 0; 856 859 margin-top: 0; 857 860 margin-bottom: 0; 858 vertical-align: top;861 vertical-align: 2px; 859 862 } 860 863 861 864 .section .header .subtitle { 862 margin-top: 2px;865 float: right; 863 866 font-size: 10px; 864 word-wrap: break-word; 867 margin-left: 5px; 868 max-width: 55%; 869 color: rgba(255, 255, 255, 0.7); 870 text-overflow: ellipsis; 871 overflow: hidden; 865 872 } 866 873 … … 874 881 padding: 2px 6px 5px; 875 882 list-style: none; 883 background-color: white; 876 884 } 877 885 … … 987 995 .swatch { 988 996 display: inline-block; 989 vertical-align: middle;997 vertical-align: baseline; 990 998 margin-left: 4px; 991 width: 0.75em; 992 height: 0.75em; 999 margin-bottom: -1px; 1000 width: 1em; 1001 height: 1em; 993 1002 border: 1px solid rgb(180, 180, 180); 994 1003 } … … 1002 1011 background-repeat: repeat-x; 1003 1012 background-position: bottom; 1004 -webkit-background-size: auto 100%; 1005 height: 14px; 1013 height: 16px; 1006 1014 padding: 0 6px; 1007 1015 border-top: 1px solid rgb(129, 129, 129); … … 1033 1041 .pane > .body { 1034 1042 position: relative; 1035 padding: 8px;1036 display: none;1037 overflow : auto;1043 display: none; 1044 overflow-y: auto; 1045 overflow-x: hidden; 1038 1046 } 1039 1047 … … 1052 1060 1053 1061 .metrics { 1062 padding: 8px; 1054 1063 font-size: 10px; 1055 1064 text-align: center; … … 1322 1331 .database-query-result.error::before { 1323 1332 background-image: url(Images/errorIcon.png); 1333 } 1334 1335 #scripts-status-bar { 1336 position: absolute; 1337 top: -1px; 1338 left: 0; 1339 right: 0; 1340 height: 24px; 1341 } 1342 1343 #scripts-status-bar .status-bar-item img { 1344 margin-top: 2px; 1345 } 1346 1347 #scripts-status-bar .status-bar-item:disabled img { 1348 opacity: 0.5; 1349 } 1350 1351 #scripts-back img { 1352 content: url(Images/back.png); 1353 } 1354 1355 #scripts-forward img { 1356 content: url(Images/forward.png); 1357 } 1358 1359 #scripts-pause img { 1360 content: url(Images/debuggerPause.png); 1361 } 1362 1363 #scripts-step-over img { 1364 content: url(Images/debuggerStepOver.png); 1365 } 1366 1367 #scripts-step-into img { 1368 content: url(Images/debuggerStepInto.png); 1369 } 1370 1371 #scripts-step-out img { 1372 content: url(Images/debuggerStepOut.png); 1373 } 1374 1375 #scripts-debugger-status { 1376 position: absolute; 1377 line-height: 24px; 1378 top: 0; 1379 right: 8px; 1380 } 1381 1382 #scripts-debugger-status:empty { 1383 display: none; 1384 } 1385 1386 #scripts-sidebar-resizer-widget { 1387 position: absolute; 1388 top: 0; 1389 bottom: 0; 1390 right: 225px; 1391 width: 16px; 1392 cursor: col-resize; 1393 background-image: url(Images/statusbarResizerHorizontal.png); 1394 background-repeat: no-repeat; 1395 background-position: center; 1396 } 1397 1398 #scripts-sidebar-buttons { 1399 position: absolute; 1400 right: 0; 1401 top: 0; 1402 bottom: 0; 1403 width: 225px; 1404 overflow: hidden; 1405 border-left: 1px solid rgb(64%, 64%, 64%); 1406 } 1407 1408 #script-resource-views { 1409 display: block; 1410 overflow: auto; 1411 padding: 0; 1412 position: absolute; 1413 top: 23px; 1414 left: 0; 1415 right: 225px; 1416 bottom: 0; 1417 } 1418 1419 #scripts-sidebar { 1420 position: absolute; 1421 top: 23px; 1422 right: 0; 1423 bottom: 0; 1424 width: 225px; 1425 background-color: rgb(232, 232, 232); 1426 border-left: 1px solid rgb(64%, 64%, 64%); 1427 cursor: default; 1428 overflow: auto; 1324 1429 } 1325 1430 -
trunk/WebCore/page/inspector/inspector.html
r31972 r32343 43 43 <script type="text/javascript" src="SidebarTreeElement.js"></script> 44 44 <script type="text/javascript" src="PropertiesSection.js"></script> 45 <script type="text/javascript" src="BreakpointsSidebarPane.js"></script> 46 <script type="text/javascript" src="CallStackSidebarPane.js"></script> 45 47 <script type="text/javascript" src="MetricsSidebarPane.js"></script> 46 48 <script type="text/javascript" src="PropertiesSidebarPane.js"></script> … … 49 51 <script type="text/javascript" src="ElementsPanel.js"></script> 50 52 <script type="text/javascript" src="ResourcesPanel.js"></script> 53 <script type="text/javascript" src="ScriptsPanel.js"></script> 51 54 <script type="text/javascript" src="DatabasesPanel.js"></script> 52 55 <script type="text/javascript" src="ResourceView.js"></script> -
trunk/WebCore/page/inspector/inspector.js
r31972 r32343 36 36 minSidebarWidth: 100, 37 37 minElementsSidebarWidth: 200, 38 minScriptsSidebarWidth: 200, 38 39 showInheritedComputedStyleProperties: false, 39 40 showMissingLocalizedStrings: false
Note: See TracChangeset
for help on using the changeset viewer.