web2app-spa/components/ui-search-box.min.js

This template is primarily designed to easily convert HTML pages and URLs into a Capacitor/Cordova based iOS/Android app that can be used as Single-page application (SPA).

"use strict";var UISearchBox={};UICore.createDefaultValues(UISearchBox,{width:300,height:50,searchIconFile:"components/ui-search-box/search.svg",clearIconFile:"components/ui-search-box/clear.svg",isCancelEnabled:1,placeholderText:"Search",color:"whitesmoke",textColor:"rgba(0, 0, 0, 0.8)",border:0,borderColor:"rgba(0, 0, 0, 0.1)",borderBottomStyle:"2px solid rgba(0, 0, 0, 0.06)",round:6,fontSize:20}),UISearchBox.create=function(t={}){const e=createBox();e.default=UICore.cloneDefaultValues(UISearchBox),UICore.parseParameters(e.default,t);let a=function(){};e.publicVariable="publicVariable",e.width=e.default.width,e.height=e.default.height,e.color=e.default.color,e.round=e.default.round,e.border=e.default.border,e.borderColor=e.default.borderColor,e.element.style.borderBottom=e.default.borderBottomStyle,e.imgIcon=createImage(16,0,25,25),e.add(that),that.load(e.default.searchIconFile),that.opacity=.4,that.space=0,that.center("top"),e.txtSearch=createTextBox(40,0),e.add(that),that.width=e.width-80,that.height=e.default.height,that.border=0,that.minimal=1,that.fontSize=e.default.fontSize,that.textColor=e.default.textColor,that.color="transparent",that.inputElement.setAttribute("placeholder",e.default.placeholderText),e.imgClearIcon=createImage(5,0,20,20),e.add(that),that.load(e.default.clearIconFile),that.opacity=0,that.space=0,that.right=20,that.center("top"),that.setMotion("opacity 0.3s");return e.onSearch=function(t){a=t},e.setText=function(t){e.txtSearch.text=t},e.getText=function(){return e.txtSearch.text},e.setPlaceholderText=function(t){e.default.placeholderText=t,e.txtSearch.inputElement.setAttribute("placeholder",t)},e.txtSearch.inputElement.addEventListener("keyup",(function(){a(e.txtSearch.text.toLowerCase(),e),e.default.isCancelEnabled&&(e.txtSearch.text.length>0?e.imgClearIcon.opacity=.6:e.imgClearIcon.opacity=0)})),e.onResize((function(t){t.txtSearch.width=t.width-80,t.txtSearch.center("top"),t.imgClearIcon.center("top"),t.imgIcon.center("top")})),e.imgClearIcon.onClick((function(t){t.opacity=0,e.txtSearch.text="",a(e.txtSearch.text.toLowerCase(),e)})),makeBasicObject(e),e};