Différents types de popup peuvent être instanciées ou modifiées :

• Création de composants
• Affichage de métadonnées de composant existant
• Activité
• Recherche
• Contenu DOM
• Liaison d’un document à un dossier parent

Ces popups peuvent être instantiées à l’aide de l’API JS :

    JSAPI.get().getPopupAPI();

Afin de modifier les différents attributs communs des popups, les fonctions suivantes sont à disposition :

Pour instancier une popup de création, il est nécessaire de lui fournir un composant en entrée (ici newTask) :

var newTask = new Task();
var popup = JSAPI.get().getPopupAPI().buildComponentCreation(newTask);

Un callback peut être fourni à cette méthode afin de réagir à la création du composant :

var newTask = new Task();
newTask.setClassId("ClaimProcess_Start");
var popup = JSAPI.get().getPopupAPI().buildComponentCreation(newTask, function(saved){
    console.info("The task has been created: "+saved.getId());
});
popup.show();

Pour instancier ce type de popup, il est nécessaire de fournir à l’API un composant existant :

var popup = JSAPI.get().getPopupAPI().buildComponentFields(document);

Exemple : Affichage des tags d’un document dans une popup

JSAPI.get().document().get(["documentId"], function(documents){
	var document = documents[0];
	console.info("Got: "+document.getId());
	var popup = JSAPI.get().getPopupAPI().buildComponentFields(document);
	popup.setTitle("Mon document");
	popup.setDescription("Consultez les tags du document");
	popup.setIcon("fa fa-book");
	popup.show();

	},
	function(error){
		console.error("Documents could not be get: " + error);
	});

1. Instancier la place à ouvrir

Si la place correspond à celle d’un composant, l’instanciation s’effectue en renseignant sa catégorie et son identifiant.

var componentPlace = new flower.docs.PlaceBuilder.build(category, id);

Les autres places peuvent instanciées à partir d’un token. Ce token est défini de la même façon que pour la page par défaut.

var place = new flower.docs.PlaceBuilder.build(token);

2. Instanciation de la popup

var popup = JSAPI.get().getPopupAPI().buildPlace(place);

Exemple : ouverture de l’écran de modification d’un document au sein d’une popup

var place = new flower.docs.PlaceBuilder.build("DOCUMENT", "45376503-dfda-4abc-bc2f-32ac8a8b88d1");
var popup = JSAPI.get().getPopupAPI().buildPlace(place);
popup.show();

Exemple : ouverture de la page d’accueil au sein d’une popup

var place = new flower.docs.PlaceBuilder.build("home");
var popup = JSAPI.get().getPopupAPI().buildPlace(place);
popup.show();

Pour ouvrir un formulaire de recherche dans une popup, les paramètres suivant sont nécessaires :

• category : Catégorie sur laquelle l’on souhaite effectuer une recherche
• template : Nom du template à utiliser pour la recherche
• callback : Fonction de sélection de composant dans la recherche, il va permettre de manipuler le composant selectionné dans la popup. Il peut, par exemple, être ajouter en tant que pièce jointe d’une tâche.

popup = JSAPI.get().getPopupAPI().buildSearch(category, template, function(component){ 
	console.log("Selected component id="+ component.getId());
}); 
popup.show();

La popup de type Contenu DOM permet d’ajouter un élement DOM dans une popup. Ceci permet donc d’ajouter un élément construit en JS dans une popup.

var domElement = document.createElement('div'); 
domElement.innerHTML = "Hello world"; 
var popup = JSAPI.get().getPopupAPI().buildDOM(domElement);
popup.show();

Attachement d’un document à un dossier parent

Cette partie détaille les interactions possibles avec le widget appelé ComponentAttacher permettant d’attacher un composant à un dossier.

Ce type de popup ne peut pas être créé manuellement mais il est possible de s’abonner à son ouverture de la façon suivante :

JSAPI.get().getPopupAPI().registerForComponentAttacherOpen(function(popup){
	popup.setTitle("Mon nouveau titre");
	popup.setRapidSearchVisible(false); 
	popup.getActions().get("advancedSearch").setEnabled(false); 
});  

Les propriétés modifiables sur les autres types de popup le sont également sur celle-ci. Les fonctions suivantes sont spécifique à ce type de popup :

Les actions disponibles via la méthode getActions() sont :

• browseFolder : Parcourir l’arborescence de dossier
• advancedSearch : Recherche avancée
• newFolder : Création d’un nouveau dossier

La popup affichée lors du clic sur l’action browseFolder va afficher une arborescence de dossier. Il est possible que pour certains besoins l’arborescence complète ne correspondent pas à vos besoins et qu’une certaine partie de celle-ci soit autorisée pour un attachement. Dans ce cas là, il est possible de restreindre l’affichage des différents dossiers dans cette arborescence de la façon suivante :

folderAttacher = JSAPI.get().getPopupAPI().getFolderAttacher();
folderAttacher.register(function(folder,toAttach, callback){
	if(folder.getName() == "2014"){
    	console.error("Remove item " + folder.getName() + " from browse tree");
		callback.onSuccess(null);
	}
	else if(folder.getName() == "Arondor"){
		console.log("Force disable selection for "+ folder.getName());
		callback.onSuccess(new SelectableTreeItem(folder.getName(),false));
    }
	else{
		console.log("Use applicative selection for "+ folder.getName());
		callback.onSuccess(new SelectableTreeItem(folder.getName()));
	}
});

Dans l’exemple ci-dessus, le composant ayant pour nom Arondor sera affiché mais non sélectionnable. Celui avec le nom 2014 ne sera pas affiché et les autres seront affichés.
Dans ce dernier cas, la sélection utilisée est celle calculée par l’application, c’est-à-dire qu’elle est affichée uniquement si la classe du composant courant est dans la liste des enfants autorisés du dossier.

Cette partie détaille les interactions possibles avec le widget appelé ComponentAttacher permettant d’attacher un composant à un dossier.

Ce type de popup ne peut pas être créé manuellement mais il est possible de s’abonner à son ouverture de la façon suivante :

JSAPI.get().getPopupAPI().registerForComponentAttacherOpen(function(popup){
	popup.setTitle("Mon nouveau titre");
	popup.setRapidSearchVisible(false); 
	popup.getActions().get("advancedSearch").setEnabled(false); 
});  

Les propriétés modifiables sur les autres types de popup le sont également sur celle-ci. Les fonctions suivantes sont spécifique à ce type de popup :

Les actions disponibles via la méthode getActions() sont :

• browseFolder : Parcourir l’arborescence de dossier
• advancedSearch : Recherche avancée
• newFolder : Création d’un nouveau dossier

La popup affichée lors du clic sur l’action browseFolder va afficher une arborescence de dossier. Il est possible que pour certains besoins l’arborescence complète ne correspondent pas à vos besoins et qu’une certaine partie de celle-ci soit autorisée pour un attachement. Dans ce cas là, il est possible de restreindre l’affichage des différents dossiers dans cette arborescence de la façon suivante :

folderAttacher = JSAPI.get().getPopupAPI().getFolderAttacher();
folderAttacher.register(function(folder,toAttach, callback){
	if(folder.getName() == "2014"){
    	console.error("Remove item " + folder.getName() + " from browse tree");
		callback.onSuccess(null);
	}
	else if(folder.getName() == "Arondor"){
		console.log("Force disable selection for "+ folder.getName());
		callback.onSuccess(new SelectableTreeItem(folder.getName(),false));
    }
	else{
		console.log("Use applicative selection for "+ folder.getName());
		callback.onSuccess(new SelectableTreeItem(folder.getName()));
	}
});

Dans l’exemple ci-dessus, le composant ayant pour nom Arondor sera affiché mais non sélectionnable. Celui avec le nom 2014 ne sera pas affiché et les autres seront affichés.
Dans ce dernier cas, la sélection utilisée est celle calculée par l’application, c’est-à-dire qu’elle est affichée uniquement si la classe du composant courant est dans la liste des enfants autorisés du dossier.