Bug 18066: Fix map positioning in admin/usage_statistics.pl
[koha.git] / koha-tmpl / intranet-tmpl / prog / en / modules / admin / usage_statistics.tt
1 [% USE Koha %]
2 [% USE KohaDates %]
3 [% USE Price %]
4 [% INCLUDE 'doc-head-open.inc' %]
5 <title>Koha &rsaquo; Administration &rsaquo; Koha usage statistics</title>
6 [% INCLUDE 'doc-head-close.inc' %]
7 [% INCLUDE 'calendar.inc' %]
8 <link rel="stylesheet" href="[% interface %]/lib/leaflet/leaflet.css" />
9 <script src="[% interface %]/lib/leaflet/leaflet.js"></script>
10
11 <script type="text/javascript">
12 //<![CDATA[
13     function positionMap() {
14         var tbh = $("#mapid");
15         var mapContainer = tbh.parent();
16         mapContainer.css('position', 'relative');
17         mapContainer.css('min-height', tbh.outerHeight(true));
18         tbh.css('position', 'absolute');
19         tbh.css('right', 0);
20
21         var offsetTop = mapContainer.offset().top;
22         var s = parseInt($(window).scrollTop(), 10);
23         tbh.css('top', '').css('bottom', '');
24         if (s > offsetTop) {
25             var mapContainerOffsetBottom = offsetTop + mapContainer.innerHeight();
26             if (s + tbh.outerHeight(true) > mapContainerOffsetBottom) {
27                 tbh.css('bottom', 0);
28             } else {
29                 tbh.css('top', s - offsetTop);
30             }
31         } else {
32             tbh.css('top', 0);
33         }
34     }
35
36     $(document).ready(function() {
37         $(window).scroll(positionMap);
38         positionMap();
39     });
40 //]]>
41 </script>
42 </head>
43
44 <body id="admin_usage_statistics" class="admin">
45 [% INCLUDE 'header.inc' %]
46 [% INCLUDE 'cat-search.inc' %]
47
48 <div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/admin/admin-home.pl">Administration</a> &rsaquo; Usage statistics</div>
49
50 <div id="doc3" class="yui-t2">
51    <div id="bd">
52     <div id="yui-main">
53     <div class="yui-b">
54
55 [% FOR m IN messages %]
56     <div class="dialog [% m.type %]">
57         [% SWITCH m.code %]
58         [% CASE 'error_on_update' %]
59             An error occurred when updating this patron category. Perhaps it already exists.
60         [% CASE 'error_on_insert' %]
61             An error occurred when inserting this patron category. The patron category might already exist.
62         [% CASE 'error_on_delete' %]
63             An error occurred when deleting this patron category. Check the logs.
64         [% CASE 'success_on_update' %]
65             Patron category updated successfully.
66         [% CASE 'success_on_insert' %]
67             Patron category inserted successfully.
68         [% CASE 'success_on_delete' %]
69             Patron category deleted successfully.
70         [% CASE 'already_exists' %]
71             This patron category already exists.
72         [% CASE %]
73             [% m.code %]
74         [% END %]
75     </div>
76 [% END %]
77
78 [% IF NOT Koha.Preference('UsageStats') %]
79     <div class="dialog message">You are not sharing any data with the Koha community</div>
80 [% END %]
81
82     <form id="category_form" action="/cgi-bin/koha/admin/usage_statistics.pl" method="post">
83         <h1>Modify the statistics you share with the Koha community</h1>
84         <fieldset class="rows">
85             <ol style="float:left;">
86                 <li>
87                     <label for="UsageStats">Share my Koha usage statistics: </label>
88                     <select name="UsageStats" id="UsageStats">
89                     [% IF Koha.Preference('UsageStats') %]
90                         <option value="1" selected="selected">Yes</option>
91                         <option value="0">No</option>
92                     [% ELSE %]
93                         <option value="1">Yes</option>
94                         <option value="0" selected="selected">No</option>
95                     [% END %]
96                     </select>
97                 </li>
98                 <li>
99                     <label for="UsageStatsCountry">Your country: </label>
100                     [% SET UsageStatsCountry = Koha.Preference('UsageStatsCountry') %]
101                     [% SET IsUsageStatsCountryValid = 0 %]
102                     [% IF NOT UsageStatsCountry %]
103                         [% SET IsUsageStatsCountryValid = 1 %]
104                     [% END %]
105                     [% PROCESS 'country-list.inc' %]
106                     <select name="UsageStatsCountry" id="UsageStatsCountry">
107                         <option value="">&nbsp;</option>
108                         [% FOR country IN countries %]
109                             [% IF country == UsageStatsCountry %]
110                                 <option value="[% country %]" selected="selected">[% country %]</option>
111                                 [% SET IsUsageStatsCountryValid = 1 %]
112                             [% ELSE %]
113                                 <option value="[% country %]">[% country %]</option>
114                             [% END %]
115                         [% END %]
116                     </select>
117                     [% UNLESS IsUsageStatsCountryValid %]
118                         Note: The value of your system preference 'UsageStatsCountry' is not valid ([% UsageStatsCountry %]).
119                         Please select a valid one.
120                     [% END %]
121                 </li>
122                 <li>
123                     <label for="UsageStatsLibraryName">Library name: </label>
124                     <input type="text" value="[% Koha.Preference('UsageStatsLibraryName') | html %]" name="UsageStatsLibraryName" id="UsageStatsLibraryName" />
125                 </li>
126                 <li>
127                     <label for="UsageStatsLibraryType">Library type: </label>
128                     [% SET UsageStatsLibraryType = Koha.Preference('UsageStatsLibraryType') %]
129                     <select name="UsageStatsLibraryType" id="UsageStatsLibraryType">
130                         <option value="">&nbsp;</option>
131                         [% IF UsageStatsLibraryType == 'public' %]
132                             <option value="public" selected="selected">Public</option>
133                         [% ELSE %]
134                             <option value="public">Public</option>
135                         [% END %]
136
137                         [% IF UsageStatsLibraryType == 'school' %]
138                             <option value="school" selected="selected">School</option>
139                         [% ELSE %]
140                             <option value="school">School</option>
141                         [% END %]
142                         [% IF UsageStatsLibraryType == 'academic' %]
143                             <option value="academic" selected="selected">Academic</option>
144                         [% ELSE %]
145                             <option value="academic">Academic</option>
146                         [% END %]
147                         [% IF UsageStatsLibraryType == 'research' %]
148                             <option value="research" selected="selected">Research</option>
149                         [% ELSE %]
150                             <option value="research">Research</option>
151                         [% END %]
152                         [% IF UsageStatsLibraryType == 'private' %]
153                             <option value="private" selected="selected">Private</option>
154                         [% ELSE %]
155                             <option value="private">Private</option>
156                         [% END %]
157                         [% IF UsageStatsLibraryType == 'societyAssociation' %]
158                             <option value="societyAssociation" selected="selected">Society or association</option>
159                         [% ELSE %]
160                             <option value="societyAssociation">Society or association</option>
161                         [% END %]
162                         [% IF UsageStatsLibraryType == 'corporate' %]
163                             <option value="corporate" selected="selected">Corporate</option>
164                         [% ELSE %]
165                             <option value="corporate">Corporate</option>
166                         [% END %]
167                         [% IF UsageStatsLibraryType == 'government' %]
168                             <option value="government" selected="selected">Government</option>
169                         [% ELSE %]
170                             <option value="government">Government</option>
171                         [% END %]
172                         [% IF UsageStatsLibraryType == 'religiousOrg' %]
173                             <option value="religiousOrg" selected="selected">Religious organization</option>
174                         [% ELSE %]
175                             <option value="religiousOrg">Religious organization</option>
176                         [% END %]
177                         [% IF UsageStatsLibraryType == 'subscription' %]
178                             <option value="subscription" selected="selected">Subscription</option>
179                         [% ELSE %]
180                             <option value="subscription">Subscription</option>
181                         [% END %]
182                     </select>
183                 </li>
184                 <li>
185                     <label for="UsageStatsLibraryUrl">Library URL: </label>
186                     <input type="text" name="UsageStatsLibraryUrl" value="[% Koha.Preference('UsageStatsLibraryUrl') %]" id="UsageStatsLibraryUrl" />
187                 </li>
188                 <li>
189                     <span class="label">Last update: </span>
190                     [% IF UsageStatsLastUpdateTime %]
191                         [% UsageStatsLastUpdateTime %]
192                     [% ELSE %]
193                         Your data have never been shared
194                     [% END %]
195                 </li>
196                 <li>
197                     <label for="UsageStatsGeolocation">Geolocation: </label>
198                     <input id="UsageStatsGeolocation" name="UsageStatsGeolocation" value="[% Koha.Preference('UsageStatsGeolocation') %]" type="text" value="[% Koha.Preference('UsageStatsLibrariesInfo') %]" size="35" readonly="readonly" />
199                     <a href="#" class="change_geolocation" data-branchname="" data-id="UsageStatsGeolocation"><img src="[% interface %]/lib/leaflet/images/marker-icon.png" title="Set geolocation" style="max-height: 2em;" /></a>
200                 </li>
201                 <li>
202                     <label for="UsageStatsLibrariesInfo">Libraries informations: </label>
203                     <select name="UsageStatsLibrariesInfo" id="UsageStatsLibrariesInfo">
204                         [% IF Koha.Preference('UsageStatsLibrariesInfo') %]
205                             <option value="1" selected="selected">Yes</option>
206                             <option value="0">No</option>
207                         [% ELSE %]
208                             <option value="1">Yes</option>
209                             <option value="0" selected="selected">No</option>
210                         [% END %]
211                     </select>
212                 </li>
213
214                 <li id="libraries_info">
215                     <fieldset class="rows">
216                     <legend>Libraries</legend>
217                     <ol>
218                         [% FOR l IN libraries %]
219                         <li>
220                             <label for="[% l.branchcode %]">[% l.branchname %]: </label>
221                             <div style="float:left;">
222                                 <div>Country: [% l.branchcountry %]</div>
223                                 <div>Url: [% l.branchurl %]</div>
224                                 <div>
225                                     Geolocation: <input type="text" id="geolocation_[% l.branchcode %]" name="geolocation_[% l.branchcode %]" value="[% l.geolocation %]" size="35" readonly="readonly" />
226                                     <a href="#" class="change_geolocation" data-branchname="[% l.branchname %]" data-id="geolocation_[% l.branchcode %]"><img src="[% interface %]/lib/leaflet/images/marker-icon.png" title="Set geolocation for [% l.branchname %]" style="max-height: 2em;" /></a>
227                                 </div>
228                             </div>
229                         </li>
230                         [% END %]
231                     </ol>
232                     </fieldset>
233                 </li>
234                 <li>
235                     <label for="MyPublicLink">See your public page: </label>
236                     [% IF Koha.Preference('UsageStatsPublicID') %]
237                         [% SET my_url = 'https://hea.koha-community.org/libraries/' _  Koha.Preference('UsageStatsPublicID') %]
238                         <a href="[% my_url %]">[% my_url %]</a>
239                     [% ELSE %]
240                         You do not have anything public yet.
241                     [% END %]
242                 </li>
243
244             </ol>
245             <div style="clear:right"></div>
246         <div id="mapid" style="width: 600px; height: 400px; margin-left: 40%:"></div>
247     </fieldset>
248
249         <fieldset class="action">
250             <input type="hidden" name="op" value="update" />
251             <input type="submit" value="Update your statistics usage" />
252             <a class="cancel" href="/cgi-bin/koha/admin/usage_statistics.pl">Cancel</a>
253         </fieldset>
254     </form>
255
256     <script>
257         var map = L.map('mapid').setView([0,0], 1);
258
259         L.tileLayer('https://a.tile.openstreetmap.org/{z}/{x}/{y}.png', {
260             maxZoom: 18,
261             attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
262                 '<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>'
263         }).addTo(map);
264
265         var default_elt = { 'text': _("Main library"), 'id': 'UsageStatsGeolocation' };
266         var current_elt = default_elt;
267
268         // Add the title
269         var title = L.control({position: 'topright'});
270         title.onAdd = function (map) {
271             this._div = L.DomUtil.create('div', 'title');
272             this.update();
273             return this._div;
274         };
275         title.update = function (props) {
276             this._div.innerHTML = '<h4>' + _("Click on the map to set the geolocation for %s").format(current_elt.text) + '</h4>';
277         };
278         title.addTo(map);
279
280         var markers = {};
281         function add_to_map(elt, latlng) {
282             var marker = markers[elt.id];
283             if (marker) map.removeLayer(marker);
284             marker = L.marker(latlng).addTo(map);
285             marker.bindPopup(elt.text);
286             marker.on('mouseover', function (e) {this.openPopup(); });
287             marker.on('mouseout',  function (e) {this.closePopup();});
288             markers[elt.id] = marker;
289         }
290
291         // Init the map
292         [% IF Koha.Preference('UsageStatsGeolocation') %]
293             var latlng = [ [% Koha.Preference('UsageStatsGeolocation') %] ];
294             add_to_map( current_elt, latlng );
295         [% END %]
296         [% FOR l IN libraries %]
297             [% NEXT UNLESS l.geolocation %]
298             add_to_map( { 'text': "[% l.branchname %]", 'id': "geolocation_[% l.branchcode %]" }, [ [% l.geolocation %] ] );
299         [% END %]
300
301         // On click, update the geolocation and the marker
302         map.on('click', function(e){
303             add_to_map( current_elt, e.latlng );
304             $("#" + current_elt.id).val(e.latlng.lat + ',' + e.latlng.lng);
305         });
306
307         // Auto zoom
308         var group = new L.featureGroup(Object.keys(markers).map(function(key){return markers[key]}));
309         if ( group.getBounds().isValid() ) map.fitBounds(group.getBounds());
310
311         // On click on the marker icons, update the title of the map
312         $(document).ready(function(){
313             $(".change_geolocation").on('click', function(e){
314                 e.preventDefault();
315                 if ( $(this).data('branchname') ) {
316                     current_elt = { 'text': $(this).data('branchname'), 'id': $(this).data('id') };
317                 } else {
318                     current_elt = default_elt;
319                 }
320                 title.update();
321             });
322             $("#UsageStatsLibrariesInfo").change();
323         });
324
325         $("#UsageStatsLibrariesInfo").on('change', function(){
326             if ( $(this).val() == 1 ) $("#libraries_info").show()
327             else $("#libraries_info").hide();
328             positionMap();
329         });
330
331     </script>
332
333 </div>
334 </div>
335 <div class="yui-b">
336 [% INCLUDE 'admin-menu.inc' %]
337 </div>
338 </div>
339 [% INCLUDE 'intranet-bottom.inc' %]