https://gdelt.github.io/responsive.js

1// Manages iframe zoom functionality and responsive panel re-sizing
2
3// cookie functions remember app zoom settings - one for GDELT one for Compare tool
4// both settings are saved together in a JSON string to cookie 'zoom' argument
5
6function saveCookie() {
7  var d = new Date();
8  d.setTime(d.getTime() + (30*24*60*60*1000)); // 30 days expiry
9  var expires = "expires="+ d.toUTCString();
10  cookie_json = '{ "zoom": ' + scale + ', "compzoom": ' + comp_scale + '}';
11  document.cookie = "zoom=" + cookie_json + ";" + expires + ";path=/";
12}
13
14function readCookie() {
15  var cookie = {};
16  var cookie_array = document.cookie.split(';');
17  for(var i=0; i<cookie_array.length; i++) {
18    cookie_arg = cookie_array[i].split('=');
19    cookie[cookie_arg[0].trim()] = cookie_arg[1];
20  }
21  if(!cookie.zoom) return;
22  return JSON.parse(cookie.zoom);
23}
24
25// iframe zoom functionality
26var dw = 1;  var dh = 1;
27var dwc = 1; var dhc = 1;
28var scale = 1;         // main gdelt iframe scaler
29var comp_scale = 1;    // scale for compare scaler
30
31var cookie = readCookie();
32if(typeof cookie !== 'undefined') { if(cookie.zoom) {
33  scale = cookie.zoom;
34  if(scale == NaN) scale = 1; // safeguard
35  dw = 1/cookie.zoom;
36  dh = 1/cookie.zoom;
37  comp_scale = cookie.compzoom;
38  dwc = 1/cookie.compzoom;
39  dhc = 1/cookie.compzoom;
40}}
41
42// rescale iframe based on zoom keys
43// separate zoom settings for GDELT and Compare iframes
44function iframe_zoom(x) {
45  var comp_mode = /^Compare/.test($('#iframe_title').text()); // true if on Compare screen
46  if(VERBOSE) { clog('iframe_zoom ' + comp_mode); }
47  var x = [1/1.1, 1.1, 1][x];  // x is a zoom code: 0:out, 1:in, 2:no change
48  var w = $('#iframe_container').width();
49	var h = $('#iframe_container').height();
50  if(comp_mode){ // adjust appropriate scaler
51    comp_scale *= x;
52    dwc /= x; dhc /= x;
53    $("#gdelt_iframe").width(dwc * w + "px");
54  	$("#gdelt_iframe").height(dhc * h + "px")
55  	$('#gdelt_iframe').css('transform', `scale(${comp_scale})`);
56  } else {
57    scale *= x;
58    dw /= x; dh /= x;
59    $("#gdelt_iframe").width(dw * w + "px");
60  	$("#gdelt_iframe").height(dh * h + "px")
61  	$('#gdelt_iframe').css('transform', `scale(${scale})`);
62  }
63  if(x != 1) { saveCookie(); } // update cookie if zoom changed
64}
65
66// If browser window is resized this recalculates panel sizes so page can work without refresh
67function resize_panels() {
68  if(VERBOSE) { clog('resize_panels'); }
69  // iframe_zoom(2);
70  var w = window.innerWidth;
71  var h = window.innerHeight;
72  var n = $('nav').outerHeight();
73  var t = $('#main_panel_title_row').outerHeight();
74  if(w <= 767) {
75    $('#side_panel').outerHeight('auto');
76    $('#iframe_container').width(w + 'px');
77    $('#iframe_container').height(h - t + 'px');
78  } else {
79    $('#side_panel').outerHeight(h - n + 'px');
80    $('#iframe_container').width(w * 2/3 + 'px');
81    $('#iframe_container').height(h - n - t + 'px');
82  }
83  iframe_zoom(2);
84}
85
86// event listeners
87resize_panels();
88$( window ).resize(function() { resize_panels(); });
89