File indexing completed on 2024-05-12 06:01:03
0001 "use strict"; 0002 0003 window.appHelpers = function () { 0004 0005 function convertObjectToArray(object) { 0006 var newArray = []; 0007 for (var i in object) { 0008 newArray.push(object[i]); 0009 } 0010 return newArray; 0011 } 0012 0013 function getSelectedCategory(categories, categoryId) { 0014 var selectedCategory = void 0; 0015 categories.forEach(function (cat, catIndex) { 0016 if (!selectedCategory) { 0017 if (parseInt(cat.id) === categoryId) { 0018 selectedCategory = cat; 0019 } else { 0020 if (cat.has_children === true) { 0021 var catChildren = appHelpers.convertObjectToArray(cat.children); 0022 selectedCategory = appHelpers.getSelectedCategory(catChildren, categoryId); 0023 } 0024 } 0025 } 0026 }); 0027 return selectedCategory; 0028 } 0029 0030 function getCategoryType(selectedCategories, selectedCategoryId, categoryId) { 0031 var categoryType = void 0; 0032 if (parseInt(categoryId) === selectedCategoryId) { 0033 categoryType = "selected"; 0034 } else { 0035 selectedCategories.forEach(function (selectedCat, index) { 0036 if (selectedCat.id === categoryId) { 0037 categoryType = "parent"; 0038 } 0039 }); 0040 } 0041 return categoryType; 0042 } 0043 0044 function generateCategoryLink(baseUrl, urlContext, catId, locationHref) { 0045 if (window.baseUrl !== window.location.origin) { 0046 baseUrl = window.location.origin; 0047 } 0048 var link = baseUrl + urlContext + "/browse/"; 0049 if (catId !== "all") { 0050 link += "cat/" + catId + "/"; 0051 } 0052 if (locationHref.indexOf('ord') > -1) { 0053 link += "ord/" + locationHref.split('/ord/')[1]; 0054 } 0055 return link; 0056 } 0057 0058 function sortArrayAlphabeticallyByTitle(a, b) { 0059 var titleA = a.title.toLowerCase(); 0060 var titleB = b.title.toLowerCase(); 0061 if (titleA < titleB) { 0062 return -1; 0063 } 0064 if (titleA > titleB) { 0065 return 1; 0066 } 0067 return 0; 0068 } 0069 0070 function getDeviceFromWidth(width) { 0071 var device = void 0; 0072 if (width >= 910) { 0073 device = "large"; 0074 } else if (width < 910 && width >= 610) { 0075 device = "mid"; 0076 } else if (width < 610) { 0077 device = "tablet"; 0078 } 0079 return device; 0080 } 0081 0082 function getUrlContext(href) { 0083 var urlContext = ""; 0084 if (href.indexOf('/s/') > -1) { 0085 urlContext = "/s/" + href.split('/s/')[1].split('/')[0]; 0086 } 0087 return urlContext; 0088 } 0089 0090 function getAllCatItemCssClass(href, baseUrl, urlContext, categoryId) { 0091 if (baseUrl !== window.location.origin) { 0092 baseUrl = window.location.origin; 0093 } 0094 var allCatItemCssClass = void 0; 0095 if (categoryId && categoryId !== 0) { 0096 allCatItemCssClass = ""; 0097 } else { 0098 if (href === baseUrl + urlContext || href === baseUrl + urlContext + "/browse/" || href === baseUrl + urlContext + "/browse/ord/latest/" || href === baseUrl + urlContext + "/browse/ord/top/" || href === "https://store.kde.org" || href === "https://store.kde.org/browse/ord/latest/" || href === "https://store.kde.org/browse/ord/top/" || href === "https://addons.videolan.org" || href === "https://addons.videolan.org/browse/ord/latest/" || href === "https://addons.videolan.org/browse/ord/top/" || href === "https://share.krita.org/" || href === "https://share.krita.org/browse/ord/latest/" || href === "https://share.krita.org/browse/ord/top/") { 0099 allCatItemCssClass = "active"; 0100 } 0101 } 0102 return allCatItemCssClass; 0103 } 0104 0105 return { 0106 convertObjectToArray: convertObjectToArray, 0107 getSelectedCategory: getSelectedCategory, 0108 getCategoryType: getCategoryType, 0109 generateCategoryLink: generateCategoryLink, 0110 sortArrayAlphabeticallyByTitle: sortArrayAlphabeticallyByTitle, 0111 getDeviceFromWidth: getDeviceFromWidth, 0112 getUrlContext: getUrlContext, 0113 getAllCatItemCssClass: getAllCatItemCssClass 0114 }; 0115 }(); 0116 "use strict"; 0117 0118 var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }(); 0119 0120 var _createClass = 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, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); 0121 0122 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } 0123 0124 function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } 0125 0126 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } 0127 0128 var CategoryTree = function (_React$Component) { 0129 _inherits(CategoryTree, _React$Component); 0130 0131 function CategoryTree(props) { 0132 _classCallCheck(this, CategoryTree); 0133 0134 var _this = _possibleConstructorReturn(this, (CategoryTree.__proto__ || Object.getPrototypeOf(CategoryTree)).call(this, props)); 0135 0136 _this.state = { 0137 categories: window.catTree, 0138 categoryId: window.categoryId, 0139 catTreeCssClass: "", 0140 selectedCategories: [], 0141 showCatTree: false, 0142 backendView: window.backendView, 0143 loading: true 0144 }; 0145 _this.getSelectedCategories = _this.getSelectedCategories.bind(_this); 0146 _this.updateDimensions = _this.updateDimensions.bind(_this); 0147 _this.toggleCatTree = _this.toggleCatTree.bind(_this); 0148 return _this; 0149 } 0150 0151 _createClass(CategoryTree, [{ 0152 key: "componentWillMount", 0153 value: function componentWillMount() { 0154 this.updateDimensions(); 0155 } 0156 }, { 0157 key: "componentWillUnmount", 0158 value: function componentWillUnmount() { 0159 window.removeEventListener("resize", this.updateDimensions); 0160 } 0161 }, { 0162 key: "componentDidMount", 0163 value: function componentDidMount() { 0164 window.addEventListener("resize", this.updateDimensions); 0165 var urlContext = appHelpers.getUrlContext(window.location.href); 0166 this.setState({ urlContext: urlContext }, function () { 0167 if (this.state.categoryId && this.state.categoryId !== 0) { 0168 this.getSelectedCategories(this.state.categories, this.state.categoryId); 0169 } else { 0170 this.setState({ loading: false }); 0171 } 0172 }); 0173 } 0174 }, { 0175 key: "getSelectedCategories", 0176 value: function getSelectedCategories(categories, catId) { 0177 var selectedCategory = appHelpers.getSelectedCategory(this.state.categories, catId); 0178 var selectedCategories = this.state.selectedCategories; 0179 if (typeof selectedCategory !== 'undefined') { 0180 selectedCategory.selectedIndex = selectedCategories.length; 0181 selectedCategories.push(selectedCategory); 0182 } 0183 this.setState({ selectedCategories: selectedCategories }, function () { 0184 if (selectedCategory && selectedCategory.parent_id) { 0185 this.getSelectedCategories(categories, parseInt(selectedCategory.parent_id)); 0186 } else { 0187 this.setState({ loading: false }); 0188 } 0189 }); 0190 } 0191 }, { 0192 key: "updateDimensions", 0193 value: function updateDimensions() { 0194 var device = appHelpers.getDeviceFromWidth(window.innerWidth); 0195 this.setState({ device: device }); 0196 } 0197 }, { 0198 key: "toggleCatTree", 0199 value: function toggleCatTree() { 0200 var showCatTree = this.state.showCatTree === true ? false : true; 0201 var catTreeCssClass = this.state.catTreeCssClass === "open" ? "" : "open"; 0202 this.setState({ showCatTree: showCatTree, catTreeCssClass: catTreeCssClass }); 0203 } 0204 }, { 0205 key: "render", 0206 value: function render() { 0207 var categoryTreeDisplay = void 0, 0208 selectedCategoryDisplay = void 0; 0209 if (!this.state.loading) { 0210 0211 if (this.state.device === "tablet" && this.state.selectedCategories && this.state.selectedCategories.length > 0) { 0212 selectedCategoryDisplay = React.createElement(SelectedCategory, { 0213 categoryId: this.state.categoryId, 0214 selectedCategory: this.state.selectedCategories[0], 0215 selectedCategories: this.state.selectedCategories, 0216 onCatTreeToggle: this.toggleCatTree 0217 }); 0218 } 0219 if (this.state.device === "tablet" && this.state.showCatTree || this.state.device !== "tablet" || this.state.selectedCategories && this.state.selectedCategories.length === 0) { 0220 if (this.state.categories) { 0221 var self = this; 0222 var categoryTree = this.state.categories.sort(appHelpers.sortArrayAlphabeticallyByTitle).map(function (cat, index) { 0223 return React.createElement(CategoryItem, { 0224 key: index, 0225 category: cat, 0226 categoryId: self.state.categoryId, 0227 urlContext: self.state.urlContext, 0228 selectedCategories: self.state.selectedCategories, 0229 backendView: self.state.backendView 0230 }); 0231 }); 0232 0233 var allCatItemCssClass = appHelpers.getAllCatItemCssClass(window.location.href, window.baseUrl, this.state.urlContext, this.state.categoryId); 0234 var baseUrl = void 0; 0235 if (window.baseUrl !== window.location.origin) { 0236 baseUrl = window.location.origin; 0237 } 0238 0239 var categoryItemLink = appHelpers.generateCategoryLink(window.baseUrl, this.state.urlContext, "all", window.location.href); 0240 0241 categoryTreeDisplay = React.createElement( 0242 "ul", 0243 { className: "main-list" }, 0244 React.createElement( 0245 "li", 0246 { className: "cat-item" + " " + allCatItemCssClass }, 0247 React.createElement( 0248 "a", 0249 { href: categoryItemLink }, 0250 React.createElement( 0251 "span", 0252 { className: "title" }, 0253 "All" 0254 ) 0255 ) 0256 ), 0257 categoryTree 0258 ); 0259 } 0260 } 0261 } 0262 0263 return React.createElement( 0264 "div", 0265 { id: "category-tree", className: this.state.device + " " + this.state.catTreeCssClass }, 0266 selectedCategoryDisplay, 0267 categoryTreeDisplay 0268 ); 0269 } 0270 }]); 0271 0272 return CategoryTree; 0273 }(React.Component); 0274 0275 var CategoryItem = function (_React$Component2) { 0276 _inherits(CategoryItem, _React$Component2); 0277 0278 function CategoryItem(props) { 0279 _classCallCheck(this, CategoryItem); 0280 0281 var _this2 = _possibleConstructorReturn(this, (CategoryItem.__proto__ || Object.getPrototypeOf(CategoryItem)).call(this, props)); 0282 0283 _this2.state = { 0284 showSubmenu: false 0285 }; 0286 _this2.toggleSubmenu = _this2.toggleSubmenu.bind(_this2); 0287 return _this2; 0288 } 0289 0290 _createClass(CategoryItem, [{ 0291 key: "toggleSubmenu", 0292 value: function toggleSubmenu() { 0293 console.log('toggle sub menu'); 0294 var showSubmenu = this.state.showSubmenu === true ? false : true; 0295 console.log(showSubmenu); 0296 this.setState({ showSubmenu: showSubmenu }); 0297 } 0298 }, { 0299 key: "render", 0300 value: function render() { 0301 var categoryChildrenDisplay = void 0; 0302 0303 var categoryType = appHelpers.getCategoryType(this.props.selectedCategories, this.props.categoryId, this.props.category.id); 0304 if (this.props.category.has_children === true && categoryType && this.props.lastChild !== true || this.props.category.has_children === true && this.props.backendView === true && this.state.showSubmenu === true) { 0305 0306 var self = this; 0307 0308 var lastChild = void 0; 0309 if (categoryType === "selected") { 0310 lastChild = true; 0311 } 0312 0313 var children = appHelpers.convertObjectToArray(this.props.category.children); 0314 var categoryChildren = children.sort(appHelpers.sortArrayAlphabeticallyByTitle).map(function (cat, index) { 0315 return React.createElement(CategoryItem, { 0316 key: index, 0317 category: cat, 0318 categoryId: self.props.categoryId, 0319 urlContext: self.props.urlContext, 0320 selectedCategories: self.props.selectedCategories, 0321 lastChild: lastChild, 0322 parent: self.props.category, 0323 backendView: self.props.backendView 0324 }); 0325 }); 0326 0327 categoryChildrenDisplay = React.createElement( 0328 "ul", 0329 null, 0330 categoryChildren 0331 ); 0332 } 0333 0334 var categoryItemClass = "cat-item"; 0335 if (this.props.categoryId === parseInt(this.props.category.id)) { 0336 categoryItemClass += " active"; 0337 } 0338 0339 var productCountDisplay = void 0; 0340 if (this.props.category.product_count !== "0") { 0341 productCountDisplay = this.props.category.product_count; 0342 } 0343 0344 var categoryItemLink = appHelpers.generateCategoryLink(window.baseUrl, this.props.urlContext, this.props.category.id, window.location.href); 0345 0346 var catItemContentDisplay = void 0; 0347 if (this.props.backendView === true) { 0348 0349 var submenuToggleDisplay = void 0; 0350 if (this.props.category.has_children === true) { 0351 console.log(this.props.category.title); 0352 console.log(this.props.category.has_children); 0353 if (this.state.showSubmenu === true) { 0354 submenuToggleDisplay = "[-]"; 0355 } else { 0356 submenuToggleDisplay = "[+]"; 0357 } 0358 } 0359 0360 catItemContentDisplay = React.createElement( 0361 "span", 0362 null, 0363 React.createElement( 0364 "span", 0365 { className: "title" }, 0366 React.createElement( 0367 "a", 0368 { href: categoryItemLink }, 0369 this.props.category.title 0370 ) 0371 ), 0372 React.createElement( 0373 "span", 0374 { className: "product-counter" }, 0375 productCountDisplay 0376 ), 0377 React.createElement( 0378 "span", 0379 { className: "submenu-toggle", onClick: this.toggleSubmenu }, 0380 submenuToggleDisplay 0381 ) 0382 ); 0383 } else { 0384 catItemContentDisplay = React.createElement( 0385 "a", 0386 { href: categoryItemLink }, 0387 React.createElement( 0388 "span", 0389 { className: "title" }, 0390 this.props.category.title 0391 ), 0392 React.createElement( 0393 "span", 0394 { className: "product-counter" }, 0395 productCountDisplay 0396 ) 0397 ); 0398 } 0399 0400 return React.createElement( 0401 "li", 0402 { id: "cat-" + this.props.category.id, className: categoryItemClass }, 0403 catItemContentDisplay, 0404 categoryChildrenDisplay 0405 ); 0406 } 0407 }]); 0408 0409 return CategoryItem; 0410 }(React.Component); 0411 0412 var SelectedCategory = function (_React$Component3) { 0413 _inherits(SelectedCategory, _React$Component3); 0414 0415 function SelectedCategory(props) { 0416 _classCallCheck(this, SelectedCategory); 0417 0418 var _this3 = _possibleConstructorReturn(this, (SelectedCategory.__proto__ || Object.getPrototypeOf(SelectedCategory)).call(this, props)); 0419 0420 _this3.state = {}; 0421 return _this3; 0422 } 0423 0424 _createClass(SelectedCategory, [{ 0425 key: "render", 0426 value: function render() { 0427 var selectedCategoryDisplay = void 0; 0428 if (this.props.selectedCategory) { 0429 selectedCategoryDisplay = React.createElement( 0430 "a", 0431 { onClick: this.props.onCatTreeToggle }, 0432 this.props.selectedCategory.title 0433 ); 0434 } 0435 0436 var selectedCategoriesDisplay = void 0; 0437 if (this.props.selectedCategories) { 0438 var selectedCategoriesReverse = this.props.selectedCategories.slice(0); 0439 selectedCategoriesDisplay = selectedCategoriesReverse.reverse().map(function (sc, index) { 0440 return React.createElement( 0441 "a", 0442 { key: index }, 0443 sc.title 0444 ); 0445 }); 0446 } 0447 0448 return React.createElement( 0449 "div", 0450 { onClick: this.props.onCatTreeToggle, id: "selected-category-tree-item" }, 0451 selectedCategoriesDisplay, 0452 React.createElement("span", { className: "selected-category-arrow-down" }) 0453 ); 0454 } 0455 }]); 0456 0457 return SelectedCategory; 0458 }(React.Component); 0459 0460 function CategorySidePanel() { 0461 var _React$useState = React.useState(window.catTree), 0462 _React$useState2 = _slicedToArray(_React$useState, 2), 0463 categories = _React$useState2[0], 0464 setCategoies = _React$useState2[1]; 0465 0466 var _React$useState3 = React.useState(window.categoryId), 0467 _React$useState4 = _slicedToArray(_React$useState3, 2), 0468 categoryId = _React$useState4[0], 0469 setCategoryId = _React$useState4[1]; 0470 0471 var _React$useState5 = React.useState(''), 0472 _React$useState6 = _slicedToArray(_React$useState5, 2), 0473 catTreeSccClass = _React$useState6[0], 0474 setCatTreeCssClass = _React$useState6[1]; 0475 0476 var _React$useState7 = React.useState(false), 0477 _React$useState8 = _slicedToArray(_React$useState7, 2), 0478 showCatTree = _React$useState8[0], 0479 setShowCatTree = _React$useState8[1]; 0480 0481 var _React$useState9 = React.useState(window.backendView), 0482 _React$useState10 = _slicedToArray(_React$useState9, 2), 0483 backendView = _React$useState10[0], 0484 setBackendView = _React$useState10[1]; 0485 0486 var _React$useState11 = React.useState(true), 0487 _React$useState12 = _slicedToArray(_React$useState11, 2), 0488 loading = _React$useState12[0], 0489 setLoading = _React$useState12[1]; 0490 0491 console.log(categories); 0492 0493 return React.createElement( 0494 "div", 0495 { id: "sidebar-container" }, 0496 React.createElement(CategoryTree, null), 0497 React.createElement( 0498 "div", 0499 { id: "category-menu-panels-container" }, 0500 React.createElement("div", { id: "category-menu-panels-slider" }) 0501 ) 0502 ); 0503 } 0504 0505 ReactDOM.render(React.createElement(CategorySidePanel, null), document.getElementById('category-tree-container'));