From c7cd230bfebbb413ea88a9aaf4bd337e2347efbd Mon Sep 17 00:00:00 2001 From: joannazhang7 Date: Mon, 27 Mar 2023 22:57:22 -0400 Subject: [PATCH 1/9] joanna's website - added multidrop function - interactive map + long and lat - landing page --- backend/static/mainpg.css | 116 + backend/static/style.css | 161 +- backend/static/virtual-select.js | 3410 +++++++++++++++++++++++++ backend/static/virtual-select.min.css | 13 + backend/templates/base.html | 72 +- backend/templates/main.html | 136 + 6 files changed, 3768 insertions(+), 140 deletions(-) create mode 100644 backend/static/mainpg.css create mode 100644 backend/static/virtual-select.js create mode 100644 backend/static/virtual-select.min.css create mode 100644 backend/templates/main.html diff --git a/backend/static/mainpg.css b/backend/static/mainpg.css new file mode 100644 index 000000000..ed7c8a44c --- /dev/null +++ b/backend/static/mainpg.css @@ -0,0 +1,116 @@ +.full-body-container{ + position: absolute; + top:0; + left:0; + right:0; + bottom:0; + width:100%; + height:100%; + display: flex; + justify-content: start; + align-items: center; + flex-direction: column; + /* background-color: #E8DED1; */ +} + +#title { + color: #E8DED1 + /* color: black; */ +} + +.website-title{ + display: flex; + align-items: center; + justify-content: center; + font-size: 48px; + font-family: 'Open Sans', sans-serif; + margin-bottom: 5vh;; +} + +.website-title h1{ + margin-bottom: 0; + margin-right: 3px; +} + +/* MULTISELECT DROPDOWN BOX - START */ +.searchAndDisplayContainer{ + display: flex; + justify-content: space-between; + /* border: solid; */ +} + +.multiselect{ + margin: 30px 30px 30px 30px; + width: 50%; + float: left; +} + +.restaurantResults { + width: 50%; + float: left; +} + +label{ + display: block; + font-size: 18px; + font-weight: 700; + color: #fff; + margin-bottom: 5px; +} + +#multipleSelect{ + max-width: 100%; + width: 350px; +} + +.vscomp-toggle-button{ + padding: 10px 30px 10px 10px; + border-radius: 5px; +} + +.restaurantResults{ + border: solid; +} +/* MULTISELECT DROPDOWN BOX END */ + +/* MAPS DROPDOWN BOX START */ +.wrap{ + width: 1200px; + /* margin:30px auto; */ + margin-top: 200px; + display: grid; + grid-gap: 50px; + grid-template-columns: 300px auto; +} + +.form input{ + width: 100%; + border: none; + padding: 20px; + font-size: 1em; + outline: none; + margin-bottom: 5px; + background: #ddd; + border-radius: 10px; + box-sizing: border-box; + text-transform: capitalize; + -webkit-transition: all 0.5s ; + -moz-transition: all 0.5s ; + -ms-transition: all 0.5s ; + -o-transition: all 0.5s ; + transition: all 0.5s ; +} +.form input:focus{ + background: #aaa; +} +.form .form__btn{ + color: #fff; + background: rgb(63, 192, 46); +} + +#map{ + width: 100%; + height: 500px; + border-radius: 10px; +} +/* MAPS DROPDOWN BOX END */ \ No newline at end of file diff --git a/backend/static/style.css b/backend/static/style.css index e2c6d6ed1..ad922841a 100644 --- a/backend/static/style.css +++ b/backend/static/style.css @@ -1,91 +1,74 @@ -.full-body-container{ - position: absolute; - top:0; - left:0; - right:0; - bottom:0; - width:100%; - height:100%; - display: flex; - justify-content: start; - align-items: center; - flex-direction: column; +body{ + margin:0; + font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; + font-size: 17px; + color:black; + line-height: 1.6; } -#google-c{ - color:#4285F4; -} - -#google-s{ - color:#DB4437; -} - -#google-4{ - color: #F4B400; -} - -#google-3{ - color: #4285F4; -} - -#google-0-1{ - color: #0F9D58; -} - -#google-0-2{ - color:#DB4437; -} - -.google-colors{ - display: flex; - align-items: center; - font-size: 48px; - font-family: 'Open Sans', sans-serif; -} - -.google-colors h1{ - margin-bottom: 0; - margin-right: 3px; -} - -.input-box{ - border-radius: 50px; - border:1px solid black; - display: flex; - align-items: center; - margin-top: 10px; - padding:12px; - width: 600px; -} - -.input-box img{ - height: 20px; - width:20px; -} - -.top-text{ - display: flex; - flex-direction: column; - align-items: center; -} - -.input-box input{ - width: 100%; - margin-left: 10px; - font-size: 16px; - border: none; - outline: 0; -} - -#answer-box{ - width: 700px; - margin-top:50px; -} - -.episode-title{ - font-family: 'Kanit', sans-serif; -} - -.episode-desc{ - font-family: 'Montserrat', sans-serif; -} \ No newline at end of file +#showcase{ + background-image:url('images/minimalistfood.jpeg'); + background-size:cover; + background-position:center; + height:100vh; + display:flex; + flex-direction:column; + justify-content:center; + align-items:center; + text-align:center; + padding:0 20px; + } + + #showcase h1{ + font-size:50px; + line-height:1.2; + } + + #showcase p{ + font-size:20px; + } + + #showcase .button{ + font-size:18px; + text-decoration:none; + color:#926239; + border:#926239 1px solid; + padding:10px 20px; + border-radius:10px; + margin-top:20px; + } + + #showcase .button:hover{ + background:#926239; + color:#fff; + } + + #section-a{ + padding:20px; + background:#926239; + color:#fff; + text-align:center; + } + + #section-b{ + padding:20px; + background:#f4f4f4; + text-align:center; + } + + #section-c{ + display:flex; + } + + #section-c div{ + padding:20px; + } + + #section-c .box-1, #section-c .box-3{ + background:#926239; + color:#fff; + } + + #section-c .box-2{ + background:#f9f9f9; + } \ No newline at end of file diff --git a/backend/static/virtual-select.js b/backend/static/virtual-select.js new file mode 100644 index 000000000..736550bc8 --- /dev/null +++ b/backend/static/virtual-select.js @@ -0,0 +1,3410 @@ +/*! + * Virtual Select v1.0.37 + * https://sa-si-dev.github.io/virtual-select + * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) + *//******/ (function() { // webpackBootstrap +var __webpack_exports__ = {}; +// This entry need to be wrapped in an IIFE because it need to be in strict mode. +!function() { +"use strict"; + +// UNUSED EXPORTS: VirtualSelect + +;// CONCATENATED MODULE: ./src/utils/utils.js +function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); } +function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } +function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } +function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); } +function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); } +function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } +function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); } +function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } +function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } } +function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; } +function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); } +function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } +var Utils = /*#__PURE__*/function () { + function Utils() { + _classCallCheck(this, Utils); + } + _createClass(Utils, null, [{ + key: "getString", + value: + /** + * @param {any} text + * @returns {string} + */ + function getString(text) { + return text || text === 0 ? text.toString() : ''; + } + + /** + * @param {any} value + * @param {boolean} defaultValue + * @returns {boolean} + */ + }, { + key: "convertToBoolean", + value: function convertToBoolean(value) { + var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; + var result; + if (value === true || value === 'true') { + result = true; + } else if (value === false || value === 'false') { + result = false; + } else { + result = defaultValue; + } + return result; + } + + /** + * @param {any} value + * @returns {boolean} + */ + }, { + key: "isEmpty", + value: function isEmpty(value) { + var result = false; + if (!value) { + result = true; + } else if (Array.isArray(value)) { + if (value.length === 0) { + result = true; + } + } else if (_typeof(value) === 'object' && Object.keys(value).length === 0) { + result = true; + } + return result; + } + + /** + * @param {any} value + * @returns {boolean} + */ + }, { + key: "isNotEmpty", + value: function isNotEmpty(value) { + return !this.isEmpty(value); + } + + /** + * @param {any[]} array + * @param {any} value + * @param {boolean} cloneArray + * @returns {any[]} + */ + }, { + key: "removeItemFromArray", + value: function removeItemFromArray(array, value) { + var cloneArray = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; + if (!Array.isArray(array) || !array.length) { + return array; + } + var inputArr = cloneArray ? _toConsumableArray(array) : array; + var index = inputArr.indexOf(value); + if (index !== -1) { + inputArr.splice(index, 1); + } + return inputArr; + } + + /** + * @param {any[]} array + * @returns {any[]} + */ + }, { + key: "removeArrayEmpty", + value: function removeArrayEmpty(array) { + if (!Array.isArray(array) || !array.length) { + return []; + } + return array.filter(function (d) { + return !!d; + }); + } + + /** + * @param {number} max + * @param {number} max + * @returns {number} + */ + }, { + key: "getRandomInt", + value: function getRandomInt(max) { + var min = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0; + var minN = Math.ceil(min); + var maxN = Math.floor(max); + return Math.floor(Math.random() * (maxN - minN - 1)) + minN; + } + + /** + * @static + * @param {string} text + * @return {string} + * @memberof Utils + */ + }, { + key: "regexEscape", + value: function regexEscape(text) { + return text.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&'); + } + }]); + return Utils; +}(); +;// CONCATENATED MODULE: ./src/utils/dom-utils.js +function dom_utils_typeof(obj) { "@babel/helpers - typeof"; return dom_utils_typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, dom_utils_typeof(obj); } +function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || dom_utils_unsupportedIterableToArray(arr, i) || _nonIterableRest(); } +function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } +function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } } +function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } +function dom_utils_toConsumableArray(arr) { return dom_utils_arrayWithoutHoles(arr) || dom_utils_iterableToArray(arr) || dom_utils_unsupportedIterableToArray(arr) || dom_utils_nonIterableSpread(); } +function dom_utils_nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } +function dom_utils_unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return dom_utils_arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return dom_utils_arrayLikeToArray(o, minLen); } +function dom_utils_iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); } +function dom_utils_arrayWithoutHoles(arr) { if (Array.isArray(arr)) return dom_utils_arrayLikeToArray(arr); } +function dom_utils_arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } +function dom_utils_classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } +function dom_utils_defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, dom_utils_toPropertyKey(descriptor.key), descriptor); } } +function dom_utils_createClass(Constructor, protoProps, staticProps) { if (protoProps) dom_utils_defineProperties(Constructor.prototype, protoProps); if (staticProps) dom_utils_defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; } +function dom_utils_toPropertyKey(arg) { var key = dom_utils_toPrimitive(arg, "string"); return dom_utils_typeof(key) === "symbol" ? key : String(key); } +function dom_utils_toPrimitive(input, hint) { if (dom_utils_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (dom_utils_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } + +var DomUtils = /*#__PURE__*/function () { + function DomUtils() { + dom_utils_classCallCheck(this, DomUtils); + } + dom_utils_createClass(DomUtils, null, [{ + key: "addClass", + value: + /** + * @param {HTMLElement | NodeListOf} $ele + * @param {string} classNames + */ + function addClass($ele, classNames) { + if (!$ele) { + return; + } + var classNamesArr = classNames.split(' '); + DomUtils.getElements($ele).forEach(function ($this) { + var _$this$classList; + (_$this$classList = $this.classList).add.apply(_$this$classList, dom_utils_toConsumableArray(classNamesArr)); + }); + } + + /** + * @param {HTMLElement | NodeListOf} $ele + * @param {string} classNames + */ + }, { + key: "removeClass", + value: function removeClass($ele, classNames) { + if (!$ele) { + return; + } + var classNamesArr = classNames.split(' '); + DomUtils.getElements($ele).forEach(function ($this) { + var _$this$classList2; + (_$this$classList2 = $this.classList).remove.apply(_$this$classList2, dom_utils_toConsumableArray(classNamesArr)); + }); + } + + /** + * @param {HTMLElement | NodeListOf} $ele + * @param {string} classNames + * @param {boolean} [isAdd] + */ + }, { + key: "toggleClass", + value: function toggleClass($ele, classNames, isAdd) { + if (!$ele) { + return; + } + + /** @type {boolean | undefined} */ + var isAdding; + if (isAdd !== undefined) { + isAdding = Boolean(isAdd); + } + DomUtils.getElements($ele).forEach(function ($this) { + $this.classList.toggle(classNames, isAdding); + }); + } + + /** + * @param {HTMLElement} $ele + * @param {string} className + * @returns {boolean} + */ + }, { + key: "hasClass", + value: function hasClass($ele, className) { + if (!$ele) { + return false; + } + return $ele.classList.contains(className); + } + + /** + * @param {HTMLElement} $ele + * @returns {boolean} + */ + }, { + key: "hasEllipsis", + value: function hasEllipsis($ele) { + if (!$ele) { + return false; + } + return $ele.scrollWidth > $ele.offsetWidth; + } + + /** + * @param {HTMLElement} $ele + * @param {string} name + * @param {string} [type] + * @returns {any} + */ + }, { + key: "getData", + value: function getData($ele, name, type) { + if (!$ele) { + return undefined; + } + + /** @type {any} */ + var value = $ele ? $ele.dataset[name] : ''; + if (type === 'number') { + value = parseFloat(value) || 0; + } else if (value === 'true') { + value = true; + } else if (value === 'false') { + value = false; + } + return value; + } + + /** + * @param {HTMLElement} $ele + * @param {string} name + * @param {string} value + */ + }, { + key: "setData", + value: function setData($ele, name, value) { + if (!$ele) { + return; + } + + // eslint-disable-next-line no-param-reassign + $ele.dataset[name] = value; + } + + /** + * @param {HTMLElement} $ele + * @param {string} name + * @param {string} value + */ + }, { + key: "setAttr", + value: function setAttr($ele, name, value) { + if (!$ele) { + return; + } + $ele.setAttribute(name, value); + } + + /** + * @param {HTMLElement} $from + * @param {HTMLElement} $to + * @param {string[]} attrList + * @param {string[]} valueLessProps + */ + }, { + key: "setAttrFromEle", + value: function setAttrFromEle($from, $to, attrList, valueLessProps) { + /** @type {any} */ + var values = {}; + attrList.forEach(function (attr) { + values[attr] = $from.getAttribute(attr); + }); + attrList.forEach(function (attr) { + var value = values[attr]; + if (value || valueLessProps.indexOf(attr) !== -1 && value === '') { + $to.setAttribute(attr, value); + } + }); + } + + /** + * @param {HTMLElement} $ele + * @param {string} name + * @param {string} value + */ + }, { + key: "setStyle", + value: function setStyle($ele, name, value) { + if (!$ele) { + return; + } + + // @ts-ignore + // eslint-disable-next-line no-param-reassign + $ele.style[name] = value; + } + + /** + * @param {HTMLElement} $ele + * @param {any} props + */ + }, { + key: "setStyles", + value: function setStyles($ele, props) { + if (!$ele || !props) { + return; + } + Object.keys(props).forEach(function (name) { + // @ts-ignore + // eslint-disable-next-line no-param-reassign + $ele.style[name] = props[name]; + }); + } + + /** + * @param {HTMLElement} $ele + * @param {string} name + * @param {string} value + */ + }, { + key: "setAria", + value: function setAria($ele, name, value) { + var attrName = name; + if (attrName !== 'role') { + attrName = "aria-".concat(attrName); + } + $ele.setAttribute(attrName, value); + } + + /** + * @param {any} $ele + * @returns {any[]} + */ + }, { + key: "getElements", + value: function getElements($ele) { + if (!$ele) { + return []; + } + return $ele.forEach === undefined ? [$ele] : $ele; + } + + /** + * @param {HTMLElement} $ele + * @param {string} events + * @param {Function} callback + */ + }, { + key: "addEvent", + value: function addEvent($ele, events, callback) { + if (!$ele) { + return; + } + var eventsArray = Utils.removeArrayEmpty(events.split(' ')); + eventsArray.forEach(function (event) { + var $eleArray = DomUtils.getElements($ele); + $eleArray.forEach(function ($this) { + $this.addEventListener(event, callback); + }); + }); + } + + /** + * @param {HTMLElement} $ele + * @param {string} eventName + * @param {boolean} [bubbles] + */ + }, { + key: "dispatchEvent", + value: function dispatchEvent($ele, eventName) { + var bubbles = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; + if (!$ele) { + return; + } + var $eleArray = DomUtils.getElements($ele); + + /** using setTimeout to trigger asynchronous event */ + setTimeout(function () { + $eleArray.forEach(function ($this) { + $this.dispatchEvent(new CustomEvent(eventName, { + bubbles: bubbles + })); + }); + }, 0); + } + + /** + * convert object to dom attributes + * @param {any} data + */ + }, { + key: "getAttributesText", + value: function getAttributesText(data) { + var html = ''; + if (!data) { + return html; + } + Object.entries(data).forEach(function (_ref) { + var _ref2 = _slicedToArray(_ref, 2), + k = _ref2[0], + v = _ref2[1]; + if (v !== undefined) { + html += " ".concat(k, "=\"").concat(v, "\" "); + } + }); + return html; + } + + /** + * convert "maxValue" to "data-max-value" + * @param {string} prop + */ + }, { + key: "convertPropToDataAttr", + value: function convertPropToDataAttr(prop) { + return prop ? "data-".concat(prop).replace(/([A-Z])/g, '-$1').toLowerCase() : ''; + } + }]); + return DomUtils; +}(); +;// CONCATENATED MODULE: ./src/virtual-select.js +function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; } +function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } +function _defineProperty(obj, key, value) { key = virtual_select_toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } +function virtual_select_typeof(obj) { "@babel/helpers - typeof"; return virtual_select_typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, virtual_select_typeof(obj); } +function virtual_select_slicedToArray(arr, i) { return virtual_select_arrayWithHoles(arr) || virtual_select_iterableToArrayLimit(arr, i) || virtual_select_unsupportedIterableToArray(arr, i) || virtual_select_nonIterableRest(); } +function virtual_select_nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } +function virtual_select_iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } } +function virtual_select_arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } +function virtual_select_toConsumableArray(arr) { return virtual_select_arrayWithoutHoles(arr) || virtual_select_iterableToArray(arr) || virtual_select_unsupportedIterableToArray(arr) || virtual_select_nonIterableSpread(); } +function virtual_select_nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } +function virtual_select_unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return virtual_select_arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return virtual_select_arrayLikeToArray(o, minLen); } +function virtual_select_iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); } +function virtual_select_arrayWithoutHoles(arr) { if (Array.isArray(arr)) return virtual_select_arrayLikeToArray(arr); } +function virtual_select_arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } +function virtual_select_classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } +function virtual_select_defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, virtual_select_toPropertyKey(descriptor.key), descriptor); } } +function virtual_select_createClass(Constructor, protoProps, staticProps) { if (protoProps) virtual_select_defineProperties(Constructor.prototype, protoProps); if (staticProps) virtual_select_defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; } +function virtual_select_toPropertyKey(arg) { var key = virtual_select_toPrimitive(arg, "string"); return virtual_select_typeof(key) === "symbol" ? key : String(key); } +function virtual_select_toPrimitive(input, hint) { if (virtual_select_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (virtual_select_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } +/** cSpell:ignore nocheck, Labelledby, vscomp, tabindex, combobox, haspopup, listbox, activedescendant */ +/* eslint-disable class-methods-use-this */ +// @ts-nocheck + +var dropboxCloseButtonFullHeight = 48; +var searchHeight = 40; +var keyDownMethodMapping = { + 13: 'onEnterPress', + 38: 'onUpArrowPress', + 40: 'onDownArrowPress' +}; +var valueLessProps = ['autofocus', 'disabled', 'multiple', 'required']; +var nativeProps = ['autofocus', 'class', 'disabled', 'id', 'multiple', 'name', 'placeholder', 'required']; +var attrPropsMapping; +var dataProps = ['additionalClasses', 'aliasKey', 'allOptionsSelectedText', 'allowNewOption', 'alwaysShowSelectedOptionsCount', 'alwaysShowSelectedOptionsLabel', 'ariaLabelledby', 'autoSelectFirstOption', 'clearButtonText', 'descriptionKey', 'disableAllOptionsSelectedText', 'disableOptionGroupCheckbox', 'disableSelectAll', 'disableValidation', 'dropboxWidth', 'dropboxWrapper', 'emptyValue', 'enableSecureText', 'focusSelectedOptionOnOpen', 'hasOptionDescription', 'hideClearButton', 'hideValueTooltipOnSelectAll', 'keepAlwaysOpen', 'labelKey', 'markSearchResults', 'maxValues', 'maxWidth', 'minValues', 'moreText', 'noOfDisplayValues', 'noOptionsText', 'noSearchResultsText', 'optionHeight', 'optionSelectedText', 'optionsCount', 'optionsSelectedText', 'popupDropboxBreakpoint', 'popupPosition', 'position', 'search', 'searchByStartsWith', 'searchDelay', 'searchGroup', 'searchPlaceholderText', 'selectAllOnlyVisible', 'selectAllText', 'setValueAsArray', 'showDropboxAsPopup', 'showOptionsOnlyOnSearch', 'showSelectedOptionsFirst', 'showValueAsTags', 'silentInitialValueSet', 'textDirection', 'tooltipAlignment', 'tooltipFontSize', 'tooltipMaxWidth', 'updatePositionThrottle', 'useGroupValue', 'valueKey', 'zIndex']; + +/** Class representing VirtualSelect */ +var VirtualSelect = /*#__PURE__*/function () { + /** + * @param {virtualSelectOptions} options + */ + function VirtualSelect(options) { + virtual_select_classCallCheck(this, VirtualSelect); + try { + this.createSecureTextElements(); + this.setProps(options); + this.setDisabledOptions(options.disabledOptions); + this.setOptions(options.options); + this.render(); + } catch (e) { + // eslint-disable-next-line no-console + console.warn("Couldn't initiate Virtual Select"); + // eslint-disable-next-line no-console + console.error(e); + } + } + + /** render methods - start */ + virtual_select_createClass(VirtualSelect, [{ + key: "render", + value: function render() { + if (!this.$ele) { + return; + } + var uniqueId = this.uniqueId; + var wrapperClasses = 'vscomp-wrapper'; + var valueTooltip = this.getTooltipAttrText(this.placeholder, true, true); + var clearButtonTooltip = this.getTooltipAttrText(this.clearButtonText); + var ariaLabelledbyText = this.ariaLabelledby ? "aria-labelledby=\"".concat(this.ariaLabelledby, "\"") : ''; + var isExpanded = false; + if (this.additionalClasses) { + wrapperClasses += " ".concat(this.additionalClasses); + } + if (this.multiple) { + wrapperClasses += ' multiple'; + if (!this.disableSelectAll) { + wrapperClasses += ' has-select-all'; + } + } + if (!this.hideClearButton) { + wrapperClasses += ' has-clear-button'; + } + if (this.keepAlwaysOpen) { + wrapperClasses += ' keep-always-open'; + isExpanded = true; + } else { + wrapperClasses += ' closed'; + } + if (this.showAsPopup) { + wrapperClasses += ' show-as-popup'; + } + if (this.hasSearch) { + wrapperClasses += ' has-search-input'; + } + if (this.showValueAsTags) { + wrapperClasses += ' show-value-as-tags'; + } + if (this.textDirection) { + wrapperClasses += " text-direction-".concat(this.textDirection); + } + if (this.popupPosition) { + wrapperClasses += " popup-position-".concat(this.popupPosition.toLowerCase()); + } + var html = "
\n \n\n
\n
\n ").concat(this.placeholder, "\n
\n\n
\n\n
\n \n
\n
\n\n ").concat(this.renderDropbox({ + wrapperClasses: wrapperClasses + }), "\n
"); + this.$ele.innerHTML = html; + this.$body = document.querySelector('body'); + this.$wrapper = this.$ele.querySelector('.vscomp-wrapper'); + if (this.hasDropboxWrapper) { + this.$allWrappers = [this.$wrapper, this.$dropboxWrapper]; + this.$dropboxContainer = this.$dropboxWrapper.querySelector('.vscomp-dropbox-container'); + DomUtils.addClass(this.$dropboxContainer, 'pop-comp-wrapper'); + } else { + this.$allWrappers = [this.$wrapper]; + this.$dropboxContainer = this.$wrapper.querySelector('.vscomp-dropbox-container'); + } + this.$toggleButton = this.$ele.querySelector('.vscomp-toggle-button'); + this.$clearButton = this.$ele.querySelector('.vscomp-clear-button'); + this.$valueText = this.$ele.querySelector('.vscomp-value'); + this.$hiddenInput = this.$ele.querySelector('.vscomp-hidden-input'); + this.$dropbox = this.$dropboxContainer.querySelector('.vscomp-dropbox'); + this.$dropboxCloseButton = this.$dropboxContainer.querySelector('.vscomp-dropbox-close-button'); + this.$search = this.$dropboxContainer.querySelector('.vscomp-search-wrapper'); + this.$optionsContainer = this.$dropboxContainer.querySelector('.vscomp-options-container'); + this.$optionsList = this.$dropboxContainer.querySelector('.vscomp-options-list'); + this.$options = this.$dropboxContainer.querySelector('.vscomp-options'); + this.$noOptions = this.$dropboxContainer.querySelector('.vscomp-no-options'); + this.$noSearchResults = this.$dropboxContainer.querySelector('.vscomp-no-search-results'); + this.afterRenderWrapper(); + } + }, { + key: "renderDropbox", + value: function renderDropbox(_ref) { + var wrapperClasses = _ref.wrapperClasses; + var $wrapper = this.dropboxWrapper !== 'self' ? document.querySelector(this.dropboxWrapper) : null; + var html = "
\n
\n
\n\n
\n
\n\n
\n
\n
\n
\n\n
\n
").concat(this.noOptionsText, "
\n
").concat(this.noSearchResultsText, "
\n\n \n
\n
"); + if ($wrapper) { + var $dropboxWrapper = document.createElement('div'); + this.$dropboxWrapper = $dropboxWrapper; + this.hasDropboxWrapper = true; + $dropboxWrapper.innerHTML = html; + $wrapper.appendChild($dropboxWrapper); + DomUtils.addClass($dropboxWrapper, "vscomp-dropbox-wrapper ".concat(wrapperClasses)); + return ''; + } + this.hasDropboxWrapper = false; + return html; + } + }, { + key: "renderOptions", + value: function renderOptions() { + var _this = this; + var html = ''; + var visibleOptions = this.getVisibleOptions(); + var checkboxHtml = ''; + var newOptionIconHtml = ''; + var markSearchResults = !!(this.markSearchResults && this.searchValue); + var searchRegex; + var labelRenderer = this.labelRenderer, + disableOptionGroupCheckbox = this.disableOptionGroupCheckbox, + uniqueId = this.uniqueId, + searchGroup = this.searchGroup; + var hasLabelRenderer = typeof labelRenderer === 'function'; + var convertToBoolean = Utils.convertToBoolean; + if (markSearchResults) { + searchRegex = new RegExp("(".concat(Utils.regexEscape(this.searchValue), ")"), 'gi'); + } + if (this.multiple) { + checkboxHtml = ''; + } + if (this.allowNewOption) { + var newOptionTooltip = this.getTooltipAttrText('New Option'); + newOptionIconHtml = ""); + } + visibleOptions.forEach(function (d) { + var index = d.index; + var optionLabel; + var optionClasses = 'vscomp-option'; + var optionTooltip = _this.getTooltipAttrText('', true, true); + var leftSection = checkboxHtml; + var rightSection = ''; + var description = ''; + var groupIndexText = ''; + var isSelected = convertToBoolean(d.isSelected); + var ariaDisabledText = ''; + if (d.classNames) { + optionClasses += " ".concat(d.classNames); + } + if (d.isFocused) { + optionClasses += ' focused'; + } + if (d.isDisabled) { + optionClasses += ' disabled'; + ariaDisabledText = 'aria-disabled="true"'; + } + if (d.isGroupTitle) { + optionClasses += ' group-title'; + if (disableOptionGroupCheckbox) { + leftSection = ''; + } + } + if (isSelected) { + optionClasses += ' selected'; + } + if (d.isGroupOption) { + optionClasses += ' group-option'; + groupIndexText = "data-group-index=\"".concat(d.groupIndex, "\""); + } + if (hasLabelRenderer) { + optionLabel = labelRenderer(d); + } else { + optionLabel = d.label; + } + if (d.description) { + description = "
").concat(d.description, "
"); + } + if (d.isCurrentNew) { + optionClasses += ' current-new'; + rightSection += newOptionIconHtml; + } else if (markSearchResults && (!d.isGroupTitle || searchGroup)) { + optionLabel = optionLabel.replace(searchRegex, '$1'); + } + html += "
\n ").concat(leftSection, "\n \n ").concat(optionLabel, "\n \n ").concat(description, "\n ").concat(rightSection, "\n
"); + }); + this.$options.innerHTML = html; + this.$visibleOptions = this.$options.querySelectorAll('.vscomp-option'); + this.afterRenderOptions(); + } + }, { + key: "renderSearch", + value: function renderSearch() { + if (!this.hasSearchContainer) { + return; + } + var checkboxHtml = ''; + var searchInput = ''; + if (this.multiple && !this.disableSelectAll) { + checkboxHtml = "\n \n ".concat(this.selectAllText, "\n "); + } + if (this.hasSearch) { + searchInput = "\n ×"); + } + var html = "
\n ".concat(checkboxHtml, "\n ").concat(searchInput, "\n
"); + this.$search.innerHTML = html; + this.$searchInput = this.$dropboxContainer.querySelector('.vscomp-search-input'); + this.$searchClear = this.$dropboxContainer.querySelector('.vscomp-search-clear'); + this.$toggleAllButton = this.$dropboxContainer.querySelector('.vscomp-toggle-all-button'); + this.$toggleAllCheckbox = this.$dropboxContainer.querySelector('.vscomp-toggle-all-checkbox'); + this.addEvent(this.$searchInput, 'input', 'onSearch'); + this.addEvent(this.$searchClear, 'click', 'onSearchClear'); + this.addEvent(this.$toggleAllButton, 'click', 'onToggleAllOptions'); + } + /** render methods - end */ + + /** dom event methods - start */ + }, { + key: "addEvents", + value: function addEvents() { + this.addEvent(document, 'click', 'onDocumentClick'); + this.addEvent(this.$allWrappers, 'keydown', 'onKeyDown'); + this.addEvent(this.$toggleButton, 'click', 'onToggleButtonClick'); + this.addEvent(this.$clearButton, 'click', 'onClearButtonClick'); + this.addEvent(this.$dropboxContainer, 'click', 'onDropboxContainerClick'); + this.addEvent(this.$dropboxCloseButton, 'click', 'onDropboxCloseButtonClick'); + this.addEvent(this.$optionsContainer, 'scroll', 'onOptionsScroll'); + this.addEvent(this.$options, 'click', 'onOptionsClick'); + this.addEvent(this.$options, 'mouseover', 'onOptionsMouseOver'); + this.addEvent(this.$options, 'touchmove', 'onOptionsTouchMove'); + this.addMutationObserver(); + } + }, { + key: "addEvent", + value: function addEvent($ele, events, method) { + var _this2 = this; + if (!$ele) { + return; + } + var eventsArray = Utils.removeArrayEmpty(events.split(' ')); + eventsArray.forEach(function (event) { + var eventsKey = "".concat(method, "-").concat(event); + var callback = _this2.events[eventsKey]; + if (!callback) { + callback = _this2[method].bind(_this2); + _this2.events[eventsKey] = callback; + } + DomUtils.addEvent($ele, event, callback); + }); + } + }, { + key: "onDocumentClick", + value: function onDocumentClick(e) { + var $eleToKeepOpen = e.target.closest('.vscomp-wrapper'); + if ($eleToKeepOpen !== this.$wrapper && $eleToKeepOpen !== this.$dropboxWrapper && this.isOpened()) { + this.closeDropbox(); + } + } + }, { + key: "onKeyDown", + value: function onKeyDown(e) { + var key = e.which || e.keyCode; + var method = keyDownMethodMapping[key]; + if (method) { + this[method](e); + } + } + }, { + key: "onEnterPress", + value: function onEnterPress(e) { + e.preventDefault(); + if (this.isOpened()) { + this.selectFocusedOption(); + } else { + this.openDropbox(); + } + } + }, { + key: "onDownArrowPress", + value: function onDownArrowPress(e) { + e.preventDefault(); + if (this.isOpened()) { + this.focusOption({ + direction: 'next' + }); + } else { + this.openDropbox(); + } + } + }, { + key: "onUpArrowPress", + value: function onUpArrowPress(e) { + e.preventDefault(); + if (this.isOpened()) { + this.focusOption({ + direction: 'previous' + }); + } else { + this.openDropbox(); + } + } + }, { + key: "onToggleButtonClick", + value: function onToggleButtonClick(e) { + var $target = e.target; + if ($target.closest('.vscomp-value-tag-clear-button')) { + this.removeValue($target.closest('.vscomp-value-tag')); + } else if (!$target.closest('.toggle-button-child')) { + this.toggleDropbox(); + } + } + }, { + key: "onClearButtonClick", + value: function onClearButtonClick() { + this.reset(); + } + }, { + key: "onOptionsScroll", + value: function onOptionsScroll() { + this.setVisibleOptions(); + } + }, { + key: "onOptionsClick", + value: function onOptionsClick(e) { + var $option = e.target.closest('.vscomp-option'); + if ($option && !DomUtils.hasClass($option, 'disabled')) { + if (DomUtils.hasClass($option, 'group-title')) { + this.onGroupTitleClick($option); + } else { + this.selectOption($option, { + event: e + }); + } + } + } + }, { + key: "onGroupTitleClick", + value: function onGroupTitleClick($ele) { + if (!$ele || !this.multiple || this.disableOptionGroupCheckbox) { + return; + } + var isAdding = !DomUtils.hasClass($ele, 'selected'); + this.toggleGroupTitleCheckbox($ele, isAdding); + this.toggleGroupOptions($ele, isAdding); + } + }, { + key: "onDropboxContainerClick", + value: function onDropboxContainerClick(e) { + if (!e.target.closest('.vscomp-dropbox')) { + this.closeDropbox(); + } + } + }, { + key: "onDropboxCloseButtonClick", + value: function onDropboxCloseButtonClick() { + this.closeDropbox(); + } + }, { + key: "onOptionsMouseOver", + value: function onOptionsMouseOver(e) { + var $ele = e.target.closest('.vscomp-option'); + if ($ele && this.isOpened()) { + if (DomUtils.hasClass($ele, 'disabled') || DomUtils.hasClass($ele, 'group-title')) { + this.removeOptionFocus(); + } else { + this.focusOption({ + $option: $ele + }); + } + } + } + }, { + key: "onOptionsTouchMove", + value: function onOptionsTouchMove() { + this.removeOptionFocus(); + } + }, { + key: "onSearch", + value: function onSearch(e) { + e.stopPropagation(); + this.setSearchValue(e.target.value, true); + } + }, { + key: "onSearchClear", + value: function onSearchClear() { + this.setSearchValue(''); + this.focusSearchInput(); + } + }, { + key: "onToggleAllOptions", + value: function onToggleAllOptions() { + this.toggleAllOptions(); + } + }, { + key: "onResize", + value: function onResize() { + this.setOptionsContainerHeight(true); + } + + /** to remove dropboxWrapper on removing vscomp-ele when it is rendered outside of vscomp-ele */ + }, { + key: "addMutationObserver", + value: function addMutationObserver() { + var _this3 = this; + if (!this.hasDropboxWrapper) { + return; + } + var $vscompEle = this.$ele; + this.mutationObserver = new MutationObserver(function (mutations) { + var isAdded = false; + var isRemoved = false; + mutations.forEach(function (mutation) { + if (!isAdded) { + isAdded = virtual_select_toConsumableArray(mutation.addedNodes).some(function ($ele) { + return !!($ele === $vscompEle || $ele.contains($vscompEle)); + }); + } + if (!isRemoved) { + isRemoved = virtual_select_toConsumableArray(mutation.removedNodes).some(function ($ele) { + return !!($ele === $vscompEle || $ele.contains($vscompEle)); + }); + } + }); + if (isRemoved && !isAdded) { + _this3.destroy(); + } + }); + this.mutationObserver.observe(document.querySelector('body'), { + childList: true, + subtree: true + }); + } + /** dom event methods - end */ + + /** before event methods - start */ + }, { + key: "beforeValueSet", + value: function beforeValueSet(isReset) { + this.toggleAllOptionsClass(isReset ? false : undefined); + } + }, { + key: "beforeSelectNewValue", + value: function beforeSelectNewValue() { + var _this4 = this; + var newOption = this.getNewOption(); + var newIndex = newOption.index; + this.newValues.push(newOption.value); + this.setOptionProp(newIndex, 'isCurrentNew', false); + this.setOptionProp(newIndex, 'isNew', true); + + /** using setTimeout to fix the issue of dropbox getting closed on select */ + setTimeout(function () { + _this4.setSearchValue(''); + _this4.focusSearchInput(); + }, 0); + } + /** before event methods - end */ + + /** after event methods - start */ + }, { + key: "afterRenderWrapper", + value: function afterRenderWrapper() { + DomUtils.addClass(this.$ele, 'vscomp-ele'); + this.renderSearch(); + this.setEleStyles(); + this.setDropboxStyles(); + this.setOptionsHeight(); + this.setVisibleOptions(); + this.setOptionsContainerHeight(); + this.addEvents(); + this.setEleProps(); + if (!this.keepAlwaysOpen && !this.showAsPopup) { + this.initDropboxPopover(); + } + if (this.initialSelectedValue) { + this.setValueMethod(this.initialSelectedValue, this.silentInitialValueSet); + } else if (this.autoSelectFirstOption && this.visibleOptions.length) { + this.setValueMethod(this.visibleOptions[0].value, this.silentInitialValueSet); + } + if (this.showOptionsOnlyOnSearch) { + this.setSearchValue('', false, true); + } + if (this.initialDisabled) { + this.disable(); + } + if (this.autofocus) { + this.focus(); + } + } + }, { + key: "afterRenderOptions", + value: function afterRenderOptions() { + var visibleOptions = this.getVisibleOptions(); + var hasNoOptions = !this.options.length && !this.hasServerSearch; + var hasNoSearchResults = !hasNoOptions && !visibleOptions.length; + if (!this.allowNewOption || this.hasServerSearch || this.showOptionsOnlyOnSearch) { + DomUtils.toggleClass(this.$allWrappers, 'has-no-search-results', hasNoSearchResults); + } + DomUtils.toggleClass(this.$allWrappers, 'has-no-options', hasNoOptions); + this.setOptionAttr(); + this.setOptionsPosition(); + this.setOptionsTooltip(); + } + }, { + key: "afterSetOptionsContainerHeight", + value: function afterSetOptionsContainerHeight(reset) { + if (reset && this.showAsPopup) { + this.setVisibleOptions(); + } + } + }, { + key: "afterSetSearchValue", + value: function afterSetSearchValue() { + var _this5 = this; + if (this.hasServerSearch) { + clearInterval(this.serverSearchTimeout); + this.serverSearchTimeout = setTimeout(function () { + _this5.serverSearch(); + }, this.searchDelay); + } else { + this.setVisibleOptionsCount(); + } + if (this.selectAllOnlyVisible) { + this.toggleAllOptionsClass(); + } + this.focusOption({ + focusFirst: true + }); + } + }, { + key: "afterSetVisibleOptionsCount", + value: function afterSetVisibleOptionsCount() { + this.scrollToTop(); + this.setOptionsHeight(); + this.setVisibleOptions(); + this.updatePosition(); + } + }, { + key: "afterValueSet", + value: function afterValueSet() { + this.scrollToTop(); + this.setSearchValue(''); + this.renderOptions(); + } + }, { + key: "afterSetOptions", + value: function afterSetOptions(keepValue) { + if (keepValue) { + this.setSelectedProp(); + } + this.setOptionsHeight(); + this.setVisibleOptions(); + if (this.showOptionsOnlyOnSearch) { + this.setSearchValue('', false, true); + } + if (!keepValue) { + this.reset(); + } + } + /** after event methods - end */ + + /** set methods - start */ + /** + * @param {virtualSelectOptions} params + */ + }, { + key: "setProps", + value: function setProps(params) { + var options = this.setDefaultProps(params); + this.setPropsFromElementAttr(options); + var convertToBoolean = Utils.convertToBoolean; + this.$ele = options.ele; + this.dropboxWrapper = options.dropboxWrapper; + this.valueKey = options.valueKey; + this.labelKey = options.labelKey; + this.descriptionKey = options.descriptionKey; + this.aliasKey = options.aliasKey; + this.optionHeightText = options.optionHeight; + this.optionHeight = parseFloat(this.optionHeightText); + this.multiple = convertToBoolean(options.multiple); + this.hasSearch = convertToBoolean(options.search); + this.searchByStartsWith = convertToBoolean(options.searchByStartsWith); + this.searchGroup = convertToBoolean(options.searchGroup); + this.hideClearButton = convertToBoolean(options.hideClearButton); + this.autoSelectFirstOption = convertToBoolean(options.autoSelectFirstOption); + this.hasOptionDescription = convertToBoolean(options.hasOptionDescription); + this.silentInitialValueSet = convertToBoolean(options.silentInitialValueSet); + this.allowNewOption = convertToBoolean(options.allowNewOption); + this.markSearchResults = convertToBoolean(options.markSearchResults); + this.showSelectedOptionsFirst = convertToBoolean(options.showSelectedOptionsFirst); + this.disableSelectAll = convertToBoolean(options.disableSelectAll); + this.keepAlwaysOpen = convertToBoolean(options.keepAlwaysOpen); + this.showDropboxAsPopup = convertToBoolean(options.showDropboxAsPopup); + this.hideValueTooltipOnSelectAll = convertToBoolean(options.hideValueTooltipOnSelectAll); + this.showOptionsOnlyOnSearch = convertToBoolean(options.showOptionsOnlyOnSearch); + this.selectAllOnlyVisible = convertToBoolean(options.selectAllOnlyVisible); + this.alwaysShowSelectedOptionsCount = convertToBoolean(options.alwaysShowSelectedOptionsCount); + this.alwaysShowSelectedOptionsLabel = convertToBoolean(options.alwaysShowSelectedOptionsLabel); + this.disableAllOptionsSelectedText = convertToBoolean(options.disableAllOptionsSelectedText); + this.showValueAsTags = convertToBoolean(options.showValueAsTags); + this.disableOptionGroupCheckbox = convertToBoolean(options.disableOptionGroupCheckbox); + this.enableSecureText = convertToBoolean(options.enableSecureText); + this.setValueAsArray = convertToBoolean(options.setValueAsArray); + this.disableValidation = convertToBoolean(options.disableValidation); + this.initialDisabled = convertToBoolean(options.disabled); + this.required = convertToBoolean(options.required); + this.autofocus = convertToBoolean(options.autofocus); + this.useGroupValue = convertToBoolean(options.useGroupValue); + this.focusSelectedOptionOnOpen = convertToBoolean(options.focusSelectedOptionOnOpen); + this.noOptionsText = options.noOptionsText; + this.noSearchResultsText = options.noSearchResultsText; + this.selectAllText = options.selectAllText; + this.searchPlaceholderText = options.searchPlaceholderText; + this.optionsSelectedText = options.optionsSelectedText; + this.optionSelectedText = options.optionSelectedText; + this.allOptionsSelectedText = options.allOptionsSelectedText; + this.clearButtonText = options.clearButtonText; + this.moreText = options.moreText; + this.placeholder = options.placeholder; + this.position = options.position; + this.textDirection = options.textDirection; + this.dropboxWidth = options.dropboxWidth; + this.tooltipFontSize = options.tooltipFontSize; + this.tooltipAlignment = options.tooltipAlignment; + this.tooltipMaxWidth = options.tooltipMaxWidth; + this.updatePositionThrottle = options.updatePositionThrottle; + this.noOfDisplayValues = parseInt(options.noOfDisplayValues); + this.zIndex = parseInt(options.zIndex); + this.maxValues = parseInt(options.maxValues); + this.minValues = parseInt(options.minValues); + this.name = this.secureText(options.name); + this.additionalClasses = options.additionalClasses; + this.popupDropboxBreakpoint = options.popupDropboxBreakpoint; + this.popupPosition = options.popupPosition; + this.onServerSearch = options.onServerSearch; + this.labelRenderer = options.labelRenderer; + this.initialSelectedValue = options.selectedValue === 0 ? '0' : options.selectedValue; + this.emptyValue = options.emptyValue; + this.ariaLabelledby = options.ariaLabelledby; + this.maxWidth = options.maxWidth; + this.searchDelay = options.searchDelay; + + /** @type {string[]} */ + this.selectedValues = []; + /** @type {virtualSelectOption[]} */ + this.selectedOptions = []; + this.newValues = []; + this.events = {}; + this.tooltipEnterDelay = 200; + this.searchValue = ''; + this.searchValueOriginal = ''; + this.isAllSelected = false; + if (options.search === undefined && this.multiple || this.allowNewOption || this.showOptionsOnlyOnSearch) { + this.hasSearch = true; + } + this.hasServerSearch = typeof this.onServerSearch === 'function'; + if (this.maxValues || this.hasServerSearch || this.showOptionsOnlyOnSearch) { + this.disableSelectAll = true; + this.disableOptionGroupCheckbox = true; + } + if (this.keepAlwaysOpen) { + this.dropboxWrapper = 'self'; + } + this.showAsPopup = this.showDropboxAsPopup && !this.keepAlwaysOpen && window.innerWidth <= parseFloat(this.popupDropboxBreakpoint); + this.hasSearchContainer = this.hasSearch || this.multiple && !this.disableSelectAll; + this.optionsCount = this.getOptionsCount(options.optionsCount); + this.halfOptionsCount = Math.ceil(this.optionsCount / 2); + this.optionsHeight = this.getOptionsHeight(); + this.uniqueId = this.getUniqueId(); + } + + /** + * @param {virtualSelectOptions} options + */ + }, { + key: "setDefaultProps", + value: function setDefaultProps(options) { + var defaultOptions = { + dropboxWrapper: 'self', + valueKey: 'value', + labelKey: 'label', + descriptionKey: 'description', + aliasKey: 'alias', + optionsCount: 5, + noOfDisplayValues: 50, + optionHeight: '40px', + noOptionsText: 'No options found', + noSearchResultsText: 'No results found', + selectAllText: 'Select All', + searchPlaceholderText: 'Search...', + clearButtonText: 'Clear', + moreText: 'more...', + optionsSelectedText: 'options selected', + optionSelectedText: 'option selected', + allOptionsSelectedText: 'All', + placeholder: 'Select', + position: 'bottom left', + zIndex: options.keepAlwaysOpen ? 1 : 2, + tooltipFontSize: '14px', + tooltipAlignment: 'center', + tooltipMaxWidth: '300px', + updatePositionThrottle: 100, + name: '', + additionalClasses: '', + maxValues: 0, + showDropboxAsPopup: true, + popupDropboxBreakpoint: '576px', + popupPosition: 'center', + hideValueTooltipOnSelectAll: true, + emptyValue: '', + searchDelay: 300, + focusSelectedOptionOnOpen: true + }; + if (options.hasOptionDescription) { + defaultOptions.optionsCount = 4; + defaultOptions.optionHeight = '50px'; + } + return Object.assign(defaultOptions, options); + } + }, { + key: "setPropsFromElementAttr", + value: function setPropsFromElementAttr(options) { + var $ele = options.ele; + Object.keys(attrPropsMapping).forEach(function (k) { + var value = $ele.getAttribute(k); + if (valueLessProps.indexOf(k) !== -1 && (value === '' || value === 'true')) { + value = true; + } + if (value) { + // eslint-disable-next-line no-param-reassign + options[attrPropsMapping[k]] = value; + } + }); + } + }, { + key: "setEleProps", + value: function setEleProps() { + var $ele = this.$ele; + $ele.virtualSelect = this; + $ele.value = this.multiple ? [] : ''; + $ele.name = this.name; + $ele.disabled = false; + $ele.required = this.required; + $ele.autofocus = this.autofocus; + $ele.multiple = this.multiple; + $ele.form = $ele.closest('form'); + $ele.reset = VirtualSelect.reset; + $ele.setValue = VirtualSelect.setValueMethod; + $ele.setOptions = VirtualSelect.setOptionsMethod; + $ele.setDisabledOptions = VirtualSelect.setDisabledOptionsMethod; + $ele.setEnabledOptions = VirtualSelect.setEnabledOptionsMethod; + $ele.toggleSelectAll = VirtualSelect.toggleSelectAll; + $ele.isAllSelected = VirtualSelect.isAllSelected; + $ele.addOption = VirtualSelect.addOptionMethod; + $ele.getNewValue = VirtualSelect.getNewValueMethod; + $ele.getDisplayValue = VirtualSelect.getDisplayValueMethod; + $ele.getSelectedOptions = VirtualSelect.getSelectedOptionsMethod; + $ele.getDisabledOptions = VirtualSelect.getDisabledOptionsMethod; + $ele.open = VirtualSelect.openMethod; + $ele.close = VirtualSelect.closeMethod; + $ele.focus = VirtualSelect.focusMethod; + $ele.enable = VirtualSelect.enableMethod; + $ele.disable = VirtualSelect.disableMethod; + $ele.destroy = VirtualSelect.destroyMethod; + $ele.validate = VirtualSelect.validateMethod; + $ele.toggleRequired = VirtualSelect.toggleRequiredMethod; + if (this.hasDropboxWrapper) { + this.$dropboxWrapper.virtualSelect = this; + } + } + }, { + key: "setValueMethod", + value: function setValueMethod(newValue, silentChange) { + var valuesMapping = {}; + var valuesOrder = {}; + var validValues = []; + var isMultiSelect = this.multiple; + var value = newValue; + if (value) { + if (!Array.isArray(value)) { + value = [value]; + } + if (isMultiSelect) { + var maxValues = this.maxValues; + if (maxValues && value.length > maxValues) { + value.splice(maxValues); + } + } else if (value.length > 1) { + value = [value[0]]; + } + + /** converting value to string */ + value = value.map(function (v) { + return v || v === 0 ? v.toString() : ''; + }); + if (this.useGroupValue) { + value = this.setGroupOptionsValue(value); + } + value.forEach(function (d, i) { + valuesMapping[d] = true; + valuesOrder[d] = i; + }); + if (this.allowNewOption && value) { + this.setNewOptionsFromValue(value); + } + } + this.options.forEach(function (d) { + if (valuesMapping[d.value] === true && !d.isDisabled && !d.isGroupTitle) { + // eslint-disable-next-line no-param-reassign + d.isSelected = true; + validValues.push(d.value); + } else { + // eslint-disable-next-line no-param-reassign + d.isSelected = false; + } + }); + if (isMultiSelect) { + if (this.hasOptionGroup) { + this.setGroupsSelectedProp(); + } + + /** sorting validValues in the given values order */ + validValues.sort(function (a, b) { + return valuesOrder[a] - valuesOrder[b]; + }); + } else { + /** taking first value for single select */ + var _validValues = validValues; + var _validValues2 = virtual_select_slicedToArray(_validValues, 1); + validValues = _validValues2[0]; + } + this.beforeValueSet(); + this.setValue(validValues, { + disableEvent: silentChange + }); + this.afterValueSet(); + } + }, { + key: "setGroupOptionsValue", + value: function setGroupOptionsValue(preparedValues) { + var selectedValues = []; + var selectedGroups = {}; + var valuesMapping = {}; + preparedValues.forEach(function (d) { + valuesMapping[d] = true; + }); + this.options.forEach(function (d) { + var value = d.value; + var isSelected = valuesMapping[value] === true; + if (d.isGroupTitle) { + if (isSelected) { + selectedGroups[d.index] = true; + } + } else if (isSelected || selectedGroups[d.groupIndex]) { + selectedValues.push(value); + } + }); + return selectedValues; + } + }, { + key: "setGroupsSelectedProp", + value: function setGroupsSelectedProp() { + var isAllGroupOptionsSelected = this.isAllGroupOptionsSelected.bind(this); + this.options.forEach(function (d) { + if (d.isGroupTitle) { + // eslint-disable-next-line no-param-reassign + d.isSelected = isAllGroupOptionsSelected(d.index); + } + }); + } + }, { + key: "setOptionsMethod", + value: function setOptionsMethod(options, keepValue) { + this.setOptions(options); + this.afterSetOptions(keepValue); + } + }, { + key: "setDisabledOptionsMethod", + value: function setDisabledOptionsMethod(disabledOptions) { + var keepValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; + this.setDisabledOptions(disabledOptions, true); + if (!keepValue) { + this.setValueMethod(null); + this.toggleAllOptionsClass(); + } + this.setVisibleOptions(); + } + }, { + key: "setDisabledOptions", + value: function setDisabledOptions(disabledOptions) { + var setOptionsProp = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; + var disabledOptionsArr = []; + if (!disabledOptions) { + if (setOptionsProp) { + this.options.forEach(function (d) { + // eslint-disable-next-line no-param-reassign + d.isDisabled = false; + return d; + }); + } + } else if (disabledOptions === true) { + if (setOptionsProp) { + this.options.forEach(function (d) { + // eslint-disable-next-line no-param-reassign + d.isDisabled = true; + disabledOptionsArr.push(d.value); + return d; + }); + } + } else { + disabledOptionsArr = disabledOptions.map(function (d) { + return d.toString(); + }); + var disabledOptionsMapping = {}; + disabledOptionsArr.forEach(function (d) { + disabledOptionsMapping[d] = true; + }); + if (setOptionsProp) { + this.options.forEach(function (d) { + // eslint-disable-next-line no-param-reassign + d.isDisabled = disabledOptionsMapping[d.value] === true; + return d; + }); + } + } + this.disabledOptions = disabledOptionsArr; + } + }, { + key: "setEnabledOptionsMethod", + value: function setEnabledOptionsMethod(disabledOptions) { + var keepValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; + this.setEnabledOptions(disabledOptions); + if (!keepValue) { + this.setValueMethod(null); + this.toggleAllOptionsClass(); + } + this.setVisibleOptions(); + } + }, { + key: "setEnabledOptions", + value: function setEnabledOptions(enabledOptions) { + if (enabledOptions === undefined) { + return; + } + var disabledOptionsArr = []; + if (enabledOptions === true) { + this.options.forEach(function (d) { + // eslint-disable-next-line no-param-reassign + d.isDisabled = false; + return d; + }); + } else { + var enabledOptionsMapping = {}; + enabledOptions.forEach(function (d) { + enabledOptionsMapping[d] = true; + }); + this.options.forEach(function (d) { + var isDisabled = enabledOptionsMapping[d.value] !== true; + + // eslint-disable-next-line no-param-reassign + d.isDisabled = isDisabled; + if (isDisabled) { + disabledOptionsArr.push(d.value); + } + return d; + }); + } + this.disabledOptions = disabledOptionsArr; + } + }, { + key: "setOptions", + value: function setOptions() { + var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : []; + var preparedOptions = []; + var hasDisabledOptions = this.disabledOptions.length; + var valueKey = this.valueKey, + labelKey = this.labelKey, + descriptionKey = this.descriptionKey, + aliasKey = this.aliasKey, + hasOptionDescription = this.hasOptionDescription; + var getString = Utils.getString, + convertToBoolean = Utils.convertToBoolean; + var secureText = this.secureText.bind(this); + var getAlias = this.getAlias.bind(this); + var index = 0; + var hasOptionGroup = false; + var disabledOptionsMapping = {}; + var hasEmptyValueOption = false; + this.disabledOptions.forEach(function (d) { + disabledOptionsMapping[d] = true; + }); + var prepareOption = function prepareOption(d) { + if (virtual_select_typeof(d) !== 'object') { + var _d2; + // eslint-disable-next-line no-param-reassign + d = (_d2 = {}, _defineProperty(_d2, valueKey, d), _defineProperty(_d2, labelKey, d), _d2); + } + var value = secureText(getString(d[valueKey])); + var childOptions = d.options; + var isGroupTitle = !!childOptions; + var option = { + index: index, + value: value, + label: secureText(getString(d[labelKey])), + alias: getAlias(d[aliasKey]), + isVisible: convertToBoolean(d.isVisible, true), + isNew: d.isNew || false, + isGroupTitle: isGroupTitle, + classNames: d.classNames + }; + if (!hasEmptyValueOption && value === '') { + hasEmptyValueOption = true; + } + if (hasDisabledOptions) { + option.isDisabled = disabledOptionsMapping[value] === true; + } + if (d.isGroupOption) { + option.isGroupOption = true; + option.groupIndex = d.groupIndex; + } + if (hasOptionDescription) { + option.description = secureText(getString(d[descriptionKey])); + } + if (d.customData) { + option.customData = d.customData; + } + preparedOptions.push(option); + index += 1; + if (isGroupTitle) { + var groupIndex = option.index; + hasOptionGroup = true; + childOptions.forEach(function (childData) { + // eslint-disable-next-line no-param-reassign + childData.isGroupOption = true; + // eslint-disable-next-line no-param-reassign + childData.groupIndex = groupIndex; + prepareOption(childData); + }); + } + }; + if (Array.isArray(options)) { + options.forEach(prepareOption); + } + var optionsLength = preparedOptions.length; + var $ele = this.$ele; + $ele.options = preparedOptions; + $ele.length = optionsLength; + this.options = preparedOptions; + this.visibleOptionsCount = optionsLength; + this.lastOptionIndex = optionsLength - 1; + this.newValues = []; + this.hasOptionGroup = hasOptionGroup; + this.hasEmptyValueOption = hasEmptyValueOption; + this.setSortedOptions(); + } + }, { + key: "setServerOptions", + value: function setServerOptions() { + var _this6 = this; + var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : []; + this.setOptionsMethod(options, true); + var selectedOptions = this.selectedOptions; + var newOptions = this.options; + var optionsUpdated = false; + + /** merging already selected options details with new options */ + if (selectedOptions.length) { + var newOptionsValueMapping = {}; + optionsUpdated = true; + newOptions.forEach(function (d) { + newOptionsValueMapping[d.value] = true; + }); + selectedOptions.forEach(function (d) { + if (newOptionsValueMapping[d.value] !== true) { + // eslint-disable-next-line no-param-reassign + d.isVisible = false; + newOptions.push(d); + } + }); + this.setOptionsMethod(newOptions, true); + } + + /** merging new search option */ + if (this.allowNewOption && this.searchValue) { + var hasExactOption = newOptions.some(function (d) { + return d.label.toLowerCase() === _this6.searchValue; + }); + if (!hasExactOption) { + optionsUpdated = true; + this.setNewOption(); + } + } + if (optionsUpdated) { + this.setVisibleOptionsCount(); + if (this.multiple) { + this.toggleAllOptionsClass(); + } + this.setValueText(); + } else { + this.updatePosition(); + } + DomUtils.removeClass(this.$allWrappers, 'server-searching'); + } + }, { + key: "setSelectedOptions", + value: function setSelectedOptions() { + this.selectedOptions = this.options.filter(function (d) { + return d.isSelected; + }); + } + }, { + key: "setSortedOptions", + value: function setSortedOptions() { + var sortedOptions = virtual_select_toConsumableArray(this.options); + if (this.showSelectedOptionsFirst && this.selectedValues.length) { + if (this.hasOptionGroup) { + sortedOptions = this.sortOptionsGroup(sortedOptions); + } else { + sortedOptions = this.sortOptions(sortedOptions); + } + } + this.sortedOptions = sortedOptions; + } + }, { + key: "setVisibleOptions", + value: function setVisibleOptions() { + var visibleOptions = virtual_select_toConsumableArray(this.sortedOptions); + var maxOptionsToShow = this.optionsCount * 2; + var startIndex = this.getVisibleStartIndex(); + var newOption = this.getNewOption(); + var endIndex = startIndex + maxOptionsToShow - 1; + var i = 0; + if (newOption) { + newOption.visibleIndex = i; + i += 1; + } + visibleOptions = visibleOptions.filter(function (d) { + var inView = false; + if (d.isVisible && !d.isCurrentNew) { + inView = i >= startIndex && i <= endIndex; + // eslint-disable-next-line no-param-reassign + d.visibleIndex = i; + i += 1; + } + return inView; + }); + if (newOption) { + visibleOptions = [newOption].concat(virtual_select_toConsumableArray(visibleOptions)); + } + this.visibleOptions = visibleOptions; + this.renderOptions(); + } + }, { + key: "setOptionsPosition", + value: function setOptionsPosition(startIndex) { + var top = (startIndex || this.getVisibleStartIndex()) * this.optionHeight; + this.$options.style.transform = "translate3d(0, ".concat(top, "px, 0)"); + DomUtils.setData(this.$options, 'top', top); + } + }, { + key: "setOptionsTooltip", + value: function setOptionsTooltip() { + var _this7 = this; + var visibleOptions = this.getVisibleOptions(); + var hasOptionDescription = this.hasOptionDescription; + visibleOptions.forEach(function (d) { + var $optionEle = _this7.$dropboxContainer.querySelector(".vscomp-option[data-index=\"".concat(d.index, "\"]")); + DomUtils.setData($optionEle.querySelector('.vscomp-option-text'), 'tooltip', d.label); + if (hasOptionDescription) { + DomUtils.setData($optionEle.querySelector('.vscomp-option-description'), 'tooltip', d.description); + } + }); + } + }, { + key: "setValue", + value: function setValue(value) { + var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}, + _ref2$disableEvent = _ref2.disableEvent, + disableEvent = _ref2$disableEvent === void 0 ? false : _ref2$disableEvent, + _ref2$disableValidati = _ref2.disableValidation, + disableValidation = _ref2$disableValidati === void 0 ? false : _ref2$disableValidati; + var isValidValue = this.hasEmptyValueOption && value === '' || value; + if (!isValidValue) { + this.selectedValues = []; + } else if (Array.isArray(value)) { + this.selectedValues = virtual_select_toConsumableArray(value); + } else { + this.selectedValues = [value]; + } + var newValue = this.getValue(); + this.$ele.value = newValue; + this.$hiddenInput.value = this.getInputValue(newValue); + this.isMaxValuesSelected = !!(this.maxValues && this.maxValues <= this.selectedValues.length); + this.toggleAllOptionsClass(); + this.setValueText(); + DomUtils.toggleClass(this.$allWrappers, 'has-value', Utils.isNotEmpty(this.selectedValues)); + DomUtils.toggleClass(this.$allWrappers, 'max-value-selected', this.isMaxValuesSelected); + if (!disableValidation) { + this.validate(); + } + if (!disableEvent) { + DomUtils.dispatchEvent(this.$ele, 'change', true); + } + } + }, { + key: "setValueText", + value: function setValueText() { + var multiple = this.multiple, + selectedValues = this.selectedValues, + noOfDisplayValues = this.noOfDisplayValues, + showValueAsTags = this.showValueAsTags, + $valueText = this.$valueText; + var valueText = []; + var valueTooltip = []; + var selectedLength = selectedValues.length; + var selectedValuesCount = 0; + var showAllText = this.isAllSelected && !this.hasServerSearch && !this.disableAllOptionsSelectedText && !showValueAsTags; + + /** show all values selected text without tooltip text */ + if (showAllText && this.hideValueTooltipOnSelectAll) { + $valueText.innerHTML = "".concat(this.allOptionsSelectedText, " (").concat(selectedLength, ")"); + } else { + var selectedOptions = this.getSelectedOptions({ + fullDetails: true, + keepSelectionOrder: true + }); + selectedOptions.some(function (d) { + if (d.isCurrentNew) { + return false; + } + if (selectedValuesCount >= noOfDisplayValues) { + return true; + } + var label = d.label; + valueText.push(label); + selectedValuesCount += 1; + if (showValueAsTags) { + var valueTagHtml = "\n ").concat(label, "\n \n \n \n "); + valueTooltip.push(valueTagHtml); + } else { + valueTooltip.push(label); + } + return false; + }); + var moreSelectedOptions = selectedLength - noOfDisplayValues; + if (moreSelectedOptions > 0) { + valueTooltip.push("+ ".concat(moreSelectedOptions, " ").concat(this.moreText, "")); + } + var aggregatedValueText = valueText.join(', '); + if (aggregatedValueText === '') { + $valueText.innerHTML = this.placeholder; + } else { + $valueText.innerHTML = aggregatedValueText; + if (multiple) { + var maxValues = this.maxValues; + var showSelectedCount = this.alwaysShowSelectedOptionsCount || DomUtils.hasEllipsis($valueText); + if (showSelectedCount || maxValues || showValueAsTags) { + var countText = "".concat(selectedLength, ""); + if (maxValues) { + countText += " / ".concat(maxValues, ""); + } + + /** show all values selected text with tooltip text */ + if (showAllText) { + $valueText.innerHTML = "".concat(this.allOptionsSelectedText, " (").concat(selectedLength, ")"); + } else if (showValueAsTags) { + $valueText.innerHTML = valueTooltip.join(''); + this.$valueTags = $valueText.querySelectorAll('.vscomp-value-tag'); + this.setValueTagAttr(); + } else if (!this.alwaysShowSelectedOptionsLabel) { + /** replace comma separated list of selections with shorter text indicating selection count */ + var optionsSelectedText = selectedLength === 1 ? this.optionSelectedText : this.optionsSelectedText; + $valueText.innerHTML = "".concat(countText, " ").concat(optionsSelectedText); + } + } else { + /** removing tooltip if full value text is visible */ + valueTooltip = []; + } + } + } + } + var tooltipText = ''; + if (selectedLength === 0) { + tooltipText = this.placeholder; + } else if (!showValueAsTags) { + tooltipText = valueTooltip.join(', '); + } + DomUtils.setData($valueText, 'tooltip', tooltipText); + if (multiple) { + DomUtils.setData($valueText, 'tooltipEllipsisOnly', selectedLength === 0); + if (showValueAsTags) { + this.updatePosition(); + } + } + } + }, { + key: "setSearchValue", + value: function setSearchValue(value) { + var skipInputSet = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; + var forceSet = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; + if (value === this.searchValueOriginal && !forceSet) { + return; + } + if (!skipInputSet) { + this.$searchInput.value = value; + } + var searchValue = value.replace(/\\/g, '').toLowerCase().trim(); + this.searchValue = searchValue; + this.searchValueOriginal = value; + DomUtils.toggleClass(this.$allWrappers, 'has-search-value', value); + this.afterSetSearchValue(); + } + }, { + key: "setVisibleOptionsCount", + value: function setVisibleOptionsCount() { + var visibleOptionsCount = 0; + var hasExactOption = false; + var visibleOptionGroupsMapping; + var searchValue = this.searchValue, + searchGroup = this.searchGroup, + showOptionsOnlyOnSearch = this.showOptionsOnlyOnSearch, + searchByStartsWith = this.searchByStartsWith; + var isOptionVisible = this.isOptionVisible.bind(this); + if (this.hasOptionGroup) { + visibleOptionGroupsMapping = this.getVisibleOptionGroupsMapping(searchValue); + } + this.options.forEach(function (d) { + if (d.isCurrentNew) { + return; + } + var result; + if (showOptionsOnlyOnSearch && !searchValue) { + // eslint-disable-next-line no-param-reassign + d.isVisible = false; + result = { + isVisible: false, + hasExactOption: false + }; + } else { + result = isOptionVisible({ + data: d, + searchValue: searchValue, + hasExactOption: hasExactOption, + visibleOptionGroupsMapping: visibleOptionGroupsMapping, + searchGroup: searchGroup, + searchByStartsWith: searchByStartsWith + }); + } + if (result.isVisible) { + visibleOptionsCount += 1; + } + if (!hasExactOption) { + hasExactOption = result.hasExactOption; + } + }); + if (this.allowNewOption) { + if (searchValue && !hasExactOption) { + this.setNewOption(); + visibleOptionsCount += 1; + } else { + this.removeNewOption(); + } + } + this.visibleOptionsCount = visibleOptionsCount; + this.afterSetVisibleOptionsCount(); + } + }, { + key: "setOptionProp", + value: function setOptionProp(index, key, value) { + if (!this.options[index]) { + return; + } + this.options[index][key] = value; + } + }, { + key: "setOptionsHeight", + value: function setOptionsHeight() { + this.$optionsList.style.height = "".concat(this.optionHeight * this.visibleOptionsCount, "px"); + } + }, { + key: "setOptionsContainerHeight", + value: function setOptionsContainerHeight(reset) { + var optionsHeight; + if (reset) { + if (this.showAsPopup) { + this.optionsCount = this.getOptionsCount(); + this.halfOptionsCount = Math.ceil(this.optionsCount / 2); + optionsHeight = this.getOptionsHeight(); + this.optionsHeight = optionsHeight; + } + } else { + optionsHeight = this.optionsHeight; + if (this.keepAlwaysOpen) { + DomUtils.setStyle(this.$noOptions, 'height', optionsHeight); + DomUtils.setStyle(this.$noSearchResults, 'height', optionsHeight); + } + } + DomUtils.setStyle(this.$optionsContainer, 'max-height', optionsHeight); + this.afterSetOptionsContainerHeight(reset); + } + }, { + key: "setNewOption", + value: function setNewOption(newValue) { + var value = newValue || this.searchValueOriginal.trim(); + if (!value) { + return; + } + var newOption = this.getNewOption(); + if (newOption) { + var newIndex = newOption.index; + this.setOptionProp(newIndex, 'value', this.secureText(value)); + this.setOptionProp(newIndex, 'label', this.secureText(value)); + } else { + var data = { + value: value, + label: value + }; + if (newValue) { + data.isNew = true; + this.newValues.push(value); + } else { + data.isCurrentNew = true; + } + this.addOption(data); + } + } + }, { + key: "setSelectedProp", + value: function setSelectedProp() { + var valuesMapping = {}; + this.selectedValues.forEach(function (d) { + valuesMapping[d] = true; + }); + this.options.forEach(function (d) { + if (valuesMapping[d.value] === true) { + // eslint-disable-next-line no-param-reassign + d.isSelected = true; + } + }); + } + }, { + key: "setNewOptionsFromValue", + value: function setNewOptionsFromValue(values) { + if (!values) { + return; + } + var setNewOption = this.setNewOption.bind(this); + var availableValuesMapping = {}; + this.options.forEach(function (d) { + availableValuesMapping[d.value] = true; + }); + values.forEach(function (d) { + if (d && availableValuesMapping[d] !== true) { + setNewOption(d); + } + }); + } + }, { + key: "setDropboxWrapperWidth", + value: function setDropboxWrapperWidth() { + if (this.showAsPopup) { + return; + } + var width = this.dropboxWidth || "".concat(this.$wrapper.offsetWidth, "px"); + DomUtils.setStyle(this.$dropboxContainer, 'max-width', width); + } + }, { + key: "setEleStyles", + value: function setEleStyles() { + var maxWidth = this.maxWidth; + var styles = {}; + if (maxWidth) { + styles['max-width'] = maxWidth; + } + DomUtils.setStyles(this.$ele, styles); + } + }, { + key: "setDropboxStyles", + value: function setDropboxStyles() { + var dropboxWidth = this.dropboxWidth; + var styles = {}; + var containerStyles = { + 'z-index': this.zIndex + }; + if (dropboxWidth) { + if (this.showAsPopup) { + styles['max-width'] = dropboxWidth; + } else { + containerStyles.width = dropboxWidth; + } + } + DomUtils.setStyles(this.$dropboxContainer, containerStyles); + DomUtils.setStyles(this.$dropbox, styles); + } + }, { + key: "setOptionAttr", + value: function setOptionAttr() { + var $visibleOptions = this.$visibleOptions; + var options = this.options; + var optionHeight = "".concat(this.optionHeight, "px"); + var setStyle = DomUtils.setStyle, + getData = DomUtils.getData, + setData = DomUtils.setData; + if ($visibleOptions && $visibleOptions.length) { + $visibleOptions.forEach(function ($option) { + var optionDetails = options[getData($option, 'index')]; + setStyle($option, 'height', optionHeight); + setData($option, 'value', optionDetails.value); + }); + } + } + }, { + key: "setValueTagAttr", + value: function setValueTagAttr() { + var $valueTags = this.$valueTags; + if (!$valueTags || !$valueTags.length) { + return; + } + var getData = DomUtils.getData, + setData = DomUtils.setData; + var options = this.options; + $valueTags.forEach(function ($valueTag) { + var index = getData($valueTag, 'index'); + if (typeof index !== 'undefined') { + var optionDetails = options[index]; + setData($valueTag, 'value', optionDetails.value); + } + }); + } + }, { + key: "setScrollTop", + value: function setScrollTop() { + var selectedValues = this.selectedValues; + if (this.showSelectedOptionsFirst || !this.focusSelectedOptionOnOpen || selectedValues.length === 0) { + return; + } + var valuesMapping = {}; + var selectedOptionIndex; + selectedValues.forEach(function (d) { + valuesMapping[d] = true; + }); + this.options.some(function (d) { + if (valuesMapping[d.value]) { + selectedOptionIndex = d.visibleIndex; + return true; + } + return false; + }); + if (selectedOptionIndex) { + this.$optionsContainer.scrollTop = this.optionHeight * selectedOptionIndex; + } + } + /** set methods - end */ + + /** get methods - start */ + }, { + key: "getVisibleOptions", + value: function getVisibleOptions() { + return this.visibleOptions || []; + } + }, { + key: "getValue", + value: function getValue() { + var value; + if (this.multiple) { + if (this.useGroupValue) { + value = this.getGroupValue(); + } else { + value = this.selectedValues; + } + } else { + value = this.selectedValues[0] || ''; + } + return value; + } + }, { + key: "getGroupValue", + value: function getGroupValue() { + var selectedValues = []; + var selectedGroups = {}; + this.options.forEach(function (d) { + if (!d.isSelected) { + return; + } + var value = d.value; + if (d.isGroupTitle) { + if (value) { + selectedGroups[d.index] = true; + selectedValues.push(value); + } + } else if (selectedGroups[d.groupIndex] !== true) { + selectedValues.push(value); + } + }); + return selectedValues; + } + }, { + key: "getInputValue", + value: function getInputValue(preparedValue) { + var value = preparedValue; + if (value && value.length) { + if (this.setValueAsArray && this.multiple) { + value = JSON.stringify(value); + } + } else { + value = this.emptyValue; + } + return value; + } + }, { + key: "getFirstVisibleOptionIndex", + value: function getFirstVisibleOptionIndex() { + return Math.ceil(this.$optionsContainer.scrollTop / this.optionHeight); + } + }, { + key: "getVisibleStartIndex", + value: function getVisibleStartIndex() { + var firstVisibleOptionIndex = this.getFirstVisibleOptionIndex(); + var startIndex = firstVisibleOptionIndex - this.halfOptionsCount; + if (startIndex < 0) { + startIndex = 0; + } + return startIndex; + } + }, { + key: "getTooltipAttrText", + value: function getTooltipAttrText(text) { + var ellipsisOnly = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; + var allowHtml = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false; + var data = { + 'data-tooltip': text || '', + 'data-tooltip-enter-delay': this.tooltipEnterDelay, + 'data-tooltip-z-index': this.zIndex, + 'data-tooltip-font-size': this.tooltipFontSize, + 'data-tooltip-alignment': this.tooltipAlignment, + 'data-tooltip-max-width': this.tooltipMaxWidth, + 'data-tooltip-ellipsis-only': ellipsisOnly, + 'data-tooltip-allow-html': allowHtml + }; + return DomUtils.getAttributesText(data); + } + + /** + * @param {any} data + * @returns {any} + */ + }, { + key: "getOptionObj", + value: function getOptionObj(data) { + if (!data) { + return undefined; + } + var getString = Utils.getString; + var secureText = this.secureText.bind(this); + return { + index: data.index, + value: secureText(getString(data.value)), + label: secureText(getString(data.label)), + description: secureText(getString(data.description)), + alias: this.getAlias(data.alias), + isCurrentNew: data.isCurrentNew || false, + isNew: data.isNew || false, + isVisible: true + }; + } + }, { + key: "getNewOption", + value: function getNewOption() { + var lastOption = this.options[this.lastOptionIndex]; + if (!lastOption || !lastOption.isCurrentNew) { + return undefined; + } + return lastOption; + } + }, { + key: "getOptionIndex", + value: function getOptionIndex(value) { + var index; + this.options.some(function (d) { + if (d.value === value) { + index = d.index; + return true; + } + return false; + }); + return index; + } + }, { + key: "getNewValue", + value: function getNewValue() { + var valuesMapping = {}; + this.newValues.forEach(function (d) { + valuesMapping[d] = true; + }); + var result = this.selectedValues.filter(function (d) { + return valuesMapping[d] === true; + }); + return this.multiple ? result : result[0]; + } + }, { + key: "getAlias", + value: function getAlias(alias) { + var result = alias; + if (result) { + if (Array.isArray(result)) { + result = result.join(','); + } else { + result = result.toString().trim(); + } + result = result.toLowerCase(); + } + return result || ''; + } + }, { + key: "getDisplayValue", + value: function getDisplayValue() { + var displayValues = []; + this.options.forEach(function (d) { + if (d.isSelected) { + displayValues.push(d.label); + } + }); + return this.multiple ? displayValues : displayValues[0] || ''; + } + }, { + key: "getSelectedOptions", + value: function getSelectedOptions() { + var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, + _ref3$fullDetails = _ref3.fullDetails, + fullDetails = _ref3$fullDetails === void 0 ? false : _ref3$fullDetails, + _ref3$keepSelectionOr = _ref3.keepSelectionOrder, + keepSelectionOrder = _ref3$keepSelectionOr === void 0 ? false : _ref3$keepSelectionOr; + var valueKey = this.valueKey, + labelKey = this.labelKey, + selectedValues = this.selectedValues; + var selectedOptions = []; + this.options.forEach(function (d) { + if (d.isSelected && !d.isGroupTitle) { + if (fullDetails) { + selectedOptions.push(d); + } else { + var _data; + var data = (_data = {}, _defineProperty(_data, valueKey, d.value), _defineProperty(_data, labelKey, d.label), _data); + if (d.isNew) { + data.isNew = true; + } + if (d.customData) { + data.customData = d.customData; + } + selectedOptions.push(data); + } + } + }); + if (keepSelectionOrder) { + var valuesOrder = {}; + selectedValues.forEach(function (d, i) { + valuesOrder[d] = i; + }); + selectedOptions.sort(function (a, b) { + return valuesOrder[a.value] - valuesOrder[b.value]; + }); + } + return this.multiple || fullDetails ? selectedOptions : selectedOptions[0]; + } + }, { + key: "getDisabledOptions", + value: function getDisabledOptions() { + var valueKey = this.valueKey, + labelKey = this.labelKey, + disabledOptions = this.disabledOptions; + var disabledOptionsValueMapping = {}; + var result = []; + disabledOptions.forEach(function (value) { + disabledOptionsValueMapping[value] = true; + }); + this.options.forEach(function (_ref4) { + var value = _ref4.value, + label = _ref4.label; + if (disabledOptionsValueMapping[value]) { + var _result$push; + result.push((_result$push = {}, _defineProperty(_result$push, valueKey, value), _defineProperty(_result$push, labelKey, label), _result$push)); + } + }); + return result; + } + }, { + key: "getVisibleOptionGroupsMapping", + value: function getVisibleOptionGroupsMapping(searchValue) { + var options = this.options; + var result = {}; + var isOptionVisible = this.isOptionVisible.bind(this); + options = this.structureOptionGroup(options); + options.forEach(function (d) { + result[d.index] = d.options.some(function (e) { + return isOptionVisible({ + data: e, + searchValue: searchValue + }).isVisible; + }); + }); + return result; + } + }, { + key: "getOptionsCount", + value: function getOptionsCount(count) { + var result; + if (this.showAsPopup) { + var availableHeight = window.innerHeight * 80 / 100 - dropboxCloseButtonFullHeight; + if (this.hasSearchContainer) { + availableHeight -= searchHeight; + } + result = Math.floor(availableHeight / this.optionHeight); + } else { + result = parseInt(count); + } + return result; + } + }, { + key: "getOptionsHeight", + value: function getOptionsHeight() { + return "".concat(this.optionsCount * this.optionHeight, "px"); + } + + /** getting next/prev valid option element */ + }, { + key: "getSibling", + value: function getSibling($ele, direction) { + var propName = direction === 'next' ? 'nextElementSibling' : 'previousElementSibling'; + var $sibling = $ele; + do { + if ($sibling) { + $sibling = $sibling[propName]; + } + } while (DomUtils.hasClass($sibling, 'disabled') || DomUtils.hasClass($sibling, 'group-title')); + return $sibling; + } + }, { + key: "getUniqueId", + value: function getUniqueId() { + var uniqueId = Utils.getRandomInt(10000); + var isAlreadyUsed = document.querySelector("#vscomp-ele-wrapper-".concat(uniqueId)); + if (isAlreadyUsed) { + return this.getUniqueId(); + } + return uniqueId; + } + /** get methods - end */ + }, { + key: "initDropboxPopover", + value: function initDropboxPopover() { + var data = { + ele: this.$ele, + target: this.$dropboxContainer, + position: this.position, + zIndex: this.zIndex, + margin: 4, + transitionDistance: 30, + hideArrowIcon: true, + disableManualAction: true, + disableUpdatePosition: !this.hasDropboxWrapper, + updatePositionThrottle: this.updatePositionThrottle, + afterShow: this.afterShowPopper.bind(this), + afterHide: this.afterHidePopper.bind(this) + }; + this.dropboxPopover = new PopoverComponent(data); + } + }, { + key: "openDropbox", + value: function openDropbox(isSilent) { + this.isSilentOpen = isSilent; + if (isSilent) { + DomUtils.setStyle(this.$dropboxContainer, 'display', 'inline-flex'); + } else { + DomUtils.dispatchEvent(this.$ele, 'beforeOpen'); + DomUtils.setAria(this.$wrapper, 'expanded', true); + } + this.setDropboxWrapperWidth(); + DomUtils.removeClass(this.$allWrappers, 'closed'); + if (this.dropboxPopover && !isSilent) { + this.dropboxPopover.show(); + } else { + this.afterShowPopper(); + } + } + }, { + key: "afterShowPopper", + value: function afterShowPopper() { + var isSilent = this.isSilentOpen; + this.isSilentOpen = false; + if (!isSilent) { + this.moveSelectedOptionsFirst(); + this.setScrollTop(); + DomUtils.addClass(this.$allWrappers, 'focused'); + if (this.showAsPopup) { + DomUtils.addClass(this.$body, 'vscomp-popup-active'); + this.isPopupActive = true; + } else { + this.focusSearchInput(); + } + DomUtils.dispatchEvent(this.$ele, 'afterOpen'); + } + } + }, { + key: "closeDropbox", + value: function closeDropbox(isSilent) { + this.isSilentClose = isSilent; + if (this.keepAlwaysOpen) { + this.removeOptionFocus(); + return; + } + if (isSilent) { + DomUtils.setStyle(this.$dropboxContainer, 'display', ''); + } else { + DomUtils.dispatchEvent(this.$ele, 'beforeClose'); + DomUtils.setAria(this.$wrapper, 'expanded', false); + DomUtils.setAria(this.$wrapper, 'activedescendant', ''); + } + if (this.dropboxPopover && !isSilent) { + this.dropboxPopover.hide(); + } else { + this.afterHidePopper(); + } + } + }, { + key: "afterHidePopper", + value: function afterHidePopper() { + var isSilent = this.isSilentClose; + this.isSilentClose = false; + DomUtils.removeClass(this.$allWrappers, 'focused'); + this.removeOptionFocus(); + if (!isSilent && this.isPopupActive) { + DomUtils.removeClass(this.$body, 'vscomp-popup-active'); + this.isPopupActive = false; + } + DomUtils.addClass(this.$allWrappers, 'closed'); + if (!isSilent) { + DomUtils.dispatchEvent(this.$ele, 'afterClose'); + } + } + }, { + key: "moveSelectedOptionsFirst", + value: function moveSelectedOptionsFirst() { + if (!this.showSelectedOptionsFirst) { + return; + } + this.setSortedOptions(); + if (!this.$optionsContainer.scrollTop || !this.selectedValues.length) { + this.setVisibleOptions(); + } else { + this.scrollToTop(); + } + } + }, { + key: "toggleDropbox", + value: function toggleDropbox() { + if (this.isOpened()) { + this.closeDropbox(); + } else { + this.openDropbox(); + } + } + }, { + key: "updatePosition", + value: function updatePosition() { + if (!this.dropboxPopover || !this.isOpened()) { + return; + } + this.$ele.updatePosition(); + } + }, { + key: "isOpened", + value: function isOpened() { + return !DomUtils.hasClass(this.$wrapper, 'closed'); + } + }, { + key: "focusSearchInput", + value: function focusSearchInput() { + var $ele = this.$searchInput; + if ($ele) { + $ele.focus(); + } + } + }, { + key: "focusOption", + value: function focusOption() { + var _ref5 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}, + direction = _ref5.direction, + $option = _ref5.$option, + focusFirst = _ref5.focusFirst; + var $focusedEle = this.$dropboxContainer.querySelector('.vscomp-option.focused'); + var $newFocusedEle; + if ($option) { + $newFocusedEle = $option; + } else if (!$focusedEle || focusFirst) { + /* if no element on focus choose first visible one */ + var firstVisibleOptionIndex = this.getFirstVisibleOptionIndex(); + $newFocusedEle = this.$dropboxContainer.querySelector(".vscomp-option[data-visible-index=\"".concat(firstVisibleOptionIndex, "\"]")); + if (DomUtils.hasClass($newFocusedEle, 'disabled') || DomUtils.hasClass($newFocusedEle, 'group-title')) { + $newFocusedEle = this.getSibling($newFocusedEle, 'next'); + } + } else { + $newFocusedEle = this.getSibling($focusedEle, direction); + } + if ($newFocusedEle && $newFocusedEle !== $focusedEle) { + if ($focusedEle) { + this.toggleOptionFocusedState($focusedEle, false); + } + this.toggleOptionFocusedState($newFocusedEle, true); + this.toggleFocusedProp(DomUtils.getData($newFocusedEle, 'index'), true); + this.moveFocusedOptionToView($newFocusedEle); + } + } + }, { + key: "moveFocusedOptionToView", + value: function moveFocusedOptionToView($ele) { + var $focusedEle = $ele || this.$dropboxContainer.querySelector('.vscomp-option.focused'); + if (!$focusedEle) { + return; + } + var newScrollTop; + var containerRect = this.$optionsContainer.getBoundingClientRect(); + var optionRect = $focusedEle.getBoundingClientRect(); + var containerTop = containerRect.top; + var containerBottom = containerRect.bottom; + var containerHeight = containerRect.height; + var optionTop = optionRect.top; + var optionBottom = optionRect.bottom; + var optionHeight = optionRect.height; + var optionOffsetTop = $focusedEle.offsetTop; + var optionsTop = DomUtils.getData(this.$options, 'top', 'number'); + + /* if option hidden on top */ + if (containerTop > optionTop) { + newScrollTop = optionOffsetTop + optionsTop; + } else if (containerBottom < optionBottom) { + /* if option hidden on bottom */ + newScrollTop = optionOffsetTop - containerHeight + optionHeight + optionsTop; + } + if (newScrollTop !== undefined) { + this.$optionsContainer.scrollTop = newScrollTop; + } + } + }, { + key: "removeOptionFocus", + value: function removeOptionFocus() { + var $focusedEle = this.$dropboxContainer.querySelector('.vscomp-option.focused'); + if (!$focusedEle) { + return; + } + this.toggleOptionFocusedState($focusedEle, false); + this.toggleFocusedProp(null); + } + }, { + key: "selectOption", + value: function selectOption($ele) { + var _ref6 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}, + event = _ref6.event; + if (!$ele) { + return; + } + var isAdding = !DomUtils.hasClass($ele, 'selected'); + if (isAdding) { + if (this.multiple && this.isMaxValuesSelected) { + return; + } + } else if (!this.multiple) { + /** on selecting same value in single select */ + this.closeDropbox(); + return; + } + var selectedValues = this.selectedValues; + var selectedValue = DomUtils.getData($ele, 'value'); + var selectedIndex = DomUtils.getData($ele, 'index', 'number'); + var isNewOption = DomUtils.hasClass($ele, 'current-new'); + var shouldSelectRange = false; + var lastSelectedOptionIndex = this.lastSelectedOptionIndex; + this.lastSelectedOptionIndex = null; + this.toggleSelectedProp(selectedIndex, isAdding); + if (isAdding) { + if (this.multiple) { + selectedValues.push(selectedValue); + this.toggleAllOptionsClass(); + this.toggleGroupOptionsParent($ele); + if (event && event.shiftKey) { + shouldSelectRange = true; + } + } else { + if (selectedValues.length) { + this.toggleSelectedProp(this.getOptionIndex(selectedValues[0]), false); + } + selectedValues = [selectedValue]; + var $prevSelectedOption = this.$dropboxContainer.querySelector('.vscomp-option.selected'); + if ($prevSelectedOption) { + this.toggleOptionSelectedState($prevSelectedOption, false); + } + this.closeDropbox(); + if (!isNewOption) { + this.setSearchValue(''); + } + } + this.lastSelectedOptionIndex = selectedIndex; + this.toggleOptionSelectedState($ele); + } else if (this.multiple) { + this.toggleOptionSelectedState($ele); + Utils.removeItemFromArray(selectedValues, selectedValue); + this.toggleAllOptionsClass(false); + this.toggleGroupOptionsParent($ele, false); + } + if (isNewOption) { + this.beforeSelectNewValue(); + } + this.setValue(selectedValues); + if (shouldSelectRange) { + this.selectRangeOptions(lastSelectedOptionIndex, selectedIndex); + } + } + }, { + key: "selectFocusedOption", + value: function selectFocusedOption() { + this.selectOption(this.$dropboxContainer.querySelector('.vscomp-option.focused')); + } + }, { + key: "selectRangeOptions", + value: function selectRangeOptions(lastSelectedOptionIndex, selectedIndex) { + var _this8 = this; + if (typeof lastSelectedOptionIndex !== 'number' || this.maxValues) { + return; + } + var selectedValues = this.selectedValues, + hasOptionGroup = this.hasOptionGroup; + var groupIndexes = {}; + var startIndex; + var endIndex; + if (lastSelectedOptionIndex < selectedIndex) { + startIndex = lastSelectedOptionIndex; + endIndex = selectedIndex; + } else { + startIndex = selectedIndex; + endIndex = lastSelectedOptionIndex; + } + this.options.forEach(function (d) { + if (d.isDisabled || d.isGroupTitle || !d.isVisible || d.isSelected) { + return; + } + var index = d.index; + if (index > startIndex && index < endIndex) { + if (hasOptionGroup) { + var groupIndex = d.groupIndex; + if (typeof groupIndex === 'number') { + groupIndexes[groupIndex] = true; + } + } + + // eslint-disable-next-line no-param-reassign + d.isSelected = true; + selectedValues.push(d.value); + } + }); + this.toggleAllOptionsClass(); + this.setValue(selectedValues); + groupIndexes = Object.keys(groupIndexes); + if (groupIndexes.length) { + var toggleGroupTitleProp = this.toggleGroupTitleProp.bind(this); + groupIndexes.forEach(function (i) { + toggleGroupTitleProp(parseInt(i)); + }); + } + + /** using setTimeout to fix the issue of dropbox getting closed on select */ + setTimeout(function () { + _this8.renderOptions(); + }, 0); + } + }, { + key: "toggleAllOptions", + value: function toggleAllOptions(selectAll) { + if (!this.multiple || this.disableSelectAll) { + return; + } + var selectingAll = typeof isSelected === 'boolean' ? selectAll : !DomUtils.hasClass(this.$toggleAllCheckbox, 'checked'); + var selectedValues = []; + var selectAllOnlyVisible = this.selectAllOnlyVisible; + this.options.forEach(function (d) { + var option = d; + if (option.isDisabled || option.isCurrentNew) { + return; + } + var isVisible = option.isVisible, + isSelected = option.isSelected; + + /** unselected items are */ + if ( /** when unselecting all, selectAllOnlyVisible feature disabled or visible items or already unselected items */ + !selectingAll && (!selectAllOnlyVisible || isVisible || !isSelected) || /** when selecting all, selectAllOnlyVisible feature enabled and hidden items those are not already selected */ + selectingAll && selectAllOnlyVisible && !isVisible && !isSelected) { + option.isSelected = false; + } else { + option.isSelected = true; + if (!option.isGroupTitle) { + selectedValues.push(option.value); + } + } + }); + this.toggleAllOptionsClass(selectingAll); + this.setValue(selectedValues); + this.renderOptions(); + } + }, { + key: "toggleAllOptionsClass", + value: function toggleAllOptionsClass(isAllSelected) { + if (!this.multiple) { + return; + } + var valuePassed = typeof isAllSelected === 'boolean'; + var isAllVisibleSelected = false; + if (!valuePassed) { + // eslint-disable-next-line no-param-reassign + isAllSelected = this.isAllOptionsSelected(); + } + + /** when all options not selected, checking if all visible options selected */ + if (!isAllSelected && this.selectAllOnlyVisible) { + isAllVisibleSelected = this.isAllOptionsSelected(true); + } + DomUtils.toggleClass(this.$toggleAllCheckbox, 'checked', isAllSelected || isAllVisibleSelected); + this.isAllSelected = isAllSelected; + } + }, { + key: "isAllOptionsSelected", + value: function isAllOptionsSelected(visibleOnly) { + var isAllSelected = false; + if (this.options.length && this.selectedValues.length) { + isAllSelected = !this.options.some( + /** + * stop looping if any option is not selected + * for selectAllOnlyVisible case hidden option need not to be selected + */ + function (d) { + return !d.isSelected && !d.isDisabled && !d.isGroupTitle && (!visibleOnly || d.isVisible); + }); + } + return isAllSelected; + } + }, { + key: "isAllGroupOptionsSelected", + value: function isAllGroupOptionsSelected(groupIndex) { + var isAllSelected = false; + if (this.options.length) { + isAllSelected = !this.options.some(function (d) { + return !d.isSelected && !d.isDisabled && !d.isGroupTitle && d.groupIndex === groupIndex; + }); + } + return isAllSelected; + } + }, { + key: "toggleGroupOptionsParent", + value: function toggleGroupOptionsParent($option, isSelected) { + if (!this.hasOptionGroup || this.disableOptionGroupCheckbox || !$option) { + return; + } + var groupIndex = DomUtils.getData($option, 'groupIndex'); + if (groupIndex !== undefined) { + groupIndex = parseInt(groupIndex); + } + var $group = this.$options.querySelector(".vscomp-option[data-index=\"".concat(groupIndex, "\"]")); + var isAllSelected = typeof isSelected === 'boolean' ? isSelected : this.isAllGroupOptionsSelected(groupIndex); + this.toggleGroupTitleCheckbox($group, isAllSelected); + this.toggleGroupTitleProp(groupIndex, isAllSelected); + } + }, { + key: "toggleGroupTitleProp", + value: function toggleGroupTitleProp(groupIndex, isSelected) { + var isAllSelected = typeof isSelected === 'boolean' ? isSelected : this.isAllGroupOptionsSelected(groupIndex); + this.toggleSelectedProp(groupIndex, isAllSelected); + } + }, { + key: "toggleGroupOptions", + value: function toggleGroupOptions($ele, isSelected) { + var _this9 = this; + if (!this.hasOptionGroup || this.disableOptionGroupCheckbox || !$ele) { + return; + } + var groupIndex = DomUtils.getData($ele, 'index', 'number'); + var selectedValues = this.selectedValues, + selectAllOnlyVisible = this.selectAllOnlyVisible; + var valuesMapping = {}; + var removeItemFromArray = Utils.removeItemFromArray; + selectedValues.forEach(function (d) { + valuesMapping[d] = true; + }); + this.options.forEach(function (d) { + if (d.isDisabled || d.groupIndex !== groupIndex) { + return; + } + var value = d.value; + if (!isSelected || selectAllOnlyVisible && !d.isVisible) { + // eslint-disable-next-line no-param-reassign + d.isSelected = false; + if (valuesMapping[value]) { + removeItemFromArray(selectedValues, value); + } + } else { + // eslint-disable-next-line no-param-reassign + d.isSelected = true; + if (!valuesMapping[value]) { + selectedValues.push(value); + } + } + }); + this.toggleAllOptionsClass(isSelected ? null : false); + this.setValue(selectedValues); + + /** using setTimeout to fix the issue of dropbox getting closed on select */ + setTimeout(function () { + _this9.renderOptions(); + }, 0); + } + }, { + key: "toggleGroupTitleCheckbox", + value: function toggleGroupTitleCheckbox($ele, isSelected) { + if (!$ele) { + return; + } + var selectedIndex = DomUtils.getData($ele, 'index', 'number'); + this.toggleSelectedProp(selectedIndex, isSelected); + this.toggleOptionSelectedState($ele, isSelected); + } + }, { + key: "toggleFocusedProp", + value: function toggleFocusedProp(index) { + var isFocused = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; + if (this.focusedOptionIndex) { + this.setOptionProp(this.focusedOptionIndex, 'isFocused', false); + } + this.setOptionProp(index, 'isFocused', isFocused); + this.focusedOptionIndex = index; + } + }, { + key: "toggleSelectedProp", + value: function toggleSelectedProp(index) { + var isSelected = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; + this.setOptionProp(index, 'isSelected', isSelected); + } + }, { + key: "scrollToTop", + value: function scrollToTop() { + var isClosed = !this.isOpened(); + if (isClosed) { + this.openDropbox(true); + } + var scrollTop = this.$optionsContainer.scrollTop; + if (scrollTop > 0) { + this.$optionsContainer.scrollTop = 0; + } + if (isClosed) { + this.closeDropbox(true); + } + } + }, { + key: "reset", + value: function reset() { + var formReset = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false; + this.options.forEach(function (d) { + // eslint-disable-next-line no-param-reassign + d.isSelected = false; + }); + this.beforeValueSet(true); + this.setValue(null, { + disableValidation: formReset + }); + this.afterValueSet(); + if (formReset) { + DomUtils.removeClass(this.$allWrappers, 'has-error'); + } + DomUtils.dispatchEvent(this.$ele, 'reset'); + } + }, { + key: "addOption", + value: function addOption(data, rerender) { + if (!data) { + return; + } + this.lastOptionIndex += 1; + var newOption = this.getOptionObj(_objectSpread(_objectSpread({}, data), {}, { + index: this.lastOptionIndex + })); + this.options.push(newOption); + this.sortedOptions.push(newOption); + if (rerender) { + this.visibleOptionsCount += 1; + this.afterSetOptions(); + } + } + }, { + key: "removeOption", + value: function removeOption(index) { + if (!index && index !== 0) { + return; + } + this.options.splice(index, 1); + this.lastOptionIndex -= 1; + } + }, { + key: "removeNewOption", + value: function removeNewOption() { + var newOption = this.getNewOption(); + if (newOption) { + this.removeOption(newOption.index); + } + } + }, { + key: "sortOptions", + value: function sortOptions(options) { + return options.sort(function (a, b) { + var aIsSelected = a.isSelected || a.isAnySelected; + var bIsSelected = b.isSelected || b.isAnySelected; + if (!aIsSelected && !bIsSelected) { + return 0; + } + if (aIsSelected && (!bIsSelected || a.index < b.index)) { + return -1; + } + return 1; + }); + } + }, { + key: "sortOptionsGroup", + value: function sortOptionsGroup(options) { + var sortOptions = this.sortOptions.bind(this); + var structuredOptions = this.structureOptionGroup(options); + structuredOptions.forEach(function (d) { + var childOptions = d.options; + // eslint-disable-next-line no-param-reassign + d.isAnySelected = childOptions.some(function (e) { + return e.isSelected; + }); + if (d.isAnySelected) { + sortOptions(childOptions); + } + }); + sortOptions(structuredOptions); + return this.destructureOptionGroup(structuredOptions); + } + }, { + key: "isOptionVisible", + value: function isOptionVisible(_ref7) { + var data = _ref7.data, + searchValue = _ref7.searchValue, + hasExactOption = _ref7.hasExactOption, + visibleOptionGroupsMapping = _ref7.visibleOptionGroupsMapping, + searchGroup = _ref7.searchGroup, + searchByStartsWith = _ref7.searchByStartsWith; + var value = data.value.toLowerCase(); + var label = data.label.toLowerCase(); + var description = data.description, + alias = data.alias; + var isVisible = searchByStartsWith ? label.startsWith(searchValue) : label.indexOf(searchValue) !== -1; + if (data.isGroupTitle && (!searchGroup || !isVisible)) { + isVisible = visibleOptionGroupsMapping[data.index]; + } + if (!searchByStartsWith && alias && !isVisible) { + isVisible = alias.indexOf(searchValue) !== -1; + } + if (!searchByStartsWith && description && !isVisible) { + isVisible = description.toLowerCase().indexOf(searchValue) !== -1; + } + + // eslint-disable-next-line no-param-reassign + data.isVisible = isVisible; + if (!hasExactOption) { + // eslint-disable-next-line no-param-reassign + hasExactOption = label === searchValue || value === searchValue; + } + return { + isVisible: isVisible, + hasExactOption: hasExactOption + }; + } + }, { + key: "structureOptionGroup", + value: function structureOptionGroup(options) { + var result = []; + var childOptions = {}; + + /** getting all group title */ + options.forEach(function (d) { + if (d.isGroupTitle) { + var childArray = []; + // eslint-disable-next-line no-param-reassign + d.options = childArray; + childOptions[d.index] = childArray; + result.push(d); + } + }); + + /** getting all group options */ + options.forEach(function (d) { + if (d.isGroupOption) { + childOptions[d.groupIndex].push(d); + } + }); + return result; + } + }, { + key: "destructureOptionGroup", + value: function destructureOptionGroup(options) { + var result = []; + options.forEach(function (d) { + result.push(d); + result = result.concat(d.options); + }); + return result; + } + }, { + key: "serverSearch", + value: function serverSearch() { + DomUtils.removeClass(this.$allWrappers, 'has-no-search-results'); + DomUtils.addClass(this.$allWrappers, 'server-searching'); + this.setSelectedOptions(); + this.onServerSearch(this.searchValue, this); + } + }, { + key: "removeValue", + value: function removeValue($ele) { + var selectedValues = this.selectedValues; + var selectedValue = DomUtils.getData($ele, 'value'); + Utils.removeItemFromArray(selectedValues, selectedValue); + this.setValueMethod(selectedValues); + } + }, { + key: "focus", + value: function focus() { + this.$wrapper.focus(); + } + }, { + key: "enable", + value: function enable() { + this.$ele.disabled = false; + this.$ele.removeAttribute('disabled'); + this.$hiddenInput.removeAttribute('disabled'); + DomUtils.setAria(this.$wrapper, 'disabled', false); + } + }, { + key: "disable", + value: function disable() { + this.$ele.disabled = true; + this.$ele.setAttribute('disabled', ''); + this.$hiddenInput.setAttribute('disabled', ''); + DomUtils.setAria(this.$wrapper, 'disabled', true); + } + }, { + key: "validate", + value: function validate() { + if (this.disableValidation) { + return true; + } + var hasError = false; + var selectedValues = this.selectedValues, + minValues = this.minValues; + if (this.required && (Utils.isEmpty(selectedValues) || /** required minium options not selected */ + this.multiple && minValues && selectedValues.length < minValues)) { + hasError = true; + } + DomUtils.toggleClass(this.$allWrappers, 'has-error', hasError); + return !hasError; + } + }, { + key: "destroy", + value: function destroy() { + var $ele = this.$ele; + $ele.virtualSelect = undefined; + $ele.value = undefined; + $ele.innerHTML = ''; + if (this.hasDropboxWrapper) { + this.$dropboxWrapper.remove(); + this.mutationObserver.disconnect(); + } + if (this.dropboxPopover) { + this.dropboxPopover.destroy(); + } + DomUtils.removeClass($ele, 'vscomp-ele'); + } + }, { + key: "createSecureTextElements", + value: function createSecureTextElements() { + this.$secureDiv = document.createElement('div'); + this.$secureText = document.createTextNode(''); + this.$secureDiv.appendChild(this.$secureText); + } + }, { + key: "secureText", + value: function secureText(text) { + if (!text || !this.enableSecureText) { + return text; + } + this.$secureText.nodeValue = text; + return this.$secureDiv.innerHTML; + } + }, { + key: "toggleRequired", + value: function toggleRequired(isRequired) { + this.required = Utils.convertToBoolean(isRequired); + this.$ele.required = this.required; + } + }, { + key: "toggleOptionSelectedState", + value: function toggleOptionSelectedState($ele, value) { + var isSelected = value; + if (typeof isSelected === 'undefined') { + isSelected = !DomUtils.hasClass($ele, 'selected'); + } + DomUtils.toggleClass($ele, 'selected', isSelected); + DomUtils.setAria($ele, 'selected', isSelected); + } + }, { + key: "toggleOptionFocusedState", + value: function toggleOptionFocusedState($ele, isFocused) { + if (!$ele) { + return; + } + DomUtils.toggleClass($ele, 'focused', isFocused); + if (isFocused) { + DomUtils.setAria(this.$wrapper, 'activedescendant', $ele.id); + } + } + + /** static methods - start */ + }], [{ + key: "init", + value: function init(options) { + var $eleArray = options.ele; + if (!$eleArray) { + return undefined; + } + var singleEle = false; + if (typeof $eleArray === 'string') { + $eleArray = document.querySelectorAll($eleArray); + var eleLength = $eleArray.length; + if (eleLength === 0) { + return undefined; + } + if (eleLength === 1) { + singleEle = true; + } + } + if ($eleArray.length === undefined || $eleArray.forEach === undefined) { + $eleArray = [$eleArray]; + singleEle = true; + } + var instances = []; + $eleArray.forEach(function ($ele) { + /** skipping initialization on calling init method multiple times */ + if ($ele.virtualSelect) { + instances.push($ele.virtualSelect); + return; + } + + // eslint-disable-next-line no-param-reassign + options.ele = $ele; + if ($ele.tagName === 'SELECT') { + VirtualSelect.setPropsFromSelect(options); + } + instances.push(new VirtualSelect(options)); + }); + return singleEle ? instances[0] : instances; + } + }, { + key: "getAttrProps", + value: function getAttrProps() { + var convertPropToDataAttr = DomUtils.convertPropToDataAttr; + var result = {}; + nativeProps.forEach(function (d) { + result[d] = d; + }); + dataProps.forEach(function (d) { + result[convertPropToDataAttr(d)] = d; + }); + return result; + } + }, { + key: "setPropsFromSelect", + value: function setPropsFromSelect(props) { + var $ele = props.ele; + var disabledOptions = []; + var selectedValue = []; + var getNativeOptions = function getNativeOptions($container) { + var options = []; + var $options = Array.from($container.children); + $options.forEach(function ($option) { + var value = $option.value; + var option = { + value: value + }; + if ($option.tagName === 'OPTGROUP') { + option.label = $option.getAttribute('label'); + option.options = getNativeOptions($option); + } else { + option.label = $option.innerHTML; + } + options.push(option); + if ($option.disabled) { + disabledOptions.push(value); + } + if ($option.selected) { + selectedValue.push(value); + } + }); + return options; + }; + var optionsList = getNativeOptions($ele); + + /** creating div element to initiate plugin and removing native element */ + var $newEle = document.createElement('div'); + DomUtils.setAttrFromEle($ele, $newEle, Object.keys(attrPropsMapping), valueLessProps); + $ele.parentNode.insertBefore($newEle, $ele); + $ele.remove(); + + // eslint-disable-next-line no-param-reassign + props.ele = $newEle; + // eslint-disable-next-line no-param-reassign + props.options = optionsList; + // eslint-disable-next-line no-param-reassign + props.disabledOptions = disabledOptions; + // eslint-disable-next-line no-param-reassign + props.selectedValue = selectedValue; + } + }, { + key: "onFormReset", + value: function onFormReset(e) { + var $form = e.target.closest('form'); + if (!$form) { + return; + } + $form.querySelectorAll('.vscomp-ele-wrapper').forEach(function ($ele) { + $ele.parentElement.virtualSelect.reset(true); + }); + } + }, { + key: "onFormSubmit", + value: function onFormSubmit(e) { + if (!VirtualSelect.validate(e.target.closest('form'))) { + e.preventDefault(); + } + } + }, { + key: "validate", + value: function validate($container) { + if (!$container) { + return true; + } + var hasError = false; + $container.querySelectorAll('.vscomp-ele-wrapper').forEach(function ($ele) { + var result = $ele.parentElement.virtualSelect.validate(); + if (!hasError && !result) { + hasError = true; + } + }); + return !hasError; + } + }, { + key: "reset", + value: function reset() { + this.virtualSelect.reset(); + } + }, { + key: "setValueMethod", + value: function setValueMethod() { + var _this$virtualSelect; + (_this$virtualSelect = this.virtualSelect).setValueMethod.apply(_this$virtualSelect, arguments); + } + }, { + key: "setOptionsMethod", + value: function setOptionsMethod() { + var _this$virtualSelect2; + (_this$virtualSelect2 = this.virtualSelect).setOptionsMethod.apply(_this$virtualSelect2, arguments); + } + }, { + key: "setDisabledOptionsMethod", + value: function setDisabledOptionsMethod() { + var _this$virtualSelect3; + (_this$virtualSelect3 = this.virtualSelect).setDisabledOptionsMethod.apply(_this$virtualSelect3, arguments); + } + }, { + key: "setEnabledOptionsMethod", + value: function setEnabledOptionsMethod() { + var _this$virtualSelect4; + (_this$virtualSelect4 = this.virtualSelect).setEnabledOptionsMethod.apply(_this$virtualSelect4, arguments); + } + }, { + key: "toggleSelectAll", + value: function toggleSelectAll(isSelected) { + this.virtualSelect.toggleAllOptions(isSelected); + } + }, { + key: "isAllSelected", + value: function isAllSelected() { + return this.virtualSelect.isAllSelected; + } + }, { + key: "addOptionMethod", + value: function addOptionMethod(data) { + this.virtualSelect.addOption(data, true); + } + }, { + key: "getNewValueMethod", + value: function getNewValueMethod() { + return this.virtualSelect.getNewValue(); + } + }, { + key: "getDisplayValueMethod", + value: function getDisplayValueMethod() { + return this.virtualSelect.getDisplayValue(); + } + }, { + key: "getSelectedOptionsMethod", + value: function getSelectedOptionsMethod(params) { + return this.virtualSelect.getSelectedOptions(params); + } + }, { + key: "getDisabledOptionsMethod", + value: function getDisabledOptionsMethod() { + return this.virtualSelect.getDisabledOptions(); + } + }, { + key: "openMethod", + value: function openMethod() { + return this.virtualSelect.openDropbox(); + } + }, { + key: "closeMethod", + value: function closeMethod() { + return this.virtualSelect.closeDropbox(); + } + }, { + key: "focusMethod", + value: function focusMethod() { + return this.virtualSelect.focus(); + } + }, { + key: "enableMethod", + value: function enableMethod() { + return this.virtualSelect.enable(); + } + }, { + key: "disableMethod", + value: function disableMethod() { + return this.virtualSelect.disable(); + } + }, { + key: "destroyMethod", + value: function destroyMethod() { + return this.virtualSelect.destroy(); + } + }, { + key: "validateMethod", + value: function validateMethod() { + return this.virtualSelect.validate(); + } + }, { + key: "toggleRequiredMethod", + value: function toggleRequiredMethod(isRequired) { + return this.virtualSelect.toggleRequired(isRequired); + } + }, { + key: "onResizeMethod", + value: function onResizeMethod() { + document.querySelectorAll('.vscomp-ele-wrapper').forEach(function ($ele) { + $ele.parentElement.virtualSelect.onResize(); + }); + } + /** static methods - end */ + }]); + return VirtualSelect; +}(); +document.addEventListener('reset', VirtualSelect.onFormReset); +document.addEventListener('submit', VirtualSelect.onFormSubmit); +window.addEventListener('resize', VirtualSelect.onResizeMethod); +attrPropsMapping = VirtualSelect.getAttrProps(); +window.VirtualSelect = VirtualSelect; + +/** polyfill to fix an issue in ie browser */ +if (typeof NodeList !== 'undefined' && NodeList.prototype && !NodeList.prototype.forEach) { + NodeList.prototype.forEach = Array.prototype.forEach; +} +}(); +// This entry need to be wrapped in an IIFE because it need to be isolated against other entry modules. +!function() { +/*! + * Popover v1.0.12 + * https://sa-si-dev.github.io/popover + * Licensed under MIT (https://github.com/sa-si-dev/popover/blob/master/LICENSE) + */!function(){"use strict";function e(e){return function(e){if(Array.isArray(e))return t(e)}(e)||function(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}(e)||function(e,o){if(e){if("string"==typeof e)return t(e,o);var i=Object.prototype.toString.call(e).slice(8,-1);return"Object"===i&&e.constructor&&(i=e.constructor.name),"Map"===i||"Set"===i?Array.from(e):"Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i)?t(e,o):void 0}}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function t(e,t){(null==t||t>e.length)&&(t=e.length);for(var o=0,i=new Array(t);oo-n-t.width?"left":"right",vertical:r>i-r-t.height?"top":"bottom"}}},{key:"getAbsoluteCoords",value:function(e){if(e){var t=e.getBoundingClientRect(),o=window.pageXOffset,i=window.pageYOffset;return{width:t.width,height:t.height,top:t.top+i,right:t.right+o,bottom:t.bottom+i,left:t.left+o}}}},{key:"getCoords",value:function(e){return e?e.getBoundingClientRect():{}}},{key:"getData",value:function(e,t,o){if(e){var i=e?e.dataset[t]:"";return"number"===o?i=parseFloat(i)||0:"true"===i?i=!0:"false"===i&&(i=!1),i}}},{key:"setData",value:function(e,t,o){e&&(e.dataset[t]=o)}},{key:"setStyle",value:function(e,t,o){e&&(e.style[t]=o)}},{key:"show",value:function(e){var o=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"block";t.setStyle(e,"display",o)}},{key:"hide",value:function(e){t.setStyle(e,"display","none")}},{key:"getHideableParent",value:function(e){for(var t,o=e.parentElement;o;){var i=getComputedStyle(o).overflow;if(-1!==i.indexOf("scroll")||-1!==i.indexOf("auto")){t=o;break}o=o.parentElement}return t}}])&&o(i,n),t}();function n(e,t){for(var o=0;ow?w-d:R:D+p>z&&("right"===P?o="left":D=z+dE?E-c:H:C+u>L&&("bottom"===P?o="top":C=L+cp-V&&(B=p-V):"left"!==P&&"right"!==P||((q=m/2+g-K)u-V&&(q=u-V)),i.setStyle(this.$arrowEle,"transform","translate3d(".concat(B,"px, ").concat(q,"px, 0) ").concat(X))}i.hide(this.$popperEle)}},{key:"resetPosition",value:function(){i.setStyle(this.$popperEle,"transform","none"),this.setPosition()}},{key:"show",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},o=t.resetPosition,n=t.data;clearTimeout(this.exitDelayTimeout),clearTimeout(this.hideDurationTimeout),o&&this.resetPosition(),this.enterDelayTimeout=setTimeout((function(){var t=i.getData(e.$popperEle,"left"),o=i.getData(e.$popperEle,"top"),r="translate3d(".concat(t,"px, ").concat(o,"px, 0)"),a=e.showDuration;i.show(e.$popperEle,"inline-flex"),i.getCoords(e.$popperEle),i.setStyle(e.$popperEle,"transitionDuration",a+"ms"),i.setStyle(e.$popperEle,"transform",r),i.setStyle(e.$popperEle,"opacity",1),e.showDurationTimeout=setTimeout((function(){"function"==typeof e.afterShowCallback&&e.afterShowCallback(n)}),a)}),this.enterDelay)}},{key:"hide",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},o=t.data;clearTimeout(this.enterDelayTimeout),clearTimeout(this.showDurationTimeout),this.exitDelayTimeout=setTimeout((function(){if(e.$popperEle){var t=i.getData(e.$popperEle,"fromLeft"),n=i.getData(e.$popperEle,"fromTop"),r="translate3d(".concat(t,"px, ").concat(n,"px, 0)"),a=e.hideDuration;i.setStyle(e.$popperEle,"transitionDuration",a+"ms"),i.setStyle(e.$popperEle,"transform",r),i.setStyle(e.$popperEle,"opacity",0),e.hideDurationTimeout=setTimeout((function(){i.hide(e.$popperEle),"function"==typeof e.afterHideCallback&&e.afterHideCallback(o)}),a)}}),this.exitDelay)}},{key:"updatePosition",value:function(){i.setStyle(this.$popperEle,"transitionDuration","0ms"),this.resetPosition();var e=i.getData(this.$popperEle,"left"),t=i.getData(this.$popperEle,"top");i.show(this.$popperEle,"inline-flex"),i.setStyle(this.$popperEle,"transform","translate3d(".concat(e,"px, ").concat(t,"px, 0)"))}}])&&n(t.prototype,o),e}();window.PopperComponent=s}(),function(){"use strict";function e(e,t){for(var o=0;o1&&void 0!==arguments[1]&&arguments[1];return e=!0===e||"true"===e||!1!==e&&"false"!==e&&t}},{key:"removeArrayEmpty",value:function(e){return Array.isArray(e)&&e.length?e.filter((function(e){return!!e})):[]}},{key:"throttle",value:function(e,t){var o,i=0;return function(){for(var n=arguments.length,r=new Array(n),a=0;ae.length)&&(t=e.length);for(var o=0,i=new Array(t);o'),e=this.$popover.querySelector(".pop-comp-arrow")),this.$arrowEle=e}}},{key:"destroy",value:function(){this.removeEvents()}}])&&a(o.prototype,i),n&&a(o,n),Object.defineProperty(o,"prototype",{writable:!1}),e}();s=p.getAttrProps(),window.PopoverComponent=p}(); +}(); +/******/ })() +; \ No newline at end of file diff --git a/backend/static/virtual-select.min.css b/backend/static/virtual-select.min.css new file mode 100644 index 000000000..aa7ab7117 --- /dev/null +++ b/backend/static/virtual-select.min.css @@ -0,0 +1,13 @@ +/*! + * Virtual Select v1.0.37 + * https://sa-si-dev.github.io/virtual-select + * Licensed under MIT (https://github.com/sa-si-dev/virtual-select/blob/master/LICENSE) + */ +@keyframes vscomp-animation-spin{to{transform:rotateZ(360deg)}}.vscomp-popup-active{overflow:hidden !important}.vscomp-ele{display:inline-block;max-width:250px;width:100%}.vscomp-wrapper{color:#333;display:inline-flex;flex-wrap:wrap;font-family:sans-serif;font-size:14px;position:relative;text-align:left;width:100%}.vscomp-wrapper *,.vscomp-wrapper *::before,.vscomp-wrapper *::after{box-sizing:border-box}.vscomp-wrapper:focus{outline:none}.vscomp-dropbox-wrapper{left:0;position:absolute;top:0}.vscomp-toggle-button{align-items:center;background-color:#fff;border:1px solid #ddd;cursor:pointer;display:flex;padding:7px 30px 7px 10px;position:relative;width:100%}.vscomp-value{height:20px;line-height:20px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vscomp-arrow{align-items:center;display:flex;height:100%;justify-content:center;position:absolute;right:0;top:0;width:30px}.vscomp-arrow::after{transform:rotate(45deg);border:1px solid rgba(0,0,0,0);border-bottom-color:#111;border-right-color:#111;content:"";height:8px;margin-top:-6px;width:8px}.vscomp-clear-icon{height:12px;position:relative;width:12px}.vscomp-clear-icon::before,.vscomp-clear-icon::after{background-color:#999;content:"";height:12px;left:5px;position:absolute;top:0;width:2px}.vscomp-clear-icon::before{transform:rotate(45deg)}.vscomp-clear-icon::after{transform:rotate(-45deg)}.vscomp-clear-icon:hover::before,.vscomp-clear-icon:hover::after{background:#333}.vscomp-clear-button{align-items:center;border-radius:50%;display:none;height:24px;justify-content:center;margin-top:-12px;position:absolute;right:30px;top:50%;width:24px}.vscomp-clear-button:hover{background:#ccc}.vscomp-clear-button:hover .vscomp-clear-icon::before,.vscomp-clear-button:hover .vscomp-clear-icon::after{background-color:#333}.vscomp-dropbox-close-button{align-items:center;background-color:#fff;border-radius:50%;bottom:-48px;cursor:pointer;display:none;height:40px;justify-content:center;left:50%;margin-left:-20px;position:absolute;width:40px}.vscomp-value-tag.more-value-count{white-space:nowrap}.vscomp-dropbox-container{width:100%;z-index:2}.vscomp-dropbox{background-color:#fff;width:100%}.vscomp-options-container{max-height:210px;overflow:auto;position:relative}.vscomp-options-bottom-freezer{bottom:0;height:2px;left:0;position:absolute;right:0}.vscomp-option{align-items:center;cursor:pointer;display:flex;flex-wrap:wrap;height:40px;padding:0 15px;position:relative}.vscomp-option.selected{background-color:#eee}.vscomp-option.focused{background-color:#ccc}.vscomp-option.disabled{cursor:default;opacity:.5}.vscomp-option.group-title .vscomp-option-text{cursor:default;opacity:.6}.vscomp-option.group-title.selected{background-color:rgba(0,0,0,0)}.vscomp-option.group-option{padding-left:30px}.vscomp-new-option-icon{height:30px;position:absolute;right:0;top:0;width:30px}.vscomp-new-option-icon::before{border:15px solid #512da8;border-bottom-color:rgba(0,0,0,0);border-left-color:rgba(0,0,0,0);content:"";position:absolute;right:0;top:0}.vscomp-new-option-icon::after{align-items:center;color:#fff;content:"+";display:flex;font-size:18px;height:15px;justify-content:center;position:absolute;right:1px;top:0;width:15px}.vscomp-option-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}.vscomp-option-description{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#666;font-size:13px;line-height:15px;width:100%}.vscomp-search-container{align-items:center;border-bottom:1px solid #ddd;display:flex;height:40px;padding:0 5px 0 15px;position:relative}.vscomp-search-input{background-color:rgba(0,0,0,0);border:0;color:inherit;font-size:15px;height:38px;padding:10px 0;width:calc(100% - 30px)}.vscomp-search-input:focus{outline:none}.vscomp-search-clear{align-items:center;color:#999;cursor:pointer;display:flex;font-size:25px;height:30px;justify-content:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;visibility:hidden;width:30px}.vscomp-search-clear:hover{color:inherit}.vscomp-no-options,.vscomp-no-search-results{align-items:center;display:none;justify-content:center;padding:20px 10px}.vscomp-options-loader{display:none;padding:20px 0;text-align:center}.vscomp-options-loader::before{animation:vscomp-animation-spin .8s infinite linear;background-color:#fff;border-radius:50%;box-shadow:-4px -5px 3px -3px rgba(0,0,0,.3);content:"";display:inline-block;height:40px;opacity:.7;width:40px}.vscomp-ele[disabled]{cursor:not-allowed;-webkit-user-select:none;-moz-user-select:none;user-select:none}.vscomp-ele[disabled] .vscomp-wrapper{opacity:.7;pointer-events:none}.vscomp-wrapper .checkbox-icon{display:inline-flex;height:15px;margin-right:10px;position:relative;width:15px}.vscomp-wrapper .checkbox-icon::after{transition-duration:.2s;border:2px solid #888;content:"";display:inline-block;height:100%;width:100%}.vscomp-wrapper .checkbox-icon.checked::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100vh;justify-content:center;left:0;opacity:1;overflow:auto;padding:0 10px;position:fixed;top:0;width:100vw}.vscomp-wrapper.show-as-popup .vscomp-dropbox{margin-top:-24px;max-height:calc(80% - 48px);max-width:500px;position:relative;width:80%}.vscomp-wrapper.show-as-popup .vscomp-dropbox-close-button{display:flex}.vscomp-wrapper.popup-position-left .vscomp-dropbox-container{justify-content:flex-start}.vscomp-wrapper.popup-position-right .vscomp-dropbox-container{justify-content:flex-end}.vscomp-wrapper.has-select-all .vscomp-toggle-all-button{align-items:center;cursor:pointer;display:flex}.vscomp-wrapper.has-select-all .vscomp-search-input,.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{width:calc(100% - 55px)}.vscomp-wrapper.has-select-all .vscomp-toggle-all-label{display:none}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-button{width:100%}.vscomp-wrapper:not(.has-search-input) .vscomp-toggle-all-label{display:inline-block}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-text{width:calc(100% - 25px)}.vscomp-wrapper.multiple .vscomp-option .vscomp-option-description{padding-left:25px}.vscomp-wrapper.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(1px, -4px);border-color:#512da8;border-left-color:rgba(0,0,0,0);border-top-color:rgba(0,0,0,0);width:50%}.vscomp-wrapper.focused .vscomp-toggle-button,.vscomp-wrapper:focus .vscomp-toggle-button{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.closed .vscomp-dropbox-container,.vscomp-wrapper.closed.vscomp-dropbox-wrapper{display:none}.vscomp-wrapper:not(.has-value) .vscomp-value{opacity:.5}.vscomp-wrapper.has-clear-button.has-value .vscomp-clear-button{display:flex}.vscomp-wrapper.has-clear-button .vscomp-toggle-button{padding-right:54px}.vscomp-wrapper.has-no-options .vscomp-options-container,.vscomp-wrapper.has-no-search-results .vscomp-options-container{display:none}.vscomp-wrapper.has-no-options .vscomp-no-options{display:flex}.vscomp-wrapper.has-no-search-results .vscomp-no-search-results{display:flex}.vscomp-wrapper.has-search-value .vscomp-search-clear{visibility:visible}.vscomp-wrapper.has-no-options .vscomp-toggle-all-button{opacity:.5;pointer-events:none}.vscomp-wrapper.keep-always-open .vscomp-toggle-button{padding-right:24px}.vscomp-wrapper.keep-always-open .vscomp-clear-button{right:5px}.vscomp-wrapper.keep-always-open .vscomp-arrow{display:none}.vscomp-wrapper.keep-always-open .vscomp-dropbox-container{position:relative;z-index:1}.vscomp-wrapper.keep-always-open .vscomp-dropbox{transition-duration:0s;border:1px solid #ddd;box-shadow:none}.vscomp-wrapper.keep-always-open.focused,.vscomp-wrapper.keep-always-open:focus,.vscomp-wrapper.keep-always-open:hover{box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2)}.vscomp-wrapper.server-searching .vscomp-options-list{display:none}.vscomp-wrapper.server-searching .vscomp-options-loader{display:block}.vscomp-wrapper.has-error .vscomp-toggle-button{border-color:#b00020}.vscomp-wrapper.show-value-as-tags .vscomp-toggle-button{padding:4px 22px 0 10px}.vscomp-wrapper.show-value-as-tags .vscomp-value{display:flex;flex-wrap:wrap;height:auto;min-height:28px;overflow:auto;text-overflow:unset;white-space:normal}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;border:1px solid #ddd;border-radius:20px;display:inline-flex;font-size:12px;line-height:16px;margin:0 4px 4px 0;max-width:100%;padding:2px 3px 2px 8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag.more-value-count{padding-right:8px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 20px)}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button{align-items:center;display:flex;height:20px;justify-content:center;width:20px}.vscomp-wrapper.show-value-as-tags .vscomp-value-tag-clear-button .vscomp-clear-icon{transform:scale(0.8)}.vscomp-wrapper.show-value-as-tags .vscomp-arrow{height:34px}.vscomp-wrapper.show-value-as-tags .vscomp-clear-button{margin-top:0;top:5px}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-arrow{display:none}.vscomp-wrapper.show-value-as-tags.has-value .vscomp-clear-button{right:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-toggle-button{padding-bottom:2px}.vscomp-wrapper.show-value-as-tags:not(.has-value) .vscomp-value{align-items:center;padding-bottom:3px}.vscomp-wrapper.text-direction-rtl{direction:rtl}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-button{padding:7px 10px 7px 30px}.vscomp-wrapper.text-direction-rtl .vscomp-arrow{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-clear-button{left:30px;right:auto !important}.vscomp-wrapper.text-direction-rtl .checkbox-icon{margin-left:10px;margin-right:0}.vscomp-wrapper.text-direction-rtl .checkbox-icon.checked::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl .vscomp-search-container{padding:0 15px 0 5px}.vscomp-wrapper.text-direction-rtl .vscomp-toggle-all-label{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option{text-align:right}.vscomp-wrapper.text-direction-rtl .vscomp-option.group-option{padding-right:30px}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon{left:0;right:auto}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::before{border-left-color:#512da8;border-right-color:rgba(0,0,0,0)}.vscomp-wrapper.text-direction-rtl .vscomp-new-option-icon::after{left:1px;right:auto}.vscomp-wrapper.text-direction-rtl.multiple .vscomp-option.selected .checkbox-icon::after{transform:rotate(45deg) translate(-4px, 1px)}.vscomp-wrapper.text-direction-rtl.has-clear-button .vscomp-toggle-button{padding-left:54px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-toggle-button{padding-left:24px}.vscomp-wrapper.text-direction-rtl.keep-always-open .vscomp-clear-button{left:5px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-toggle-button{padding:4px 10px 0 22px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag{margin:0 0 4px 4px;padding:2px 8px 2px 3px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags .vscomp-value-tag.more-value-count{padding-left:8px}.vscomp-wrapper.text-direction-rtl.show-value-as-tags.has-value .vscomp-clear-button{left:2px} +/*! + * Popover v1.0.12 + * https://sa-si-dev.github.io/popover + * Licensed under MIT (https://github.com/sa-si-dev/popover/blob/master/LICENSE) + */ +.pop-comp-wrapper{display:none;position:absolute;top:0;left:0;opacity:0;color:#000;background-color:#fff;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2);text-align:left;flex-wrap:wrap;z-index:1}.pop-comp-arrow{position:absolute;z-index:1;width:16px;height:16px;overflow:hidden;pointer-events:none}.pop-comp-arrow::before{content:"";position:absolute;top:8px;left:8px;width:16px;height:16px;background-color:#fff;box-shadow:0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.12),0 1px 5px 0 rgba(0,0,0,.2);-webkit-transform-origin:left top;transform-origin:left top;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.pop-comp-content{position:relative;z-index:2}.pop-comp-wrapper.position-bottom>.pop-comp-arrow{margin-left:-8px;left:0;top:-15px}.pop-comp-wrapper.position-bottom>.pop-comp-arrow::before{box-shadow:0px 0px 2px 0 rgba(0,0,0,.14)}.pop-comp-wrapper.position-top>.pop-comp-arrow{margin-left:-8px;left:0;bottom:-15px}.pop-comp-wrapper.position-right>.pop-comp-arrow{margin-top:-8px;top:0;left:-15px}.pop-comp-wrapper.position-left>.pop-comp-arrow{margin-top:-8px;top:0;right:-15px}.pop-comp-disable-events{pointer-events:none} + diff --git a/backend/templates/base.html b/backend/templates/base.html index 4326bccaf..bd32f1a4d 100644 --- a/backend/templates/base.html +++ b/backend/templates/base.html @@ -1,56 +1,26 @@ - -{% block title %}{% endblock %} - Flaskr - - - - - -
-
-
-

C

-

S

-

4

-

3

-

0

-

0

-
-
- - -
-
-
+ + + + + + + + Document + + +
+

Welcome to CityFood

+

Lorem ipsum dolor sit amet consectetur + adipisicing elit. Illo labore, iusto, + quam est ipsam doloremque, praesentium + ut aliquid consequatur aspernatur a + ad vero nulla nisi consequuntur.

-
-
+ Discover More Restaurants - - \ No newline at end of file diff --git a/backend/templates/main.html b/backend/templates/main.html new file mode 100644 index 000000000..fc1776b0d --- /dev/null +++ b/backend/templates/main.html @@ -0,0 +1,136 @@ + + + + + + + + + + + +
+
+ +
+

CityFood

+
+ + +
+
+ +
+ + +
Recommended Restaurants
+ +
+ + + + + + +
+ + + +
+
+ + +
+ +
+ +
+ + + + +
+ + + + \ No newline at end of file From 4f36a2167a0ab66732dca8d7f1dd0dc1bd14c639 Mon Sep 17 00:00:00 2001 From: joannazhang7 Date: Mon, 27 Mar 2023 22:58:50 -0400 Subject: [PATCH 2/9] Updated app.py --- backend/app.py | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/backend/app.py b/backend/app.py index e5418799b..7c491cf20 100644 --- a/backend/app.py +++ b/backend/app.py @@ -12,7 +12,7 @@ # Don't worry about the deployment credentials, those are fixed # You can use a different DB name if you want to MYSQL_USER = "root" -MYSQL_USER_PASSWORD = "MayankRao16Cornell.edu" +MYSQL_USER_PASSWORD = "" MYSQL_PORT = 3306 MYSQL_DATABASE = "kardashiandb" @@ -42,4 +42,8 @@ def episodes_search(): text = request.args.get("title") return sql_search(text) -# app.run(debug=True) \ No newline at end of file +@app.route('/main') +def main(): + return render_template('main.html') + +app.run(debug=True) \ No newline at end of file From 2d779a1a3ac92b4881816ea46102095fe0907c3a Mon Sep 17 00:00:00 2001 From: joannazhang7 Date: Mon, 27 Mar 2023 23:02:27 -0400 Subject: [PATCH 3/9] Added picture to landing pg --- backend/static/images/minimalistfood.jpeg | Bin 0 -> 25658 bytes 1 file changed, 0 insertions(+), 0 deletions(-) create mode 100644 backend/static/images/minimalistfood.jpeg diff --git a/backend/static/images/minimalistfood.jpeg b/backend/static/images/minimalistfood.jpeg new file mode 100644 index 0000000000000000000000000000000000000000..ffae298402df7d56311cb9a805c651693e9a1b8d GIT binary patch literal 25658 zcmbq)1z23M_U9c2cXxLNE3U;|ic_58R@_}m(c)6v2N|R-TD-Ws7k4eCP$*CeJALoJ z@4emcTlsc#bHneRb8?fMBsa-9!_)H97J#dwpsWCZKp;Q~egRKAmKY$N&!jSXgui903c1cG@rGNrxhGW!trZgFSoz+3pggU zboz@C5dUHicm?5@^e?viC+7Hv%s;WzUu^B{Vhxx1TW2?GXY0SXAC6;uylvnZtOmzX zJ`Og%a6AvkjIX_&9pLyDjtQM@EIa`K5%VwI%f`wcj-SCXriZS!EF6mi04k>4e_+f1 zz+N_f@OlD(tgD;9hl8EH7cHw58!eBBh%l{^jqht4FE36_3o9oJ4{KUkS7$d17k>cw zXPf`#0`ULpmKLsLK^_r7K~7#SxcdJU{~%T1J<+t=5Z%fZHq z>#sup75u-7g(jBdwjje_EYcJZrO0{x*?dt78>*;1;WkbvPKM&&n z=ZybRt^cS8hqjHajfag3yeNJ6D06VJgLk)!wS$*~s|&4z%m1o}{~xpcM;-pce~xQ7 zASinT2+g?w+$ll;{B0aSB)|Z`CIxT~=wJP&hNchvop~>54*xms;TX>UNBTb`2ubiq z1WyM$+P`F3ZCzR`Zx5fp7(OTdCP)A}fCCT$WB@h50I&j_052c}hyhZ7JfH$-0J?x7 zUfVM%$pi9s_0vG`kfe?WTff<1tK^Q?AK@~w4!4$y`!5tw0Arc`G zAq$}dp$4HDp$B0MVF6(a;S}K-41h7f#9%rwCs-IP3)TP|fo;Ja;1F;eI1^j~t^>D$ zhrn~-E$|um4iOoV0Ff4v6HyFN2~iKx3eg=g1o0hW4q_!@Gh#pD9O5?O1>z$T77`^A zJCZ1pGLiw39g;6n6jCNqIZ_kS0MY`|KGF>`GBPnT3$hTh60#w(BXS_}JLG)i56EAT zXOMT1uTfA?$WYi(o}*}>SfF^JM4@D()Sz^u%%be0+@fNj(xCF9Dxeynx}Zj&W}?DS zyHICQ4^e-k;i562iK1zsS)=)*C83p}wV_R+?W6rh$3tg9e~zw;?uZ_ao`qhAK7hW4 zeuaU7L60GVp@rdq5r&b4@eyMfV;kcR6CV?TDT`@>>5Z9)S%LWla|QDX3k!=GOA5;f z%L^+Js|u?RYXj>Rn*f^&TN&FLI}|$?yBT{H`y2-ihY3d-#|$R`CljXuXA0*G7Y&yg zR~FX-Hv~5qw-t8@_Zp7?j|Wc!&l&F>9t>{;?+70SpBY~s-x@y>zZAa@f0qDEz(62N zU`6nTpp0OEV4o0~kcCj0(2+2nu$FL=@PY`Rh@VKG$d4$OsFP@m7);DetW5lxIElEP zc#-&?go;F(#D*l6q>f~k(zV`56Tvg&2huMI1#v#aBuMN(iMkWgulKZ8PXYg87>%U7}Xhr7^@k-GNCaEGubn}XBuMq#mvI|k~x~Wh53kultq~(fTfyc zjTMVklGUBHgms<`nN66@i7lUP8iD{3fY?KFAye!K?1JnL?D_0797r4@94;Is97~*- zoYI^=oYkD$T*O>zToGI?T<6@3+(z6f+(X=t&jg;mepdEul?R_kg(rfijpvdV!fVBw z%RA49#izg*%J-S?2R}Q%4SxauvH*dAxBQhMxj?ic|uFVguK8SZN$sOcc0Tgw|HLsd`p5>;*~^^ z#FiwTq=jUOMH7K>T55UUbwty(Ev1*HPSTJHCZ&>HQTk2wKTPIwGOm-w1c#VbO?0JbznL- zx-z;+x~qDudfs}y`Z)R~`c?YBUdp{peYs`8Z4hiQW=L-6VEEYx#Yo?%-00d^-Z;Z} z-$cM9%4E@$#njJq#EjhRwOOY*j=6<-!z-j$FJHl4Jy>X1lvrF_DqH4RURcRmy|+5G zmawJU7Fpoy`+7n{h5QTLyp4_MvQX?@7v&q=jY-#?ho;g^*;BA!L0M*Mv9@=aSLRb*J??pwvT)lt|{9#KotV$p>$h%pW^ld*iU z*|Cpt)^Vfp&*C%VAKqEL8%^Lz$Vzxhv`w5$5=<&cMoxA~UQCfpsZ7O74M^QhQ%`G7 zr%jJb|CwQ)F_OujS@<6Pz4!aAEVZo9*^JrA*$+APISaWmxgYW<^J4RUYAm->_*lck@<$o$%Dz+-MEBmX2s;Xd= zu%v2)YVYdf8k3soTDjWKb)0p@ABaE1e*`{ye?0m0>eFJqYJG2ma6?@qQ)6BeK~r2a zsM){yqQ$;t>$BnKnO2q7-ZrtergpCOiVnJt+)kp-q%QQX$gZdEfbQ!rZePxN?0R;4 z&3jk-4EpB#wfZLqR0oC!6$bl;q=&kPpAUD8h>o<53Xiso363?73ye2S2uw6h3Qjgp z2~B;T7MX6F5ufRrm7MLFlbaiySDqhRc(E|EsJFPhWU{oiY`uK6@_OaRSD&xHSHsqj z*5cN2*E2ULH%d0yHa~0$Zgp_bu<7^}O-B)c5fVgNywi9zUKg-(8ViRs7`t*?X;dy>a7w^ZQra zE!l15o$%ez{mc8q-@Xqh4_SZM{&WK>iX z6jW3!G<5idMSzKo36BJLgm^gco0^n}h?JUvijs-}!o&m-;1!UUHv#?szTl}Bz(YmI z1s{Py^Z)`L2#g1M>W6Pa05Aw1{~m+>E5J)aL_$VEMMM8f{mcCC9QfYnpS-8904AJ_ zfD6Wj^B$X*?{8h=9Zf$Of6no$nq!(~k(tmG%O?^o(_M~p;y*!ut=_JOWs1!POA$2c z2^;XLX4HABGQz<$t*)tTqf#}4DUz2bV$h+q$TZ?0I_VNmV8J9tJA<#Ig1es*@;{Kn1GjxuNCn9|FI>)P830gc` z9JY#VLa472E$eL4f;NL5_f{S~TNVr82O{L?v$3=JPedMSL`<#+#!@mq*Rp7%bEGaL zA62p8Ytqd?_VJ5tKH(RQH>PT;G|DulR?(9(_oqe}`!EY?7o~<{(izoc##$J)2$ZcL z(JN3R?7nb>s(jN<7huzVQ)0?%%FhZV9UMe|`%-YOs>~%@usWaBNA$%^+o&-U#jC-$ zIC8yVtbnwkvaR-VvHTlIJM~MNjQGK^pe3?Jukrd3Bcg1Zq$<>#Z4|+VfgDg~+gf~Mmk>|^L z(o0z>EQ>37RP^aSv+3$YwdtCQYCt@;XVL8;MYF@+%DPxtm9N!fvH)FJbS0n4nLnB9 zdvgAFry`3=tn;a3eEb{}_B9jB(iTXusWZk%k=6QYM=`8?`Z1jNn$j}LGRjg>^kik3 zFuhEfR{U2{WjZpWWiqXdwuO@Qt<-6%y3dNMtrP}l%Ln8kuU{%xVj&B#dSE*Cz!10& z>Whj>ssxV^qBNfk7w=)}t`d}L>(vFQS;(##sjsYD^6VY_;9F&TY*W# z)vw@dm9c9p%d3%%Y902nrX`Wy3$JoT@MEOID}O_qNPc=pE;nO z2|-uRnk^eVXh}16!eJY6tb&9Tz)i&i=_ zxQelbzcx{S!TL*uXBj&cGbd@bu0Gg>2&RdStWAL@SI?`}f}Ro8pmr1VPG}DEdP<0G z);Tr7hHzG|mJwz4w<1qJTt%<$Yg&t`czKARN zYD1u(j>`+Rf<{|PI~uU5)anvf8$z56zX|pE*LW@okC)M9GOs6VRY5Y8u zC`Aj$YR{ZS6!IK&tf2bkWY8BW`gMD`*?jp7%2tzK?2olc_j2qHiO`Ki z@n>!@Wq>F1 zCu4nb5$xY8TRZEJ3eu^h)$hBvz6^TZG~uD{N=uBT7aJA@|D;;7(!NfOP=z3e!B6GN zkXgB-RJ}-I#%g>Od<9(?L?KyiJd-d@k1Z1oCW}+3WpYmiK>ECmbK+fBb9oVlQfzX5u#=slXKQLFzHP2=W@RNl0!IMzp5t{2GUVpx%6Ah zyuEYEITWIzMH-$_Q>OsP&?3Q{DUGs-T3Vv&($cg5h##LPU2r^|UN==mMmL3BZepMa zHL8q0E<7iex6JYuxw>GTSya73N49Km&Y?-^8R7tF6v-M3?4li&KJbZ2cGg9p67p8N zIQe?Yu$J7DErZ?47!;0LBJUzsg5L0KW*_Ra_D+Osljb>J+oYpFGL|)YNqHQC+!s(a z8Dq0HYt?H)2LyFpEcgn`Ob;T>rA1}t&7i}i)2<>f7NA#SB#ywq?K`{{nDUylZ!MlT zYLiwM%$H{<>nDP+roY0{erJDVf$i)|LR4mE!~d;ZSdF-8%+R@ftjfP}|AYq>p&SvA zLM%cxvG=9eZVw8&9$h=A&;oTNfbBVp0b0kXFF+B15L+fSU8>CZDk>R-*aPtBup$zu zg)zc12z1kQqZ;s`RctviNEbvTQ_kgcWixBD%~*n2JW&4ms#YB&AXQh-335%QfNXO5BFvwhl4>yK56lAP9CtjKSt-{WsJHHc$qcp4>0B4xA zvcg-B1Qa2vq@eF*DC15?@rJ>zD8MTaE@s&@w7QIb4@_^grVK-53Hw|Z%m&j=d#Php zwh&eag$hXPXovBCp?Ej|2wSEFk~bI^+DsZ;!$dvWLJ9iy`Pw*UYm zUM%6qdI!%cyJt>9Psx4^m1=#?t6owt!Zh5_i{SVL!FDetmMta>5fuPf!2o9QD5`#y zjS?YqSuzK%CQ{JN&YjEJ>|72NbK{&o!d#Aur)(7za45>mGtpBwC@+u7Gghn48Li`5 z^>hR2ACxi2nhuN=!KC>krh8hw9B~@H$s1x7DK%+o zXx_wX=x|@6uypiJ#@eg0d4oG0M)88;J&EQKxu#Sv%O8Q;{{?OhBTe6? zjMtThg{ytSXIzXG`4p2>aGdXX4BfYBB|axVQst1<-Os@vbyw*prmZ(=)77LcLWs1f z%RVwyC(>NZ@zQpe;h33tb;1r|n!{&}N~hPK!IXdQKHHvfvEiDOxni7W;zUb6qN68c z&yQ#_x;78!nfdUegI>*G0U)`?GyzoRDASzvLSR(` z@IB(#7$eB>pCK}*(}m+kiY%kqhR$Vw?oSz_ z8ua?-ghvA3qLe_6!}RnsJfNg1YOV}MpZ96LoeiL6%^_@L^N7IZ=bc6mPo-p%YQ$}1 zs+2O|-_zd5_iT^>2oC29shgCVPwdNcnzKuD!po-@&<|3=iUi6ly@_={Itvh_sZQ>y z#IvH4yN`Ivg_&hAm`o+G;+<+rU)sr%##7h&_|S^d-MtkbmU z1ZYsSx6kmC0e}w84G05a(OX%+(6ZAiN~s)y8%eEY5ZTde%Mwy~rwSTxeOd%w>@3Xl zo;Y%qr-RBzi6C-=Rp~_h(1CXj3R&_!zT`|MYnsIGu$AyQ?9Uxp(Eyb%(uw+5QndE$ zYCq>b@BL^s+{EUOXP~Ozu*Ur^S`A7;h#*AN1cPwV`xzKHk{uXvGY}N^C{l75trfhk zJY|&GSgZgGR@LyajITGR!+bng=>?+M%rexaK#nP%;#Tdf9$Ax=cMO4gm^0m+#{Y@vEGKitXMX(f1mCDFW zsRHz?4wvs@{FU`<^Nj~3bzGXrungKcMdijX3Ue>DM-k^hu3eXF;#~;?7bb><()$%* zOL||vwTl0my9_q>?zl}{Ix5IHJm{*PXA6p;-gejgiWe@0yO!Z%ta}h$9zZq3k~BQ{ zx%D)$Ox~`hs#1R+ib`&u0`?$&Z}KwCOyzQp1Iu&c^Ss9kVUJ065$_(3GwwR<$@}E< zrX%pI^FG<>%@67G#tS{}&Jg_S_2aFxdls?bfVMq-lKit`Ju=w3rJ*Nk1Ah(~vENs{ zIFs4+LoMi`tB2(-^*NK54_7H(!NbjSO7q4Govm3!;YxuoH3Zg2=U zb0<#Vv~TBKfQI5hCv~f*oX6?ziIa4N4QfglP}MjM)sd%jQfsU`P3zzD+#o&8Jn&yL zD7m7DV@-*Z!B=iREEl217Ozg*89N?@*^|rbYHO2!0^76EB3G(2fbgt%YZ)`Cqt_qi z)~|i!s3lX1lIPWP$k56iIhyiTi<1jH;xirJ>Vw?&TR7U{;@v$Kq+HskvTC9o?vZ~k&K#j#0~$ntdr z-LRgB{jvYJ*UyTPhl&q3lEq#R1rIcQH$n`Th3*}X@l*SoGB+XZ8Fc%%4f(z5Qf;^^ zRrqPt4*n9{+~PZKJHAt@V@99QUXaN(Rd6^Xp%wK%<1(lspae8UmAuG*(~umCK6mKZ zzdE(%ILY)hB4ykZ-)W4A7Z5&Z=z#|PJc5t@v?PR)3CC z_r2%L^V{uZS7^pPPVQ;IxyC|!VnO@m)Ivzo^`Dg7C#Hy65J5Op#CT#4caDcbGas;E}(>iPKECts~Z_hRxgW^TN)l zQP1EQvx9-ao`jhCBK`RVbZPj0iYMQVo+ZD7o73=2bYpT#`dIuI?0Bl{?AGK=XXL(+ z9+o?=o;+0$jI-pwMLqUq`w4)A`uKg%x&JWIDRjae7G%EcZ7#F*vj8QuQIUS4-aO8tl7|Lw)zYBz+g16$$5l)GVF zD3#^$qBWx9is$jtV*Wt>{sjt4{Cj!v5PYB0k`*zRp`vr4Li3XcJDsVD)jOIulEy(# zK-Vub-@Xuu?e2}Bq&=FW4==xW`}rk_%>_y-w=`dd<~{-Rzmpj5<1gM%iv^SXtk~~P z?8^W71mNAdUL;*(9Cr2fJ{<0K``noGeV3%WdF(5?>I(hdohE^CyLtV6;t7~0X?{e! zkr%`0zl3WQ%d-Qqy^00jzQun9jzl&&S%WFulY00|@7Y~8FQ zON*M)cZNTW2B9klOGcy6wn=D9E>}b4bX-nF)@y5pYTC6gA}FLHIC0!;?)aCJgp`jY z6mfZH_w(=yW(Gc%Qgvh8+&|=AxNdZ1KgUVFH7~jgb>F>v0=#!@PP^Q%rfdq2l9caW z9v6c4{zx9=&jeBDZic+N(^$IvRoE!`ZtV$}>C*Xw?j;!|Y5hp>v&}1%^I?DQw|VRK zom0tgZj8BL*UR_EPk>WW;JxJ5X5by=W6ZtA)!{+6(`9IPs91>W(G#HfaC+Lcx*zI) z{Wx}>c52n_g7UH3_aI<0>A<|WVhlcLQ>NxOg-^F1;(kly2DKWw*NPaq3%pOMAfHsX zP^7=T=lV6&wzo;Wn_^(tX`?X3&hOt~G?LS?QkAceB+7OpQSLN#|7ceGh6qP#_Z9~h zRBwjtB%wPzCYyNC`i8*ZUT0$B)KK7Sy{FOQ3x0nssP+EzIOl;v9AUFuT?5D(Lq!3m zORQEG^!zqek^1w=XY%XX?Vf^ypBJHYe?Yt9+{F(OG!N2B$ zx(jw5v#vMu9;0vDPoDs2*PG)%g$F0!beCpKcrV9al4BX&P)N<5N+$G>d*ecklQ#J_mhoN!tIOWOO*%#Z|%b zg1LfeTao$pYhL{B%18~DP>rK$HF+&NgukX$i~K%RHL*Z(&gY@ydvtK(S8wj_tC7(? zzqT>50sa))Q+`WF-8!&WjP6I)3MOa^z^JtL>&c4;5fVctfw_F+MLV zSIdaiNBKs@1zU*X{X2KwgM&_A!%a8lhatsN(Fw1+shHm^iklUO-JJJAlm5>o=)3Y~ zT>Lo$vFp7Luf**@Ar&hRVsV9~VmPCBhWERUm)^E2vv-}o~rNlP(TA{fFhv6=Py6d4m>Wm-Qrk%fL zJ6xOfq|;`dNa}8rmL#M_*;oqZ#ZNps&UIUrM=u+wg&5-J-V>&^;Cz^0qTxERuZ|`@ z$c#M5R|m^IW@hj{y5Dxb$1&ci#qcmn-Mg{n_IdS- zW8j;DK{#oyJHE#g%*lRswvgg-hNu3^+f)q^f25{oZi(qIICMOoxrVg@kOw?AP zUUg-)-oj_nAEy4(zAM$=l9Atb{q0O#^88I63tPkjcdvN%g4;WHJnqgM#+=2)6~{Y= zBJ)ki;YXvXYSF6m>xRjpih!xqvE`hhsNG;BCmMcQ`qc#`^oU^SX`Gnt3`Y ztkQDv8lstbyd&rc6q%-Wny8HwOmln!*_E)8X9pZ@9R6CJ^2a&`xfw%(X`FCy zNUDQg8o5|rqtW{=BIc#2suq^``b!f*(zmaonDy-B8B=43M~FAP(vzQ2fa;l(?G*{B zB;)TbHzlV&{n}`0!AZQQ@r8CRaZ{0P*7c2z7o^dMu?YH!P_@qPn_gbstsEUr*ap0Q z7$gp;yfiR8t^e^5SZM8MdAOn5_58dfGjCQ;ULG|E7N*UMnCkVuhQ&T`N+C$lKq8YW+qD^QVC5M#Jo3&F!OPTyWS#B@12s&$@A7er_`C0MwPdhVm+M4xwi3hG3<)RjuMFv=1>16rJPm6HO4WuP7PRU6S;JM{+eUth9dqHLkV}W? zq8VVJMNX6oRAx~$urFqM>GBA`O{+4oJ`qeU^g^7hQb1yHx~gp~x_@I6WR+1>n}4mW zF+G94GL`bJdw{v(bC!vY&6WF*4hg=&dz{4YJJ)U&bAzArzB8d7PacXGjS?M2 z_$k%otNN?itJyvABUX_uP0uey#l?rx@`vI7h|ojmVeyn~0TRk{>;SU>Ge1Ij@?QXs z|F5GFwGZL{c&kxYYT5fQYxxTY6#p&iy27khhp*?rHdw0UzCug!xuVv*H`U*S;`i^> z)%Nz>+??x^?0b+@Hm;TccIlh;leT0x48lEDrlYsS(Q{hzO9YM!)%vvo*XJ%S=igmj zzhD2&?)v@vcUOeMXZC%ctrAeNh-2l;j4qDPnDFCMH>}nO`&BHP+@-l`)}3QCJDFQz)L^5m zR)IZogb6#@=P~dQmjua<(cClQ#E+F589+(Aip?`m?A9k?G>sdsT$dw(B$)bPdh3gf zyVC?kWJh;};HN)-lVYE)!bFIWmlXFWcD(9^jgmF09IjfK=sQA%7@vxB(Krq(${k6d z5dpkY=&wS(GsBv$!u2A^p!et?(`$@go2?S;hNQ(J{i>tYZEYO}DJfwQPU^u-7K(7R zTNl7_|ND9p7VvgkUes}ll=kb08`nK!&f!MGYE>O4EoUf~(OaDw&zQU&*O=IZ6~4S- zln$4k;dGT3vDrgkKItpVf7NM*+Un}MVD+Eri7GYGL#jI1(R)AFK*(fSnG0jU>mq7* zha!39cDm!E3(q4MsBngpW1w zchq(2{79ufE?CL_&yeA0>%oMdTC!J5sZypl@rqWWW9Na*KmO18>2Jt;yPIG7vy91% zT%ih1F}0z^DI?>xmQjlpr&Zb0x3B?7Z9s{bfzeA|{x{J+MMJd*^Irw5YmQ&~-!)7?_ zqO_f}-=s{vEZ^Mm%W?c$(+0~_oOMpWmabQK^kB=?)W(c3lD|K`G8*-;lc)rdr*zn& zeM67_3_0uw{!u(`Kkq0&c~V27ZPt6{Mj`u-uwuXBAvu)V>P}QL7w1ql#I0~&a(6gH zCh72a%dO`d2NwsM#cVSz!oI{ZZWAmBg?`bdwx9|%S38}R;49*ncu~GN_8pp_KtxPr za0FD3Neka`{X}MqM5=@M#(2xD_xewA`x9Wm)xCg`WfFcX2I+@5;0A)Z~FexrYD9RweM4qmkoUXi_oE$2emp$PC zos@CBmNf_Rn&1?CJIj72If9{NB(rGjU;uvh8Wn*ynHepd|2SqGJZ{P9Wb~D8H(yQl z>*u6*_V&SkasL?I6$%?0i}1KOIXO89zb6;rPYLAw4s+%748mbJ$_isfx(-`hK07y^ zLdo_a;;8ZpT7Rbm9v;;N(%fkbWWd;BrfNbwB8Q}T$CY;a;SI64J2mOMH*36(s~N8> ztrL|aELPnGjRXT+(n^oosNWPlhF*2&Uec;ape3IbOpkit1Q5E^wkkMe<{;P3m{*+y zyqSMdYt#h)zUe|nl)n=Um*QZM#%sP8?-1OGh@3hKk zr2y3mH9#sd=m&^4T@fzuO9)BJ*iWCR#aBq+l;Gt42i^wgM?YrDw5Tmrz_nw(4j&&q zucQY(J;Q!1_PRo}luWs8biKX5U-)P-HhB4YpE-PyR>B29VED3(f{2U?MnQu23;Y*K z@KqY0j)#C=S_=u6S5w= zDh`$eJpm_@g{$zB@1Ho&Cm_l22{@gT{PP9@HTWH>?1!_G2mfFaT(Pc5y!W)O*rx@+x-Ns zBQ1zds5f^+DA~~4h5Df7e4j8luf0K_WNdkAb?y0>>!;Sh&b}L*z^)b?cVpNS(0#bz zzDc7We2qbAbduE5^1~Z_hZdN(*hadEB0vhR##ZzHfK!u>w1ku$AazillV1! z3{RSfIx7z8iKu?Noa&UUcg|OW3^;{3RwWieFC0Vb{uxT-X^ z*0w}d9pLeDC`Rev^XsvXl${(|hPL4hTv9vR!!4?;-)XHUNn*?1|KJenCH%OBiBxv5 z9k*q^KOjRz=|?%v_#JQRH|=0Ffott&(QUZJFa5A3RBI@@72N9EzRFd*>2t-HJg0me z9AU(zyyKG1uS)aM)m#`*)RfplhTB7)N~QTI0-UVsW`$UTN6? zZ3=Dg?ST^vyeqoRJ;#`VaG0ux;h=CI2i*spo)D!FqeaxAU6L^Md2w3Ocgywk9=sJAeL8 z53kQ7{rnL2!l|@>toeN20E1;d*e!1P?c{Tfsfe$_cwv`9tq)oQmV@yCPg>Qb9EwZ9 z3`>fp@PNPDk0lLuT5Ag8rbTK_BHi&2yhzv_9ucUxzunI+hK6aDBSh3NagL{gIE&;^%1!M$Mdw2McNe&^rv(P9 z3fga%dA*2XTI#Kp?GwJbM^HP6mkc2*XR&uirrm7UIrzwDi-T!}2x*<%wv`iPrk}n=IxL$@5)w z&#NM3!Ry`3yy|x>!;6_e-^6EMw1zc4s@OZ0$N7KE8jSRyBvivbJ6nmyw!FL2#haHW zyd?hS1vX~szjI`)aw>BAI9D(JiCXB;MnhZx8|LN|-W8O)2ZLGrjHc8OH+Xh$j#oi3 zc~f5#)!G(ObPzmSX{+LA!b(d9}5tG+R(he5GDs zBkGUet1nb`N^YB}91U0>!!t6(`I#LG-+np?T_T$G9R5DD=CDI<+!(C#$71GFv!T20 zASVmo$Z+L7b&PITTwR$JR-ZavM(=|XC0>ZIeE@X{i?Psr3PJ9p$%3ouABLlw`DgV) zQ@Occ#N8yB#EB*|MasU&DvYkUROn9-rdlH97_3OE6HOj<$%eHhzGjNV^`euORx)RJ z1CV_#WlWWqCuTu;$1B$0BEps2|Lsk4m@(GMuXUbvf&1pFnb?n(q^9l%;&Ik>NQr2@ z13crR4z~~(n-dkGC%N0;s}KVt(`rv`i9||+Zri!67GGD6-$ga)dFYii=!Lg7st>${ zTWlNn`P&eQgmQdwjL$1Yb(!4QiMF=ip6%Nx>!_^=hEY*&&|d25CX;{@o&XGy4~trI zD-_Y7&zvH5)?iB858 z`@VM(Uo~jXPRQD(Ml|&;@{;8*hqF<{xA)rg5lTM z^{VmZyNsFS`2k_Z=aJj(AM$I8GPW#z3gaRmmTs=$sg+f+Gcj0ss7pD%^0Ji1x3ckd zyLXTkCoF8bkDxmGl~ic>l1*Q&)0;1KDOQmlQ_o)AGK3(YuqQ&ozU4mS!Cw*;iR~+B zq0B!hxAw79n~JyICZ2beEu$Q)*wb-3`r`SqTV}4(puE=|S3rC;S*X-5Vb3Bc<+Hg@ zzh!6Z9yAiUO~JTVNi8LOVt2ino&6Ueja@vCdvnA_6{V~ofk~F}60zRGN-h*DH)b`b zraCac#VrYI(uZZ_<>C}+4FN_i@$Xnf0%B%n7po!cKVesVjB6sR6BeW=)wg9X?MjGPmG@+MD>*X6iJ|A7^pi}fCIPk31s_*|zxU*p|r!%mfs zKs|enVY0gRuq5B3ZD)I`-LNu~^4r8V+bJ<3GOI`_ zA$(Zr`w$rsLp?nQ-@8^WXm%_>-Sag3 zt&AOy;o-WGV>8LZirLavA%GaM{R}gWa-t`ToJEPU_c_6eZ8oQ~3|?Q#jB;ZC56uOs zFLU|Hz0TH4(Wb4HVv3qM!?|x4nK0$nb`HuDDV{$NOp=h{IMMCp87=MVaR^$u?pv>v zS}~Ugf}Qj0bdNYg+0n}ZE{Iktif8q5`GQS2mE?vWeU z;(vV9yXF!432}NSO95?H?Icn2iY%HJooIRG zM|c84RK0BrzL9@C*lBfG&=C5@fPJ--Tf-Zae+SDFb59mI5eq+8cWuLD6bTAN%9U`sKZ8w83plb z4-W~&S}3r6h+CUy4$ppIFFj%C{}r=7q3abi@M)q69C38F>M%L-1Vj`UmX1@- zJrmp3{T{aM0!u$QG76R{8W}`3pg5|e!t;`9c}}i{*QT#897^Y7!_U7d1RfGAWsjx#;x@l~!8X-rL$|2# zR%vp6>8I|*nPMn!Qi~#YPvn)0N^y6Co8Nx1w!-OiXvNg85R?uSwHUz_*3mkNgW!5QOIJl+4Qm(YEf>VDF-6-JDC%Je{l;hlYW&?b4C8hjFwXXAO|(nen*b!UOi zkaL8Z_>D5u zEa0u}FHc0@=u!M7>JUOfZK1N!_leC)Y=U8PrPH7QVRU06M{nc&7b{4AF0%DAE2k-QiEy~b_aRO)f^q%!I440)3Od%X>fCi~H;E(BEC2uH`iVwH4@ zVsT^wj;>#HXHGUf3(XfczcwmXi%j>ZA-syoHlaav~X?=Q2(-OLKm_xbBX;n z?|r)98-7sJ^UW2s_ynM7-=Y_Oso0aa=1xuPC+M)Cq1oy#yiosAHSK%Dh zO}hzqqee%7-yL1Tp}^ixrxo$%5=Dwv&zHdD2voY845(ZPT!F9jx6dNQeskSXy-@s$ z8YoW~ko5J7mIm53VaPf{_=%e$++o6eDZ3F0KQ}{g;pb!!7!ic@kADRE$GI5~mzIv_ znUu7ag{FIWO7W*xJwLW*{=0o!689NCR3!sJx5}_)5zPSg??Z&X6N;S?yRHHwoVX+d zr$F@Ci6G3d0UxfoIYU(ZBFj(O4Td}hb(LNxx>$NSiSJRfl(n1m9bcM#GCC!S%gBM} zprSabRd6y@$#_FFQ)L=(%oTx}!T@Kye9^e{q75zt(I?YNQu$<9Nkuzt*`_yJrQPOK zc8JVa^HLk?yHL`g-G+=k96jw?^eGnp(4gJ**07eSCMxboUtJ(g-nNk{w?=57hsU5w zyTSCW$~n70O;21;T^msilWehJ6};e_kx5LexCzS!Ehd$Te>CFAp(wJ3td@?w)JRRg zR66HW|4k}tN-Tl;Up~9QOszNUlWD#TZY1Vn+DE$Cy0<5F;UjOL@WP??RYs7Pfu@Ml zQjuahC8927E+(5qke6~Z!%;j7+Hf6}!-Z59jGU_B)zM)t70CI9J=kF6$73~RWppab zZfXfvO^vLnFN@N*qm$K!fQ9LR3~-G%Odr+yD9WjN3YjO#*~qCmFzzfd->c3HmUm%A zB>-2uZrvl)u?}iI8;smmA!oH%qx+$l<+V?E`8Jwit-wr8-qxTnyq|RIGE_2tqLf&+ z_mXxZis@wc^30fDf}wCNzHs-*VQ&r`UG%ku&3X&=)f|%Gn6)ji3;fh6@ltZAA;*rL z-;XD~5r`XbtXnyLsdP5%730Kb%9m#_bWF4mNPbF=#au!@P8y&n%#+Av((184_WnQr zq&@*#WprhWvRstixpa ziuC5Yc6(`4fSf?`gzIzwitwj*0VtYJKqT(GY@}O*5@@3C|tKlkun*9I&=1Yt7L;a8M@BVvs_uTFF+tjkw8&``ft@br{jeYQl_u3;(Z~`}^zkz(5^WZnlj5@l=P?5WO9zv$3}U=C4&_i}vN6 z9THl*mV4l*FLkA$vF*}thVPy%;011=DCdqN$q?e2JO3~FaLObKB1hXP+ieBP(8g5% z^Is;ZW_Ln@jwL{LsN*x)>#;(R*oW9jFl1%r1kEEc=R{`v!%uR+5%0Lk=8NpzFqi7jr>G zgya|&Q1OLjHVonsl6Qpu4-3?rx^G%4PpTUeM8=v>CREf_O?y@Nq4)=D)R`KGT$wK( z=V!{#g~1YYf%pTS%n{;xo7b|U;*WGc9g*GJ)u!%4h?8M)i&?d+-=mC9FnA44Ad__z zYfEPmB}*Z>ZP?4*%1aH`?TT_stB_#yiEXTzdwU)CYTD0f@D7_{3(MEMuZXS&5W=s3 zc_bj6lG?NXg`xsSK%CjeXyr&8mul+1iVv-KiuX=SiS- z9x}X)@hpXFJ7M9rBe9m8*<|+E&DD_wx1sXRZ3;7d7?LOiuA{mX^@&3Zik3JbYqmVB z@FmYvRdRNo@{Q&W%S^NSy@k$8u!fozPJ^nd4{hBuZRdlD`SN)Fcy6Jo#g`ekl6j?3 z;sL&`H;G6IlcF%Ndx?UnruFk#eHuJNCV^U}mfG?57=yHJCfOCma1Cz!D$4!FDcvic zw&Woz&_nU|`E379F=juk1&V6$<2{oR%c6PDNGDngSB8 zCZmW$UV=Zd#HG=_Y8)u;f{n%Dl0Wq3L`;`VKPMe$`$C>gkWGM{QTvaEp zBWP$w0ioVLUdlvCNC@Okd8f6+e@ZV@@kCzC3=fWGec*eL@DC? zhF!Iv8k{fMV7Zjb&jT>Azvw{SeHY>gEpa?TEB<~f{_U_~oS8DVs(81#%@twH*R9L)QZ; z`fj3{Fx<-c<}66KQ2w#+r4sD5FXaJwks(jgPtHuR?AwECgN{Q;9m>5$rTN50a^%Ae zL!#o`BwUGq=3~=fL!upw>`S{@B8Z)d7rGgr5M-jvy%D|^vH>3am*>LNe95!>IMi<3vbtQ7< zNEtK6_r6NbHmNY&{{0PD)r&)}Q`r%Tg9+uH`$noPLN3!?h4VM=GB>T-y#r=mW%lAk z`_rOgBokxLn+k{s@CUwNWAIIswNoe&K1`~7SlFG_I#|SKrnU67Ds|E|SvN@LR@)m; zR36iJU;Y#8+>+v>JR8viLzJk@^Ra3f#``TuWq%PqF-zM~WQkHI#YnrZM*MH1oRXZ{x(wb)FRR$cYT{Tq$` zkVi2Mi?}1TQefie>SJO8E(82E=ZCkV%h6;)CrMOa%Jd!SGJZbdA585^1=?cqm#vQu zjv^M+jCGp);8^Hbbxby{G~*-|$>}fcoJu0U7yp>-gfvL3q74#8&Qm> zsoLHbLI_9iju0N+8i;GVDbB8pm(mC{KfcDM;8PR?`3cd-*!0BLsb9>By=X)=me2|) zd76rKK4@$RuYSqznwSf$%4^4(d3wG7xNOQ@G81NCK#OdIQ%<^Fa?Q59pWmO{IFl)= zx6Hw@4PH1nFJus4Vt`B$;WYm&?y*x3Jer%}`1Z3^2*WVopD!jNJ+&fV0sRqgt>8)_ zQsmW${2Qz6TH+(j3Ux zI{fbp18W-j*bDm?|2KLDJctwu(j;A&qsU>sdJub{&}PIM-rO+M=bXnPc<#nZuCMb$ zIo}^@_iE+1dHu~Ulz@>wSGKH7FxrGav^`q81aK4m`$>JikoDzNoL0K9k&-W6nYUqA zYzP6XPm)gb`spXj&t6qlIc?Sp45`6*j0o-S1FD5*tYAYX#uF$Qd@fk^oTLM?g`pk<971DmnE$;E2C% zNO@On!nO}9>UNOro$G4{VKWWFyX+B4=D=nE5Dz9PeL4X2CBE;6b%OSTDY9aeci1u8 zOz={qRhLyeCRqTLe0I(Y`C5EX@w!DZ=w296O0;w2T~-VlCcP)U_sKgVvE=srM-sM`|0y^Si!&Bm68K|R!i07yx0IbU6h55C zi{)zPfvM#u5igkG>eUlf+#v>bYD14h*~zlUhWv((LGkm*l^ft&5`Lwk1P!MA^UOoM zbw1>l#)?Cf%^}9+>gQ+g)PI0Xj`y9G#v7D9U%awSVmKaSSc#})<}Ia8{X6U5NC@9# zWJS-PnT@SQ*v@v7%c<0Uw0o_$n4Cr5OZzrWw&OZo@VU`y-w$dyS3mU>YK|ath*?WU+eVnGI0WMbsZ{ur#}uysgBs8$?>ta`=0Lmt}`+_1-m^asc-mRDYm&nOwO zx@$iuj<*Cw&?nI;eBmgmlia-KnteSMi{YnSJ4^WcJJj+vI@G3ltCGOBl2kT$}4NfEie>z6h?Uh!=`c&TL3xm#K1e+BPY+$SHGa(GtxX@l>bv$4vau zH;ZE~mU2vXSiHW*AML3>4`v+XIOo@h&K17zKB~!B?46Pc;go;A$I60I!1pJ#pjP!S zChq=jfL~@Uc%#v#6CUiO{wt2zA8WsN@?7sjQ22Clu7G0o67h+tlfMsi!$uJZCPs-= z12636m~0{AO2gvhY`8nYlP6$byX+wbPCW8kP^7+^!oZ8fVNYHhgKWNnZd~z->mF%Ehtw)bT7hq5D%hAfZpjd2qb7wD#8I|0e94gr{v={7U@@9jh zOavSY4=naH!GqxJOyo0`fsv6B@PLFw4ri)To$xwIa+GIa5(Ys3BvHsJqb(L{t|?KjRDdQqJY~DjPhI2 zeT#EtSU^>#LJvCNc7{kpLnAXnO_gjR{0eF_9D(=}S@8;fu2H2DF-zVoP zBeXisSEM%DKbVHqj`iQ_?UJ8O><35qk=QWT{9lPi%*7ARE^#%!mzn5c)iX0fX#GCV zXGCB@Oaxu}EhDbx)*Y#t)x${fdB^EiLtlIW|0oju51`z2fsJ4i?+ArAp}%I8k95i( zKBx@s#uJC^yvLrh6r7bnAhHrI%sP%iP8g`lCXecE9(Q}&f2;oyIL`$c|FJ?z>)4KP6m1li?0V`5@D6kmSs$FUxf zbb+_5q2053W&`Qx=eOlQek^JylIE@Q!@ksm8z;eCDM&jmHq~fZLs!F(>w=9wCA|~m z*hR3@bF>S@wjd3WC=sLgr7HdGtb;o}(Y1&gbM*bBOrkZB6NW=jhwG?Fhh5AIU~S0C zayJu4H#iIIA`ul|jaXRjh*TIMKhE59g-VfrukO81{f+iBuxz2tc~rP8JBSjlFTRFlmiuN!wkX zw-Uqtr@1KIlr#=kj>;n~iim)U6LYI}%47H{!$Q`SSj)PS^5 zNJ+yz(y^xWGMs8Y?kRylwKOb_VkbppslIK97DPReW~mHvFf_Dd_t2kP}%NpjE^SrHpNJ4^Ak}drCJc5J#;FJ{gZ3{Ed*z zL94#_dw-_t;z^bKVwhwhmf!V?OkS_%ish{$9Nd%|`bxozbm*v4u8W%Bna(}2M{_lbAKpBhquol^RQ{ujB=^}inK$^W#~;}uG&g! zIV1{d4{l_FzdKv1#{}EGM{XcQ!lZ@T#4=dVF?es}9f%E9*wl!NU%vfQyH>s3D_i#a z`|}b?Q8(z1so@Fx7mM}%!iKcxZVIu;a&Q4nN7Bnv(&1@`6uc;px9??}1rsp*hsQV; zCY?27r7sC;e%!An9u16UOv7ChpTEkIy*l zYH7h6%RULmq}j}>KRdAfg*xHS`=Ox$Y)2kWIn&pFKj4ui+&**jL(G=BZi3k5^KY_` zsc5bqaqO45o7{^0xe$i?`D~0;n)fDlFWAciPgJ0lL=d+KbRN(|29*3$Q# zdXM&)=W&@%wupR1gGx>1n$s)r(`(9(uQ@8{Q%*j)`Z}uc@EB=!6kVs+=s`BflQLi< z>x!hy^O8;TY+FelPbV*)6-Z|tEUWtRaJ7>E9oVlnjbxHI z9No-zy@SSLaAL)i+zDxexJpd6+*jK2f`hoqPXXF0zt`4Q^WS8}cFVMdPJEup8d^1W zGR;TGJ#w~r1546G%rU`F*D{L~(n-36c1{etRh~qJ%)IL`y`XpN$%n2P7J8}ca{jKK zb(#=!GK`cRf2cpl{HN-?+wJJn0^Zl1naUx%`@cw9MDbWJg@CKN1mM53X|7kW!wFSf zI%YqupWQW!kLT3Z6~VEVW~+t_#EG}&fSaAp;$!w7C`%2avZ0si8c_@_m_gXrNW&jL zLiIC`cvSQBMi$dDcy04cW==f`tAbGR^J;LQ8l03KYZq#%yjZ#^5zWGA8*6=HJ129s z*<8emb&rGJwX|VLfNA$bFUO}DRhHeePgXxG>^{D}H-C%5iyq|-yT`Ca&|TsOX+&4p zAsmeXWgCAMy(^BmVS?YK%>+9pRB7;q*J9kPj^=Kg7T$J7QNpc#^Y_53Z^OmPT&z%< zZvDF}jF{5$SkeU4`4!5;#7XAm*cas@vXn*NhcYuejdkL5e?VN-;jLM_IBNM7uRb<; zKiZ3fsk>O5VB9;JIbH}alX&zF4U|hR=Hp0L86Rh-Qv3sW^8==f$~J#hujKv%e3;YG zwTmOcA&Qeo3*9VKZ}X(beTVWAYL}bxwsi!~J{rj@I%m;KAkLjN^W8P|4wULBzXt!c zQI^`Rt=skA$>8hnTz^5eVu-UJ;T~2s!2)jCkYUVW*e3l}#c{MbYERuD@^y|0b3ZI5 zzaMU)J=5Xqs~ktG6X)ecL?N@;;mZIFluWVxo&1Zy6)4XI79_rveoq{(pVJFuuY<;N&L!hLcGEC27p&JynRJ;A7gbAvydT_|CKIN?0cynQXq*tyU`Ufy4aP|p zv*t!7cnog4iYc=Ki&Y_}75cM}%`?KT>x~Y()z6?+XQXGOUk&^WlXi&Oxgh~61LdCb zQR={b47kAQ?ps*F#|KEHCs0>cHjnz1h?lOnt++)nba(Mvyh_ z+NNPdjkwXo08^7}HF&m@YK2tbj}lUaihg?kFRB>4C@8%x&K>Vp9vi#x0eFP?`1l0) z{{^o*-Y*S4EjIx*7f3>dP8DK6$Yb}4-q0^v@`0LdF$1qdW8dV)f3GvKn-7%%zdrMP z3}1t0TOS<|m8K1KONE#I-kT7f-OIL_H(5%Xe~X%}4mx80G5d`xoINDgZ|j-6Lh;@P z$6PmG_~n7VoL|~ZxcLE5eL9%E;_o(l!+yH0!kW)M-VSf8Qf+PMcCbTXn0byzu3C9Itb|#By}u2$yOCuq0IR+WT=Of z!YiJ*stMq<-5gt=bldkU+I2Mw^^zeG7)FN!J~Uu*c}}4z*~id5Oxp9VU`E@Nn0Uea z*{_DM@6jg6SQ{JL1#+)g$gJF#YM)oTcv_iC9Qe68YD`Aj%!`EdhgR4f+ht(`6Y&TJ z*}y-aagm<+z-1Q}gK$X=OilV3MeG+4q-?D;^7&RF`kjj;(7{vOji8h4dQ+I@DDddb zt)hR9~RmtsRNsECo9~7cIjV#b-@#DP7!NqInUu6 zJJ-0TkODi;XT#wK__Pl*#Qr4rjg1-G?b{Xq`Uect4Ne2Q;>1)yNUqkXM{QK{V^F!ysncYC9c=Pf>_8J6Z2L$e9W}=+AIm=if(4FK z`2{bn-+$q9Xlie!@**wtRBVv0OV@_IA7`<2amd4e5f@NGRDZ@fZK;3hL%|%9c*SNt zZNZlfWkY_Vlbl__IJeD8Mp=+)CcG!wJpc;yl0%b!HnLR`OkJ_Rky z)hAy}m0Hoqq>D~&n|>MeY}RW68yGg)g-lsPD23FxZw>)&&+u4G{| zNa|xs>ww}J;V*5YP8vlQ2pJq331&OiZ=3E;70)m%&A^S zw-Bx-%e)X%i>xpV8L$j$M<|uiG4Igy-WYkooOxOCSLuD@Tlzl9b^bcnU3?`c)zvH) zL=S%LDZ{3&YY>B~9@S(0Lnkqh@Crt!s@Bw$!hdeVrdtcYzPjM+6~|BrvG*d2QsX=I zi$)R#KPqKu(8{l#(yswgyijGr169tk`dh*KV_VdV`1ANB!ncVeQ*u{XAsM6+RD5O| zJy+at0B(zW@Q?FU!g&nADw7}F8qY8$~ TCESw)Op3gqm4|@(e+&Ny&6i-# literal 0 HcmV?d00001 From 493525bde3269ea6e0d3e318d3d276075c0a7640 Mon Sep 17 00:00:00 2001 From: joannazhang7 Date: Tue, 28 Mar 2023 14:13:12 -0400 Subject: [PATCH 4/9] half working multidrop down --- backend/static/mainpg.css | 14 ++-- backend/templates/main.html | 128 ++++++++++++++++++++++++------------ 2 files changed, 93 insertions(+), 49 deletions(-) diff --git a/backend/static/mainpg.css b/backend/static/mainpg.css index ed7c8a44c..a8845e5e5 100644 --- a/backend/static/mainpg.css +++ b/backend/static/mainpg.css @@ -10,12 +10,10 @@ justify-content: start; align-items: center; flex-direction: column; - /* background-color: #E8DED1; */ } #title { color: #E8DED1 - /* color: black; */ } .website-title{ @@ -33,10 +31,14 @@ } /* MULTISELECT DROPDOWN BOX - START */ +.restaurant-item { + display: none; + } + .searchAndDisplayContainer{ display: flex; justify-content: space-between; - /* border: solid; */ + border: none; } .multiselect{ @@ -48,6 +50,8 @@ .restaurantResults { width: 50%; float: left; + border: none; + outline:none; } label{ @@ -67,10 +71,6 @@ label{ padding: 10px 30px 10px 10px; border-radius: 5px; } - -.restaurantResults{ - border: solid; -} /* MULTISELECT DROPDOWN BOX END */ /* MAPS DROPDOWN BOX START */ diff --git a/backend/templates/main.html b/backend/templates/main.html index fc1776b0d..1294ce59c 100644 --- a/backend/templates/main.html +++ b/backend/templates/main.html @@ -7,6 +7,9 @@ + + +
@@ -28,7 +31,9 @@

CityFood

-
Recommended Restaurants
+ @@ -40,50 +45,89 @@

CityFood

}) - + + From ff65e36565ae9748d1d4952a3dbc10cf30af8c36 Mon Sep 17 00:00:00 2001 From: joannazhang7 Date: Tue, 28 Mar 2023 14:55:30 -0400 Subject: [PATCH 5/9] title page description --- backend/templates/base.html | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/backend/templates/base.html b/backend/templates/base.html index bd32f1a4d..3667d208a 100644 --- a/backend/templates/base.html +++ b/backend/templates/base.html @@ -10,11 +10,8 @@

Welcome to CityFood

-

Lorem ipsum dolor sit amet consectetur - adipisicing elit. Illo labore, iusto, - quam est ipsam doloremque, praesentium - ut aliquid consequatur aspernatur a - ad vero nulla nisi consequuntur.

+

CityFood is a web platform that combines two extremely simple and universal pleasures: travel and food. + Our platform will allow users to explore new cities by discovering new restaurants that match their existing preferences.

Discover More Restaurants From 3d03a751c519a62e58cc4b0818a29eb6b7e28a30 Mon Sep 17 00:00:00 2001 From: joannazhang7 Date: Mon, 17 Apr 2023 16:39:09 -0400 Subject: [PATCH 6/9] user input fields --- backend/app.py | 2 +- backend/static/mainpg.css | 12 +- backend/templates/main.html | 302 ++++++++++++++++++++++++------------ 3 files changed, 210 insertions(+), 106 deletions(-) diff --git a/backend/app.py b/backend/app.py index 7c491cf20..20e492a30 100644 --- a/backend/app.py +++ b/backend/app.py @@ -12,7 +12,7 @@ # Don't worry about the deployment credentials, those are fixed # You can use a different DB name if you want to MYSQL_USER = "root" -MYSQL_USER_PASSWORD = "" +MYSQL_USER_PASSWORD = "peachybums" MYSQL_PORT = 3306 MYSQL_DATABASE = "kardashiandb" diff --git a/backend/static/mainpg.css b/backend/static/mainpg.css index a8845e5e5..3da0b45dc 100644 --- a/backend/static/mainpg.css +++ b/backend/static/mainpg.css @@ -22,7 +22,7 @@ justify-content: center; font-size: 48px; font-family: 'Open Sans', sans-serif; - margin-bottom: 5vh;; + margin-bottom: 5vh; } .website-title h1{ @@ -30,6 +30,7 @@ margin-right: 3px; } + /* MULTISELECT DROPDOWN BOX - START */ .restaurant-item { display: none; @@ -38,7 +39,6 @@ .searchAndDisplayContainer{ display: flex; justify-content: space-between; - border: none; } .multiselect{ @@ -54,8 +54,8 @@ outline:none; } -label{ - display: block; +.label{ + /* display: block; */ font-size: 18px; font-weight: 700; color: #fff; @@ -113,4 +113,6 @@ label{ height: 500px; border-radius: 10px; } -/* MAPS DROPDOWN BOX END */ \ No newline at end of file +/* MAPS DROPDOWN BOX END */ + + diff --git a/backend/templates/main.html b/backend/templates/main.html index 1294ce59c..67a370cd0 100644 --- a/backend/templates/main.html +++ b/backend/templates/main.html @@ -1,7 +1,7 @@ - + @@ -19,118 +19,147 @@

CityFood

- -
-
- + +
+ Cuisine: +
+ + + + + + +
- - - +
- - + -
-

Olive Garden

-

Thompson & Bleecker

-

Taverna Banfi

-

Gola Osteria

-

Ciao Wood-Fired Pizza & Pasta

-
+ + - +

BREAK

+
+
+
- + li:hover { + background-color: #f2f2f2; + } + - +
@@ -177,4 +206,77 @@

CityFood

}) + + + + + + + + \ No newline at end of file From 0f7b276f9e2e3eab93d01c21952287c835e66ad4 Mon Sep 17 00:00:00 2001 From: joannazhang7 Date: Mon, 17 Apr 2023 18:24:02 -0400 Subject: [PATCH 7/9] Update main.html updated front end --- backend/templates/main.html | 85 ++++--------------------------------- 1 file changed, 9 insertions(+), 76 deletions(-) diff --git a/backend/templates/main.html b/backend/templates/main.html index 67a370cd0..85e16565d 100644 --- a/backend/templates/main.html +++ b/backend/templates/main.html @@ -42,8 +42,14 @@

CityFood

{name: 'Carbone', cuisine: 'Italian'}, {name: 'Babbo Ristorante e Enoteca', cuisine: 'Italian'}, {name: 'Osteria Mozza', cuisine: 'Italian'}, - {name: 'MEXICAN', cuisine: 'Mexican'}, - {name: 'CHINESE', cuisine: 'Chinese'} + {name: 'Chipotle', cuisine: 'Mexican'}, + {name: 'Casa Molina Del Norte', cuisine: 'Mexican'}, + {name: 'Happy Wok', cuisine: 'Chinese'}, + {name: 'Slate Bleu Restaurant', cuisine: 'French'}, + {name: 'Maru Global', cuisine: 'Japanese'}, + {name: 'Gangnam Street Food', cuisine: 'Korean'}, + {name: 'Generations Grill', cuisine: 'American'} + ]; const applyFiltersButton = document.getElementById('apply-filters'); @@ -111,7 +117,7 @@

CityFood

list-style: none; padding: 0; margin: 0; - border: 1px solid black; + /* border: 1px solid black; */ } li { @@ -206,77 +212,4 @@

CityFood

}) - - - - - - - - \ No newline at end of file From ced26e046f914d6c8c6febc0603a2377a54f77c2 Mon Sep 17 00:00:00 2001 From: joannazhang7 Date: Mon, 24 Apr 2023 22:55:09 -0400 Subject: [PATCH 8/9] zip code / city entry --- backend/templates/main.html | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/backend/templates/main.html b/backend/templates/main.html index 85e16565d..1f0861093 100644 --- a/backend/templates/main.html +++ b/backend/templates/main.html @@ -49,7 +49,6 @@

CityFood

{name: 'Maru Global', cuisine: 'Japanese'}, {name: 'Gangnam Street Food', cuisine: 'Korean'}, {name: 'Generations Grill', cuisine: 'American'} - ]; const applyFiltersButton = document.getElementById('apply-filters'); @@ -166,6 +165,18 @@

CityFood

} + + + + + + +
+ + + +
+
From c8efd30500c5ab569014b9b96138c55f41a63a8c Mon Sep 17 00:00:00 2001 From: joannazhang7 Date: Tue, 25 Apr 2023 16:47:05 -0400 Subject: [PATCH 9/9] color changes + new inputs --- backend/static/mainpg.css | 4 +++- backend/templates/main.html | 17 +++++++++++++---- 2 files changed, 16 insertions(+), 5 deletions(-) diff --git a/backend/static/mainpg.css b/backend/static/mainpg.css index 3da0b45dc..842766f54 100644 --- a/backend/static/mainpg.css +++ b/backend/static/mainpg.css @@ -10,10 +10,12 @@ justify-content: start; align-items: center; flex-direction: column; + background-color: #EADDCA; } #title { - color: #E8DED1 + /* color: #E8DED1 */ + color: #6F4E37; } .website-title{ diff --git a/backend/templates/main.html b/backend/templates/main.html index 1f0861093..1ee838a07 100644 --- a/backend/templates/main.html +++ b/backend/templates/main.html @@ -20,7 +20,7 @@

CityFood

-
+ -

BREAK

+


@@ -83,7 +83,10 @@

CityFood



- +
+ +
+

@@ -108,6 +111,12 @@

CityFood

+ Target City: +
+ +
+
+