Deník N – předplatné

<!doctype html> <html lang="cz" dir="ltr"> <head> <title>Deník N – předplatné</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>DenikN</title> <meta name="description" content="Deník N - Nezávislé Noviny"> <meta property="og:locale" content="cs_CZ"> <meta property="og:type" content="website"> <meta property="og:title" content="Deník N - Nezávislé Noviny"> <meta property="og:url" content="https://denikn.cz/"> <meta property="og:site_name" content="Deník N"> <meta property="fb:admins" content="1342532370"> <meta property="og:image" content="https://static.novydenik.com/2018/10/Denik_N_share_cover_fb.jpg"> <script type="application/ld+json">{ "@context": "http://schema.org", "@type": "WebSite", "url": "https://denikn.cz/", "potentialAction": { "@type": "SearchAction", "target": "https://denikn.cz/?s={search_term}", "query-input": "required name=search_term" } }</script> <link rel="canonical" href="" /> <link rel="alternate" type="application/rss+xml" title="RSS kanál: Deník N »" href="https://denikn.cz/feed/"> <link rel="alternate" type="application/rss+xml" title="RSS kanál komentářů webu Deník N »" href="https://denikn.cz/comments/feed/"> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css" integrity="sha384-DyZ88mC6Up2uqS4h/KRgHuoeGwBcD4Ng9SiP4dIRy0EXTlnuz47vAwmeGwVChigm" crossorigin="anonymous"> <link href="/layouts/novydenik/css/bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" href="/layouts/novydenik/css/2021-12.css"> <link rel="stylesheet" href="/layouts/internal-module/css/login.min.css">  <link href="https://a-static.projektn.sk/2018/11/icon-hires.png" rel="icon" sizes="192x192"> <link href="https://a-static.projektn.sk/2018/11/favicon.ico" rel="icon"> <link href="https://a-static.projektn.sk/2018/11/favicon.ico" rel="shortcut icon"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0" /> <script> document.domain = "denikn.cz"; funnel_id = "131"; </script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.js"></script> <script src="https://predplatne.denikn.cz/layouts/mailer/js/vue_3.4.21.global.prod.min.js"></script>  <script src="/layouts/internal-module/js/login.min.js"></script> <script src="/layouts/default/js/iframeResizer.contentWindow.min.js"></script> <script src="/layouts/internal-module/js/donation.min.js?v4"></script> <script> window.dataLayer = window.dataLayer || []; </script>  <script src='https://denikn.cz/wp-content/plugins/dn-ads-cz/build/cpex.js'></script> <script type="text/javascript"> // trigger dataLayer events based on the didomi consent if (typeof (__tcfapi) != 'undefined') { __tcfapi('addEventListener', 2, function (data, success) { // no consent confirmed yet, starting not personalized scripts if (success && data.eventStatus !== 'useractioncomplete' && data.eventStatus !== 'tcloaded') { dataLayer.push({'event': 'consent_ads_and_tracking'}); } if (typeof (data.listenerId) != 'undefined') { __tcfapi('removeEventListener', 2, function (success) { }, data.listenerId); } }); window.didomiOnReady = window.didomiOnReady || []; window.didomiOnReady.push(function () { if(Didomi.getUserConsentStatus('publishers-Kqq3iPge', 'c:nmediaa-8bcq6new')) { console.log("pushing events") dataLayer.push({'event': 'consent_ads_and_tracking'}); } }); window.didomiOnReady.push(function () { if(Didomi.getUserConsentStatus('publishers-UPqtcgaE', 'c:nmediaa-8bcq6new')) { dataLayer.push({'event': 'consent_personalized_ads'}); } }); } else { dataLayer.push({'event': 'consent_ads_and_tracking'}); dataLayer.push({'event': 'consent_personalized_ads'}); } </script>   <script type="text/javascript"> window['gtag_enable_tcf_support'] = true </script> <script>(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','GTM-T8CMXTN');</script>    <script type="text/javascript"> // Script below (/remp/beam-tracker/js) configures global referer variable which we need // to use in the trackCheckout. Occasionally this was executed sooner than needed. // We were forced to delay the execution after remplib is loaded. At that moment // the referer is guaranteed to be set correctly. window.addEventListener('beam_event', function (event) { // execute this only for pageview/load event if (event.detail['_category'] !== 'pageview' && event.detail['_action'] !== 'load') { return; } // if sales funnel is being reloaded (e.g. SSO login), do not track events again var urlReloadNonce = (new URL(window.location.href)).searchParams.get("_r"); var storageReloadNonce = localStorage.getItem('sf_reload_nonce'); if (storageReloadNonce && urlReloadNonce === storageReloadNonce) { // sales funnel reload, do no track } else { var xmlHttpRequest = new XMLHttpRequest(); xmlHttpRequest.open('POST', '/api/v1/content/parse-url'); xmlHttpRequest.onreadystatechange = function() { if (this.readyState !== 4) { return; } if (this.status >= 400) { var response = JSON.parse(this.responseText); if (response.code !== 'content_not_found') { console.warn("Unable to find content: " + response.message); } } var response = JSON.parse(this.responseText); if (response.article_id) { remplib.tracker.setArticle({ 'id': new String(response.article_id) }); remplib.tracker.trackCheckout(funnel_id, true); return; } remplib.tracker.trackCheckout(funnel_id, true); } xmlHttpRequest.send(JSON.stringify({ url: referer })); } }, false); </script> <script type="application/javascript" src="/remp/beam-tracker/js"></script>   <script> // fbq('track', 'ViewContent'); </script>   <script> window.addEventListener("load", () => { window.addEventListener('message', function(event) { if (event.data.name === 'tp-checkout-box' && event.data.detail.width && event.data.detail.height) { let iframe = document.getElementById("tp-iframe"); iframe.style['width'] = event.data.detail.width + 'px'; iframe.style['height'] = event.data.detail.height + 'px'; } }); window.isTrustPayModalCompatible = function (form) { const isMobileDevice = navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i); const isTrustPay = form.payment_gateway.value === 'trustpay' || form.payment_gateway.value === 'trustpay_recurrent'; return isTrustPay && !isMobileDevice; } window.trustPayModalSubmit = function (form) { showModal(); let formData = new FormData(form); fetch(form.action, { method: form.method, body: formData, }).then(response => { console.log(response); showPaymentUI(response.url); }).catch((error) => { console.log(error); alert("Nastala chyba. Zkuste to prosím později."); }); } let modal = document.getElementById("tp-payment-modal"); let loader = document.getElementById("tp-payment-modal-loader"); let modalIframe = document.getElementById("tp-payment-modal-iframe"); modal.addEventListener('click', function() { modal.style.display = 'none'; modalIframe.firstChild.remove(); }); function showModal() { window.top.scrollTo({top: 0, behaviour: "smooth"}); modal.style.display = 'flex'; loader.style.display = 'flex'; } function showPaymentUI(url) { let iframe = document.createElement('iframe'); iframe.src = url; iframe.id = 'tp-iframe'; iframe.width = '100%'; iframe.style.width = '360px'; iframe.style.height = '300px'; iframe.setAttribute('frameborder', 0); iframe.setAttribute('marginwidth', 0); iframe.setAttribute('marginheight', 0); iframe.onload = function () { loader.style.display = 'none'; modalIframe.style.display = 'flex'; }; modalIframe.appendChild(iframe); } }); </script> <div id="tp-payment-modal" style="display: none; position: fixed; z-index: 1000; left: 0; top: 0; right: 0; bottom: 0; align-items: flex-start; justify-content: center; background-color: rgba(0,0,0,0.6);"> <div style="max-width: 95dvh; max-height: 95dvh; font-size: 0; margin-top: 50px;"> <div id="tp-payment-modal-loader" class="tp-payment-modal-loader" style="margin-top: 100px; display: none;"></div> <div id="tp-payment-modal-iframe" style="display: none;"></div> </div> </div> <style> .tp-payment-modal-loader { color: lightgrey; height: 30px; aspect-ratio: 2.5; --_g: no-repeat radial-gradient(farthest-side, #eeeeee 90%, #0000); background: var(--_g), var(--_g), var(--_g), var(--_g); background-size: 20% 50%; animation: l43 1s infinite linear; } @keyframes l43 { 0% { background-position: calc(0 * 100% / 3) 50%, calc(1 * 100% / 3) 50%, calc(2 * 100% / 3) 50%, calc(3 * 100% / 3) 50% } 16.67% { background-position: calc(0 * 100% / 3) 0, calc(1 * 100% / 3) 50%, calc(2 * 100% / 3) 50%, calc(3 * 100% / 3) 50% } 33.33% { background-position: calc(0 * 100% / 3) 100%, calc(1 * 100% / 3) 0, calc(2 * 100% / 3) 50%, calc(3 * 100% / 3) 50% } 50% { background-position: calc(0 * 100% / 3) 50%, calc(1 * 100% / 3) 100%, calc(2 * 100% / 3) 0, calc(3 * 100% / 3) 50% } 66.67% { background-position: calc(0 * 100% / 3) 50%, calc(1 * 100% / 3) 50%, calc(2 * 100% / 3) 100%, calc(3 * 100% / 3) 0 } 83.33% { background-position: calc(0 * 100% / 3) 50%, calc(1 * 100% / 3) 50%, calc(2 * 100% / 3) 50%, calc(3 * 100% / 3) 100% } 100% { background-position: calc(0 * 100% / 3) 50%, calc(1 * 100% / 3) 50%, calc(2 * 100% / 3) 50%, calc(3 * 100% / 3) 50% } } </style>  <style> @font-face { font-family: 'Lumin Serif'; font-style: normal; font-weight: 400; font-display: swap; src: url('/layouts/novydenik/fonts/lumin-serif-300.woff') format('woff'), url(/layouts/novydenik/fonts/lumin-serif-300.ttf) format('truetype'); } @font-face { font-family: 'Lumin Serif'; font-style: italic; font-weight: 400; font-display: swap; src: url('/layouts/novydenik/fonts/lumin-serif-300-italic.woff') format('woff'), url(/layouts/novydenik/fonts/lumin-serif-300-italic.ttf) format('truetype'); } @font-face { font-family: 'Lumin Serif'; font-style: normal; font-weight: 700; font-display: swap; src: url('/layouts/novydenik/fonts/lumin-serif-500.woff') format('woff'), url(/layouts/novydenik/fonts/lumin-serif-500.ttf) format('truetype'); } @font-face { font-family: 'Lumin Serif'; font-style: italic; font-weight: 700; font-display: swap; src: url('/layouts/novydenik/fonts/lumin-serif-500-italic.woff') format('woff'), url(/layouts/novydenik/fonts/lumin-serif-500-italic.ttf) format('truetype'); } @font-face { font-family: 'Lumin Sans'; font-style: normal; font-weight: 200; font-display: swap; src: url('/layouts/novydenik/fonts/lumin-sans-200.woff') format('woff'), url(/layouts/novydenik/fonts/lumin-sans-200.ttf) format('truetype'); } @font-face { font-family: 'Lumin Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('/layouts/novydenik/fonts/lumin-sans-400.woff') format('woff'), url(/layout/novydenik/fonts/lumin-sans-400.ttf) format('truetype') } </style> <style> body { font-family: "Lumin Serif", "Times New Roman", Times, serif; } .flex-wrapper { max-width: 1000px; margin: auto; display: flex; min-height: auto; flex-direction: column; justify-content: start; gap: 20px; grid-gap: 20px; padding: 0 10px; } h1 { font-family: "Lumin Serif", "Times New Roman", Times, serif; font-weight: bold; font-size: 30px; } h2 { font-family: "Lumin Serif", "Times New Roman", Times, serif; font-size: 20px; font-weight: bold; } .section_title_box { display: block; background: rgb(255 232 216); padding: 15px 30px; margin-top: 10px; } .section_title_heading { font-size: 30px; font-weight: bold; line-height: 1; } .section_title_subheading { font-size: 15px; } .section_title_box ul { list-style: none; text-indent: -20px; /* key property */ margin-left: 20px; /* key property */ margin-top: 10px; font-size: 15px; } .section_title_box li:before { content: '\2713'; /*margin-left: -20px;*/ margin-right: 10px; } .period_options { display: flex; gap: 5px; } .period_option { flex: 0 1 33%; border: 2px solid rgb(234, 234, 234); text-align: center; cursor: pointer; display: flex; flex-direction: column; justify-content: space-between; } .period_option_title { /*margin: -16px -16px 16px;*/ padding: 16px; font-weight: bold; color: rgb(175 50 57); border-bottom: 1px solid rgb(234, 234, 234); font-size: 20px; } @media all and (max-width: 500px) { .period_option_title { font-size: 16px; } } .period_option_old_price { /*text-decoration: line-through;*/ font-size: 14px; line-height: 22px; /*font-family: 'Lumin Sans', sans-serif;*/ color: #999999; padding: 10px 0; } .old_price_line_through { text-decoration: line-through; } .period_option_price { margin-top: 12px; margin-bottom: 12px; white-space: nowrap; line-height: 1; font-size: 24px; font-weight: bold; /*font-family: 'Lumin Sans', sans-serif;*/ } .period_option.period_option_selected { border: 2px solid rgb(103 182 108); } .period_option_selected .period_option_title { color: #fff; background-color: rgb(103 182 108); border-bottom: 1px solid rgb(103 182 108); } .additional_options { display: flex; gap: 10px; grid-gap: 10px; flex-direction: column; } .additional_option { display: flex; min-height: 60px; border: 2px solid rgb(234, 234, 234); cursor: pointer; } .addition_option_checkbox { background: rgb(248, 248, 248); padding: 5px; border-right: 1px solid rgb(234, 234, 234); flex: 0 0 20%; display: flex; justify-content: center; align-items: center; max-width: 72px; } .addition_option_checkbox .addition_option_checkbox_square { width: 24px; height: 24px; border: 2px solid black; } .addition_option_text { flex: 1 1 auto; padding: 5px 5px 5px 30px; font-size: 20px; /*font-family: 'Lumin Sans', sans-serif;*/ font-weight: bold; border-right: 1px solid rgb(234, 234, 234); display: flex; align-items: center; } @media all and (max-width: 500px) { .addition_option_text { font-size: 16px; padding: 5px 15px 5px 15px; } } @media all and (max-width: 500px) { .period_option_title { font-size: 16px; } } .addition_option_text_color { color: rgb(175 50 57); } .addition_option_price { flex: 0 0 15%; padding: 5px; font-size: 24px; /*font-family: 'Lumin Sans', sans-serif;*/ font-weight: bold; text-align: center; margin: auto; min-width: 100px; } .additional_option.additional_option_selected { border: 2px solid rgb(103 182 108); } .additional_option_selected .addition_option_checkbox { background: rgb(103 182 108); } .additional_option_selected .addition_option_checkbox .addition_option_checkbox_square { background: white; border: 2px solid white; } .additional_option_selected .addition_option_text { border-right: 2px solid rgb(103 182 108); color: rgb(103 182 108); } .addition_option_checkbox .material-symbols-outlined { display: none; margin: -2px; } .additional_option_selected .addition_option_checkbox .material-symbols-outlined { display: inline-block; } .additional_option_info_box { font-size: 15px; display: flex; } .additional_option_info_box_text { font-size: 15px; padding: 5px 10px; } .additional_option_info_box_text ul { list-style: none; text-indent: -20px; /* key property */ margin-left: 20px; /* key property */ margin-top: 10px; font-size: 15px; } .additional_option_info_box_text li:before { content: '\2713'; margin-right: 10px; } .additional_option_info_left { flex: 0 0 20%; max-width: 72px; } .additional_option_info_right { flex: 0 0 15%; min-width: 100px; } @media all and (max-width: 600px) { .additional_option_info_left { flex: 0 1 0; } .additional_option_info_right { flex: 0 1 0; min-width: 0; } } .payment_box { border: 1px solid rgb(176 176 176); background: rgb(248 248 248); display: flex; padding: 16px; } .payment_box .payment_options { flex: 0 0 50%; display: flex; flex-direction: column; gap: 10px; } .payment_options .payment_options_heading { font-weight: bold; font-size: 24px; } .payment_option { display: flex; cursor: pointer; gap: 5px; } .payment_option .payment_option_radio { border-radius: 50%; width: 20px; height: 20px; border: 2px solid black; margin: auto; display: flex; justify-content: center; align-items: center; flex-shrink: 0; } .payment_option.payment_option_selected .payment_option_radio .payment_option_radio_selected { background: black; border-radius: 50%; width: 12px; height: 12px; margin: auto; } .payment_option .payment_option_icon { flex: 0 0 25%; margin-left: 10px; display: flex; align-items: center; justify-content: center; gap: 5px; } .payment_option .payment_option_text { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; font-size: 15px; } .payment_option .payment_option_text_main { font-weight: bold; } .payment_option .payment_option_text_info { font-weight: bold; color: rgb(176 176 176); } .payment_box .user_info { flex: 0 0 50%; } @media all and (max-width: 690px) { .payment_box { flex-wrap: wrap; gap: 30px; } .payment_box .payment_options { flex-basis: 100%; } .payment_box .user_info { flex-basis: 100%; } } .pay_button_old_price { /*text-decoration: line-through;*/ /*font-size: 16px;*/ /*line-height: 22px;*/ /*font-family: 'Lumin Sans', sans-serif;*/ /*color: black;*/ } .has-error2.shake.section_title_box { -webkit-animation: bounce 0.8s ease-out; -moz-animation: bounce 800ms ease-out; -o-animation: bounce 800ms ease-out; animation: bounce 0.8s ease-out; } label.has-error2 { color: #a94442; } small { font-size: 90%; display: block; } .checkbox-label { text-indent: -35px; margin-left: 35px; } .special_subscriptions_box { display: flex; flex-wrap: wrap; gap: 10px; max-width: 800px; margin: 0 auto; } .special_subscriptions_title { flex: 1 0 100%; text-align: center; } .special_subscription_option { flex: 1 1 40%; text-align: center; } .special_subscription_option a { width: 100%; padding: 10px; font-weight: bold; } .special_subscription_option_full { flex: 0 0 100%; } .special_subscription_option_highlight a { background-color: rgb(200, 50, 57); color: white; } .special_subscription_option_highlight a:hover { background-color: rgb(171, 44, 52); color: white; } .new_price_box { text-align: center; margin-top: 1.5rem; font-size: 15px; color: #9E9E9E; } .pay-button { margin: 0.5rem auto; width: 85%; } .pay-button-small { margin: auto; width: 85%; } .modal-backdrop.in { opacity: .5; } .popover_root { position: relative; display: flex; align-items: center; } .popover_icon { -webkit-appearance: none; -moz-appearance: none; appearance: none; display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; font-weight: 700; font-size: 1.1rem; color: #fff; border: 0; border-radius: 9999px; background-color: #999; cursor: pointer } .popover_icon:hover,.popover_icon:focus { color: #fff; text-decoration: none; } .popover_content_html { display:none; } .popover-content { min-width: 18.625rem; padding: 1rem 2rem; font-size: 1rem; line-height: 1.5; border-radius: .25rem; background-color: #fff; filter: drop-shadow(0 .0625rem .25rem rgba(0, 0, 0, .13)); transition: opacity .33s ease } .popover-content ul li:not(:last-child) { margin-bottom: .25rem; } </style> </head> <body> <script> window.parent.$('body, html').css('scroll-behavior', 'auto'); </script> <style> .sf-header-wrapper { max-width: 1000px; margin: auto; display: flex; min-height: auto; flex-direction: column; justify-content: start; gap: 20px; grid-gap: 20px; padding: 10px 10px 0; z-index: 1000; font-size: 14px; } .sf-header-wrapper .sf-header-logo { position: relative; overflow: hidden; float: left; font-size: 0px; margin-top: 0px; background: transparent; height: 50px; text-align: center; } .sf-header-wrapper .sf-header-login { float: right; } .sf-header-wrapper .sf-header-login a { font-family: "Open Sans", sans-serif; font-size: 12px; color: #000; text-transform: uppercase; text-align: right; display: block; width: 100%; height: 48px; padding: 0 18px; line-height: 49px; } .sf-header-wrapper .sf-header-login a span { display: inline-block; max-width: 196px; white-space: nowrap; overflow: hidden; } .sf-header-wrapper .sf-header-icon { display: block; width: 12px; float: right; height: 49px; margin-left: 10px; } </style> <header class="sf-header-wrapper"> <div style="padding: 0 10px;"> <h1 class="sf-header-logo"> <a href="https://denikn.cz/"><img alt="logo" src="/layouts/novydenik/logo.svg" style="height: 50px; margin: 1em 0;"></a> </h1> <div class="sf-header-login"> </div> </div> </header> <section id="main" class="flex-wrapper"> <form action="/sales-funnel/sales-funnel-frontend/submit" id="frm-payment" method="post" target="_top" ref="form" @submit.prevent="onSubmit"> <input type="hidden" name="funnel_url_key" :value="funnelUrlKey"> <input type="hidden" name="subscription_type" :value="inputs.subscription_type"> <input type="hidden" name="payment_gateway" :value="inputs.payment_gateway"> <input type="hidden" name="allow_redirect" :value="inputs.payment_gateway_allow_redirect"> <section id="first-window" class="flex-wrapper" :class="{ hidden: !isWindowActive('first-window') }"> <h1 style="text-align: center">Předplaťte si Deník N</h1> <h2 class="special_subscriptions_title">Podpořte nezávislou novinařinu, která pomáhá rozumět lépe světu.</h2> <h3 style="text-align: center">Vánoční nabídka: <a href="https://predplatne.denikn.cz/vanoce24">darujte jeden dárek, dostanete další tři zdarma.</a></h3> <div class="section_title_box"> <div class="section_title_heading"> <div class="popover_root"> Základní předplatné  <a href="#" class="popover_icon" data-toggle="popover" data-trigger="focus" data-html="true" data-placement="auto" tabindex="0" role="button" >?</a> <div class="popover_content_html"> <ul> <li>digitální obsah Deníku N v prohlížeči na webu i v mobilu</li> <li>kompletní archiv Deníku N od roku 2018</li> <li>denní zpravodajský souhrn a páteční výběr šéfredaktora jako newsletter do e-&NoBreak;mailové schránky</li> <li>články novinářských osobností jako Petra Procházková, Petr Koubský, Renata Kalenská, Zdislava Pokorná, Michael Romancov a mnoha dalších</li> </ul> </div> </div> </div> <div class="section_title_subheading">(Cena za měsíc)</div> </div> <div class="period_options"> <div class="period_option" :class="{period_option_selected: isSubscriptionTerm('month')}" @click="selectSubscriptionTerm('month')"> <div class="period_option_title">Měsíční</div> <div class="period_option_price">[[ monthlyPrice('month') ]] Kč</div> </div> <div class="period_option" :class="{period_option_selected: isSubscriptionTerm('months_3')}" @click="selectSubscriptionTerm('months_3')"> <div class="period_option_title">Čtvrtletní</div> <div class="period_option_price">[[ monthlyPrice('months_3') ]] Kč</div> </div> <div class="period_option" :class="{period_option_selected: isSubscriptionTerm('year')}" @click="selectSubscriptionTerm('year')"> <div class="period_option_title">Roční</div> <div class="period_option_price">[[ monthlyPrice('year') ]] Kč</div> </div> </div> <div class="section_title_box" :class="{'has-error2': errors.additional, 'shake': shake.additional }" @animationend="shake.additional = false"> <div class="section_title_heading">Klubové předplatné</div> <div class="section_title_subheading">(Cena za měsíc)</div> </div> <div class="additional_options" ref="additionalOptions"> <div class="additional_option" :class="{additional_option_selected: isClubSelected()}" @click="toggleClub()"> <div class="addition_option_checkbox"> <div class="addition_option_checkbox_square"> <span class="material-symbols-outlined">check</span> </div> </div> <div class="addition_option_text addition_option_text_color">Klub N (nejoblíbenější)</div> <div class="addition_option_price">120 Kč</div> </div> <div class="additional_option_info_box"> <div class="additional_option_info_left"></div> <div class="additional_option_info_box_text"> <strong>Využijte Deník N naplno a získejte navíc: </strong> <ul> <li>mobilní aplikace</li> <li>audioverze článků</li> <li>odemykání článků pro přátele</li> <li>možnost vypnout reklamu</li> <li>online verze tištěných novin</li> <li>výhodnější ceny vybraných akcí</li> <li>podcasty Studio N, Sféry a Romancov a spol.</li> <li>nadstandardní podpora novinařiny</li> </ul> </div> <div class="additional_option_info_right"></div> </div> </div> <div class="section_title_box" :class="{'has-error2': errors.additional, 'shake': shake.additional }" @animationend="shake.additional = false"> <div class="section_title_heading">Tištěné noviny s novým pátečním magazínem s TV programem</div> <div class="section_title_subheading">(Cena za měsíc)</div> </div> <div class="additional_options" ref="additionalOptions"> <div class="additional_option" :class="{additional_option_selected: isPrintSelected('friday_print')}" @click="togglePrint('friday_print')"> <div class="addition_option_checkbox"> <div class="addition_option_checkbox_square"> <span class="material-symbols-outlined">check</span> </div> </div> <div class="addition_option_text addition_option_text_color">Páteční noviny s magazínem a TV programem (68% sleva proti ceně na stánku)</div> <div class="addition_option_price">40 Kč</div> </div> <div class="additional_option_info_box"> <div class="additional_option_info_left"></div> <div class="additional_option_info_box_text">Každý pátek najdete ve své poštovní schránce 32 stran tištěných novin včetně víkendové přílohy Kontext N a kulturní přílohy live!. <strong>Navíc nový magazín s TV programem.</strong></div> <div class="additional_option_info_right"></div> </div> <div class="additional_option" :class="{additional_option_selected: isPrintSelected('print')}" @click="togglePrint('print')"> <div class="addition_option_checkbox"> <div class="addition_option_checkbox_square"> <span class="material-symbols-outlined">check</span> </div> </div> <div class="addition_option_text addition_option_text_color">Noviny každý všední den</div> <div class="addition_option_price">300 Kč</div> </div> <div class="additional_option_info_box"> <div class="additional_option_info_left"></div> <div class="additional_option_info_box_text">Tištené noviny do vaší schránky každý všední den včetně pátečních příloh <strong>a nového magazínu s TV programem.</strong></div> <div class="additional_option_info_right"></div> </div> </div> <div class="payment_box"> <div class="payment_options" ref="paymentOptions"> <div class="payment_options_heading">Vyberte si způsob platby</div> <div class="payment_option" :class="{payment_option_selected: isPaymentGatewaySelected('csob_one_click')}" @click="selectPaymentGateway('csob_one_click', false)"> <div class="payment_option_radio"><div class="payment_option_radio_selected"></div></div> <div class="payment_option_icon"> <svg xmlns="http://www.w3.org/2000/svg" height="2em" viewBox="0 0 576 512"><path d="M470.1 231.3s7.6 37.2 9.3 45H446c3.3-8.9 16-43.5 16-43.5-.2.3 3.3-9.1 5.3-14.9l2.8 13.4zM576 80v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V80c0-26.5 21.5-48 48-48h480c26.5 0 48 21.5 48 48zM152.5 331.2L215.7 176h-42.5l-39.3 106-4.3-21.5-14-71.4c-2.3-9.9-9.4-12.7-18.2-13.1H32.7l-.7 3.1c15.8 4 29.9 9.8 42.2 17.1l35.8 135h42.5zm94.4.2L272.1 176h-40.2l-25.1 155.4h40.1zm139.9-50.8c.2-17.7-10.6-31.2-33.7-42.3-14.1-7.1-22.7-11.9-22.7-19.2.2-6.6 7.3-13.4 23.1-13.4 13.1-.3 22.7 2.8 29.9 5.9l3.6 1.7 5.5-33.6c-7.9-3.1-20.5-6.6-36-6.6-39.7 0-67.6 21.2-67.8 51.4-.3 22.3 20 34.7 35.2 42.2 15.5 7.6 20.8 12.6 20.8 19.3-.2 10.4-12.6 15.2-24.1 15.2-16 0-24.6-2.5-37.7-8.3l-5.3-2.5-5.6 34.9c9.4 4.3 26.8 8.1 44.8 8.3 42.2.1 69.7-20.8 70-53zM528 331.4L495.6 176h-31.1c-9.6 0-16.9 2.8-21 12.9l-59.7 142.5H426s6.9-19.2 8.4-23.3H486c1.2 5.5 4.8 23.3 4.8 23.3H528z"/></svg> <svg xmlns="http://www.w3.org/2000/svg" height="2em" viewBox="0 0 576 512"><path d="M482.9 410.3c0 6.8-4.6 11.7-11.2 11.7-6.8 0-11.2-5.2-11.2-11.7 0-6.5 4.4-11.7 11.2-11.7 6.6 0 11.2 5.2 11.2 11.7zm-310.8-11.7c-7.1 0-11.2 5.2-11.2 11.7 0 6.5 4.1 11.7 11.2 11.7 6.5 0 10.9-4.9 10.9-11.7-.1-6.5-4.4-11.7-10.9-11.7zm117.5-.3c-5.4 0-8.7 3.5-9.5 8.7h19.1c-.9-5.7-4.4-8.7-9.6-8.7zm107.8.3c-6.8 0-10.9 5.2-10.9 11.7 0 6.5 4.1 11.7 10.9 11.7 6.8 0 11.2-4.9 11.2-11.7 0-6.5-4.4-11.7-11.2-11.7zm105.9 26.1c0 .3.3.5.3 1.1 0 .3-.3.5-.3 1.1-.3.3-.3.5-.5.8-.3.3-.5.5-1.1.5-.3.3-.5.3-1.1.3-.3 0-.5 0-1.1-.3-.3 0-.5-.3-.8-.5-.3-.3-.5-.5-.5-.8-.3-.5-.3-.8-.3-1.1 0-.5 0-.8.3-1.1 0-.5.3-.8.5-1.1.3-.3.5-.3.8-.5.5-.3.8-.3 1.1-.3.5 0 .8 0 1.1.3.5.3.8.3 1.1.5s.2.6.5 1.1zm-2.2 1.4c.5 0 .5-.3.8-.3.3-.3.3-.5.3-.8 0-.3 0-.5-.3-.8-.3 0-.5-.3-1.1-.3h-1.6v3.5h.8V426h.3l1.1 1.4h.8l-1.1-1.3zM576 81v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V81c0-26.5 21.5-48 48-48h480c26.5 0 48 21.5 48 48zM64 220.6c0 76.5 62.1 138.5 138.5 138.5 27.2 0 53.9-8.2 76.5-23.1-72.9-59.3-72.4-171.2 0-230.5-22.6-15-49.3-23.1-76.5-23.1-76.4-.1-138.5 62-138.5 138.2zm224 108.8c70.5-55 70.2-162.2 0-217.5-70.2 55.3-70.5 162.6 0 217.5zm-142.3 76.3c0-8.7-5.7-14.4-14.7-14.7-4.6 0-9.5 1.4-12.8 6.5-2.4-4.1-6.5-6.5-12.2-6.5-3.8 0-7.6 1.4-10.6 5.4V392h-8.2v36.7h8.2c0-18.9-2.5-30.2 9-30.2 10.2 0 8.2 10.2 8.2 30.2h7.9c0-18.3-2.5-30.2 9-30.2 10.2 0 8.2 10 8.2 30.2h8.2v-23zm44.9-13.7h-7.9v4.4c-2.7-3.3-6.5-5.4-11.7-5.4-10.3 0-18.2 8.2-18.2 19.3 0 11.2 7.9 19.3 18.2 19.3 5.2 0 9-1.9 11.7-5.4v4.6h7.9V392zm40.5 25.6c0-15-22.9-8.2-22.9-15.2 0-5.7 11.9-4.8 18.5-1.1l3.3-6.5c-9.4-6.1-30.2-6-30.2 8.2 0 14.3 22.9 8.3 22.9 15 0 6.3-13.5 5.8-20.7.8l-3.5 6.3c11.2 7.6 32.6 6 32.6-7.5zm35.4 9.3l-2.2-6.8c-3.8 2.1-12.2 4.4-12.2-4.1v-16.6h13.1V392h-13.1v-11.2h-8.2V392h-7.6v7.3h7.6V416c0 17.6 17.3 14.4 22.6 10.9zm13.3-13.4h27.5c0-16.2-7.4-22.6-17.4-22.6-10.6 0-18.2 7.9-18.2 19.3 0 20.5 22.6 23.9 33.8 14.2l-3.8-6c-7.8 6.4-19.6 5.8-21.9-4.9zm59.1-21.5c-4.6-2-11.6-1.8-15.2 4.4V392h-8.2v36.7h8.2V408c0-11.6 9.5-10.1 12.8-8.4l2.4-7.6zm10.6 18.3c0-11.4 11.6-15.1 20.7-8.4l3.8-6.5c-11.6-9.1-32.7-4.1-32.7 15 0 19.8 22.4 23.8 32.7 15l-3.8-6.5c-9.2 6.5-20.7 2.6-20.7-8.6zm66.7-18.3H408v4.4c-8.3-11-29.9-4.8-29.9 13.9 0 19.2 22.4 24.7 29.9 13.9v4.6h8.2V392zm33.7 0c-2.4-1.2-11-2.9-15.2 4.4V392h-7.9v36.7h7.9V408c0-11 9-10.3 12.8-8.4l2.4-7.6zm40.3-14.9h-7.9v19.3c-8.2-10.9-29.9-5.1-29.9 13.9 0 19.4 22.5 24.6 29.9 13.9v4.6h7.9v-51.7zm7.6-75.1v4.6h.8V302h1.9v-.8h-4.6v.8h1.9zm6.6 123.8c0-.5 0-1.1-.3-1.6-.3-.3-.5-.8-.8-1.1-.3-.3-.8-.5-1.1-.8-.5 0-1.1-.3-1.6-.3-.3 0-.8.3-1.4.3-.5.3-.8.5-1.1.8-.5.3-.8.8-.8 1.1-.3.5-.3 1.1-.3 1.6 0 .3 0 .8.3 1.4 0 .3.3.8.8 1.1.3.3.5.5 1.1.8.5.3 1.1.3 1.4.3.5 0 1.1 0 1.6-.3.3-.3.8-.5 1.1-.8.3-.3.5-.8.8-1.1.3-.6.3-1.1.3-1.4zm3.2-124.7h-1.4l-1.6 3.5-1.6-3.5h-1.4v5.4h.8v-4.1l1.6 3.5h1.1l1.4-3.5v4.1h1.1v-5.4zm4.4-80.5c0-76.2-62.1-138.3-138.5-138.3-27.2 0-53.9 8.2-76.5 23.1 72.1 59.3 73.2 171.5 0 230.5 22.6 15 49.5 23.1 76.5 23.1 76.4.1 138.5-61.9 138.5-138.4z"/></svg> </div> <div class="payment_option_text"> <div class="payment_option_text_main">Platební karta</div> <div class="payment_option_text_info">automatické obnovování</div> </div> </div> <div class="payment_option" :class="{payment_option_selected: isPaymentGatewaySelected('csob')}" @click="selectPaymentGateway('csob', false)"> <div class="payment_option_radio"><div class="payment_option_radio_selected"></div></div> <div class="payment_option_icon"> <svg xmlns="http://www.w3.org/2000/svg" height="2em" viewBox="0 0 576 512"><path d="M470.1 231.3s7.6 37.2 9.3 45H446c3.3-8.9 16-43.5 16-43.5-.2.3 3.3-9.1 5.3-14.9l2.8 13.4zM576 80v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V80c0-26.5 21.5-48 48-48h480c26.5 0 48 21.5 48 48zM152.5 331.2L215.7 176h-42.5l-39.3 106-4.3-21.5-14-71.4c-2.3-9.9-9.4-12.7-18.2-13.1H32.7l-.7 3.1c15.8 4 29.9 9.8 42.2 17.1l35.8 135h42.5zm94.4.2L272.1 176h-40.2l-25.1 155.4h40.1zm139.9-50.8c.2-17.7-10.6-31.2-33.7-42.3-14.1-7.1-22.7-11.9-22.7-19.2.2-6.6 7.3-13.4 23.1-13.4 13.1-.3 22.7 2.8 29.9 5.9l3.6 1.7 5.5-33.6c-7.9-3.1-20.5-6.6-36-6.6-39.7 0-67.6 21.2-67.8 51.4-.3 22.3 20 34.7 35.2 42.2 15.5 7.6 20.8 12.6 20.8 19.3-.2 10.4-12.6 15.2-24.1 15.2-16 0-24.6-2.5-37.7-8.3l-5.3-2.5-5.6 34.9c9.4 4.3 26.8 8.1 44.8 8.3 42.2.1 69.7-20.8 70-53zM528 331.4L495.6 176h-31.1c-9.6 0-16.9 2.8-21 12.9l-59.7 142.5H426s6.9-19.2 8.4-23.3H486c1.2 5.5 4.8 23.3 4.8 23.3H528z"/></svg> <svg xmlns="http://www.w3.org/2000/svg" height="2em" viewBox="0 0 576 512"><path d="M482.9 410.3c0 6.8-4.6 11.7-11.2 11.7-6.8 0-11.2-5.2-11.2-11.7 0-6.5 4.4-11.7 11.2-11.7 6.6 0 11.2 5.2 11.2 11.7zm-310.8-11.7c-7.1 0-11.2 5.2-11.2 11.7 0 6.5 4.1 11.7 11.2 11.7 6.5 0 10.9-4.9 10.9-11.7-.1-6.5-4.4-11.7-10.9-11.7zm117.5-.3c-5.4 0-8.7 3.5-9.5 8.7h19.1c-.9-5.7-4.4-8.7-9.6-8.7zm107.8.3c-6.8 0-10.9 5.2-10.9 11.7 0 6.5 4.1 11.7 10.9 11.7 6.8 0 11.2-4.9 11.2-11.7 0-6.5-4.4-11.7-11.2-11.7zm105.9 26.1c0 .3.3.5.3 1.1 0 .3-.3.5-.3 1.1-.3.3-.3.5-.5.8-.3.3-.5.5-1.1.5-.3.3-.5.3-1.1.3-.3 0-.5 0-1.1-.3-.3 0-.5-.3-.8-.5-.3-.3-.5-.5-.5-.8-.3-.5-.3-.8-.3-1.1 0-.5 0-.8.3-1.1 0-.5.3-.8.5-1.1.3-.3.5-.3.8-.5.5-.3.8-.3 1.1-.3.5 0 .8 0 1.1.3.5.3.8.3 1.1.5s.2.6.5 1.1zm-2.2 1.4c.5 0 .5-.3.8-.3.3-.3.3-.5.3-.8 0-.3 0-.5-.3-.8-.3 0-.5-.3-1.1-.3h-1.6v3.5h.8V426h.3l1.1 1.4h.8l-1.1-1.3zM576 81v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V81c0-26.5 21.5-48 48-48h480c26.5 0 48 21.5 48 48zM64 220.6c0 76.5 62.1 138.5 138.5 138.5 27.2 0 53.9-8.2 76.5-23.1-72.9-59.3-72.4-171.2 0-230.5-22.6-15-49.3-23.1-76.5-23.1-76.4-.1-138.5 62-138.5 138.2zm224 108.8c70.5-55 70.2-162.2 0-217.5-70.2 55.3-70.5 162.6 0 217.5zm-142.3 76.3c0-8.7-5.7-14.4-14.7-14.7-4.6 0-9.5 1.4-12.8 6.5-2.4-4.1-6.5-6.5-12.2-6.5-3.8 0-7.6 1.4-10.6 5.4V392h-8.2v36.7h8.2c0-18.9-2.5-30.2 9-30.2 10.2 0 8.2 10.2 8.2 30.2h7.9c0-18.3-2.5-30.2 9-30.2 10.2 0 8.2 10 8.2 30.2h8.2v-23zm44.9-13.7h-7.9v4.4c-2.7-3.3-6.5-5.4-11.7-5.4-10.3 0-18.2 8.2-18.2 19.3 0 11.2 7.9 19.3 18.2 19.3 5.2 0 9-1.9 11.7-5.4v4.6h7.9V392zm40.5 25.6c0-15-22.9-8.2-22.9-15.2 0-5.7 11.9-4.8 18.5-1.1l3.3-6.5c-9.4-6.1-30.2-6-30.2 8.2 0 14.3 22.9 8.3 22.9 15 0 6.3-13.5 5.8-20.7.8l-3.5 6.3c11.2 7.6 32.6 6 32.6-7.5zm35.4 9.3l-2.2-6.8c-3.8 2.1-12.2 4.4-12.2-4.1v-16.6h13.1V392h-13.1v-11.2h-8.2V392h-7.6v7.3h7.6V416c0 17.6 17.3 14.4 22.6 10.9zm13.3-13.4h27.5c0-16.2-7.4-22.6-17.4-22.6-10.6 0-18.2 7.9-18.2 19.3 0 20.5 22.6 23.9 33.8 14.2l-3.8-6c-7.8 6.4-19.6 5.8-21.9-4.9zm59.1-21.5c-4.6-2-11.6-1.8-15.2 4.4V392h-8.2v36.7h8.2V408c0-11.6 9.5-10.1 12.8-8.4l2.4-7.6zm10.6 18.3c0-11.4 11.6-15.1 20.7-8.4l3.8-6.5c-11.6-9.1-32.7-4.1-32.7 15 0 19.8 22.4 23.8 32.7 15l-3.8-6.5c-9.2 6.5-20.7 2.6-20.7-8.6zm66.7-18.3H408v4.4c-8.3-11-29.9-4.8-29.9 13.9 0 19.2 22.4 24.7 29.9 13.9v4.6h8.2V392zm33.7 0c-2.4-1.2-11-2.9-15.2 4.4V392h-7.9v36.7h7.9V408c0-11 9-10.3 12.8-8.4l2.4-7.6zm40.3-14.9h-7.9v19.3c-8.2-10.9-29.9-5.1-29.9 13.9 0 19.4 22.5 24.6 29.9 13.9v4.6h7.9v-51.7zm7.6-75.1v4.6h.8V302h1.9v-.8h-4.6v.8h1.9zm6.6 123.8c0-.5 0-1.1-.3-1.6-.3-.3-.5-.8-.8-1.1-.3-.3-.8-.5-1.1-.8-.5 0-1.1-.3-1.6-.3-.3 0-.8.3-1.4.3-.5.3-.8.5-1.1.8-.5.3-.8.8-.8 1.1-.3.5-.3 1.1-.3 1.6 0 .3 0 .8.3 1.4 0 .3.3.8.8 1.1.3.3.5.5 1.1.8.5.3 1.1.3 1.4.3.5 0 1.1 0 1.6-.3.3-.3.8-.5 1.1-.8.3-.3.5-.8.8-1.1.3-.6.3-1.1.3-1.4zm3.2-124.7h-1.4l-1.6 3.5-1.6-3.5h-1.4v5.4h.8v-4.1l1.6 3.5h1.1l1.4-3.5v4.1h1.1v-5.4zm4.4-80.5c0-76.2-62.1-138.3-138.5-138.3-27.2 0-53.9 8.2-76.5 23.1 72.1 59.3 73.2 171.5 0 230.5 22.6 15 49.5 23.1 76.5 23.1 76.4.1 138.5-61.9 138.5-138.4z"/></svg> </div> <div class="payment_option_text"> <div class="payment_option_text_main">Platební karta</div> <div class="payment_option_text_info">jednorázově</div> </div> </div> <div class="payment_option" :class="{payment_option_selected: isPaymentGatewaySelected('bank_transfer')}" @click="selectPaymentGateway('bank_transfer', true)"> <div class="payment_option_radio"><div class="payment_option_radio_selected"></div></div> <div class="payment_option_icon"> <svg xmlns="http://www.w3.org/2000/svg" height="2em" viewBox="0 0 512 512"><path d="M243.4 2.6l-224 96c-14 6-21.8 21-18.7 35.8S16.8 160 32 160v8c0 13.3 10.7 24 24 24H456c13.3 0 24-10.7 24-24v-8c15.2 0 28.3-10.7 31.3-25.6s-4.8-29.9-18.7-35.8l-224-96c-8-3.4-17.2-3.4-25.2 0zM128 224H64V420.3c-.6 .3-1.2 .7-1.8 1.1l-48 32c-11.7 7.8-17 22.4-12.9 35.9S17.9 512 32 512H480c14.1 0 26.5-9.2 30.6-22.7s-1.1-28.1-12.9-35.9l-48-32c-.6-.4-1.2-.7-1.8-1.1V224H384V416H344V224H280V416H232V224H168V416H128V224zM256 64a32 32 0 1 1 0 64 32 32 0 1 1 0-64z"/></svg> </div> <div class="payment_option_text"> <div class="payment_option_text_main">Bankovní převod</div> </div> </div> </div> <div class="user_info"> <template v-if="!isLogged"> <div class="controls show-error" :class="{'has-error2': errors.email && !showPasswordInput, 'shake': shake.email }" @animationend="shake.email = false"> <input type="text" v-model="inputs.email" @change="emailChanged" id="email" ref="inputEmail" name="email" class="optout-email input-text" placeholder="Napište e-mail" /> <span class="help-block"> <template v-if="errors.email === 'invalid'"> Tato e-mailová adresa není platná. </template> <template v-else-if="showPasswordInput"> Tento e-mailová adresa už je zaregistrovaná. </template> <template v-else> Na tuto e-mailovou adresu vám zašleme přístupové údaje. </template> </span> </div> <div class="controls show-error" id="password_field" v-if="showPasswordInput" :class="{'has-error2': errors.password, 'shake': shake.password }" @animationend="shake.password = false"> <input type="password" id="password" ref="inputPassword" v-model="inputs.password" name="password" class="optout-password password input-text" placeholder="Vaše heslo" /> <span class="help-block" id="password-help-block"> <template v-if="errors.password === 'invalid'"> Zadané heslo není správné. </template> <template v-else> E-mailová adresa už je zaregistrovaná, prosím, zadejte heslo. (<a href="https://predplatne.denikn.cz/users/users/reset-password" target="_blank">Zapomněli jste heslo?</a>) </template> </span> </div> </template> <div class="oss_wrapper" style="margin-bottom: 16px;"> <span style="color: #737373" class="oss_payment_country_explanation"> Podle vaší IP adresy jsme určili, že zemí, v níž bude předplatné využito (za účelem výpočtu DPH), bude <strong>Singapore</strong>. Pokud si ji přejete změnit, <a style="color: rgb(175 50 57)" onclick="(function(){ document.querySelector('.oss_payment_country_wrapper').style.display = 'block'; document.querySelector('.oss_payment_country_explanation').style.display = 'none'; // 'disabled' prevents sending 'payment_country' input in form data // send only if user explicitly selects a country document.querySelector('.oss_payment_country_select').disabled = false; return false; })();return false;">vyberte si ze seznamu</a>. </span> <div class="oss_payment_country_wrapper" style="display: none"> <label style="color: #737373" for="oss_payment_country">Vyberte si zemi využití předplatného, resp. zemi, v níž fakturujete (kvůli správnému vyúčtování DPH). Cena zůstává beze změn.</label> <select id="oss_payment_country" class="input-select oss_payment_country_select" name="payment_country" disabled="disabled" style="padding: 8px; width: 100%; margin: 4px 0;border: 1px solid #9E9E9E;"> <option value="CZ" >Česko</option> <option value="SK" >Slovensko</option> <option value="AF" >Afghanistan</option> <option value="AL" >Albania</option> <option value="DZ" >Algeria</option> <option value="AD" >Andorra</option> <option value="AO" >Angola</option> <option value="AG" >Antigua and Barbuda</option> <option value="AR" >Argentina</option> <option value="AM" >Armenia</option> <option value="AW" >Aruba</option> <option value="AU" >Australia</option> <option value="AT" >Austria</option> <option value="AZ" >Azerbaijan</option> <option value="BS" >Bahamas</option> <option value="BH" >Bahrain</option> <option value="BD" >Bangladesh</option> <option value="BB" >Barbados</option> <option value="BY" >Belarus</option> <option value="BE" >Belgium</option> <option value="BZ" >Belize</option> <option value="BJ" >Benin</option> <option value="BT" >Bhutan</option> <option value="BO" >Bolivia</option> <option value="BA" >Bosnia and Herzegovina</option> <option value="BW" >Botswana</option> <option value="BR" >Brazil</option> <option value="BN" >Brunei</option> <option value="BG" >Bulgaria</option> <option value="BF" >Burkina Faso</option> <option value="BU" >Burma</option> <option value="BI" >Burundi</option> <option value="KH" >Cambodia</option> <option value="CM" >Cameroon</option> <option value="CA" >Canada</option> <option value="CV" >Cape Verde</option> <option value="CF" >Central African Republic</option> <option value="TD" >Chad</option> <option value="CL" >Chile</option> <option value="CN" >China</option> <option value="CO" >Colombia</option> <option value="KM" >Comoros</option> <option value="CD" >Congo Democratic Republic of the</option> <option value="CG" >Congo Republic of the</option> <option value="CR" >Costa Rica</option> <option value="CI" >Cote d'Ivoire</option> <option value="HR" >Croatia</option> <option value="CU" >Cuba</option> <option value="CW" >Curacao</option> <option value="CY" >Cyprus</option> <option value="DK" >Denmark</option> <option value="DJ" >Djibouti</option> <option value="DM" >Dominica</option> <option value="DO" >Dominican Republic</option> <option value="EC" >Ecuador</option> <option value="EG" >Egypt</option> <option value="SV" >El Salvador</option> <option value="GQ" >Equatorial Guinea</option> <option value="ER" >Eritrea</option> <option value="EE" >Estonia</option> <option value="ET" >Ethiopia</option> <option value="FJ" >Fiji</option> <option value="FI" >Finland</option> <option value="FR" >France</option> <option value="PF" >French Polynesia</option> <option value="GA" >Gabon</option> <option value="GM" >Gambia The</option> <option value="GE" >Georgia</option> <option value="DE" >Germany</option> <option value="GH" >Ghana</option> <option value="GI" >Gibraltar</option> <option value="GR" >Greece</option> <option value="GD" >Grenada</option> <option value="GT" >Guatemala</option> <option value="GN" >Guinea</option> <option value="GW" >Guinea-Bissau</option> <option value="GY" >Guyana</option> <option value="HT" >Haiti</option> <option value="VA" >Holy See</option> <option value="HN" >Honduras</option> <option value="HK" >Hong Kong</option> <option value="HU" >Hungary</option> <option value="IS" >Iceland</option> <option value="IN" >India</option> <option value="ID" >Indonesia</option> <option value="IR" >Iran</option> <option value="IQ" >Iraq</option> <option value="IE" >Ireland</option> <option value="IL" >Israel</option> <option value="IT" >Italy</option> <option value="JM" >Jamaica</option> <option value="JP" >Japan</option> <option value="JO" >Jordan</option> <option value="KZ" >Kazakhstan</option> <option value="KE" >Kenya</option> <option value="KI" >Kiribati</option> <option value="XK" >Kosovo</option> <option value="KW" >Kuwait</option> <option value="KG" >Kyrgyzstan</option> <option value="LA" >Laos</option> <option value="LV" >Latvia</option> <option value="LB" >Lebanon</option> <option value="LS" >Lesotho</option> <option value="LR" >Liberia</option> <option value="LY" >Libya</option> <option value="LI" >Liechtenstein</option> <option value="LT" >Lithuania</option> <option value="LU" >Luxembourg</option> <option value="MO" >Macau</option> <option value="MK" >Macedonia</option> <option value="MG" >Madagascar</option> <option value="MW" >Malawi</option> <option value="MY" >Malaysia</option> <option value="MV" >Maldives</option> <option value="ML" >Mali</option> <option value="MT" >Malta</option> <option value="MH" >Marshall Islands</option> <option value="MR" >Mauritania</option> <option value="MU" >Mauritius</option> <option value="MX" >Mexico</option> <option value="FM" >Micronesia</option> <option value="MD" >Moldova</option> <option value="MC" >Monaco</option> <option value="MN" >Mongolia</option> <option value="ME" >Montenegro</option> <option value="MA" >Morocco</option> <option value="MZ" >Mozambique</option> <option value="NA" >Namibia</option> <option value="NR" >Nauru</option> <option value="NP" >Nepal</option> <option value="NL" >Netherlands</option> <option value="AN" >Netherlands Antilles</option> <option value="NZ" >New Zealand</option> <option value="NI" >Nicaragua</option> <option value="NE" >Niger</option> <option value="NG" >Nigeria</option> <option value="KP" >North Korea</option> <option value="NO" >Norway</option> <option value="OM" >Oman</option> <option value="PK" >Pakistan</option> <option value="PW" >Palau</option> <option value="PS" >Palestinian Territories</option> <option value="PA" >Panama</option> <option value="PG" >Papua New Guinea</option> <option value="PY" >Paraguay</option> <option value="PE" >Peru</option> <option value="PH" >Philippines</option> <option value="PL" >Poland</option> <option value="PT" >Portugal</option> <option value="PR" >Puerto Rico</option> <option value="QA" >Qatar</option> <option value="RO" >Romania</option> <option value="RU" >Russia</option> <option value="RW" >Rwanda</option> <option value="KN" >Saint Kitts and Nevis</option> <option value="LC" >Saint Lucia</option> <option value="VC" >Saint Vincent and the Grenadines</option> <option value="WS" >Samoa</option> <option value="SM" >San Marino</option> <option value="ST" >Sao Tome and Principe</option> <option value="SA" >Saudi Arabia</option> <option value="SN" >Senegal</option> <option value="RS" >Serbia</option> <option value="SC" >Seychelles</option> <option value="SL" >Sierra Leone</option> <option selected value="SG" >Singapore</option> <option value="SX" >Sint Maarten</option> <option value="SI" >Slovenia</option> <option value="SB" >Solomon Islands</option> <option value="SO" >Somalia</option> <option value="ZA" >South Africa</option> <option value="KR" >South Korea</option> <option value="SS" >South Sudan</option> <option value="ES" >Spain</option> <option value="LK" >Sri Lanka</option> <option value="SD" >Sudan</option> <option value="SR" >Suriname</option> <option value="SZ" >Swaziland</option> <option value="SE" >Sweden</option> <option value="CH" >Switzerland</option> <option value="SY" >Syria</option> <option value="TW" >Taiwan</option> <option value="TJ" >Tajikistan</option> <option value="TZ" >Tanzania</option> <option value="TH" >Thailand</option> <option value="TL" >Timor-Leste</option> <option value="TG" >Togo</option> <option value="TO" >Tonga</option> <option value="TT" >Trinidad and Tobago</option> <option value="TN" >Tunisia</option> <option value="TR" >Turkey</option> <option value="TM" >Turkmenistan</option> <option value="TV" >Tuvalu</option> <option value="UG" >Uganda</option> <option value="UA" >Ukraine</option> <option value="AE" >United Arab Emirates</option> <option value="GB" >United Kingdom</option> <option value="US" >United States of America</option> <option value="UY" >Uruguay</option> <option value="UZ" >Uzbekistan</option> <option value="VU" >Vanuatu</option> <option value="VE" >Venezuela</option> <option value="VN" >Vietnam</option> <option value="YE" >Yemen</option> <option value="ZM" >Zambia</option> <option value="ZW" >Zimbabwe</option> </select> </div> </div> <label class="checkbox-label show-error" ref="inputTerms" :class="{'has-error2': errors.terms, 'shake': shake.terms }" @animationend="shake.terms = false"> <input type="checkbox" id="terms" class="checkbox terms" v-model="inputs.terms" name="terms"> Souhlasím s podmínkami používání (<a href="https://denikn.cz/vseobecne-obchodni-podminky/" target="_blank" style="text-decoration: underline;">info</a>) </label> <label class="checkbox-label"> <input type="checkbox" class="checkbox" v-model="inputs.newsletter_subscribe" name="newsletters_subscribe"> Posílejte mi novinky z redakce a informace o zvýhodněných cenách. </label> <button type="button" class="pay-button pay-button-valid" id="submit-pay-button" v-on:click="submitFirstWindow"> <i id="preloader" class="fa fa-spinner fa-spin" v-show="preloader"></i> Dokončit a zaplatit <span class="total-price-value">[[ buttonPrice ]] Kč</span> </button> </div> </div> <div> Doručovací adresu vyplníte po zaplacení, tisk začne chodit 2–3 pracovní dny po začátku předplatného. </div> </section> <section id="second-window" :class="{ hidden: !isWindowActive('second-window') }"> <donation-window :user-email="inputs.email" :button-price="buttonPrice" :enable-button-default-submit="true" :is-recurrent-payment="isPaymentGatewaySelected('csob_one_click')" :funnel-url-key="'2024-10'" ></donation-window> </section> </form> <br/><br/><br/> <div class="special_subscriptions_box" :class="{ hidden: !isWindowActive('first-window') }"> <h2 class="special_subscriptions_title">Speciální předplatné</h2> <div class="special_subscription_option"> <a target="_top" href="/vanoce24?medium=denikn&referer=" class="btn btn-default"> Darujte Deník N a získejte tři dárky zdarma </a> </div> <div class="special_subscription_option"> <a target="_top" href="/ucitele24?medium=denikn&referer=" class="btn btn-default"> Zvýhodněné předplatné pro učitele </a> </div> <div class="special_subscription_option"> <a target="_top" href="/vic?contentAccess[0]=club&medium=denikn&referer=" class="btn btn-default"> Aktivujte si klubové předplatné </a> </div> <div class="special_subscription_option"> <a target="_top" href="/studenti24?medium=denikn&referer=" class="btn btn-default"> Zvýhodněné předplatné pro studenty </a> </div> <div class="special_subscription_option"> <a href="/prorodice-2024-10?medium=denikn&referer=" target="_top" class="btn btn-default"> Online pro mě a tisk pro rodiče </a> </div> <div class="special_subscription_option"> <a href="/firmy?medium=denikn&referer=" target="_top" class="btn btn-default"> Zvýhodněné předplatné pro firmy </a> </div> <div class="special_subscription_option"> <a target="_top" href="/enkoareporter-2024?medium=denikn&referer=" class="btn btn-default"> Společné předplatné s Reportérem </a> </div> <div class="special_subscription_option"> <a target="_top" href="http://predplatne.dennikn.sk/dvakratn?referer=" class="btn btn-default"> Společné předplatné s Denníkem N </a> </div> </div> <div style="font-size:1.2em" class="lead text-muted text-center"> Máte otázku, potřebujete poradit? <b>info@denikn.cz</b> / <span>+420 770 174 295</span><br><span>(pondělí až pátek, od 9 do 17 hodin)</span> </div> <div> <hr> </div> </section> <script> // reset forms in case of back navigation window.addEventListener("pageshow", () => { var form = $('form'); form[0].reset(); $('[name="additional_type"]').first().attr('checked', true).prop('checked', true); }); function formatNumber(number) { var string = Math.round(number * 100) / 100 + ''; if (string.lastIndexOf('.') === -1 ){ string = string + '.00'; } else if ((string.length - 1 - string.lastIndexOf('.')) === 1) { string = string + '0'; } return string.replace('.', ','); } function getParameterByName(name) { var url = window.location.href name = name.replace(/[\[\]]/g, '\\$&'); var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'), results = regex.exec(url); if (!results) return null; if (!results[2]) return ''; return decodeURIComponent(results[2].replace(/\+/g, ' ')); } var messages = { errors: { server: 'Nastala chyba :-( Zdá se že naše servery jsou přetížené', unexpected: 'Nastala neočekávaná chyba :-( Prosím zkuste později' } }; var backendData = { subscriptionTypePrices: { online_month_2024_01: 249, online_3months_2024_01: 687, online_year_2024_01: 2388, online_club_month_2024_01: 369, online_club_3months_2024_01: 1047, online_club_year_2024_01: 3828, online_print_friday_month_2024_01: 289, online_print_friday_3months_2024_01: 807, online_print_friday_year_2024_01: 2868, online_print_friday_club_month_2024_01: 409, online_print_friday_club_3months_2024_01: 1167, online_print_friday_club_year_2024_01: 4308, online_3months_discount_2024: 69, online_club_3months_discount_2024: 129, online_print_club_month_2024_10: 669, online_print_club_3months_2024_10: 1947, online_print_club_year_2024_10: 7428, online_print_month_2024_10: 549, online_print_3months_2024_10: 1587, online_print_year_2024_10: 5988, }, gateways: ["bank_transfer","csob","csob_one_click"], isLogged: false, // isLogged: false, funnelUrlKey: "2024-10", oldValues: null }; var type2Subscription = { month: { club: { print: 'online_print_club_month_2024_10', friday_print: 'online_print_friday_club_month_2024_01', no_print: 'online_club_month_2024_01' }, no_club: { print: 'online_print_month_2024_10', friday_print: 'online_print_friday_month_2024_01', no_print: 'online_month_2024_01' }, }, months_3: { club: { print: 'online_print_club_3months_2024_10', friday_print: 'online_print_friday_club_3months_2024_01', no_print: 'online_club_3months_2024_01' }, no_club: { print: 'online_print_3months_2024_10', friday_print: 'online_print_friday_3months_2024_01', no_print: 'online_3months_2024_01' }, }, year: { club: { print: 'online_print_club_year_2024_10', friday_print: 'online_print_friday_club_year_2024_01', no_print: 'online_club_year_2024_01' }, no_club: { print: 'online_print_year_2024_10', friday_print: 'online_print_friday_year_2024_01', no_print: 'online_year_2024_01' }, } }; var SalesFunnelVue = { delimiters: ['[[', ']]'], created: function () { // initialize old values for (inputName in this.oldValues) { if (this.oldValues.hasOwnProperty(inputName)) { this.inputs[inputName] = this.oldValues[inputName]; } } // load subscription_type from URL var subscriptionType = getParameterByName('subscription_type'); if (subscriptionType) { this.inputs.subscription_type = subscriptionType; } var subscriptionTerm = getParameterByName('subscription_term'); if (subscriptionTerm) { this.inputs.subscription_term = subscriptionTerm; } // load saved data if present this.loadSavedData(); this.clearSavedData(); // load subscription type after everything is ready // otherwise if user keeps default options, submit button doesn't have subscription type ready this.inputs.subscription_type = this.getSubscriptionType(this.inputs.subscription_term, this.inputs.club, this.inputs.print); }, data: function() { return Object.assign(backendData, { preloader: false, showPasswordInput: false, activeWindow: "first-window", action: null, inputs: { // same names as 'name' attributes in <input> email:'', password: '', token: '', subscription_type: null, payment_gateway: 'csob_one_click', payment_gateway_allow_redirect: this.overrideAllowRedirect(false), newsletter_subscribe: false, terms: false, subscription_term: 'year', club: true, print: null, }, errors: { email: null, password: null, terms: null, payment_gateway: null, }, shake: { email: false, password: false, terms: false, payment_gateway: false, additional: false }, validators: { sync: false, // Summary flag if the latest execution of synchronous validators returned "valid" state. email: this.isLogged, }, }); }, computed: { payButtonValid: function() { return (this.inputs.email || this.isLogged) && this.inputs.terms && this.inputs.payment_gateway && this.inputs.subscription_type; }, buttonPrice: function () { return this.getSubscriptionPrice(this.inputs.subscription_term, this.inputs.club, this.inputs.print); }, isFormValid: function () { return this.validators.sync && (this.validators.email || this.isLogged) } }, watch: { inputs: { handler() { this.resetValidation() }, deep: true, }, validators: { handler() { this.handleValidation(); }, deep: true, }, action: function() { this.handleValidation(); } }, methods: { handleValidation: function() { if (this.isFormValid) { if (this.activeWindow === 'first-window' && this.action === 'second-window') { this.displaySecondWindow(); } else if (this.activeWindow === 'second-window' && this.action === 'submit') { this.submitForm(); } } }, getSubscriptionType: function(term, club, print) { return type2Subscription[term][club ? 'club' : 'no_club'][print || 'no_print']; }, getSubscriptionPrice: function(term, club, print) { return this.subscriptionTypePrices[this.getSubscriptionType(term, club, print)]; }, getFormattedPrice: function(price) { return formatNumber(price); }, isSubscriptionTerm: function (subscriptionTerm) { return this.inputs.subscription_term === subscriptionTerm; }, selectSubscriptionTerm: function (subscriptionTerm) { this.inputs.subscription_term = subscriptionTerm; this.inputs.subscription_type = this.getSubscriptionType(this.inputs.subscription_term, this.inputs.club, this.inputs.print); // disabled by https://gitlab.projektn.sk/remp/novydenik/-/issues/1254#note_351140 // this.scrollTo(this.$refs.additionalOptions); }, isClubSelected: function () { return this.inputs.club === true; }, toggleClub: function () { this.inputs.club = !this.inputs.club; this.inputs.subscription_type = this.getSubscriptionType(this.inputs.subscription_term, this.inputs.club, this.inputs.print) }, isPrintSelected: function (print) { return this.inputs.print === print; }, togglePrint: function (print) { this.inputs.print = this.inputs.print === print ? null : print; this.inputs.subscription_type = this.getSubscriptionType(this.inputs.subscription_term, this.inputs.club, this.inputs.print) }, isPaymentGatewaySelected: function (gateway) { return this.inputs.payment_gateway === gateway; }, selectPaymentGateway: function (gateway, allowRedirect) { this.inputs.payment_gateway = gateway; this.inputs.payment_gateway_allow_redirect = this.overrideAllowRedirect(allowRedirect); }, overrideAllowRedirect: function (allowRedirect) { if (navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i)) { return true; } return allowRedirect; }, monthlyPrice: function (term) { return this.getSubscriptionPrice(term, false, null) / this.getSubscriptionTermMultiplier(term); }, getSubscriptionTermMultiplier: function (subscriptionTerm) { let multiplier = {'month': 1, 'months_3': 3, 'year': 12} return multiplier[subscriptionTerm]; }, submitForm: function() { this.resetValidation(); if (!this.inputs.payment_gateway_allow_redirect) { var $modalDialog = $('#payment-modal-dialog'); window.paymentModalOriginalWidth = window.paymentModalOriginalWidth || $modalDialog.css("width"); $.ajax({ type: "POST", url: this.$refs.form.action, data: $(this.$refs.form).serialize(), success: function (data) { if (data.url) { var $modal = $('#payment-modal'); $modal.find('.modal-body').html('<div class="scroll-wrapper"><iframe id="bankIframe" src="' + data.url + '" frameborder="0" marginwidth="0" marginheight="0" scrolling="yes" width="100%" style="width:100%; height: 600px; max-width:100%;"></iframe></div>'); $modalDialog.css("width", window.paymentModalOriginalWidth); $modal.modal('show'); window.parent.$('html, body').animate({ scrollTop: 0 }, 400); } }, error: function (XMLHttpRequest, textStatus, errorThrown) { alert("Nastala chyba. :( Zkuste to, prosím, později."); } }); } else { this.$refs.form.submit(); } // this.$refs.form.submit(); }, scrollTo: function(element) { window.parent.$('html, body').animate({ scrollTop: $(element).offset().top - 120 }, 400); }, savedDataKey: function() { return 'sf_data_' + this.funnelUrlKey; }, clearSavedData: function () { localStorage.removeItem(this.savedDataKey()); localStorage.removeItem('sf_reload_nonce'); }, saveData: function(nonce) { var data = { inputs: this.inputs, errors: this.errors, } localStorage.setItem(this.savedDataKey(), JSON.stringify(data)); localStorage.setItem('sf_reload_nonce', nonce); }, loadSavedData: function() { var data = localStorage.getItem(this.savedDataKey()); if (!data) { return; } data = JSON.parse(data); if (data.inputs && data.errors) { this.inputs = data.inputs; this.errors = data.errors; } }, resetErrors: function () { for (var param in this.errors) { if (!this.errors.hasOwnProperty(param)) { continue; } this.errors[param] = null; } }, resetEmailErrors: function () { this.errors.email = null; this.errors.password = null; }, resetValidation: function () { for (var param in this.validators) { this.validators[param] = false; } }, openLogin: function () { // random string of length 3 var nonce = Math.random().toString(36).replace(/[^a-z]+/g, '').substring(0, 3); this.saveData(nonce); parent.postMessage({ name: 'open-crm-login', nonce: nonce }); }, validateForm: function() { if (this.isFormValid) { return; } this.resetErrors(); this.resetValidation(); var errors = {}; var scrollToElement = null; if (!this.inputs.terms) { errors.terms = true; scrollToElement = this.$refs.inputTerms; } if (!this.isLogged && !this.inputs.email) { errors.email = true; scrollToElement = this.$refs.inputEmail; } if (!this.inputs.payment_gateway) { errors.payment_gateway = true; scrollToElement = this.$refs.paymentOptions; } if (!this.isLogged && this.inputs.email) { this.verifyEmail(); } var isSyncValidForm = $.isEmptyObject(errors); this.validators.sync = isSyncValidForm; if (!isSyncValidForm) { for (var param in errors) { this.errors[param] = errors[param]; this.shake[param] = true; } if (scrollToElement) { this.scrollTo(scrollToElement); } } }, isWindowActive: function (window) { return window === this.activeWindow; }, submitFirstWindow: function () { this.action = 'second-window'; this.validateForm(); }, displaySecondWindow: function () { this.action = null; this.activeWindow = "second-window"; this.scrollTo('body'); }, onSubmit: function(e) { this.action = 'submit'; this.validateForm(); // wait for watcher to submit }, emailChanged: function () { this.verifyEmail(); }, // // Network/AJAX functions // verifyEmail: function (submitCallback) { this.preloader = true; var that = this; $.ajax({ method: 'POST', url: '/api/v1/users/email', data: { email: that.inputs.email, password: that.inputs.password, token: that.token }, timeout: 20000 }).done(function (response) { that.verifyEmailProcessResponse(response, submitCallback); }).fail(function (jqXHR, textStatus) { if (textStatus === 'timeout') { alert(messages.errors.server); } else { alert(messages.errors.unexpected); } }).always(function () { that.preloader = false; }); }, verifyEmailProcessResponse: function (response, submitCallback) { this.resetEmailErrors(); if (response.status === 'taken') { this.showPasswordInput = true; if (response.password === true) { this.validators.email = true; // valid password => SUBMIT if (submitCallback) { submitCallback(); } } else if (response.password === false && this.inputs.password) { this.errors.password = 'invalid'; this.shake.password = true; } else { // no password, not submitting } } else if (response.status === 'error') { if (response.code === 'email_missing') { this.errors.email = true; this.shake.email = true; this.showPasswordInput = false; } else if (response.code === 'invalid_email') { this.errors.email = 'invalid'; this.shake.email = true; this.showPasswordInput = false; } } else if (response.status === 'available') { this.showPasswordInput = false; this.validators.email = true; // email available => SUBMIT if (submitCallback) { submitCallback(); } } } } } Vue.createApp(SalesFunnelVue) // note: do not forget to remove class .flex-wrapper from #second-window // when changing component to DonationWindowNcz2024 (novydenik#1239) .component('donation-window', DonationWindowNcz2024) .mount('#main'); </script> <script src="/layouts/novydenik/js/bootstrap.min.js"></script> <script> $(document).ready(function () { if (isAppleDevice()) { $('body').addClass('is-apple') } $('[data-toggle="popover"]').popover({ content: function () { return $(this).next('.popover_content_html').html(); } }) }); function isAppleDevice() { return ( (navigator.userAgent.toLowerCase().indexOf("ipad") > -1) || (navigator.userAgent.toLowerCase().indexOf("iphone") > -1) || (navigator.userAgent.toLowerCase().indexOf("ipod") > -1) ); } </script> <div class="modal fade in" id="payment-modal" ref="paymentModal" tabindex="-1" role="dialog" aria-labelledby="paymentModal" data-backdrop="static" data-keyboard="false"> <div id="payment-modal-dialog" class="modal-dialog" role="document" style="width: 575px"> <div class="modal-content"> <div class="modal-header" style="display: flex"> <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="margin-left: auto"><span aria-hidden="true">×</span> </button> </div> <div class="modal-body" style="padding: 0 15px 15px"> </div> </div> </div> </div> </body> </html>

CINXE.COM

Deník N – předplatné