NOTICE: By continued use of this site you understand and agree to the binding Terms of Service and Privacy Policy.
// ==UserScript== // @name YemekSepeti Restoran Ürün Filtreleme // @namespace https://www.milgar.net/ // @version 0.1 // @description YemekSepeti restoran sayfasında filtreleme özelliği // @author milgar // @match https://www.yemeksepeti.com/* // @grant none // @require https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/10.1.0/nouislider.min.js // @resource https://cdnjs.cloudflare.com/ajax/libs/noUiSlider/10.1.0/nouislider.min.css // @license MIT // @copyright 2018, Mehmet Ali İLGAR (https://milgar.net) // ==/UserScript== (function() { 'use strict'; let menus = document.getElementsByClassName("restaurantDetailBox"); if(menus.length <= 0) return; let menu_items = []; let menu_item_prices = []; let basketContainer; let mostExpensivePrice = 0; let sliderMaxValue = 0; let currentLimit = 10; for( let i=0; i<menus.length; i++) { menu_items[i] = menus[i].getElementsByTagName("li"); menu_item_prices[i] = []; for( let j=0; j<menu_items[i].length; j++) { let tmp = menu_items[i][j].getElementsByClassName("newPrice"); if(tmp.length <= 0) menu_item_prices[i][j] = -1; else menu_item_prices[i][j] = parseFloat(tmp[0].innerText.substr(0, tmp[0].innerText.indexOf(" "))); if(menu_item_prices[i][j] > mostExpensivePrice) mostExpensivePrice = menu_item_prices[i][j]; } } sliderMaxValue = mostExpensivePrice + mostExpensivePrice % 5; basketContainer = document.getElementById("basket-container"); let slider = document.createElement('input'); slider.setAttribute("id", "priceSlider"); slider.setAttribute("type", "range"); slider.setAttribute("step", 5); slider.setAttribute("min", 0); slider.setAttribute("max", mostExpensivePrice + mostExpensivePrice % 5); slider.setAttribute("value", mostExpensivePrice + mostExpensivePrice % 5); slider.style.display = "inline"; slider.style.width = "138px"; slider.oninput = function() { console.log(this.value); updateMenu(this.value); currentLimitInfo.innerHTML = this.value; }; let clearLimit = document.createElement("span"); clearLimit.innerHTML = "Hepsi"; let currentLimitInfo = document.createElement("span"); currentLimitInfo.innerHTML = mostExpensivePrice + mostExpensivePrice % 5; /*jshint multistr: true */ let template = '\ <div class="ys-left-filter"> \ <div class="header"><div class="title">Ürün Filtreleri</div></div> \ <div class="filter select-box rateFilter active"> \ <div class="slider-box-inline"> \ <i class="ys-icons ys-icons-Standard-filterIcons-rate-passive"></i> \ <i class="ys-icons ys-icons-Standard-filterIcons-rate-active"></i> \ <i class="ys-icons ys-icons-redExitIcon remove-filter-icon"></i> \ <div class="ys-filter-info"> \ <span class="filterName">Fiyat</span> \ <span class="filterValue"></span> \ </div> \ <div class="ys-pointSlider"> \ <input name="hddnPointSlider" class="hddnPointSlider" type="hidden" value=""> \ \ </div> \ </div> \ </div> \ </div>'; let parser = new DOMParser(); let filterContainer = parser.parseFromString(template, "text/html").body.firstChild; filterContainer.style.marginBottom = "12px"; basketContainer.prepend(filterContainer); let sliderContainer = basketContainer.getElementsByClassName("ys-pointSlider")[0]; sliderContainer.append(currentLimitInfo); var range = document.createElement('div'); range.style.width = "55%"; range.style.display = "inline-flex"; range.style.margin = "5% 8%"; sliderContainer.append(range); sliderContainer.append(clearLimit); range.setAttribute("class", "ys-formSlider"); noUiSlider.create(range, { start: [ currentLimit ], connect: [ false, false ], step: 5, range: { 'min': [ 0 ], 'max': [ sliderMaxValue ] } }); let handle = range.getElementsByClassName("noUi-handle")[0]; range.noUiSlider.on('update', function(values){ currentLimit = parseFloat(values[0]); updateMenu(currentLimit); currentLimitInfo.innerHTML = currentLimit + " TL"; handle.innerHTML = currentLimit; }); clearLimit.onclick = function() { currentLimit = sliderMaxValue; updateMenu(currentLimit); range.noUiSlider.set(currentLimit); }; function updateMenu(limit) { for( let i=0; i<menus.length; i++) { let hiddenCount = 0; for( let j=0; j<menu_items[i].length; j++) { if(menu_item_prices[i][j] > limit){ menu_items[i][j].style.display = 'none'; hiddenCount++; } else { menu_items[i][j].style.display = 'list-item'; } } if(hiddenCount == menu_items[i].length){ menus[i].style.display = 'none'; } else { menus[i].style.display = 'block'; } } } })();