/* This Source Code Form is subject to the terms of the Mozilla Public * License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
"use strict";
/** * Allows to find the lowest ranking index in an index * of suggestions, by comparing it to another array of "most relevant" items * which has been sorted by relevance. * * Example usage: * let sortedBrowsers = ["firefox", "safari", "edge", "chrome"]; * let myBrowsers = ["brave", "chrome", "firefox"]; * let bestBrowserIndex = findMostRelevantIndex(myBrowsers, sortedBrowsers); * // returns "2", the index of firefox in myBrowsers array * * @param {Array} items * Array of items to compare against sortedItems. * @param {Array} sortedItems * Array of sorted items that suggestions are evaluated against. Array * should be sorted by relevance, most relevant item first. * @return {Number}
*/ function findMostRelevantIndex(items, sortedItems) { if (!Array.isArray(items) || !Array.isArray(sortedItems)) { thrownew Error("Please provide valid items and sortedItems arrays.");
}
// If the items array is empty, no valid index can be found. if (!items.length) { return -1;
}
// Return 0 if no match was found in the suggestion list.
let bestIndex = 0;
let lowestIndex = Infinity;
items.forEach((item, i) => { const index = sortedItems.indexOf(item); if (index !== -1 && index <= lowestIndex) {
lowestIndex = index;
bestIndex = i;
}
});
return bestIndex;
}
/** * Top 100 CSS property names sorted by relevance, most relevant first. * * List based on the one used by Chrome devtools : * https://code.google.com/p/chromium/codesearch#chromium/src/third_party/ * WebKit/Source/devtools/front_end/sdk/CSSMetadata.js&q=CSSMetadata& * sq=package:chromium&type=cs&l=676 * * The data is a mix of https://www.chromestatus.com/metrics/css and usage * metrics from popular sites collected via https://gist.github.com/NV/3751436 * * @type {Array}
*/ const SORTED_CSS_PROPERTIES = [ "width", "margin", "height", "padding", "font-size", "border", "display", "position", "text-align", "background", "background-color", "top", "font-weight", "color", "overflow", "font-family", "margin-top", "float", "opacity", "cursor", "left", "text-decoration", "background-image", "right", "line-height", "margin-left", "visibility", "margin-bottom", "padding-top", "z-index", "margin-right", "background-position", "vertical-align", "padding-left", "background-repeat", "border-bottom", "padding-right", "border-top", "padding-bottom", "clear", "white-space", "bottom", "border-color", "max-width", "border-radius", "border-right", "outline", "border-left", "font-style", "content", "min-width", "min-height", "box-sizing", "list-style", "border-width", "box-shadow", "font", "border-collapse", "text-shadow", "text-indent", "border-style", "max-height", "text-overflow", "background-size", "text-transform", "zoom", "list-style-type", "border-spacing", "word-wrap", "overflow-y", "transition", "border-top-color", "border-bottom-color", "border-top-right-radius", "letter-spacing", "border-top-left-radius", "border-bottom-left-radius", "border-bottom-right-radius", "overflow-x", "pointer-events", "border-right-color", "transform", "border-top-width", "border-bottom-width", "border-right-width", "direction", "animation", "border-left-color", "clip", "border-left-width", "table-layout", "src", "resize", "word-break", "background-clip", "transform-origin", "font-variant", "filter", "quotes", "word-spacing",
];
/** * Helper to find the most relevant CSS property name in a provided array. * * @param items {Array} * Array of CSS property names.
*/ function findMostRelevantCssPropertyIndex(items) { return findMostRelevantIndex(items, SORTED_CSS_PROPERTIES);
}
Die Informationen auf dieser Webseite wurden
nach bestem Wissen sorgfältig zusammengestellt. Es wird jedoch weder Vollständigkeit, noch Richtigkeit,
noch Qualität der bereit gestellten Informationen zugesichert.
Bemerkung:
Die farbliche Syntaxdarstellung und die Messung sind noch experimentell.