/** Search Engine * --------------------------------------------------------------------------- * * TODO: * CRITICAL: (optimization) * Search initialization uses quite a lot of network sources; * thus it should be started in a later time; * lets say ... after `x` seconds * or... when document/core-ui-elements are ready * * @parametres (json) : options * --- * @var {string} products_json : endpoint od product descriptions * @var {string} search_tag : selector of field that shall act as typeahead-suggestions * @var {string} visualize_search_results_url : url that will visualize the sended "results-page" * @var {int} max_list : max-size of (rated) results expected * @var {int} tolerance * @var {boolean} debug : if true sends several debug console messages; if false mesagges are eliminated */ retrosearch_module({ products_json: 'https://storage.googleapis.com/pythia-files/uploads/json/emarket-products.json', search_tag: '#tagsInput', visualize_search_results_url: '/product_list', max_list: 24, tolerance: 42, debug: ((location.hostname == 'localhost') || (location.hostname == '127.0.0.1')) }); function retrosearch_module(options) { /** CONTENTS * * +1: Variables * * +2: Purify string functions * + keyboardize * + sanitize_GR * + clean * * +3: Supplementary function (vanilla js) * + ajax_get(url, callback) * + createNgram (fuzzy) * + checkSimilarity (fuzzy) * + check_match * + is_exact_match * + match_one * * +4: Actual data loading (async) * * +5: Suggestions Engine (jQuery) * + suggestions_engine * */ if (options.debug) console.log(`preparing retrosearch... (${+ new Date()})`); /** 1. VARIABLES * ------------------------------------------------------------------------- *////////////////////////////////////////////////////////////////////////// var _kwlinks; // keyword links (word-connections; imported via ajax-get) var _products = []; // all products (imported via ajax-get) // setup options var _maxResults = options.max_list; // limit suggestions var _blendProds = 4; // minimum final-produncts to blend with next-word suggestions var _timeout_ms = 100; // time (in ms) for the search engine to find matches (before rendering) var _allowFuzzy = true; // enable|disable fuzzy search var _fuzzyLimit = .5; // minimum bigram score for being considered a match var _Ngram_base = 2; // number of N in Ngram spliting algorithm var _isReady = false; // whether the searchbox is ready to be used // product keywords var keywordsURL = options.keywords_json; var cursor_on = { none: true }; // what product is highlighted; if not on product then { none: true } /** 3. SUPPLEMENTARY FUNCTIONS * ------------------------------------------------------------------------- *////////////////////////////////////////////////////////////////////////// // TODO: // exclude some generic non-critial words when proccessing user's query // ** example code to work with: // var ignoredKeys_kb = []; // keywords to ignore (in kb-format) // 'μας με σε για του της των από στο στον &'.split(' ').forEach(w => { ignoredKeys_kb.push(keyboardize(w)); }); // pure JS ajax GET request; return data as JSON // no fancy things like UTF8; if needed use base64 function ajax_get(url, callback) { var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { try { var data = JSON.parse(xmlhttp.responseText); } catch(err) { if (options.debug) console.log(err.message + " in " + xmlhttp.responseText); return; } callback(data); } }; xmlhttp.open("GET", url, true); xmlhttp.send(); } // callback function for sorting resulrs per r (=rating) property function compare_rate(a,b) { return (a.r < b.r); } /** vwOverUnder * vertical-wise over/under * * @param {document.element} el : element to check * @param {document.element} container : container element (compairing) * @return {int} .. [-1|0|+1] * ..: 0 if element's heignt is completely into container's viewport * ..: -1 if element's heignt is over container's viewport * ..: +1 if element's heignt is under container's veiwport */ function vwOverUnder(el, container) { let eR = el.getBoundingClientRect(); let cR = container.getBoundingClientRect(); console.log('er|cr', eR, cR); let result = -1; // default: element is under container's viewport if (eR.y >= cR.y && eR.y + eR.height <= cR.y + cR.height - options.tolerance) { result = 0 // fully inside } else if (eR.y < cR.y) { result = -1 } return result; } /** 4. ACTUAL DATA LOADING * ------------------------------------------------------------------------- *////////////////////////////////////////////////////////////////////////// // TODO: // control completion of async loads via .then() rather by this custom structrure // Need to rewrite the folllowing code ............................. from here // ........................................................................... // ........................................................................... /** workline * ------------------------------------------------------------------------- * custom object/data-structure * to track status/completion of async svents * (it does the job using a special set method) */ var workline = { trackerJL : 0, set jsonLoaded(x) { this.trackerJL = x; // fire event on certain values if (x == 2) { if (options.debug) console.info('suggestion-engine requirements fulfilled'); _isReady = true; // code to execute // ... } }, get jsonLoaded() { return this.trackerJL; } }; /** LOAD DATA (from endoints) * --------------------------------------------------------------------------- */ function load_store_products(storeID) { let prData = getSessionObj('prd'); if (prData !== null) { _products = prData; if (options.debug) console.log(`...products fetched from cache (${+ new Date()})`); workline.jsonLoaded++; } else { ajax_get(options.products_json, function(data) { // get stor's _products _products = data; _products.forEach(p => {p.kb = keyboardize(p.w).toLowerCase()} ); setSessionObj('prd', _products); if (options.debug) console.log(`...products loaded; (${+ new Date()})`); workline.jsonLoaded++; CURRENT_STOREs_CATALOG = storeID; }); } } var STORE = { id: 904 }; if (STORE.id != 0) load_store_products(STORE.id); // ........................................................................... // ........................................................................... // ................................................................ up to here /** 5. SEARCH ENGINE * ------------------------------------------------------------------------- *////////////////////////////////////////////////////////////////////////// workline.jsonLoaded++; // notify workline that jQuery is ready!! // suggestions engine ////////////////////////////////////////////////// // --- function suggestions_engine(qOrig) { var results = []; // suggestions to respond var pot = []; pot.length = 0; var space_ended = (qOrig.slice(-1) == ' ') ? true : false; // clean and sanitize and mark links onto q(uery) string var q = keyboardize( sanitize_GR( clean_text(qOrig.trim()) ) ).trim(); // TODO: // construct direct-linked words // = do unequivocally replaces // steps: // 1. replace accented vowels with non accented ones // 2. replace `/some pattern/gi , 'SOME-REPLACE-PATTERN'` var qAr = q.split(' '); // split to words /// if (space_ended) qAr.push(' '); // if space-end existed, push a space to query array /// /// if (qAr.slice(-1) == "") { /// qAr.pop(); /// } if (options.debug) console.log('*** init SEARCH QUERY:', qOrig, 'search:', qAr); pot = _products; // potential results // NOTE: CRITICAL: BY REFERENCE var wi = 0; // word index (from list) var wc = qAr.length; qAr.forEach( w => { if (options.debug) console.log('...testing', w); let sf = []; // (matches) so far let mi; // position of match wi++; pot.forEach( it => { let matched = false; let tester = ' '+ it.kb + ' '; // reset previous history and ratings if (wi == 1) { it.r = 0; it.history = []; } // rate word-match > start-match > simple-match // ... up to 8 points if (tester.indexOf(' '+ w +' ') != -1) { it.r += 9; it.history.push({ w: w, rate: 9 }); matched = true; } else if (tester.indexOf(' '+ w) != -1) { it.r += 5; it.history.push({ w: w, rate: 5 }); matched = true; } else if (tester.indexOf(w) != -1) { it.r += 2; it.history.push({ w: w, rate: 2 }); matched = true; } // rate `near-to-start` matching .. up to 7p // rate `earlyness` of word in query .. up to 7p if ((mi = tester.indexOf(' '+w)) != -1) { let fc1 = 100 - ((mi < 99) ? mi : 99); // near-to-start factor let fc2 = wc - wi + 1; // query earlyness factor let r1 = Math.floor(7*fc1/100); let r2 = Math.floor(7*fc2/wc); it.r += (r1 + r2); it.history.push({ w: w, left: [fc1, r1], early: [fc2, r2] }); } if (matched) sf.push(it); }); if ((sf.length > (_maxResults + Math.floor(_maxResults/2))) || (wi == 1) ) { // ..if pot has a fair amount (= max + 50%) of results // ..or these are results of '1st-query-word' // set sf as new source pot.lenght = 0; pot = []; pot = JSON.parse(JSON.stringify(sf)); // copy by value } else { // else.. keep the source list and increase of 'so-far rating' // console.log('found small list', sf, pot) pot.forEach( it => { sf.forEach( si => { if (it.id == si.id) { it.r += 10; it.history.push({ w: w, plus: '+10'}); } }); }); } }); // sort results, get max-list of best rated results = (pot.length > _maxResults) ? pot.sort(compare_rate).slice(0, _maxResults) : pot.sort(compare_rate) if (options.debug) console.log(results); return results; } // suggestions caller (router function) // arguments: // * qOrig : original query string // ** list : callback array structure to host results // --- var isuggest = function(qOrig, list) { var results; qSanit = sanitize_GR(qOrig); // sanitize greek accended chars // TODO: // check if all source-lists are ready // if not you need to wait ... // via async promishes or synced timouts /// // DEPRECATED: Suppport for eys-code search /// // if query seems to be some king of 'code/id' /// if (qSanit.length>2 && qSanit.match(/^[0-9]+$/) != null) { /// results = search_by_code(qOrig); /// /// } else { /// // string match procedure with suggestions engine results = suggestions_engine(qOrig); /// } list(results); } // var rsfoot = document.createElement('div'); // rsfoot.setAttribute("id", "retrosearch-footer"); // $('#retrosearch-footer').html('Multi Search'); /* jQuery(function() { // on document ready code ////////////////////////// // UI-dependent code // uses reference to specific document element (passed via options) // ----------------------------------------------------------------------- const searchBox = $(options.search_tag); searchBox.typeahead( { hint: true, highlight: true, minLength: 1 }, { limit: _maxResults, // +1 for extra button // name: 'kwlinks', displayKey: 'w', source: isuggest, templates: { suggestion: function(data) { return `