https://app.storiamundi.com/series

1
2
3
4<!DOCTYPE html>
5<html lang="fr">
6<head>
7    <meta charset="utf-8">
8    <meta http-equiv="X-UA-Compatible" content="IE=edge">
9    <meta name="author" content="Storia Mundi">
10    <title>Storia Mundi</title>
11    <!-- Tell the browser to be responsive to screen width -->
12    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
13    <!-- Matomo -->
14    

14<script>
15        var _paq = window._paq = window._paq || [];
16        /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
17        _paq.push(['trackPageView']);
18        _paq.push(['enableLinkTracking']);
19        (function() {
20          var u="//an.kjbconseil.com/";
21          _paq.push(['setTrackerUrl', u+'matomo.php']);
22          _paq.push(['setSiteId', '2']);
23          var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
24          g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
25        })();
26    </script>

26
27    <!-- Matomo Tag Manager -->
28    

28<script>
29        var _mtm = window._mtm = window._mtm || [];
30        _mtm.push({'mtm.startTime': (new Date().getTime()), 'event': 'mtm.Start'});
31        (function() {
32          var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
33          g.async=true; g.src='https://an.kjbconseil.com/js/container_xoFXF1EC.js'; s.parentNode.insertBefore(g,s);
34        })();
35    </script>

35
36    <!-- End Matomo Tag Manager -->
37    <!-- End Matomo Code -->
38    <!-- Google tag (gtag.js) -->
39    

39<script>

39(function (w, d, s, l, i) { w[l] = w[l] || []; w[l].push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' }); var f = d.getElementsByTagName(s)[0], j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f); })(window, document, 'script', 'dataLayer', '

39GTM-M7439L8

39');

39</script>

39
40    <!-- End Google tag (gtag.js) -->
41    <!-- Facebook Pixel Code -->
42    

42<script>

42
43        !function (f, b, e, v, n, t, s) {
44            if (f.fbq) return; n = f.fbq = function () {
45                n.callMethod ?
46                    n.callMethod.apply(n, arguments) : n.queue.push(arguments)
47            };
48            if (!f._fbq) f._fbq = n; n.push = n; n.loaded = !0; n.version = '2.0';
49            n.queue = []; t = b.createElement(e); t.async = !0;
50            t.src = v; s = b.getElementsByTagName(e)[0];
51            s.parentNode.insertBefore(t, s)
52        }(window, document, 'script',
53            'https://connect.facebook.net/en_US/fbevents.js');
54        fbq('init', '

54366729481096305

54');
55        fbq('track', 'PageView');
56        
57    

57</script>

57
58    <noscript>
59        <img height="1" width="1"
60             src="https://www.facebook.com/tr?id=366729481096305&ev=PageView
61&noscript=1" />
62    </noscript>
63    <!-- End Facebook Pixel Code -->
64
65    <link href="https://fonts.googleapis.com/css2?family=Julius+Sans+One&display=swap" rel="stylesheet">
66    <link href="https://fonts.googleapis.com/css2?family=Istok+Web&display=swap" rel="stylesheet">
67
68    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
69
70    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
71<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
72<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
73<link rel="manifest" href="/site.webmanifest">
74<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
75<meta name="msapplication-TileColor" content="#da532c">
76<meta name="theme-color" content="#ffffff">
77
78    <link rel="stylesheet" href="/bootstrap-custom.css?v=Jox9nsI_JHraySiOJo_JY_TA9I037yGFtcYNC973vfs">
79    <link rel="stylesheet" href="/css/style.css?v=gDCS45zLuzOGfyK_6Keq8wDLC6nNPjeriNbapReqdpg">
80
81    
82</head>
83
84<body>
85    <!-- Matomo Image Tracker-->
86    <img referrerpolicy="no-referrer-when-downgrade" src="https://an.kjbconseil.com/matomo.php?idsite=2&amp;rec=1" style="border:0" alt="" />
87    <!-- End Matomo -->
88    <iframe src="https://www.googletagmanager.com/ns.html?id=GTM-M7439L8" height="0" width="0" style="display:none;visibility:hidden"></iframe>
89    <nav class="navbar navbar-dark navbar-expand-md bg-dark justify-content-between py-2">
90        <div class="container-fluid">
91            <div class="navbar-collapse dual-nav w-50 order-md-0 collapse order-1">
92            </div>
93            <a href="/" class="navbar-brand d-block order-0 order-md-1 w-25 mx-auto text-center">
94                <img src="https://lh3.googleusercontent.com/Zi0G4CYYbNqt8Mct4TQ5H_3hDWm6JHFW86v-EczTJsG9Si1ha2r9y-9-Mm8Zqx8eHrgoi79-rLzBv7Jr7Xjcjlqi55Atx94WJmDkPX7qGnvBKgU=h256" width="50%" alt="Storia Mundi logo">
95            </a>
96            <div class="navbar-collapse dual-nav w-50 collapse order-2">
97            </div>
98        </div>
99    </nav>
100    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
101        <div class="container-fluid">
102            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navContent" aria-controls="navContent" aria-expanded="false" aria-label="Afficher le menu">
103                <span class="navbar-toggler-icon"></span>
104            </button>
105            <div class="navbar-collapse collapse" id="navContent">
106                <form class="form-inline" method="get" action="/conferences">
107                    <div class="md-form my-0">
108                        <input class="form-control mr-sm-2" name="filter" type="text" placeholder="Titre, conférencier, date..." minlength="3" aria-label="Recherche" required>
109                    </div>
110                    <button class="btn btn-md mr-2 bg-white" type="submit">
111                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-search" viewBox="0 0 16 16">
112                            <path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"></path>
113                        </svg>
114                    </button>
115                </form>
116                <ul class="nav navbar-nav mr-auto">
117                    <li class="nav-item">
118                        <a class="nav-link text-white" href="/conferences/upcoming">À venir</a>
119                    </li>
120                    <li class="nav-item">
121                        <a class="nav-link text-white" href="/conferences/vod">En replay</a>
122                    </li>
123                    <li class="nav-item dropdown">
124                        <a class="nav-link dropdown-toggle text-white" href="#" id="navbarDropdownMenuLink" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
125                            Par catégories
126                        </a>
127                        <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
128                                    <a class="dropdown-item" href="/categories/01_Histoire/conferences">01_Histoire</a>
129                                    <a class="dropdown-item" href="/categories/02_Histoire de l&#x2019;art/conferences">02_Histoire de l&#x2019;art</a>
130                                    <a class="dropdown-item" href="/categories/03_Architecture contemporaine/conferences">03_Architecture contemporaine</a>
131                                    <a class="dropdown-item" href="/categories/04_Escapades/conferences">04_Escapades</a>
132                                    <a class="dropdown-item" href="/categories/05_Champs de bataille/conferences">05_Champs de bataille</a>
133                                    <a class="dropdown-item" href="/categories/06_Autres sciences humaines/conferences">06_Autres sciences humaines</a>
134                                    <a class="dropdown-item" href="/categories/07_Oberrhein/conferences">07_Oberrhein</a>
135                        </div>
136                    </li>
137                    <li class="nav-item">
138                        <a class="nav-link text-white" href="/series">
139                            Nos coffrets
140                        </a>
141                    </li>
142                </ul>
143                <ul class="nav navbar-nav text-white">
144                    <li class="nav-item"><a class="nav-link text-white" href="https://www.storiamundi.com/">Retour à l'accueil</a></li>
145                    <li class="nav-item"><a class="nav-link text-white" href="https://www.storiamundi.com/263/faq">Aide</a></li>
146                        <li class="nav-item"><a class="nav-link text-white" href="/registration">Je m'inscris</a></li>
147                        <li class="nav-item"><a class="nav-link text-white" href="/login">Je me connecte</a></li>
148                </ul>
149            </div>
150        </div>
151    </nav>
152
153    <main role="main">
154        
155
156<section class="jumbotron bg-primary pb-4 pt-4 text-center">
157    <div class="container">
158        <h1 class="text-white">
159            Nos coffrets
160        </h1>
161        <p class="text-white">
162            Pour vous-même ou à offrir !
163        </p>
164    </div>
165</section>
166
167<div class="series container">
168</div>
169<div class="loader">
170    <div></div>
171    <div></div>
172    <div></div>
173</div>
174
175
176
177        
178
179
180    </main>
181
182    

182<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>

182
183    

183<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-Piv4xVNRyMGpqkS2by6br4gNJ7DXjqk09RmUpJ8jgGtD7zP9yug3goQfGII0yAns" crossorigin="anonymous"></script>

183
184
185    <!-- see https://docs.sentry.io/platforms/javascript/install/lazy-load-sentry/ -->
186    

186<script src="https://js.sentry-cdn.com/448847e9bb329495d4905b970fb25dd4.min.js"
187            crossorigin="anonymous"
188            data-lazy="no"></script>

188
189    

189<script type="text/javascript">
190        $('#displayTrialPeriodAlert').modal();
191
192        var timeZoneOffset = new Date().getTimezoneOffset();
193        var timeZoneName = Intl.DateTimeFormat().resolvedOptions().timeZone;
194        // Set the cookies
195        document.cookie = "timeZoneOffset=" + timeZoneOffset + "; path=/";
196    </script>

196
197
198    
199    

199<script type="text/javascript">
200
201        const seriesContainer = document.querySelector('.series');
202        const loader = document.querySelector('.loader');
203        const hostname = `${window.location.origin}`;
204        let currentPage = 1;
205
206        const getSeries = async (page) => {
207            const API_URL = hostname+`/api/series?pageNumber=${page}`;
208            const response = await fetch(API_URL);
209            // handle 404
210            if (!response.ok) {
211                throw new Error(`An error occurred: ${response.status}`);
212            }
213            return await response.json();
214        }
215
216        const showSeries = (seriesList) => {
217            let seriesDeck = '';
218            let seriesDeckContent = '';
219
220            seriesList.forEach((series, index) => {
221                if (index % 2 == 0) {
222                    if(index != 0){
223                        seriesDeck.innerHTML = seriesDeckContent;
224                        seriesContainer.appendChild(seriesDeck);
225                    }
226                    seriesDeck = document.createElement('div');
227                    seriesDeck.classList.add('py-3', 'card-deck', 'cards-'+index);
228                    seriesDeckContent = '';
229                }
230
231                seriesDeckContent += `
232                    <div class="card">
233                        <div class="card-header">
234                        </div>
235                    `;
236
237                seriesDeckContent += `<div class="card-body">
238                    <h3 class="text-dark text-center"><strong>${series.name}</strong></h3><hr />
239                `;
240
241                seriesDeckContent += `
242                    <img src="${series.image}"
243                        class="img-fluid d-block mx-auto rounded"
244                        alt = "${series.name} image." ><hr/>
245                `;
246
247                seriesDeckContent += `
248                        <p class="card-text text-justify">
249                            ${series.description}
250                `;
251
252                seriesDeckContent += `
253                    </p>
254                    <div class="text-center">
255                            <a href="${hostname}/series/${series.id}" method="get" class="btn btn-primary float-center mr-2">Découvrir ce coffret</a>
256                        </form>
257                    </div>
258                `;
259
260                seriesDeckContent += `
261                    </div>
262                    </div>
263                `;
264            });
265
266            if (seriesDeck != '' 
267                || seriesDeckContent != '') {
268                    seriesDeck.innerHTML = seriesDeckContent;
269                    seriesContainer.appendChild(seriesDeck);
270                    seriesDeck = '';
271                    seriesDeckContent = '';
272                }
273        };  
274        
275        const loadSeries = async (page) => {
276            // show the loader
277            showLoader();
278                setTimeout(async () => {
279                    try {
280                        // call the API to get quotes
281                    const response = await getSeries(page);
282                    
283                    showSeries(response.items);
284                    } catch (error) {
285                        console.log(error);
286                    } finally {
287                        hideLoader();
288                    }
289                }, 500);
290        };
291
292        const hideLoader = () => {
293            loader.classList.remove('show');
294        };
295
296        const showLoader = () => {
297            loader.classList.add('show');
298        };
299
300        loadSeries(currentPage);
301
302        window.addEventListener('scroll', () => {
303            const {
304                scrollTop,
305                scrollHeight,
306                clientHeight
307            } = document.documentElement;
308
309            if (scrollTop + clientHeight >= scrollHeight - 5) {
310                currentPage++;
311                loadSeries(currentPage);
312            }
313        }, {
314            passive: true
315        });
316    </script>

316
317
318    

318<script>
319window.axeptioSettings = {
320  clientId: "63e52880bd51ffe80335589d",
321  cookiesVersion: "storia mundi app-fr",
322  userCookiesDomain: "storiamundi.com"
323};
324 
325(function(d, s) {
326  var t = d.getElementsByTagName(s)[0], e = d.createElement(s);
327  e.async = true; e.src = "//static.axept.io/sdk.js";
328  t.parentNode.insertBefore(e, t);
329})(document, "script");
330</script>

330
331
332    <!-- Messenger Plugin de discussion Code -->
333    <div id="fb-root"></div>
334
335    <!-- Your Plugin de discussion code -->
336    <div id="fb-customer-chat" class="fb-customerchat">
337    </div>
338
339    

339<script>
340      var chatbox = document.getElementById('fb-customer-chat');
341      chatbox.setAttribute("page_id", "100132161853781");
342      chatbox.setAttribute("attribution", "biz_inbox");
343    </script>

343
344
345    <!-- Your SDK code -->
346    

346<script>
347      window.fbAsyncInit = function() {
348        FB.init({
349          xfbml            : true,
350          version          : 'v16.0'
351        });
352      };
353
354      (function(d, s, id) {
355        var js, fjs = d.getElementsByTagName(s)[0];
356        if (d.getElementById(id)) return;
357        js = d.createElement(s); js.id = id;
358        js.src = 'https://connect.facebook.net/fr_FR/sdk/xfbml.customerchat.js';
359        fjs.parentNode.insertBefore(js, fjs);
360      }(document, 'script', 'facebook-jssdk'));
361    </script>

361
362
363</body>
364</html>