web: First cut at implementing playlist support.
[gnupg-doc.git] / web / share / campaign / campaign.js
1 /* For mobile devices in landscape orientation, the navbar is in the
2    way of the video.  So hide it automatically then.  */
3 $(document).ready(function() {
4   $(".navbar-fixed-top").autoHidingNavbar({
5     disableAutohide: true,
6     hideOffset: 20
7   });
8   check_autohide = function(event) {
9     let hide = (screen.width < 768) && (screen.height < screen.width);
10     $(".navbar-fixed-top").autoHidingNavbar("setDisableAutohide", !hide);
11     if (!hide) {
12       $(".navbar-fixed-top").autoHidingNavbar("show");
13     }
14   };
15   $(window).on('orientationchange', check_autohide);
16   check_autohide();
17 });
18
19 /* Random starting points for the testimonial carousel.  */
20 $(document).ready(function() {
21   let nr_items_lg = 3 * $("#myCarousel div.item").length;
22   let nr_items_md = 2 * $("#myCarouselMedium div.item").length;
23   let nr_items_xs = 1 * $("#myCarouselSmall div.item").length;
24   let nr_items = Math.min(nr_items_lg, nr_items_md, nr_items_xs);
25
26   let active_item = Math.trunc(nr_items * Math.random());
27
28   let active_slide_lg = Math.trunc(active_item / 3);
29   let active_slide_md = Math.trunc(active_item / 2);
30   let active_slide_xs = Math.trunc(active_item / 1);
31
32   $("#myCarousel div.item").removeClass("active");
33   $("#myCarouselMedium div.item").removeClass("active");
34   $("#myCarouselSmall div.item").removeClass("active");
35
36   $("#myCarousel div.item").eq(active_slide_lg).addClass("active");
37   $("#myCarouselMedium div.item").eq(active_slide_md).addClass("active");
38   $("#myCarouselSmall div.item").eq(active_slide_xs).addClass("active");
39 });
40
41 /* Advance carousel by swiping.  */
42 $(document).ready(function() {
43   $('.carousel').bcSwipe({ threshold: 50 });
44 });
45
46
47 /* Fill donation amounts w/ javascript if possible.  */
48 $(document).ready(function() {
49   let vals = ["500", "200", "100", "50", "20", "10", "5"];
50
51   for (let idx = 0; idx < vals.length; ++idx) {
52     let value = vals[idx];
53     $(".amount-btn-" + value.toString()).attr("href", "#");
54     $(".amount-btn-" + value.toString()).on("click", function() {
55       $("#amountother").attr("value", value.toString());
56       $("#currency option").attr("selected", false);
57       $("#currency option[value='EUR']").attr("selected", true);
58       $("#recur option").attr("selected", false);
59       $("#recur option[value='12']").attr("selected", true);
60     });
61   }
62 });
63
64 function get_param_from_url(name) {
65     let params = location.search.substring(1); // Snip away the ?
66     params = params.split('&');
67     let idx = 0;
68     for (; idx < params.length; idx++) {
69         let param = params[idx].split('=');
70         if (param[0] != name) {
71             return;
72         }
73         if (param.length > 1) {
74             return decodeURIComponent(param[1]);
75         }
76         return "";
77     }
78 }
79
80 /* Defer loading Youtube iframe until the user clicks on the video.  */
81 $(document).ready(function() {
82   /* For the video preview, we use this for devices without hover events.  */
83   if ("ontouchstart" in document.documentElement) {
84     $("body").addClass("touch");
85   }
86
87     let wanted_yt_id = get_param_from_url('play');
88     $(".camp-video").each(function() {
89         let yt_ids = $(this).data("embed").split(",");
90         let yt_id_idx = yt_ids.indexOf(wanted_yt_id);
91         if (yt_id_idx != -1) {
92             $(this).data("embed", wanted_yt_id);
93             $(this).children("img").attr("src", "/share/campaign/img/thumbs/" + wanted_yt_id + ".jpg");
94             break;
95         }
96     });
97
98     /* To download the thumbs in share/campaign/img/thumbs:
99        for f in YTID1 YTID2 ...; do wget -O $f.jpg http://i1.ytimg.com/vi/$f/maxresdefault.jpg; done # or hqdefault.jpg */
100
101     /* Click handler for all videos.  */
102
103     /* http://i1.ytimg.com/vi/VGazSZUYyf4/hqdefault.jpg */
104     $(".camp-video").one("click", function() {
105         let yt_id = $(this).data("embed").split(",")[0];
106         let yt_list = $(this).data("embed-list");
107         let extra_parms = "";
108         if (yt_list) {
109             extra_parms = "&list=" + yt_list;
110         }
111         $(this).html('<iframe class="embed-responsive-item" allowfullscreen src="https://www.youtube.com/embed/'
112                      + yt_id + '?autoplay=1&modestbranding=1&rel=0' + extra_parms + '"></iframe>');
113     });
114   }
115 });