Locksmith Integration Guide
Here is the guide for Locksmith Integration with Boost Product Filter & Search app.
In this article
About Locksmith
1
App Information
- Locksmith allows access control, for anything in the online store.
- App details: https://apps.shopify.com/locksmith
2
Integration Benefit
- The integration between Locksmith and Boost Filter will set up navigation and search while creating specific keys to let different people access specific allowed content.
Demo of Locksmith Integration
Here is one of our customers' stores with our app and Locksmith integration
Instruction
Attention: The current document only works with the new front-end lib from Boost Commerce. Please read this document first to know if you are using the latest version.
This integration impacts product display, not filter display.
InstantSearchApi.afterCallAsync = function(result, callbackInstantSearchApi) {
/* Call 3rd party api */
if (typeof window.Locksmith === 'object' && result.products.length > 0) {
var URLs = []
var URLsCollection = []
var totalUrls = []
var grantedAccess = []
var grantedAccessCollection = []
//Create an array of products URLs
for(var i = 0; i < result.products.length; i ++){
URLs.push('/products/' + result.products[i].handle);
}
for(var i = 0; i < result.collections.length; i ++){
URLsCollection.push('/collections/' + result.collections[i].handle);
}
totalUrls = URLs.concat(URLsCollection)
jQ.ajax({
method: 'GET',
url: '/apps/locksmith/api/resources',
data: { urls: totalUrls,},
timeout: 1500,
async: false,
success: function(response) {
try {
var resources = JSON.parse(response);
for(var i = 0; i < URLs.length; i ++){
//Checks that the response exists
if(resources[URLs[i]]){
//Checks that the access of the product has been granted
if(resources[URLs[i]].access_granted || resources[URLs[i]].manual_lock){
//If the product is accesible add it to the array of the products
grantedAccess.push(result.products[i])
}
}
}
//Change array of products
result.products = grantedAccess;
//Same for collections
for(var i = 0; i < URLsCollection.length; i ++){
//Checks that the response exists
if(resources[URLsCollection[i]]){
//Checks that the access of the product has been granted
if(resources[URLsCollection[i]].access_granted || resources[URLsCollection[i]].manual_lock){
//If the product is accesible add it to the array of the products
grantedAccessCollection.push(result.collections[i])
}
}
}
//Change array of collections
result.collections = grantedAccessCollection;
/* Build everything after getting instant search data */
callbackInstantSearchApi(result);
} catch (error) {
console.error(error);
callbackFilterApi(result);
}
},
error: function() {
/* Build everything after getting instant search data */
callbackInstantSearchApi(result);
},
});
} else {
callbackInstantSearchApi(result);
}
}
Copy the following code, then paste it to the end of the boost-pfs-filter.js file:
FilterApi.afterCallAsync = function(result, callbackFilterApi) {
/* Call 3rd party api */
if (typeof window.Locksmith === 'object' && result.products.length > 0) {
var URLs = []
//Create an array of products URLs
for(var i = 0; i < result.products.length; i ++){
URLs.push('/products/' + result.products[i].handle);
}
var chunk = 20;
var counter = 0;
var URLsChunks = [];
//Divide array into chuncks of 20, more than 20 cause an error in the request.
for (var i=0; i< URLs.length ; i+=chunk) {
URLsChunks.push(URLs.slice(i,i+chunk));
}
var grantedAccess = new Array(result.products.length);
URLsChunks.forEach(function(URLsChunk , index){
jQ.ajax({
method: 'GET',
url: '/apps/locksmith/api/resources',
data: { urls: URLsChunk,},
timeout: 1500,
async: false,
success: function(response) {
try {
var resources = JSON.parse(response);
//Temp arrayForSavingProducts
var accesibleProducts = [];
for(var i = 0; i < URLsChunk.length; i ++){
//Checks that the response exists
if(resources[URLsChunk[i]].access_granted || resources[URLsChunk[i]].manual_lock){
//Checks that the access of the product has been granted
if(resources[URLsChunk[i]].access_granted){
//If the product is accesible add it to the array of the products
grantedAccess.splice( (chunk * index) + i , 1 , result.products[(chunk * index) + i])
}
}
counter ++;
}
if(counter === result.products.length){
var removedProducts = [];
grantedAccess.forEach(function(product){
if(typeof product === "object"){
removedProducts.push(product)
}
})
result.products = removedProducts;
}
/* Build everything after getting filter data */
if (index == URLsChunks.length - 1) callbackFilterApi(result);
} catch (error) {
console.error(error);
callbackFilterApi(result);
}
},
error: function() {
/* Build everything after getting filter data */
if (index == URLsChunks.length - 1) callbackFilterApi(result);
},
});
})
} else {
/* Build everything after getting filter data */
callbackFilterApi(result);
}
}
