Dashboards - Historique des versions

Syfre le 20 janvier 2015 à 09:27

2015-01-20T09:27:44Z

Flfay le 7 novembre 2014 à 10:34

2014-11-07T10:34:03Z

Syfre : /* Interaction avec le plugin */

2014-11-04T09:21:58Z

Interaction avec le plugin

Syfre : Page créée avec « Les dashboards sont des onglets de portail développé sur le même modèle que les applications mobiles et s'appuyant sur la [[Vignette_Dashboar... »

2014-10-29T14:14:47Z

Page créée avec « Les dashboards sont des onglets de portail développé sur le même modèle que les applications mobiles et s'appuyant sur la [[Vignette_Dashboar... »

Nouvelle page

Les dashboards sont des onglets de portail développé sur le même modèle que les [[Développement_Mobile|applications mobiles]] et s'appuyant sur la [[Vignette_Dashboard_(portail)|vignette dashboard]].

Un dashboard comprend :
* Un paquet de service comprenant les méthodes appelées par le dashbaord
* Un sous répertoire du site contenant les éléments du contenu html (home page, javascript, feuille de style...)

Un dashboard peut être utilisé dans le cadre du portail ou bien de façon autonome.

Un plugin jquery est fourni pour facilité le développement des dashboards, il prend en charge la gestion de la connexion de l'utilisateur lorsque le dashboard est utilisé en dehors du Portail.

===home.html===
La page home du dashboard contient le rendu et le code javascript nécessaire à l'exécution du dashboard.

Typiquement cette page doit être structurée ainsi :

<source lang="html4strict">
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="../lib-1.0.0/css/dashboard.css" />
<link rel="stylesheet" type="text/css" href="../lib-1.0.0/jq/jquery-ui.css" />
<script src="../lib-1.0.0/jq/jquery.js"></script>
<script src="../lib-1.0.0/js/jd1000.js"></script>
<script src="../lib-1.0.0/jq/jquery-ui.js"></script>
<script type="text/javascript" src="//www.google.com/jsapi"></script>
<style>
... style spécifique au dashboard
</style>

</head>
<body class="ui_viewport">
<div id='content' class="ui_content">
... contenu du dashboard
... en général un tableau servant de container
</div>
<script>

function clearDashboard() {
// Réinitialise le dashboard lorsque le contexte change
...
}

function render(data) {
// Appelé par le plugin après connexion.
// data est un objet contenant les données retournées par la requête parincipale
//

// Réinitialise
clearDashboard();

// Construit les widget d'interface a partir des données
...
}

(function(win) {

// Initialise le plugin
//
$.l1000.homeProc = "/get_Balance_Agee_Clients";
$.l1000.title = "Balance agée clients par établisement";
$.l1000.renderProc = render;
$.l1000.initialize();

// Load google visualizations
//
google.load("visualization", "1", {"packages":['controls','corechart','table']});
google.setOnLoadCallback($.l1000.renderInit);
})(window);
</script>
</body>
</html>
</source>

===Interaction avec le plugin===
Le plugin jd1000.js prend en charge la gestion de la session et la connexion de l'utilisateur.

L'interaction avec le plugin se fait ainsi :
* La page html appel l'initialisation du plugin.
* La page html charge le code de visualisation de Google, lorsque ce code est chargé la méthode renderInit du plugin est appelé.
:*Si l'utilisateur n'est pas connecté renderInit exécute le dialogue de connexion
:*Lorsque l'utilisateur est connecté renderInit appel la méthode principale du dahsboard puis la méthode render() du dahsboard.

Les paramètres d'initialisation du plugin sont les suivant :

{|class="wikitable"
|-
!Paramètre
!Usage
|-
|title
|Titre du dashboard
|-
|homeProc
|Méthode principale du dashboard
|-
|renderProc
|Procédure javascript de rendu du dashboard
|}

Le plugin gère automatiquement un entête de page et pied de page, n'incluez pas ces éléments dans le code html de votre page.

===Source de données===
Un dashboard peut être utilisé à l'intérieur d'un portail ou bien en autonome.

Suivant le cas le paramètre data passé à la méthode render() peut être différent:
:Si le dahsboard est utilisé dans le portail l'objet data contient la source de données configurée dans le paramétrage de l'onglet de portail.
:Si le portail est utilisé de manière autonome l'objet data contient la racine retournée par la méthode principale du dashboard.

Vous devez tester cette différence, par exemple avec du code comme suivant :

<pre>
var _data;
if (data.datasetName) {_data = data.datasetName; } else { _data = data.resultSetName; }
</pre>

Voir aussi:

*[[Vignette_Dashboard_(portail)|Vignette dashboard]]
*[[Développement_Mobile|Développement pour mobiles]]

[[Category:latest]]
[[Category:Mobiles]]

← Version précédente		Version du 20 janvier 2015 à 09:27
Ligne 122 :		Ligne 122 :


−	[[Category:~~latest~~]]	+	[[Category:Version700]]
	[[Category:Mobiles]]		[[Category:Mobiles]]

@@ Ligne 2 : / Ligne 2 : @@
 Un dashboard comprend :
-* Un paquet de service comprenant les méthodes appelées par le dashbaord
+* Un paquet de service comprenant les méthodes appelées par le dashboard
 * Un sous répertoire du site contenant les éléments du contenu html (home page, javascript, feuille de style...)
@@ Ligne 25 : / Ligne 25 : @@
 	<script src="../lib-1.0.0/jq/jquery-ui.js"></script>
 	<script type="text/javascript" src="//www.google.com/jsapi"></script>
 <style>
 	... style spécifique au dashboard
@@ Ligne 44 : / Ligne 45 : @@
 	function render(data) {
 		// Appelé par le plugin après connexion.
-		// data est un objet contenant les données retournées par la requête parincipale
+		// data est un objet contenant les données retournées par la requête principale
 		//
@@ Ligne 77 : / Ligne 78 : @@
 L'interaction avec le plugin se fait ainsi :
-* La page html appel l'initialisation du plugin.
+* La page html appelle l'initialisation du plugin.
-* La page html charge le code de visualisation de Google, lorsque ce code est chargé la méthode renderInit du plugin est appelé.
+* La page html charge le code de visualisation de Google, lorsque ce code est chargé la méthode renderInit du plugin est appelée.
 :*Si l'utilisateur n'est pas connecté renderInit exécute le dialogue de connexion
-:*Lorsque l'utilisateur est connecté renderInit appel la méthode principale du dahsboard puis la méthode render() du dahsboard.
+:*Lorsque l'utilisateur est connecté renderInit appelle la méthode principale du dahsboard puis la méthode render() du dahsboard.
-Les paramètres d'initialisation du plugin sont les suivant :
+Les paramètres d'initialisation du plugin sont les suivants :
 {|class="wikitable"

@@ Ligne 74 : / Ligne 74 : @@
 ===Interaction avec le plugin===
-Le plugin jd1000.js prend en charge la gestion de la session et la connexion de l'utilisateur.
+Le plugin [[jd1000.js|jd1000.js]] prend en charge la gestion de la session et la connexion de l'utilisateur.
 L'interaction avec le plugin se fait ainsi :