sr-npm 1.7.95 → 1.7.96

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sr-npm",
-  "version": "1.7.95",
+  "version": "1.7.96",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -20,7 +20,9 @@
     "@hisense-staging/velo-npm": "3.0.19",
     "@wix/data": "^1.0.211",
     "@wix/essentials": "^0.1.24",
-    "@wix/secrets": "^1.0.53"
+    "@wix/secrets": "^1.0.53",
+    "@wix/site-location": "^1.0.0",
+    "@wix/site-window": "^1.0.0"
   },
   "devDependencies": {
     "prettier": "^3.6.2"

package/pages/careersPage.js

@@ -0,0 +1,244 @@
+const { getAllPositions } = require('../backend/queries');
+const {wixData} = require('wix-data');
+const { window } = require('@wix/site-window');
+const { query,queryParams,to } = require("wix-location-frontend");
+const {
+    debounce,
+    getFilter,
+  } = require('../public/filterUtils');
+
+  let currentLoadedItems =100;
+  const itemsPerPage = 100;
+  let allJobs=[]
+  const RESET_ALL = 'RESET_ALL';
+  let pageParamSet=0;
+  let thisObjectVar;
+  let queryPageVar;
+  let queryKeyWordVar;
+
+
+async function careersPageOnReady(_$w,thisObject,queryPage,queryKeyWord) {
+queryPageVar=queryPage;
+queryKeyWordVar=queryKeyWord;
+thisObjectVar=thisObject;
+allJobs=await getAllPositions();
+await handleUrlParams(_$w);
+await activateAutoLoad(_$w);
+await bind(_$w);
+await init(_$w);
+
+}
+
+  
+function activateAutoLoad(_$w)
+{
+    _$w("#jobsDataset").onReady(() => {
+        updateCount(_$w);
+        _$w("#section2").onViewportEnter(() => {
+            if (currentLoadedItems<_$w("#jobsDataset").getTotalCount()) {
+                loadMoreJobs(_$w);  
+            }   
+            else {
+                console.log("no more jobs")
+            }        
+        });
+    });  
+}
+
+async function loadMoreJobs(_$w) {
+    //const query = await location.query();
+    let shouldLoad = false;
+    if (pageParamSet == 0) {
+        shouldLoad = true;
+    } else if (query.page % 2 == pageParamSet % 2) {
+        shouldLoad = true;
+    } else {
+        pageParamSet = Number(pageParamSet) + 1;
+    }
+    if (shouldLoad) {
+        _$w("#jobsDataset").loadMore();
+        console.log("loading more jobs");
+        currentLoadedItems = currentLoadedItems + itemsPerPage;
+        const data = _$w("#positionsRepeater").data;
+        console.log("data length is :    ", data.length);
+        setPageParamInUrl();
+    }
+}
+
+
+async function setPageParamInUrl() {
+    if(queryPageVar){
+        queryParams.add({ page: Number(queryPageVar) + 1 })
+        queryPageVar=Number(queryPageVar) + 1
+    }
+    else{
+        queryParams.add({ page: 2 })
+        queryPageVar=2
+    }
+
+   
+}
+async function handleUrlParams(_$w) {
+   // const query = await location.query();
+    if (queryKeyWordVar) {
+        await handleKeyWordParam(_$w,queryKeyWordVar);
+    }
+    if (queryPageVar) {
+        await handlePageParam(_$w);
+        
+    }
+}
+
+async function handleKeyWordParam(_$w,keyWord) {
+    _$w('#searchInput').value = keyWord;
+    //const filter = await wixData.query("Jobs").contains("title", keyWord);
+    await $w("#jobsDataset").setFilter(wixData.filter().contains("title", keyWord));
+    await _$w("#jobsDataset").refresh();
+}
+
+async function handlePageParam(_$w) {
+    
+    if(allJobs.length/itemsPerPage<queryPageVar){
+        console.log(`max page is: ${allJobs.length/itemsPerPage}`)
+        queryParams.add({ page: allJobs.length/itemsPerPage }) 
+    }
+    if(queryPageVar<=1){
+        console.log("min page is  : 2")
+        pageParamSet=2;
+        queryParams.add({ page: 2 })
+    }
+    if (queryPageVar) {   
+        pageParamSet=queryPageVar;
+        //scrolls a bit to load the dataset data
+        await window.scrollTo(0, 200,{scrollAnimation:false});
+        for (let i = 2; i <= queryPageVar; i++) {
+           await _$w("#jobsDataset").loadMore();
+            currentLoadedItems=currentLoadedItems+itemsPerPage
+        }
+        // the timeout is to wait for the repeater to render, then scroll to the last item.
+            setTimeout(() => {
+            const data = _$w("#positionsRepeater").data;
+            if (data && data.length > 0) {
+                //the dataset each time it loads 100 items
+                const lastIndex = data.length - itemsPerPage;
+                _$w("#positionsRepeater").forEachItem(async ($item, itemData, index) => {
+                    if (index === lastIndex) {
+                        await $item("#positionItem").scrollTo();
+                        console.log("finishied scrolling inside handlePageParam")
+                    }
+                });
+            }
+        }, 200); 
+        }
+    
+}
+
+async function bind(_$w) {
+	await _$w('#jobsDataset').onReady(async () => {
+		await updateCount(_$w);
+		
+	});
+
+	if (await window.formFactor === "Mobile") {
+		_$w('#dropdownsContainer').collapse();
+    } 
+
+	_$w('#positionsRepeater').onItemReady(async ($item, itemData) => {
+		$item('#positionItem').onClick(() => {
+			to(`${itemData['link-jobs-title']}`);
+		});
+	});
+}
+
+function init(_$w) {
+    const debouncedSearch = debounce(()=>applyFilters(_$w), 400,thisObjectVar);
+    
+    _$w('#searchInput').onInput(debouncedSearch);
+    _$w('#dropdownDepartment, #dropdownLocation, #dropdownJobType').onChange(()=>applyFilters(_$w));
+	_$w('#resetFiltersButton, #clearSearch').onClick(()=>resetFilters(_$w));
+
+	_$w('#openFiltersButton').onClick(()=>{
+		_$w('#dropdownsContainer, #closeFiltersButton').expand();
+	});
+
+	_$w('#closeFiltersButton').onClick(()=>{
+		_$w('#dropdownsContainer, #closeFiltersButton').collapse();
+	});
+}
+
+async function applyFilters(_$w) {
+
+	const dropdownFiltersMapping = [
+		{ elementId: '#dropdownDepartment', field: 'department', value: _$w('#dropdownDepartment').value },
+		{ elementId: '#dropdownLocation', field: 'cityText', value: _$w('#dropdownLocation').value },
+		{ elementId: '#dropdownJobType', field: 'remote', value: _$w('#dropdownJobType').value},
+		{ elementId: '#searchInput', field: 'title', value: _$w('#searchInput').value }
+		];
+
+	let filters = [];
+	let value;
+	
+	dropdownFiltersMapping.forEach(filter => {
+		// Handle RESET_ALL values
+		if (filter.value === RESET_ALL) {
+			_$w(filter.elementId).value = '';
+			filter.value = '';
+		}
+
+		// build filters
+		if (filter.value && filter.value.trim() !== '') {
+      if(filter.field === 'title'){
+         queryParams.add({ keyWord: filter.value });
+      }
+			if(filter.field === 'remote') {	
+				value = filter.value === 'true';
+			} else {
+				value = filter.value;
+			}
+			filters.push({ field: filter.field, searchTerm: value });
+		}
+    else{
+        queryParams.remove(["keyWord" ]);
+    }
+	});
+	
+	const filter = await getFilter(filters, 'and');
+	
+    await _$w('#jobsDataset').setFilter(filter);
+    await _$w('#jobsDataset').refresh();
+    
+	const count = await updateCount(_$w);
+    
+    count ? _$w('#resultsMultiState').changeState('results') : _$w('#resultsMultiState').changeState('noResults');
+    
+    // Update reset button state
+	const hasActiveFilters = filters.length > 0;
+	hasActiveFilters? _$w('#resetFiltersButton').enable() : _$w('#resetFiltersButton').disable();
+}
+
+async function resetFilters(_$w) {
+	_$w('#searchInput, #dropdownDepartment, #dropdownLocation, #dropdownJobType').value = '';
+
+    await _$w('#jobsDataset').setFilter(wixData.filter());
+    await _$w('#jobsDataset').refresh();
+
+	_$w('#resultsMultiState').changeState('results');
+
+	_$w('#resetFiltersButton').disable();
+
+	await updateCount(_$w);
+}
+
+async function updateCount(_$w) {
+	const count = await _$w('#jobsDataset').getTotalCount();
+    _$w('#numOfPositionText').text = `Showing ${count} Open Positions`;
+
+	return count;
+}
+
+
+
+
+module.exports = {
+    careersPageOnReady,
+  };

package/pages/homePage.js

@@ -0,0 +1,110 @@
+const {
+    debounce,
+    getFilter,
+  } = require('../public/filterUtils');
+  const { handleOnLocationClick } = require('../public/mapUtils');
+const { location } = require('@wix/site-location');
+let thisObjectVar;
+async function homePageOnReady(_$w,thisObject) {
+    thisObjectVar=thisObject;
+    await bind(_$w);
+    await init(_$w);
+    
+  }
+
+  function bind(_$w) {
+    _$w('#teamRepeater').onItemReady(($item, itemData) => {
+        $item('#teamButton').label = `View ${itemData.count} Open Positions`;
+    });
+
+    _$w('#citiesDataset').onReady(async () => {
+        const numOfItems = await _$w('#citiesDataset').getTotalCount();
+        const items = await _$w('#citiesDataset').getItems(0, numOfItems);
+        let baseUrl = await location.baseUrl();
+        const linkUrl = `${baseUrl}/positions`;
+
+        const markers = items.items.map(item => {
+            const location = item.locationAddress.location;
+            return {
+                location: {
+                    latitude: location.latitude,
+                    longitude: location.longitude
+                },
+                address: item.locationAddress.formatted,
+                description: `<a href=${linkUrl} target="_parent" rel="noopener noreferrer" style="color:#000000;text-decoration:underline;font-weight:bold;">View ${item.count} Open Positions</a>`
+            };
+        });
+        //@ts-ignore
+        _$w('#googleMaps').setMarkers(markers);
+    });
+}
+
+function init(_$w) {
+    const debouncedInput = debounce(()=>handleSearchInput(_$w), 400,thisObjectVar);
+
+    _$w('#searchInput').onInput(debouncedInput);
+    _$w('#searchInput').maxLength = 40;
+    
+    _$w('#searchInput').onKeyPress((event) => {
+        if (event.key === 'Enter') {
+            handleEnterPress(_$w('#searchInput').value);
+        }
+    });
+
+    _$w('#searchInput').onFocus(() => {
+        if (_$w(`#resultsContainer`).collapsed) {
+            _$w(`#resultsContainer`).expand();
+        }
+    });
+
+    _$w('#searchInput').onBlur(() => {
+        setTimeout(() => {
+            if (!_$w(`#resultsContainer`).collapsed) {
+                _$w(`#resultsContainer`).collapse();
+            }
+        }, 250);
+    });
+
+    _$w('#locationItem').onClick((event)=>{
+        handleOnLocationClick(event, '#locationsRepeater', '#googleMaps', _$w);
+    });
+}
+
+async function handleSearchInput(_$w) {
+    let searchInput;
+    let count;
+
+    searchInput = _$w('#searchInput').value;
+    const trimmedInput = searchInput.trim();
+
+    const fieldsToSearch = [
+        { field: 'title', searchTerm: trimmedInput }, 
+        { field: 'cityText', searchTerm: trimmedInput }
+    ];
+    
+    const filter = await getFilter(fieldsToSearch, 'or');
+
+    await _$w('#jobsDataset').setFilter(filter);
+    await _$w('#jobsDataset').refresh();
+
+    count = _$w('#jobsDataset').getTotalCount();
+
+    if (count > 0) {
+        _$w('#resultsContainer').expand();
+        _$w('#searchMultiStateBox').changeState('results');
+    } else {
+        _$w('#searchMultiStateBox').changeState('noResults');
+    }
+}
+
+function handleEnterPress(searchInput) {
+    const trimmedInput = searchInput.trim();
+    
+    if (trimmedInput) {
+        location.to(`/positions?keyWord=${trimmedInput}`);
+    }
+}
+
+module.exports = {
+    homePageOnReady,
+  };

package/pages/index.js

@@ -1,4 +1,6 @@
 module.exports = {
     ...require('./positionPage'),
+    ...require('./homePage'),
+    ...require('./careersPage'),
   };
   

package/pages/positionPage.js

@@ -3,8 +3,8 @@ const {
   } = require('../public/utils');
 
   async function positionPageOnReady(_$w) {
-    
-    bind(_$w);
+
+    await bind(_$w);
   }
 
   function bind(_$w) {

package/public/filterUtils.js

@@ -0,0 +1,40 @@
+//const { items:wixData } = require('@wix/data');
+const {wixData} = require('wix-data');
+
+
+function getFilter(fieldsToSearch = [], mode = 'or') {
+    const baseFilter = wixData.filter();
+    // if no fields to search, return empty filter
+    if (fieldsToSearch.length === 0) {
+        return baseFilter;
+    }
+
+    // build filters
+    let filter;
+    fieldsToSearch.forEach(({ field, searchTerm }) => {
+        const condition = typeof searchTerm === 'boolean' 
+            ? baseFilter.eq(field, searchTerm)
+            : baseFilter.contains(field, searchTerm);
+
+        filter = filter
+            ? (mode === 'or' ? filter.or(condition) : filter.and(condition))
+            : condition;
+    });
+
+    return filter;
+}
+
+function debounce(fn, delay = 400,thisObject) {
+    let timeout;
+    return function (...args) {
+        clearTimeout(timeout);
+        console.log("thisObject is: ", thisObject);
+        console.log("args is: ", args);
+        timeout = setTimeout(() => fn.apply(thisObject, args), delay);
+    };
+}
+
+module.exports = {
+    getFilter,
+    debounce
+  };

package/public/index.js

@@ -1,4 +1,6 @@
 module.exports = {
     ...require('./utils'),
+    ...require('./filterUtils'),
+    ...require('./mapUtils'),
   };
   

package/public/mapUtils.js

@@ -0,0 +1,16 @@
+function handleOnLocationClick(event, repeaterId, mapId, _$w) {
+    const FOCUS_ZOOM = 13;
+    const { itemId } = event.context;
+    const itemData = _$w(repeaterId).data.find(item => item._id === itemId);
+
+    const location = itemData.locationAddress.location;
+  
+    //@ts-ignore
+    _$w(mapId).setCenter(location);
+    //@ts-ignore
+    _$w(mapId).setZoom(FOCUS_ZOOM);
+}
+
+module.exports = {
+    handleOnLocationClick
+  };