added Linux arm64 SDK
This commit is contained in:
Andrew Zambazos
@@ -1,534 +0,0 @@
|
||||
/*
|
||||
* Copyright (C) 2013, 2015 Apple Inc. All rights reserved.
|
||||
*
|
||||
* Redistribution and use in source and binary forms, with or without
|
||||
* modification, are permitted provided that the following conditions
|
||||
* are met:
|
||||
* 1. Redistributions of source code must retain the above copyright
|
||||
* notice, this list of conditions and the following disclaimer.
|
||||
* 2. Redistributions in binary form must reproduce the above copyright
|
||||
* notice, this list of conditions and the following disclaimer in the
|
||||
* documentation and/or other materials provided with the distribution.
|
||||
*
|
||||
* THIS SOFTWARE IS PROVIDED BY APPLE INC. AND ITS CONTRIBUTORS ``AS IS''
|
||||
* AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
|
||||
* THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
|
||||
* PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL APPLE INC. OR ITS CONTRIBUTORS
|
||||
* BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
|
||||
* CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
|
||||
* SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
|
||||
* INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
|
||||
* CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
|
||||
* ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF
|
||||
* THE POSSIBILITY OF SUCH DAMAGE.
|
||||
*/
|
||||
|
||||
WI.BoxModelDetailsSectionRow = class BoxModelDetailsSectionRow extends WI.DetailsSectionRow
|
||||
{
|
||||
constructor()
|
||||
{
|
||||
super(WI.UIString("No Box Model Information"));
|
||||
|
||||
this.element.classList.add("box-model");
|
||||
|
||||
this._nodeStyles = null;
|
||||
|
||||
this._outermostBox = null;
|
||||
this._outermostBoxWidth = NaN;
|
||||
}
|
||||
|
||||
// Public
|
||||
|
||||
get nodeStyles()
|
||||
{
|
||||
return this._nodeStyles;
|
||||
}
|
||||
|
||||
set nodeStyles(nodeStyles)
|
||||
{
|
||||
if (this._nodeStyles && this._nodeStyles.computedStyle)
|
||||
this._nodeStyles.computedStyle.removeEventListener(WI.CSSStyleDeclaration.Event.PropertiesChanged, this._refresh, this);
|
||||
|
||||
this._nodeStyles = nodeStyles;
|
||||
if (this._nodeStyles && this._nodeStyles.computedStyle)
|
||||
this._nodeStyles.computedStyle.addEventListener(WI.CSSStyleDeclaration.Event.PropertiesChanged, this._refresh, this);
|
||||
|
||||
this.element.classList.remove("hovered");
|
||||
this._refresh();
|
||||
}
|
||||
|
||||
get minimumWidth()
|
||||
{
|
||||
if (isNaN(this._outermostBoxWidth) && this._outermostBox) {
|
||||
const margin = 6; // Keep this in sync with `.details-section .row.box-model .box`.
|
||||
this._outermostBoxWidth = this._outermostBox.realOffsetWidth + margin;
|
||||
}
|
||||
return this._outermostBoxWidth || 0;
|
||||
}
|
||||
|
||||
// Private
|
||||
|
||||
_refresh()
|
||||
{
|
||||
if (this._ignoreNextRefresh) {
|
||||
this._ignoreNextRefresh = false;
|
||||
return;
|
||||
}
|
||||
|
||||
this._updateMetrics();
|
||||
}
|
||||
|
||||
_getPropertyValue(style, propertyName)
|
||||
{
|
||||
let property = style.propertyForName(propertyName);
|
||||
if (!property)
|
||||
return null;
|
||||
return property.value;
|
||||
}
|
||||
|
||||
_getPropertyValueAsPx(style, propertyName)
|
||||
{
|
||||
let value = this._getPropertyValue(style, propertyName);
|
||||
if (!value)
|
||||
return 0;
|
||||
return Number(value.replace(/px$/, "") || 0);
|
||||
}
|
||||
|
||||
_getBox(computedStyle, componentName)
|
||||
{
|
||||
let prefix = this._getComponentPrefix(componentName);
|
||||
let suffix = this._getComponentSuffix(componentName);
|
||||
let left = this._getPropertyValueAsPx(computedStyle, prefix + "-left" + suffix);
|
||||
let top = this._getPropertyValueAsPx(computedStyle, prefix + "-top" + suffix);
|
||||
let right = this._getPropertyValueAsPx(computedStyle, prefix + "-right" + suffix);
|
||||
let bottom = this._getPropertyValueAsPx(computedStyle, prefix + "-bottom" + suffix);
|
||||
return {left, top, right, bottom};
|
||||
}
|
||||
|
||||
_getComponentPrefix(componentName)
|
||||
{
|
||||
return componentName === "border-radius" ? "border" : componentName;
|
||||
}
|
||||
|
||||
_getComponentSuffix(componentName)
|
||||
{
|
||||
switch (componentName) {
|
||||
case "border":
|
||||
return "-width";
|
||||
|
||||
case "border-radius":
|
||||
return "-radius";
|
||||
}
|
||||
return "";
|
||||
}
|
||||
|
||||
_highlightDOMNode(showHighlight, mode, event)
|
||||
{
|
||||
event.stopPropagation();
|
||||
|
||||
let node = showHighlight ? this.nodeStyles.node : null;
|
||||
if (node) {
|
||||
if (this._highlightMode === mode)
|
||||
return;
|
||||
this._highlightMode = mode;
|
||||
node.highlight(this._highlightMode);
|
||||
} else {
|
||||
this._highlightMode = null;
|
||||
WI.domManager.hideDOMNodeHighlight();
|
||||
}
|
||||
|
||||
for (var i = 0; this._boxElements && i < this._boxElements.length; ++i) {
|
||||
var element = this._boxElements[i];
|
||||
if (node && (mode === "all" || element._name === mode))
|
||||
element.classList.add("active");
|
||||
else
|
||||
element.classList.remove("active");
|
||||
}
|
||||
|
||||
this.element.classList.toggle("hovered", showHighlight);
|
||||
}
|
||||
|
||||
_updateMetrics()
|
||||
{
|
||||
var metricsElement = document.createElement("div");
|
||||
var style = this._nodeStyles.computedStyle;
|
||||
|
||||
function createValueElement(type, value, name, propertyName)
|
||||
{
|
||||
// Check if the value is a float and whether it should be rounded.
|
||||
let floatValue = parseFloat(value);
|
||||
let shouldRoundValue = !isNaN(floatValue) && (floatValue % 1 !== 0);
|
||||
|
||||
if (isNaN(floatValue))
|
||||
value = figureDash;
|
||||
|
||||
let element = document.createElement(type);
|
||||
element.textContent = shouldRoundValue ? ("~" + Math.round(floatValue * 100) / 100) : value;
|
||||
if (shouldRoundValue)
|
||||
element.title = value;
|
||||
element.addEventListener("dblclick", this._startEditing.bind(this, element, name, propertyName, style), false);
|
||||
return element;
|
||||
}
|
||||
|
||||
function createBoxPartElement(name, side)
|
||||
{
|
||||
let prefix = this._getComponentPrefix(name);
|
||||
let suffix = this._getComponentSuffix(name);
|
||||
let propertyName = (prefix !== "position" ? prefix + "-" : "") + side + suffix;
|
||||
let value = this._getPropertyValue(style, propertyName);
|
||||
if (value) {
|
||||
if (prefix === "position" && value === "auto")
|
||||
value = "";
|
||||
else if (prefix !== "position" && value === "0px")
|
||||
value = "";
|
||||
else
|
||||
value = value.replace(/px$/, "");
|
||||
} else
|
||||
value = "";
|
||||
|
||||
let element = createValueElement.call(this, "div", value, name, propertyName);
|
||||
element.className = side;
|
||||
return element;
|
||||
}
|
||||
|
||||
function createContentAreaElement(name)
|
||||
{
|
||||
console.assert(name === "width" || name === "height");
|
||||
|
||||
let size = this._getPropertyValueAsPx(style, name);
|
||||
if (this._getPropertyValue(style, "box-sizing") === "border-box") {
|
||||
let borderBox = this._getBox(style, "border");
|
||||
let paddingBox = this._getBox(style, "padding");
|
||||
|
||||
let [side, oppositeSide] = name === "width" ? ["left", "right"] : ["top", "bottom"];
|
||||
size = size - borderBox[side] - borderBox[oppositeSide] - paddingBox[side] - paddingBox[oppositeSide];
|
||||
}
|
||||
|
||||
return createValueElement.call(this, "span", size, name, name);
|
||||
}
|
||||
|
||||
// Display types for which margin is ignored.
|
||||
var noMarginDisplayType = {
|
||||
"table-cell": true,
|
||||
"table-column": true,
|
||||
"table-column-group": true,
|
||||
"table-footer-group": true,
|
||||
"table-header-group": true,
|
||||
"table-row": true,
|
||||
"table-row-group": true
|
||||
};
|
||||
|
||||
// Display types for which padding is ignored.
|
||||
var noPaddingDisplayType = {
|
||||
"table-column": true,
|
||||
"table-column-group": true,
|
||||
"table-footer-group": true,
|
||||
"table-header-group": true,
|
||||
"table-row": true,
|
||||
"table-row-group": true
|
||||
};
|
||||
|
||||
// Position types for which top, left, bottom and right are ignored.
|
||||
var noPositionType = {
|
||||
"static": true
|
||||
};
|
||||
|
||||
this._boxElements = [];
|
||||
|
||||
if (style.enabledProperties.length === 0) {
|
||||
this.showEmptyMessage();
|
||||
return;
|
||||
}
|
||||
|
||||
let displayProperty = this._getPropertyValue(style, "display");
|
||||
let positionProperty = this._getPropertyValue(style, "position");
|
||||
if (!displayProperty || !positionProperty) {
|
||||
this.showEmptyMessage();
|
||||
return;
|
||||
}
|
||||
|
||||
this._outermostBox = null;
|
||||
this._outermostBoxWidth = NaN;
|
||||
|
||||
for (let name of ["content", "padding", "border", "margin", "position"]) {
|
||||
|
||||
if (name === "margin" && noMarginDisplayType[displayProperty.value])
|
||||
continue;
|
||||
if (name === "padding" && noPaddingDisplayType[displayProperty.value])
|
||||
continue;
|
||||
if (name === "position" && noPositionType[positionProperty.value])
|
||||
continue;
|
||||
|
||||
let boxElement = document.createElement("div");
|
||||
boxElement.classList.add("box", name);
|
||||
boxElement._name = name;
|
||||
boxElement.addEventListener("mouseover", this._highlightDOMNode.bind(this, true, name === "position" ? "all" : name), false);
|
||||
this._boxElements.push(boxElement);
|
||||
|
||||
if (name === "content") {
|
||||
let widthElement = createContentAreaElement.call(this, "width");
|
||||
let heightElement = createContentAreaElement.call(this, "height");
|
||||
if (!widthElement || !heightElement) {
|
||||
this.showEmptyMessage();
|
||||
return;
|
||||
}
|
||||
|
||||
boxElement.append(widthElement, " \u00D7 ", heightElement);
|
||||
} else {
|
||||
let borderTopLeftRadiusElement = null;
|
||||
let borderTopRightRadiusElement = null;
|
||||
let borderBottomRightRadiusElement = null;
|
||||
let borderBottomLeftRadiusElement = null;
|
||||
if (name === "border") {
|
||||
for (let corner of ["top-left", "top-right", "bottom-right", "bottom-left"]) {
|
||||
let cornerValue = this._getPropertyValue(style, "border-" + corner + "-radius");
|
||||
if (cornerValue && cornerValue !== "0px")
|
||||
boxElement.classList.add("has-" + corner + "-radius");
|
||||
}
|
||||
|
||||
borderTopLeftRadiusElement = createBoxPartElement.call(this, "border-radius", "top-left");
|
||||
borderTopRightRadiusElement = createBoxPartElement.call(this, "border-radius", "top-right");
|
||||
borderBottomRightRadiusElement = createBoxPartElement.call(this, "border-radius", "bottom-right");
|
||||
borderBottomLeftRadiusElement = createBoxPartElement.call(this, "border-radius", "bottom-left");
|
||||
}
|
||||
|
||||
let topElement = createBoxPartElement.call(this, name, "top");
|
||||
let leftElement = createBoxPartElement.call(this, name, "left");
|
||||
let rightElement = createBoxPartElement.call(this, name, "right");
|
||||
let bottomElement = createBoxPartElement.call(this, name, "bottom");
|
||||
if (!topElement || !leftElement || !rightElement || !bottomElement) {
|
||||
this.showEmptyMessage();
|
||||
return;
|
||||
}
|
||||
|
||||
let labelElement = document.createElement("div");
|
||||
labelElement.className = "label";
|
||||
labelElement.textContent = name;
|
||||
boxElement.appendChild(labelElement);
|
||||
|
||||
if (borderTopLeftRadiusElement)
|
||||
boxElement.appendChild(borderTopLeftRadiusElement);
|
||||
|
||||
boxElement.appendChild(topElement);
|
||||
|
||||
if (borderTopRightRadiusElement)
|
||||
boxElement.appendChild(borderTopRightRadiusElement);
|
||||
|
||||
boxElement.appendChild(document.createElement("br"));
|
||||
boxElement.appendChild(leftElement);
|
||||
|
||||
if (this._outermostBox)
|
||||
boxElement.appendChild(this._outermostBox);
|
||||
|
||||
boxElement.appendChild(rightElement);
|
||||
boxElement.appendChild(document.createElement("br"));
|
||||
|
||||
if (borderBottomLeftRadiusElement)
|
||||
boxElement.appendChild(borderBottomLeftRadiusElement);
|
||||
|
||||
boxElement.appendChild(bottomElement);
|
||||
|
||||
if (borderBottomRightRadiusElement)
|
||||
boxElement.appendChild(borderBottomRightRadiusElement);
|
||||
}
|
||||
|
||||
this._outermostBox = boxElement;
|
||||
}
|
||||
|
||||
metricsElement.appendChild(this._outermostBox);
|
||||
metricsElement.addEventListener("mouseover", this._highlightDOMNode.bind(this, false, ""), false);
|
||||
|
||||
this.hideEmptyMessage();
|
||||
this.element.appendChild(metricsElement);
|
||||
}
|
||||
|
||||
_startEditing(targetElement, box, styleProperty, computedStyle)
|
||||
{
|
||||
if (WI.isBeingEdited(targetElement))
|
||||
return;
|
||||
|
||||
// If the target element has a title use it as the editing value
|
||||
// since the current text is likely truncated/rounded.
|
||||
if (targetElement.title)
|
||||
targetElement.textContent = targetElement.title;
|
||||
|
||||
var context = {box, styleProperty};
|
||||
var boundKeyDown = this._handleKeyDown.bind(this, context, styleProperty);
|
||||
context.keyDownHandler = boundKeyDown;
|
||||
targetElement.addEventListener("keydown", boundKeyDown, false);
|
||||
|
||||
this._isEditingMetrics = true;
|
||||
|
||||
var config = new WI.EditingConfig(this._editingCommitted.bind(this), this._editingCancelled.bind(this), context);
|
||||
WI.startEditing(targetElement, config);
|
||||
|
||||
window.getSelection().setBaseAndExtent(targetElement, 0, targetElement, 1);
|
||||
}
|
||||
|
||||
_alteredFloatNumber(number, event)
|
||||
{
|
||||
var arrowKeyPressed = event.keyIdentifier === "Up" || event.keyIdentifier === "Down";
|
||||
|
||||
// Jump by 10 when shift is down or jump by 0.1 when Alt/Option is down.
|
||||
// Also jump by 10 for page up and down, or by 100 if shift is held with a page key.
|
||||
var changeAmount = 1;
|
||||
if (event.shiftKey && !arrowKeyPressed)
|
||||
changeAmount = 100;
|
||||
else if (event.shiftKey || !arrowKeyPressed)
|
||||
changeAmount = 10;
|
||||
else if (event.altKey)
|
||||
changeAmount = 0.1;
|
||||
|
||||
if (event.keyIdentifier === "Down" || event.keyIdentifier === "PageDown")
|
||||
changeAmount *= -1;
|
||||
|
||||
// Make the new number and constrain it to a precision of 6, this matches numbers the engine returns.
|
||||
// Use the Number constructor to forget the fixed precision, so 1.100000 will print as 1.1.
|
||||
var result = Number((number + changeAmount).toFixed(6));
|
||||
if (!String(result).match(WI.EditingSupport.NumberRegex))
|
||||
return null;
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
_handleKeyDown(context, styleProperty, event)
|
||||
{
|
||||
if (!/^(?:Page)?(?:Up|Down)$/.test(event.keyIdentifier))
|
||||
return;
|
||||
|
||||
var element = event.currentTarget;
|
||||
|
||||
var selection = window.getSelection();
|
||||
if (!selection.rangeCount)
|
||||
return;
|
||||
|
||||
var selectionRange = selection.getRangeAt(0);
|
||||
console.assert(selectionRange, "We should have a range if we are handling a key down event");
|
||||
if (!element.contains(selectionRange.commonAncestorContainer))
|
||||
return;
|
||||
|
||||
var originalValue = element.textContent;
|
||||
var wordRange = selectionRange.startContainer.rangeOfWord(selectionRange.startOffset, WI.EditingSupport.StyleValueDelimiters, element);
|
||||
var wordString = wordRange.toString();
|
||||
|
||||
var matches = WI.EditingSupport.NumberRegex.exec(wordString);
|
||||
var replacementString;
|
||||
if (matches && matches.length) {
|
||||
var prefix = matches[1];
|
||||
var suffix = matches[3];
|
||||
var number = this._alteredFloatNumber(parseFloat(matches[2]), event);
|
||||
if (number === null) {
|
||||
// Need to check for null explicitly.
|
||||
return;
|
||||
}
|
||||
|
||||
if (styleProperty !== "margin" && number < 0)
|
||||
number = 0;
|
||||
|
||||
replacementString = prefix + number + suffix;
|
||||
}
|
||||
|
||||
if (!replacementString)
|
||||
return;
|
||||
|
||||
var replacementTextNode = document.createTextNode(replacementString);
|
||||
|
||||
wordRange.deleteContents();
|
||||
wordRange.insertNode(replacementTextNode);
|
||||
|
||||
var finalSelectionRange = document.createRange();
|
||||
finalSelectionRange.setStart(replacementTextNode, 0);
|
||||
finalSelectionRange.setEnd(replacementTextNode, replacementString.length);
|
||||
|
||||
selection.removeAllRanges();
|
||||
selection.addRange(finalSelectionRange);
|
||||
|
||||
event.handled = true;
|
||||
event.preventDefault();
|
||||
|
||||
this._ignoreNextRefresh = true;
|
||||
|
||||
this._applyUserInput(element, replacementString, originalValue, context, false);
|
||||
}
|
||||
|
||||
_editingEnded(element, context)
|
||||
{
|
||||
element.removeEventListener("keydown", context.keyDownHandler, false);
|
||||
this._isEditingMetrics = false;
|
||||
}
|
||||
|
||||
_editingCancelled(element, context)
|
||||
{
|
||||
this._editingEnded(element, context);
|
||||
this._refresh();
|
||||
}
|
||||
|
||||
_applyUserInput(element, userInput, previousContent, context, commitEditor)
|
||||
{
|
||||
if (commitEditor && userInput === previousContent) {
|
||||
// Nothing changed, so cancel.
|
||||
this._editingCancelled(element, context);
|
||||
return;
|
||||
}
|
||||
|
||||
if (context.box !== "position" && (!userInput || userInput === figureDash))
|
||||
userInput = "0px";
|
||||
else if (context.box === "position" && (!userInput || userInput === figureDash))
|
||||
userInput = "auto";
|
||||
|
||||
userInput = userInput.toLowerCase();
|
||||
// Append a "px" unit if the user input was just a number.
|
||||
if (/^-?(?:\d+(?:\.\d+)?|\.\d+)$/.test(userInput))
|
||||
userInput += "px";
|
||||
|
||||
var styleProperty = context.styleProperty;
|
||||
var computedStyle = this._nodeStyles.computedStyle;
|
||||
|
||||
if (this._getPropertyValue(computedStyle, "box-sizing") === "border-box" && (styleProperty === "width" || styleProperty === "height")) {
|
||||
if (!userInput.match(/px$/)) {
|
||||
console.error("For elements with box-sizing: border-box, only absolute content area dimensions can be applied");
|
||||
return;
|
||||
}
|
||||
|
||||
var borderBox = this._getBox(computedStyle, "border");
|
||||
var paddingBox = this._getBox(computedStyle, "padding");
|
||||
var userValuePx = Number(userInput.replace(/px$/, ""));
|
||||
if (isNaN(userValuePx))
|
||||
return;
|
||||
if (styleProperty === "width")
|
||||
userValuePx += borderBox.left + borderBox.right + paddingBox.left + paddingBox.right;
|
||||
else
|
||||
userValuePx += borderBox.top + borderBox.bottom + paddingBox.top + paddingBox.bottom;
|
||||
|
||||
userInput = userValuePx + "px";
|
||||
}
|
||||
|
||||
let setBorderStyleProperty = null;
|
||||
if (context.box === "border") {
|
||||
let borderStyleProperty = styleProperty.replace("-width", "-style");
|
||||
if (this._getPropertyValue(computedStyle, borderStyleProperty) === "none")
|
||||
setBorderStyleProperty = borderStyleProperty;
|
||||
}
|
||||
|
||||
WI.RemoteObject.resolveNode(this._nodeStyles.node).then((object) => {
|
||||
function inspectedPage_node_toggleInlineStyleProperty(styleProperty, userInput, setBorderStyleProperty) {
|
||||
if (setBorderStyleProperty)
|
||||
this.style.setProperty(setBorderStyleProperty, "solid", "important");
|
||||
this.style.setProperty(styleProperty, userInput, "important");
|
||||
}
|
||||
|
||||
let didToggle = () => {
|
||||
this._nodeStyles.refresh();
|
||||
};
|
||||
|
||||
object.callFunction(inspectedPage_node_toggleInlineStyleProperty, [styleProperty, userInput, setBorderStyleProperty], false, didToggle);
|
||||
object.release();
|
||||
});
|
||||
}
|
||||
|
||||
_editingCommitted(element, userInput, previousContent, context)
|
||||
{
|
||||
this._editingEnded(element, context);
|
||||
this._applyUserInput(element, userInput, previousContent, context, true);
|
||||
}
|
||||
};
|
||||
Reference in New Issue
Block a user