-
Notifications
You must be signed in to change notification settings - Fork 7
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Split sort logic from configuration loading process
- Loading branch information
Showing
3 changed files
with
276 additions
and
250 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,245 @@ | ||
// ---------------------------------------- | ||
// Private | ||
// ---------------------------------------- | ||
|
||
const minMaxWidth = /(!?\(\s*min(-device-)?-width)(.|\n)+\(\s*max(-device)?-width/i; | ||
const minWidth = /\(\s*min(-device)?-width/i; | ||
const maxMinWidth = /(!?\(\s*max(-device)?-width)(.|\n)+\(\s*min(-device)?-width/i; | ||
const maxWidth = /\(\s*max(-device)?-width/i; | ||
|
||
const isMinWidth = _testQuery(minMaxWidth, maxMinWidth, minWidth); | ||
const isMaxWidth = _testQuery(maxMinWidth, minMaxWidth, maxWidth); | ||
|
||
const minMaxHeight = /(!?\(\s*min(-device)?-height)(.|\n)+\(\s*max(-device)?-height/i; | ||
const minHeight = /\(\s*min(-device)?-height/i; | ||
const maxMinHeight = /(!?\(\s*max(-device)?-height)(.|\n)+\(\s*min(-device)?-height/i; | ||
const maxHeight = /\(\s*max(-device)?-height/i; | ||
|
||
const isMinHeight = _testQuery(minMaxHeight, maxMinHeight, minHeight); | ||
const isMaxHeight = _testQuery(maxMinHeight, minMaxHeight, maxHeight); | ||
|
||
const isPrint = /print/i; | ||
const isPrintOnly = /^print$/i; | ||
|
||
const maxValue = Number.MAX_VALUE; | ||
|
||
/** | ||
* Obtain the length of the media request in pixels. | ||
* Copy from original source `function inspectLength (length)` | ||
* {@link https://github.com/hail2u/node-css-mqpacker/blob/master/index.js#L58} | ||
* @private | ||
* @param {string} length | ||
* @return {number} | ||
*/ | ||
function _getQueryLength(length) { | ||
length = /(-?\d*\.?\d+)(ch|em|ex|px|rem)/.exec(length); | ||
|
||
if (length === null) { | ||
return maxValue; | ||
} | ||
|
||
let number = length[1]; | ||
const unit = length[2]; | ||
|
||
switch (unit) { | ||
case 'ch': | ||
number = parseFloat(number) * 8.8984375; | ||
break; | ||
|
||
case 'em': | ||
case 'rem': | ||
number = parseFloat(number) * 16; | ||
break; | ||
|
||
case 'ex': | ||
number = parseFloat(number) * 8.296875; | ||
break; | ||
|
||
case 'px': | ||
number = parseFloat(number); | ||
break; | ||
} | ||
|
||
return +number; | ||
} | ||
|
||
/** | ||
* Wrapper for creating test functions | ||
* @private | ||
* @param {RegExp} doubleTestTrue | ||
* @param {RegExp} doubleTestFalse | ||
* @param {RegExp} singleTest | ||
* @return {Function} | ||
*/ | ||
function _testQuery(doubleTestTrue, doubleTestFalse, singleTest) { | ||
/** | ||
* @param {string} query | ||
* @return {boolean} | ||
*/ | ||
return function (query) { | ||
if (doubleTestTrue.test(query)) { | ||
return true; | ||
} else if (doubleTestFalse.test(query)) { | ||
return false; | ||
} | ||
return singleTest.test(query); | ||
}; | ||
} | ||
|
||
/** | ||
* @private | ||
* @param {string} a | ||
* @param {string} b | ||
* @return {number|null} | ||
*/ | ||
function _testIsPrint(a, b) { | ||
const isPrintA = isPrint.test(a); | ||
const isPrintOnlyA = isPrintOnly.test(a); | ||
|
||
const isPrintB = isPrint.test(b); | ||
const isPrintOnlyB = isPrintOnly.test(b); | ||
|
||
if (isPrintA && isPrintB) { | ||
if (!isPrintOnlyA && isPrintOnlyB) { | ||
return 1; | ||
} | ||
if (isPrintOnlyA && !isPrintOnlyB) { | ||
return -1; | ||
} | ||
return a.localeCompare(b); | ||
} | ||
if (isPrintA) { | ||
return 1; | ||
} | ||
if (isPrintB) { | ||
return -1; | ||
} | ||
|
||
return null; | ||
} | ||
|
||
// ---------------------------------------- | ||
// Public | ||
// ---------------------------------------- | ||
|
||
/** | ||
* @param {Object} [configuration] | ||
* @param {boolean} [configuration.unitlessMqAlwaysFirst] | ||
* @returns {(function(string, string): number)|*} | ||
*/ | ||
module.exports = function createSort(configuration) { | ||
const config = configuration || {}; | ||
|
||
// eslint-disable-next-line no-unused-vars | ||
const UNITLESS_MQ_ALWAYS_FIRST = config.unitlessMqAlwaysFirst; | ||
|
||
/** | ||
* Sorting an array with media queries | ||
* according to the mobile-first methodology. | ||
* @param {string} a | ||
* @param {string} b | ||
* @return {number} 1 / 0 / -1 | ||
*/ | ||
function sortCSSmq(a, b) { | ||
const testIsPrint = _testIsPrint(a, b); | ||
if (testIsPrint !== null) { | ||
return testIsPrint; | ||
} | ||
|
||
const minA = isMinWidth(a) || isMinHeight(a); | ||
const maxA = isMaxWidth(a) || isMaxHeight(a); | ||
|
||
const minB = isMinWidth(b) || isMinHeight(b); | ||
const maxB = isMaxWidth(b) || isMaxHeight(b); | ||
|
||
if (minA && maxB) { | ||
return -1; | ||
} | ||
if (maxA && minB) { | ||
return 1; | ||
} | ||
|
||
const lengthA = _getQueryLength(a); | ||
const lengthB = _getQueryLength(b); | ||
|
||
if (lengthA === maxValue && lengthB === maxValue) { | ||
return a.localeCompare(b); | ||
} else if (lengthA === maxValue) { | ||
return 1; | ||
} else if (lengthB === maxValue) { | ||
return -1; | ||
} | ||
|
||
if (lengthA > lengthB) { | ||
if (maxA) { | ||
return -1; | ||
} | ||
return 1; | ||
} | ||
|
||
if (lengthA < lengthB) { | ||
if (maxA) { | ||
return 1; | ||
} | ||
return -1; | ||
} | ||
|
||
return a.localeCompare(b); | ||
} | ||
|
||
/** | ||
* Sorting an array with media queries | ||
* according to the desktop-first methodology. | ||
* @param {string} a | ||
* @param {string} b | ||
* @return {number} 1 / 0 / -1 | ||
*/ | ||
sortCSSmq.desktopFirst = function (a, b) { | ||
const testIsPrint = _testIsPrint(a, b); | ||
if (testIsPrint !== null) { | ||
return testIsPrint; | ||
} | ||
|
||
const minA = isMinWidth(a) || isMinHeight(a); | ||
const maxA = isMaxWidth(a) || isMaxHeight(a); | ||
|
||
const minB = isMinWidth(b) || isMinHeight(b); | ||
const maxB = isMaxWidth(b) || isMaxHeight(b); | ||
|
||
if (minA && maxB) { | ||
return 1; | ||
} | ||
if (maxA && minB) { | ||
return -1; | ||
} | ||
|
||
const lengthA = _getQueryLength(a); | ||
const lengthB = _getQueryLength(b); | ||
|
||
if (lengthA === maxValue && lengthB === maxValue) { | ||
return a.localeCompare(b); | ||
} else if (lengthA === maxValue) { | ||
return 1; | ||
} else if (lengthB === maxValue) { | ||
return -1; | ||
} | ||
|
||
if (lengthA > lengthB) { | ||
if (maxA) { | ||
return -1; | ||
} | ||
return 1; | ||
} | ||
|
||
if (lengthA < lengthB) { | ||
if (maxA) { | ||
return 1; | ||
} | ||
return -1; | ||
} | ||
|
||
return -a.localeCompare(b); | ||
}; | ||
|
||
return sortCSSmq; | ||
}; |
Oops, something went wrong.