Hi everyone,
First of all: I’ve read a lot of other forum threads on this topic and tried out a lot, but I still cannot get any result, so I count on the Bubble-community-wisdom! Hope someone can help me out here …
The facts:
-
My goal is to compare an string to a list of strings from the database and obtain that string that is the most similar to my input-string.
-
I have a Script that I run successfully on different sites where you can try out JavaScripts - it gives me a usable result (e.g. on JSFiddle.net)
-
In Bubble, I to use the Toolbox Plugin with the Action “Run Javascript” - I then have a Javascript To Bubble element on the page, that should return the result in a form that’s usable on Bubble. Only problem: It does not return anything.
-
Here you can see my settings:
The function is as follows:
function myFunction() {
}
/*
Copyright 2018 Stephen Brown
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/
/**
* Calculate similarity between two strings
* @param {string} str1 First string to match
* @param {string} str2 Second string to match
* @param {number} [substringLength=2] Optional. Length of substring to be used in calculating similarity. Default 2.
* @param {boolean} [caseSensitive=false] Optional. Whether you want to consider case in string matching. Default false;
* @returns Number between 0 and 1, with 0 being a low match score.
*/
var stringSimilarity = function (str1, str2, substringLength, caseSensitive) {
if (substringLength === void 0) { substringLength = 2; }
if (caseSensitive === void 0) { caseSensitive = false; }
if (!caseSensitive) {
str1 = str1.toLowerCase();
str2 = str2.toLowerCase();
}
if (str1.length < substringLength || str2.length < substringLength)
return 0;
var map = new Map();
for (var i = 0; i < str1.length - (substringLength - 1); i++) {
var substr1 = str1.substr(i, substringLength);
map.set(substr1, map.has(substr1) ? map.get(substr1) + 1 : 1);
}
var match = 0;
for (var j = 0; j < str2.length - (substringLength - 1); j++) {
var substr2 = str2.substr(j, substringLength);
var count = map.has(substr2) ? map.get(substr2) : 0;
if (count > 0) {
map.set(substr2, count - 1);
match++;
}
}
return (match * 2) / (str1.length + str2.length - ((substringLength - 1) * 2));
};
function compareStrings() {
const names = ["Anna H", "Luisan", "James"]
const targetPhrase = "Anne"
const compare = new SimilarStringFinder(targetPhrase,names, 0.3)
console.log(compare.bestMatch.phrase)
}
class SimilarStringFinder {
constructor (targetPhrase,phraseList, minScore = 0){
this.targetPhrase = targetPhrase
this.phraseList = phraseList
this.scores = null
this.minScore = minScore
this.bestMatch = {phrase:null, score:null}
this.findScores()
}
findScores(){
this.scores = this.phraseList.map(phrase => {
const score = stringSimilarity(this.targetPhrase, phrase)
const currentMatch = {phrase:phrase, score:score}
if(score < this.minScore) return currentMatch
if (this.bestMatch.score === null || this.bestMatch.score < currentMatch.score){
this.bestMatch = {...currentMatch}
}
return currentMatch
})
}
}
const solution = compareStrings();
bubble_fn_bestMatch(solution);
I really hope someone can help me out! Maybe someone can find a mistake I’m making?
(Maybe @mishav or @hola1 who were really helpful on a similar thread some years ago?)
I would also be open to try and display the result in an HTML element, but I don’t really get how that’s working. So any suggestions in that regard would also be appreciated!
Thanks!!