Web Component: j-Spotlight

j-Spotlight

• singleton
• works with Bootstrap Grid System

Configuration:

• height {Number} a default height of each item (default: 40, must be defined in CSS too)
• placeholder {String} a default placeholder (default: Search)

Methods:

Method: component.show(opt)

• opt.id {String} optional, an identifier for recent items (default: empty)
• opt.recent {String} enables recent items, must contain an expiration format (default: 3 days, empty=disabled)
• opt.callback(selected_item) {Function} is triggered when the user clicks on the item
• opt.cancel {Function} is triggered then the user cancels component
• opt.search {String} URL address for searching of values in the form GET /api/search/?={0}
• or opt.search {Function} a link to function(search, next(ARR_ITEMS)) for searching
• opt.cache {String} enables cache, can contain an expiration format e.g. 1 day or session
• opt.remap {Function} it can remap results items => items.map(...)
• opt.clear {Boolean} it clears previous results (default: false)
• opt.init {Boolean} makes an empty search when the component is called (default: false)
• opt.delay {Number} a delay in ms for performing searching (default: 100)
• opt.height {Number} a height of item (default: config.height)
• opt.class {String} adds a custom class to the container
• NEW opt.placeholder {String} search placeholder (default: config.placeholder)

Good to know:

• .items = [{ html }] -> html field ( in items) will be rendered as a plain HTML

Author

• Peter Širka petersirka@gmail.com
• License