Many resources are needed to download a project. Please understand that we have to compensate our server costs. Thank you in advance. Project price only 1 $
You can buy this project and download/modify it how often you want.
{"version":3,"file":"MediaRange.js","sourceRoot":"","sources":["../src/MediaRange.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,GAAG,IAAI,GAAG,EAAiB,CAAC;AAE7C,MAAM,iBAAiB,GAAU,IAAI,GAAG,EAAyB,CAAC;AAClE,iBAAiB,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC;AACrC,iBAAiB,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC;AACxC,iBAAiB,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC;AACzC,iBAAiB,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC;AAE9C;;;;GAIG;AACF,IAAK,SAeL;AAfA,WAAK,SAAS;IACd;;;;;;;;;;;;OAYG;IACH,mCAAsB,CAAA;AACvB,CAAC,EAfK,SAAS,KAAT,SAAS,QAed;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,YAAY,GAAG,CAAC,IAAY,EAAE,KAAY,EAAE,EAAE;IACnD,WAAW,CAAC,GAAG,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;AAC9B,CAAC,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,MAAM,eAAe,GAAG,CAAC,IAAY,EAAE,KAAK,GAAG,MAAM,CAAC,UAAU,EAAU,EAAE;IAC3E,IAAI,QAAQ,GAAG,WAAW,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;IAErC,IAAI,CAAC,QAAQ,EAAE;QACd,QAAQ,GAAG,WAAW,CAAC,GAAG,CAAC,SAAS,CAAC,YAAY,CAAE,CAAC;KACpD;IAED,IAAI,gBAAgB,CAAC;IACrB,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAEzC,QAAQ,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;QAC/B,IAAI,cAAc,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,cAAc,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE;YAC7D,gBAAgB,GAAG,GAAG,CAAC;SACvB;IACF,CAAC,CAAC,CAAC;IAEH,OAAO,gBAAgB,IAAI,CAAC,GAAG,QAAQ,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;AACpD,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,UAAU,GAAG;IAClB,SAAS;IACT,YAAY;IACZ,eAAe;CACf,CAAC;AAEF,UAAU,CAAC,YAAY,CAAC,UAAU,CAAC,SAAS,CAAC,YAAY,EAAE,iBAAiB,CAAC,CAAC;AAE9E,eAAe,UAAU,CAAC","sourcesContent":["type Range = Map>;\n\nconst mediaRanges = new Map();\n\nconst DEAFULT_RANGE_SET: Range = new Map>();\nDEAFULT_RANGE_SET.set(\"S\", [0, 599]);\nDEAFULT_RANGE_SET.set(\"M\", [600, 1023]);\nDEAFULT_RANGE_SET.set(\"L\", [1024, 1439]);\nDEAFULT_RANGE_SET.set(\"XL\", [1440, Infinity]);\n\n/**\n * Enumeration containing the names and settings of predefined screen width media query range sets.\n *\n * @public\n */\n enum RANGESETS {\n\t/**\n\t * A 4-step range set (S-M-L-XL).\n\t *\n\t * The ranges of this set are:\n\t *\n\t * - `\"S\"`: For screens smaller than 600 pixels.\n\t * - `\"M\"`: For screens greater than or equal to 600 pixels and smaller than 1024 pixels.\n\t * - `\"L\"`: For screens greater than or equal to 1024 pixels and smaller than 1440 pixels.\n\t * - `\"XL\"`: For screens greater than or equal to 1440 pixels.\n\t *\n\t *\n\t * @public\n\t */\n\tRANGE_4STEPS = \"4Step\",\n}\n\n/**\n * Initializes a screen width media query range set.\n *\n * This initialization step makes the range set ready to be used for one of the other functions in namespace `MediaRange`.\n *\n * A range set can be defined as shown in the following example:\n * ```\n * MediaRange.initRangeSet(\"MyRangeSet\", [200, 400], [\"Small\", \"Medium\", \"Large\"]);\n * ```\n * This example defines the following named ranges:\n *\n * - `\"Small\"`: For screens smaller than 200 pixels.\n * - `\"Medium\"`: For screens greater than or equal to 200 pixels and smaller than 400 pixels.\n * - `\"Large\"`: For screens greater than or equal to 400 pixels.\n *\n *\n * @param name The name of the range set to be initialized.\n * The name must be a valid id and consist only of letters and numeric digits.\n * @param range The given range set.\n */\nconst initRangeSet = (name: string, range: Range) => {\n\tmediaRanges.set(name, range);\n};\n\n/**\n * Returns information about the current active range of the range set with the given name.\n *\n * If the optional parameter `width` is given, the active range will be determined for that width,\n * otherwise it is determined for the current window size.\n *\n * @param name The name of the range set. The range set must be initialized beforehand ({@link MediaRange.initRangeSet})\n * @param [width] An optional width, based on which the range should be determined;\n * If `width` is not provided, the window size will be used.\n * @returns The name of the current active interval of the range set.\n * @public\n */\nconst getCurrentRange = (name: string, width = window.innerWidth): string => {\n\tlet rangeSet = mediaRanges.get(name);\n\n\tif (!rangeSet) {\n\t\trangeSet = mediaRanges.get(RANGESETS.RANGE_4STEPS)!;\n\t}\n\n\tlet currentRangeName;\n\tconst effectiveWidth = Math.floor(width);\n\n\trangeSet.forEach((value, key) => {\n\t\tif (effectiveWidth >= value[0] && effectiveWidth <= value[1]) {\n\t\t\tcurrentRangeName = key;\n\t\t}\n\t});\n\n\treturn currentRangeName || [...rangeSet.keys()][0];\n};\n\n/**\n * API for screen width changes.\n */\nconst MediaRange = {\n\tRANGESETS,\n\tinitRangeSet,\n\tgetCurrentRange,\n};\n\nMediaRange.initRangeSet(MediaRange.RANGESETS.RANGE_4STEPS, DEAFULT_RANGE_SET);\n\nexport default MediaRange;\n"]}