source: spip-zone/_plugins_/analyclick/branches/V0.1/fonds/statistiques_anaclic_v3.html @ 79955

Last change on this file since 79955 was 79955, checked in by jean-marc.viglino@…, 7 years ago

{BUG} Correction de bug passage SPIP v3

File size: 5.8 KB
Line 
1<!--[if IE]>[<script type="text/javascript" src="(#CHEMIN{javascript/excanvas.js})"></script>]<![endif]-->
2[<script type="text/javascript" src="(#CHEMIN{javascript/jquery.flot.js})"></script>]
3[<script type="text/javascript" src="(#CHEMIN{javascript/jquery.flot.selection.js})"></script>]
4
5<h1><:anaclic:titre_evolution_stat:></h1>
6<BOUCLE_doc(DOCUMENTS){id_document}{tout}>
7<div class="box note">
8<b class="top"><b class="tl"></b><b class="tr"></b></b>
9<div class="inner"><div class="bd"><a title="Tout afficher" href="[(#SELF|parametre_url{id_document,''}|parametre_url{duree,''})]" class="annule_filtre"><img width="16" height="16" alt="Tout afficher" src="../prive/themes/spip/images/fermer-16.png"></a>
10        <:anaclic:stat_pour:>
11        <h2 class="objet_titre">Document ##ID_DOCUMENT[ : (#TITRE)]</h2>
12</div></div></div>
13</BOUCLE_doc>
14
15<p class="pagination">
16        <span class="dl" style="display:none">
17                <a class="noajax" href="">csv</a> |
18        </span>
19        [<span class="duree">(#ENV{duree,90}) jours</span> |]
20        <a href="[(#SELF|parametre_url{duree,#ENV{duree,90}|plus{25}})]">[(#CHEMIN_IMAGE{zoomout-24.png}|balise_img{<:statistiques:info_zoom:> -})]</a>
21        <a href="[(#SELF|parametre_url{duree,#ENV{duree,90}|moins{25}})]">[(#CHEMIN_IMAGE{zoomin-24.png}|balise_img{<:statistiques:info_zoom:> +})]</a>
22</p>
23
24<h3 class="caption"><:anaclic:stat_journalieres:></h3>
25<div id="stat_jour" style="width:100%; height:300px;"></div>
26
27<p></p>
28<p class="pagination">
29        <span class="dl" style="display:none">
30                <a class="noajax" href="">csv</a> |
31        </span>
32        [<span class="duree">(#ENV{duree_mois,12}) mois</span> |]
33        <a href="[(#SELF|parametre_url{duree_mois,#ENV{duree_mois,12}|plus{12}})]">[(#CHEMIN_IMAGE{zoomout-24.png}|balise_img{<:statistiques:info_zoom:> -})]</a>
34        <a href="[(#SELF|parametre_url{duree_mois,#ENV{duree_mois,12}|moins{12}})]">[(#CHEMIN_IMAGE{zoomin-24.png}|balise_img{<:statistiques:info_zoom:> +})]</a>
35</p>
36<h3 class="caption"><:anaclic:stat_mensuelles:></h3>
37<div id="stat_mois" style="width:100%; height:300px;"></div>
38
39<script type="text/javascript">
40(function($){
41   
42        $(document).ready(function()
43        {       var stat_jour = #STAT_JOUR;
44                if (stat_jour.length)
45                {       for (var i=0; i<stat_jour.length; i++)
46                        {       stat_jour[i][0] = new Date(stat_jour[i][0]).getTime();
47                        }
48                        var options =
49                        {       grid:
50                                {       // Tagger les weekends
51                                        markings: function (axes) 
52                                        {       var d = new Date(axes.xaxis.min);
53                                                // go to the first Saturday
54                                                d.setUTCDate(d.getUTCDate() - ((d.getUTCDay() + 1) % 7))
55                                                d.setUTCSeconds(0); d.setUTCMinutes(0); d.setUTCHours(0);
56                                                // Weekends
57                                                var markings = [];
58                                                for (var i = d.getTime(); i < axes.xaxis.max; i += 7 * 24 * 60 * 60 * 1000)
59                                                {       markings.push({ xaxis: { from: i, to: i + 2 * 24 * 60 * 60 * 1000 } });
60                                                }
61                                                return markings;
62                                        },
63                                        hoverable: true,     
64                                        mouseActiveRadius: 10  //specifies how far the mouse can activate an item
65                                },
66                                xaxes: 
67                                [{      mode:"time",
68                                        minTickSize: [1, "day"],
69                                        timeformat: "%d/%m/%y",
70                                        monthNames: ["<:date_mois_1:>", "<:date_mois_2:>", "<:date_mois_3:>", "<:date_mois_4:>", "<:date_mois_5:>", "<:date_mois_6:>", 
71                                                                "<:date_mois_7:>", "<:date_mois_8:>", "<:date_mois_9:>", "<:date_mois_10:>", "<:date_mois_11:>", "<:date_mois_12:>"]
72                                }],
73                                lines:
74                                {       show: true
75                                },
76                                points:
77                                {       show: true
78                                }
79                        };
80                        $.plot($("#stat_jour"), [{data:stat_jour}], options);
81                }
82                else
83                {       $("#stat_jour").html ("<p class='notice'><:anaclic:no_statistique:></p>").height("auto");
84                }
85               
86                var stat_month = #STAT_MOIS;
87                if (stat_month.length)
88                {       for (var i=0; i<stat_month.length; i++)
89                        {       stat_month[i][0] = new Date(stat_month[i][0]).getTime();
90                        }
91                        options =
92                        {       grid:
93                                {       hoverable: true,     
94                                        mouseActiveRadius: 10  //specifies how far the mouse can activate an item
95                                },
96                                xaxes:
97                                [{      mode:"time", 
98                                        timeformat: "%b<br/>%y",
99                                        tickSize: [1, "month"],
100                                        monthNames: ["<:date_mois_1:>", "<:date_mois_2:>", "<:date_mois_3:>", "<:date_mois_4:>", "<:date_mois_5:>", "<:date_mois_6:>", 
101                                                                "<:date_mois_7:>", "<:date_mois_8:>", "<:date_mois_9:>", "<:date_mois_10:>", "<:date_mois_11:>", "<:date_mois_12:>"]
102                                }],
103                                series: 
104                                {       bars: 
105                                        {       show: true,
106                                                align: "center",
107                                                barWidth: 12*24*60*60*300*7
108                                        }
109                                }
110                        };
111                        $.plot($("#stat_mois"), [{data:stat_month}], options);
112                }
113                else
114                {       $("#stat_mois").html ("<p class='notice'><:anaclic:no_statistique:></p>").height("auto");
115                }
116        });
117       
118
119        $.fn.UseTooltip = function (mois) 
120        {       var previousPoint = null;
121             
122                $(this).bind("plothover", function (event, pos, item) 
123                {       if (item) {
124                                if (previousPoint != item.dataIndex) 
125                                {       previousPoint = item.dataIndex;
126         
127                                        $("#tooltip").remove();
128                         
129                                        var x = new Date(item.datapoint[0]);
130                                        var y = item.datapoint[1];               
131                                        var monthNames = ["<:date_mois_1:>", "<:date_mois_2:>", "<:date_mois_3:>", "<:date_mois_4:>", "<:date_mois_5:>", "<:date_mois_6:>", 
132                                                        "<:date_mois_7:>", "<:date_mois_8:>", "<:date_mois_9:>", "<:date_mois_10:>", "<:date_mois_11:>", "<:date_mois_12:>"]
133                        if (mois) x = monthNames[x.getMonth()] +" "+ x.getFullYear();
134                        else x = x.toLocaleDateString();
135                       
136                                        showTooltip(item.pageX, item.pageY, x + "<br/>" + "<strong>" + y + "</strong> <:anaclic:statistiques_doc:>");
137                                }
138                        }
139                        else 
140                        {       $("#tooltip").remove();
141                                previousPoint = null;
142                        }
143                });
144        };
145         
146        function showTooltip(x, y, contents) {
147                $('<div id="tooltip">' + contents + '</div>').css({
148                        position: 'absolute',
149                        display: 'none',
150                        top: y + 5,
151                        left: x + 20,
152                        border: '2px solid #4572A7',
153                        padding: '2px',   
154                        'font-size': '11px',
155                        'background-color': '#fff',
156                        opacity: 0.80
157                }).appendTo("body").fadeIn(200);
158        }
159
160        $("#stat_jour").UseTooltip();
161        $("#stat_mois").UseTooltip(true);
162 
163})(jQuery);
164
165
166</script>
Note: See TracBrowser for help on using the repository browser.