j-Features

• uniquement pour les ordinateurs de bureau
• singleton
• fonctionne avec le système Bootstrap Grid

Méthodes

Méthode : component.open(opt)

• opt.placeholder {String} un espace réservé pour la saisie de la recherche (par défaut : config.placeholder)
• opt.items {Object Array} avec liste de fonctionnalités (obligatoire) :
  • name {String} un nom de fonctionnalité
  • Icône icon {String} (facultatif) sans fa-
  • keywords {String} (facultatif) mots-clés supplémentaires pour la recherche
  • value {Object/String/Number} une valeur

opt.scrolltop {Boolean} défile vers le haut jusqu'à afficher la fenêtre (par défaut : false)

opt.callback(selected) {Function} un rappel qui est appelé lorsque l'utilisateur effectue un clic pour une fonctionnalité. L'argument selected contient l'élément sélectionné.

Méthode : component.hide()

Configuration :

• placeholder {String} un espace réservé pour la saisie de la recherche
• height {Number} hauteur de l'élément de liste (facultatif, 35 par défaut)

Utilisez-le avec <ui-component name="features">. Lorsque le composant n'est pas encore chargé, jComponent le télécharge lors de la première utilisation depuis l'adresse dans DEF.fallback (le CDN Componentator par défaut). Auteur : Peter Širka. Source : le référentiel de composants Componentator, licence MIT.

<style>
	body { background-color: #F0F0F0; }
</style>

<ui-component name="features" config="placeholder:Search ..."></ui-component>

<div class="container">
	<a href="javascript:features()">Show features</a>
</div>

<script>
	function features() {
		var opt = {};
		opt.items = [{ name: 'Dashboard' }, { name: 'Invoices' }, { name: 'Orders' }, { name: 'Products' }, { name: 'Pages' }, { name: 'Notes' }, { name: 'Users', icon: 'user' }, { name: 'Settings' }];
		opt.callback = function(selected) {
			console.log('CLICK', selected);
		};
		SETTER('features/show', opt);
	}
	setTimeout(features, 500);
</script>