OLD | NEW |
1 /* | 1 /* |
2 * Copyright (C) 2007 Apple Inc. All rights reserved. | 2 * Copyright (C) 2007 Apple Inc. All rights reserved. |
3 * Copyright (C) 2009 Joseph Pecoraro | 3 * Copyright (C) 2009 Joseph Pecoraro |
4 * | 4 * |
5 * Redistribution and use in source and binary forms, with or without | 5 * Redistribution and use in source and binary forms, with or without |
6 * modification, are permitted provided that the following conditions | 6 * modification, are permitted provided that the following conditions |
7 * are met: | 7 * are met: |
8 * | 8 * |
9 * 1. Redistributions of source code must retain the above copyright | 9 * 1. Redistributions of source code must retain the above copyright |
10 * notice, this list of conditions and the following disclaimer. | 10 * notice, this list of conditions and the following disclaimer. |
(...skipping 505 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
516 | 516 |
517 styleRules = []; | 517 styleRules = []; |
518 var pseudoId = pseudoElementCSSRules.pseudoId; | 518 var pseudoId = pseudoElementCSSRules.pseudoId; |
519 | 519 |
520 var entry = { isStyleSeparator: true, pseudoId: pseudoId }; | 520 var entry = { isStyleSeparator: true, pseudoId: pseudoId }; |
521 styleRules.push(entry); | 521 styleRules.push(entry); |
522 | 522 |
523 // Add rules in reverse order to match the cascade order. | 523 // Add rules in reverse order to match the cascade order. |
524 for (var j = pseudoElementCSSRules.rules.length - 1; j >= 0; --j) { | 524 for (var j = pseudoElementCSSRules.rules.length - 1; j >= 0; --j) { |
525 var rule = pseudoElementCSSRules.rules[j]; | 525 var rule = pseudoElementCSSRules.rules[j]; |
526 styleRules.push({ style: rule.style, selectorText: rule.selector
Text, media: rule.media, sourceURL: rule.resourceURL(), rule: rule, editable: !!
(rule.style && rule.style.id) }); | 526 styleRules.push({ style: rule.style, selectorText: rule.selector
Text, media: rule.media, sourceURL: rule.resourceURL(), rule: rule, editable: !!
(rule.style && rule.style.styleSheetId) }); |
527 } | 527 } |
528 usedProperties = {}; | 528 usedProperties = {}; |
529 this._markUsedProperties(styleRules, usedProperties); | 529 this._markUsedProperties(styleRules, usedProperties); |
530 this.sections[pseudoId] = this._rebuildSectionsForStyleRules(styleRu
les, usedProperties, anchorElement); | 530 this.sections[pseudoId] = this._rebuildSectionsForStyleRules(styleRu
les, usedProperties, anchorElement); |
531 } | 531 } |
532 | 532 |
533 if (this._filterRegex) | 533 if (this._filterRegex) |
534 this._updateFilter(false); | 534 this._updateFilter(false); |
535 this._nodeStylesUpdatedForTest(node, true); | 535 this._nodeStylesUpdatedForTest(node, true); |
536 }, | 536 }, |
537 | 537 |
538 _nodeStylesUpdatedForTest: function(node, rebuild) | 538 _nodeStylesUpdatedForTest: function(node, rebuild) |
539 { | 539 { |
540 // Tests override this method. | 540 // Tests override this method. |
541 }, | 541 }, |
542 | 542 |
543 _refreshStyleRules: function(sections, computedStyle) | 543 _refreshStyleRules: function(sections, computedStyle) |
544 { | 544 { |
545 var nodeComputedStyle = computedStyle; | 545 var nodeComputedStyle = computedStyle; |
546 var styleRules = []; | 546 var styleRules = []; |
547 for (var i = 0; sections && i < sections.length; ++i) { | 547 for (var i = 0; sections && i < sections.length; ++i) { |
548 var section = sections[i]; | 548 var section = sections[i]; |
549 if (section.isBlank) | 549 if (section.isBlank) |
550 continue; | 550 continue; |
551 if (section.computedStyle) | 551 if (section.computedStyle) |
552 section.styleRule.style = nodeComputedStyle; | 552 section.styleRule.style = nodeComputedStyle; |
553 var styleRule = { section: section, style: section.styleRule.style,
computedStyle: section.computedStyle, rule: section.rule, editable: !!(section.s
tyleRule.style && section.styleRule.style.id), | 553 var styleRule = { section: section, style: section.styleRule.style,
computedStyle: section.computedStyle, rule: section.rule, editable: !!(section.s
tyleRule.style && section.styleRule.style.styleSheetId), |
554 isAttribute: section.styleRule.isAttribute, isInherited: section
.styleRule.isInherited, parentNode: section.styleRule.parentNode }; | 554 isAttribute: section.styleRule.isAttribute, isInherited: section
.styleRule.isInherited, parentNode: section.styleRule.parentNode }; |
555 styleRules.push(styleRule); | 555 styleRules.push(styleRule); |
556 } | 556 } |
557 return styleRules; | 557 return styleRules; |
558 }, | 558 }, |
559 | 559 |
560 _rebuildStyleRules: function(node, styles) | 560 _rebuildStyleRules: function(node, styles) |
561 { | 561 { |
562 var nodeComputedStyle = styles.computedStyle; | 562 var nodeComputedStyle = styles.computedStyle; |
563 this.sections = {}; | 563 this.sections = {}; |
(...skipping 22 matching lines...) Expand all Loading... |
586 | 586 |
587 // Add rules in reverse order to match the cascade order. | 587 // Add rules in reverse order to match the cascade order. |
588 var addedAttributesStyle; | 588 var addedAttributesStyle; |
589 for (var i = styles.matchedCSSRules.length - 1; i >= 0; --i) { | 589 for (var i = styles.matchedCSSRules.length - 1; i >= 0; --i) { |
590 var rule = styles.matchedCSSRules[i]; | 590 var rule = styles.matchedCSSRules[i]; |
591 if ((rule.isUser || rule.isUserAgent) && !addedAttributesStyle) { | 591 if ((rule.isUser || rule.isUserAgent) && !addedAttributesStyle) { |
592 // Show element's Style Attributes after all author rules. | 592 // Show element's Style Attributes after all author rules. |
593 addedAttributesStyle = true; | 593 addedAttributesStyle = true; |
594 addAttributesStyle(); | 594 addAttributesStyle(); |
595 } | 595 } |
596 styleRules.push({ style: rule.style, selectorText: rule.selectorText
, media: rule.media, sourceURL: rule.resourceURL(), rule: rule, editable: !!(rul
e.style && rule.style.id) }); | 596 styleRules.push({ style: rule.style, selectorText: rule.selectorText
, media: rule.media, sourceURL: rule.resourceURL(), rule: rule, editable: !!(rul
e.style && rule.style.styleSheetId) }); |
597 } | 597 } |
598 | 598 |
599 if (!addedAttributesStyle) | 599 if (!addedAttributesStyle) |
600 addAttributesStyle(); | 600 addAttributesStyle(); |
601 | 601 |
602 // Walk the node structure and identify styles with inherited properties
. | 602 // Walk the node structure and identify styles with inherited properties
. |
603 var parentNode = node.parentNode; | 603 var parentNode = node.parentNode; |
604 function insertInheritedNodeSeparator(node) | 604 function insertInheritedNodeSeparator(node) |
605 { | 605 { |
606 var entry = {}; | 606 var entry = {}; |
(...skipping 19 matching lines...) Expand all Loading... |
626 for (var i = parentStyles.matchedCSSRules.length - 1; i >= 0; --i) { | 626 for (var i = parentStyles.matchedCSSRules.length - 1; i >= 0; --i) { |
627 var rulePayload = parentStyles.matchedCSSRules[i]; | 627 var rulePayload = parentStyles.matchedCSSRules[i]; |
628 if (!this._containsInherited(rulePayload.style)) | 628 if (!this._containsInherited(rulePayload.style)) |
629 continue; | 629 continue; |
630 var rule = rulePayload; | 630 var rule = rulePayload; |
631 | 631 |
632 if (!separatorInserted) { | 632 if (!separatorInserted) { |
633 insertInheritedNodeSeparator(parentNode); | 633 insertInheritedNodeSeparator(parentNode); |
634 separatorInserted = true; | 634 separatorInserted = true; |
635 } | 635 } |
636 styleRules.push({ style: rule.style, selectorText: rule.selector
Text, media: rule.media, sourceURL: rule.resourceURL(), rule: rule, isInherited:
true, parentNode: parentNode, editable: !!(rule.style && rule.style.id) }); | 636 styleRules.push({ style: rule.style, selectorText: rule.selector
Text, media: rule.media, sourceURL: rule.resourceURL(), rule: rule, isInherited:
true, parentNode: parentNode, editable: !!(rule.style && rule.style.styleSheetI
d) }); |
637 } | 637 } |
638 parentNode = parentNode.parentNode; | 638 parentNode = parentNode.parentNode; |
639 } | 639 } |
640 return styleRules; | 640 return styleRules; |
641 }, | 641 }, |
642 | 642 |
643 _markUsedProperties: function(styleRules, usedProperties) | 643 _markUsedProperties: function(styleRules, usedProperties) |
644 { | 644 { |
645 var foundImportantProperties = {}; | 645 var foundImportantProperties = {}; |
646 var propertyToEffectiveRule = {}; | 646 var propertyToEffectiveRule = {}; |
(...skipping 463 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1110 this._selectorElement.addEventListener("click", this._handleSelectorClick.bi
nd(this), false); | 1110 this._selectorElement.addEventListener("click", this._handleSelectorClick.bi
nd(this), false); |
1111 this.element.addEventListener("mousedown", this._handleEmptySpaceMouseDown.b
ind(this), false); | 1111 this.element.addEventListener("mousedown", this._handleEmptySpaceMouseDown.b
ind(this), false); |
1112 this.element.addEventListener("click", this._handleEmptySpaceClick.bind(this
), false); | 1112 this.element.addEventListener("click", this._handleEmptySpaceClick.bind(this
), false); |
1113 | 1113 |
1114 if (this.rule) { | 1114 if (this.rule) { |
1115 // Prevent editing the user agent and user rules. | 1115 // Prevent editing the user agent and user rules. |
1116 if (this.rule.isUserAgent || this.rule.isUser) | 1116 if (this.rule.isUserAgent || this.rule.isUser) |
1117 this.editable = false; | 1117 this.editable = false; |
1118 else { | 1118 else { |
1119 // Check this is a real CSSRule, not a bogus object coming from WebI
nspector.BlankStylePropertiesSection. | 1119 // Check this is a real CSSRule, not a bogus object coming from WebI
nspector.BlankStylePropertiesSection. |
1120 if (this.rule.id) | 1120 if (this.rule.styleSheetId) |
1121 this.navigable = !!this.rule.resourceURL(); | 1121 this.navigable = !!this.rule.resourceURL(); |
1122 } | 1122 } |
1123 this.titleElement.classList.add("styles-selector"); | 1123 this.titleElement.classList.add("styles-selector"); |
1124 } | 1124 } |
1125 | 1125 |
1126 this._usedProperties = styleRule.usedProperties; | 1126 this._usedProperties = styleRule.usedProperties; |
1127 | 1127 |
1128 this._selectorRefElement = document.createElement("div"); | 1128 this._selectorRefElement = document.createElement("div"); |
1129 this._selectorRefElement.className = "subtitle"; | 1129 this._selectorRefElement.className = "subtitle"; |
1130 this._mediaListElement = this.titleElement.createChild("div", "media-list"); | 1130 this._mediaListElement = this.titleElement.createChild("div", "media-list"); |
(...skipping 14 matching lines...) Expand all Loading... |
1145 } | 1145 } |
1146 | 1146 |
1147 WebInspector.StylePropertiesSection.prototype = { | 1147 WebInspector.StylePropertiesSection.prototype = { |
1148 /** | 1148 /** |
1149 * @param {!WebInspector.CSSRule} editedRule | 1149 * @param {!WebInspector.CSSRule} editedRule |
1150 * @param {!WebInspector.TextRange} oldRange | 1150 * @param {!WebInspector.TextRange} oldRange |
1151 * @param {!WebInspector.TextRange} newRange | 1151 * @param {!WebInspector.TextRange} newRange |
1152 */ | 1152 */ |
1153 _styleSheetRuleEdited: function(editedRule, oldRange, newRange) | 1153 _styleSheetRuleEdited: function(editedRule, oldRange, newRange) |
1154 { | 1154 { |
1155 if (!this.rule || !this.rule.id) | 1155 if (!this.rule || !this.rule.styleSheetId) |
1156 return; | 1156 return; |
1157 if (this.rule !== editedRule) | 1157 if (this.rule !== editedRule) |
1158 this.rule.sourceStyleSheetEdited(this.rule.id.styleSheetId, oldRange
, newRange); | 1158 this.rule.sourceStyleSheetEdited(this.rule.styleSheetId, oldRange, n
ewRange); |
1159 this._updateMediaList(); | 1159 this._updateMediaList(); |
1160 this._updateRuleOrigin(); | 1160 this._updateRuleOrigin(); |
1161 }, | 1161 }, |
1162 | 1162 |
1163 /** | 1163 /** |
1164 * @param {!Object} styleRule | 1164 * @param {!Object} styleRule |
1165 */ | 1165 */ |
1166 _createMediaList: function(styleRule) | 1166 _createMediaList: function(styleRule) |
1167 { | 1167 { |
1168 if (!styleRule.media) | 1168 if (!styleRule.media) |
(...skipping 275 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1444 for (var i = 0; i < selectors.length ; ++i) { | 1444 for (var i = 0; i < selectors.length ; ++i) { |
1445 if (i) | 1445 if (i) |
1446 fragment.appendChild(document.createTextNode(", ")); | 1446 fragment.appendChild(document.createTextNode(", ")); |
1447 var isSelectorMatching = matchingSelectors[currentMatch] === i; | 1447 var isSelectorMatching = matchingSelectors[currentMatch] === i; |
1448 if (isSelectorMatching) | 1448 if (isSelectorMatching) |
1449 ++currentMatch; | 1449 ++currentMatch; |
1450 var rawLocation = new WebInspector.CSSLocation(this._parentPane._tar
get, rule.sourceURL, rule.lineNumberInSource(i), rule.columnNumberInSource(i)); | 1450 var rawLocation = new WebInspector.CSSLocation(this._parentPane._tar
get, rule.sourceURL, rule.lineNumberInSource(i), rule.columnNumberInSource(i)); |
1451 var matchingSelectorClass = isSelectorMatching ? " selector-matches"
: ""; | 1451 var matchingSelectorClass = isSelectorMatching ? " selector-matches"
: ""; |
1452 var selectorElement = document.createElement("span"); | 1452 var selectorElement = document.createElement("span"); |
1453 selectorElement.className = "simple-selector" + matchingSelectorClas
s; | 1453 selectorElement.className = "simple-selector" + matchingSelectorClas
s; |
1454 if (rule.id) | 1454 if (rule.styleSheetId) |
1455 selectorElement._selectorIndex = i; | 1455 selectorElement._selectorIndex = i; |
1456 selectorElement.textContent = selectors[i].value; | 1456 selectorElement.textContent = selectors[i].value; |
1457 | 1457 |
1458 fragment.appendChild(selectorElement); | 1458 fragment.appendChild(selectorElement); |
1459 } | 1459 } |
1460 | 1460 |
1461 this._selectorElement.removeChildren(); | 1461 this._selectorElement.removeChildren(); |
1462 this._selectorElement.appendChild(fragment); | 1462 this._selectorElement.appendChild(fragment); |
1463 this._markSelectorHighlights(); | 1463 this._markSelectorHighlights(); |
1464 }, | 1464 }, |
(...skipping 51 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1516 var link = WebInspector.linkifyResourceAsNode(url, line, "", url + "
:" + (line + 1)); | 1516 var link = WebInspector.linkifyResourceAsNode(url, line, "", url + "
:" + (line + 1)); |
1517 link.classList.add("webkit-html-resource-link"); | 1517 link.classList.add("webkit-html-resource-link"); |
1518 link.setAttribute("data-uncopyable", link.textContent); | 1518 link.setAttribute("data-uncopyable", link.textContent); |
1519 link.textContent = ""; | 1519 link.textContent = ""; |
1520 return link; | 1520 return link; |
1521 } | 1521 } |
1522 | 1522 |
1523 if (this.styleRule.sourceURL) { | 1523 if (this.styleRule.sourceURL) { |
1524 var firstMatchingIndex = this.styleRule.rule.matchingSelectors && th
is.rule.matchingSelectors.length ? this.rule.matchingSelectors[0] : 0; | 1524 var firstMatchingIndex = this.styleRule.rule.matchingSelectors && th
is.rule.matchingSelectors.length ? this.rule.matchingSelectors[0] : 0; |
1525 var matchingSelectorLocation = new WebInspector.CSSLocation(this._pa
rentPane._target, this.styleRule.sourceURL, this.rule.lineNumberInSource(firstMa
tchingIndex), this.rule.columnNumberInSource(firstMatchingIndex)); | 1525 var matchingSelectorLocation = new WebInspector.CSSLocation(this._pa
rentPane._target, this.styleRule.sourceURL, this.rule.lineNumberInSource(firstMa
tchingIndex), this.rule.columnNumberInSource(firstMatchingIndex)); |
1526 return this._parentPane._linkifier.linkifyCSSLocation(this.rule.id.s
tyleSheetId, matchingSelectorLocation) || linkifyUncopyable(this.styleRule.sourc
eURL, this.rule.lineNumberInSource()); | 1526 return this._parentPane._linkifier.linkifyCSSLocation(this.rule.styl
eSheetId, matchingSelectorLocation) || linkifyUncopyable(this.styleRule.sourceUR
L, this.rule.lineNumberInSource()); |
1527 } | 1527 } |
1528 | 1528 |
1529 if (!this.rule) | 1529 if (!this.rule) |
1530 return document.createTextNode(""); | 1530 return document.createTextNode(""); |
1531 | 1531 |
1532 if (this.rule.isUserAgent) | 1532 if (this.rule.isUserAgent) |
1533 return document.createTextNode(WebInspector.UIString("user agent sty
lesheet")); | 1533 return document.createTextNode(WebInspector.UIString("user agent sty
lesheet")); |
1534 if (this.rule.isUser) | 1534 if (this.rule.isUser) |
1535 return document.createTextNode(WebInspector.UIString("user styleshee
t")); | 1535 return document.createTextNode(WebInspector.UIString("user styleshee
t")); |
1536 if (this.rule.isViaInspector) | 1536 if (this.rule.isViaInspector) |
(...skipping 22 matching lines...) Expand all Loading... |
1559 return; | 1559 return; |
1560 } | 1560 } |
1561 this.expand(); | 1561 this.expand(); |
1562 this.addNewBlankProperty().startEditing(); | 1562 this.addNewBlankProperty().startEditing(); |
1563 }, | 1563 }, |
1564 | 1564 |
1565 _handleSelectorClick: function(event) | 1565 _handleSelectorClick: function(event) |
1566 { | 1566 { |
1567 if (WebInspector.KeyboardShortcut.eventHasCtrlOrMeta(event) && this.navi
gable && event.target.classList.contains("simple-selector")) { | 1567 if (WebInspector.KeyboardShortcut.eventHasCtrlOrMeta(event) && this.navi
gable && event.target.classList.contains("simple-selector")) { |
1568 var index = event.target._selectorIndex; | 1568 var index = event.target._selectorIndex; |
1569 var styleSheetHeader = this._parentPane._target.cssModel.styleSheetH
eaderForId(this.rule.id.styleSheetId); | 1569 var styleSheetHeader = this._parentPane._target.cssModel.styleSheetH
eaderForId(this.rule.styleSheetId); |
1570 var uiLocation = styleSheetHeader.rawLocationToUILocation(this.rule.
lineNumberInSource(index), this.rule.columnNumberInSource(index)); | 1570 var uiLocation = styleSheetHeader.rawLocationToUILocation(this.rule.
lineNumberInSource(index), this.rule.columnNumberInSource(index)); |
1571 WebInspector.Revealer.reveal(uiLocation); | 1571 WebInspector.Revealer.reveal(uiLocation); |
1572 return; | 1572 return; |
1573 } | 1573 } |
1574 this._startEditingOnMouseEvent(); | 1574 this._startEditingOnMouseEvent(); |
1575 event.consume(true); | 1575 event.consume(true); |
1576 }, | 1576 }, |
1577 | 1577 |
1578 _startEditingOnMouseEvent: function() | 1578 _startEditingOnMouseEvent: function() |
1579 { | 1579 { |
(...skipping 1734 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
3314 return; | 3314 return; |
3315 } | 3315 } |
3316 | 3316 |
3317 var results = this._cssCompletions.startsWith(prefix); | 3317 var results = this._cssCompletions.startsWith(prefix); |
3318 var selectedIndex = this._cssCompletions.mostUsedOf(results); | 3318 var selectedIndex = this._cssCompletions.mostUsedOf(results); |
3319 completionsReadyCallback(results, selectedIndex); | 3319 completionsReadyCallback(results, selectedIndex); |
3320 }, | 3320 }, |
3321 | 3321 |
3322 __proto__: WebInspector.TextPrompt.prototype | 3322 __proto__: WebInspector.TextPrompt.prototype |
3323 } | 3323 } |
OLD | NEW |