templates/baseMobile.html.twig line 1

Open in your IDE?
  1. {% macro flash( app, type ) %}
  2.     {% for message in app.flashes(type) %}
  3.         <div class="alert alert-{{ type }} col-md-10 col-lg-8 mx-auto my-4">
  4.             {{ message|raw }}
  5.         </div>
  6.     {% endfor %}
  7. {% endmacro %}
  8. <!DOCTYPE html>
  9. <html lang="en">
  10. <head>
  11.     <meta charset="utf-8" />
  12.     <link rel="apple-touch-icon" sizes="76x76" href="../assets/img/apple-icon.png">
  13.     <link rel="icon" type="image/png" href="../assets/img/favicon.png">
  14.     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  16.     <title>Lowdefest Tickets: {{ block('title') }}</title>
  18.     <meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport' />
  20.     {% block stylesheets %}
  21. {#        {{ encore_entry_link_tags('app') }}#}
  22.         <link href="{{ asset('css/feStyles.css') }}" rel="stylesheet">
  23.     {% endblock stylesheets %}
  24.     <style id="progressStyles">
  25.         body::before {
  26.             content: '';
  27.             display: block;
  28.             position: fixed;
  29.             top: 0px;
  30.             left: 0px;
  31.             width: 100%;
  32.             height: 3px;
  33.             background: #0d6efd;
  34.             transform: scaleX(0.3);
  35.             transform-origin: 0 0;
  36.             will-change: transform;
  37.             z-index: 1000;
  38.         }
  39.     </style>
  40.     <!-- Global site tag (gtag.js) - Google Analytics -->
  41.     <script async src="https://www.googletagmanager.com/gtag/js?id=G-HFZKWK042C"></script>
  42.     <script>
  43.         window.dataLayer = window.dataLayer || [];
  44.         function gtag(){dataLayer.push(arguments);}
  45.         gtag('js', new Date());
  46.         gtag('config', 'G-HFZKWK042C');
  47.     </script>
  48. </head>
  50. <body class="">
  52. <div class="mobile-container">
  53.     {% import _self as helper %}
  54.     <div class="content">
  55.         <div class="app-head unlogged" >
  56.             <div class="col-12 header-row">
  57.             <a href="{{ path('feapp_home') }}">
  58.                     <div class="mob-logo">
  59.                         <img src="{{ asset('build/img/LF23-logo.png') }}" >
  60.                         <img src="{{ asset('build/img/LF23-name.svg') }}" >
  61.                     </div>
  62.                     {#                {% if orders.invited|length>0 or orders.purchased|length>0 %}#}
  63.                     {#                    <div class="col-50">#}
  64.                     {#                        <div class="barcode-btn">#}
  65.                     {#                            <a href="#" class="barcode-link" data-toggle="modal" data-target="#barcodeModal">#}
  66.                     {#                                <svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34 22"><defs><style>.cls-1{fill:#fff;}</style></defs><rect class="cls-1" width="2" height="22"/><rect class="cls-1" x="4" width="2" height="19.5"/><rect class="cls-1" x="8" width="2" height="19.5"/><rect class="cls-1" x="12" width="2" height="19.5"/><rect class="cls-1" x="16" width="2" height="19.5"/><rect class="cls-1" x="20" width="2" height="19.5"/><rect class="cls-1" x="24" width="2" height="19.5"/><rect class="cls-1" x="28" width="2" height="19.5"/><rect class="cls-1" x="32" width="2" height="22"/><rect class="cls-1" x="4" width="2" height="19.5"/></svg>#}
  67.                     {#                            </a>#}
  68.                     {#                        </div>#}
  69.                     {#                    </div>#}
  70.                     {#                {% endif %}#}
  71.             </a>
  72.             </div>
  73.         </div>
  75.         {{ helper.flash( app, 'danger' ) }}
  76.         {{ helper.flash( app, 'warning' ) }}
  77.         {{ helper.flash( app, 'success' ) }}
  78.         {{ helper.flash( app, 'info' ) }}
  80.         {%if onAir|length %}
  81.             <div class="on-air">
  82.                 {% for event in onAir%}
  83.                     <div class="event">
  84.                         <div class="badge badge-pill badge-danger">On Air</div>
  85.                         <div class="artist">{{event.artist.name}}</div> @ <a href="{{path('feapp_lineup_stage',{'id':event.stage.id})}}" class="stage">{{event.stage.name}}</a>
  86.                     </div>
  87.                 {% endfor %}
  88.             </div>
  89.         {%endif%}
  90.         {%if upcoming|length %}
  91.             <div class="upcoming">
  92.                 {% for event in upcoming%}
  93.                     <div class="event">
  94.                         <div class="time">{{event.startAt|date('H:i')}} ({{event.startAt|elapsed}})</div>
  95.                         <div class="artist">{{event.artist.name}}</div> @ <a href="{{path('feapp_lineup_stage',{'id':event.stage.id})}}" class="stage">{{event.stage.name}}</a>
  96.                     </div>
  97.                 {% endfor %}
  98.             </div>
  99.         {%endif%}
  101.         {% block body %}{% endblock %}
  102.     </div>
  103.     <footer>Provided by <a href="https://wisetiger.co.uk/">Wisetiger</a>. Powered by <a href="https://seehoo.co.uk/">Seehoo</a>
  104.     </footer>
  105. </div>
  107. {% block javascripts %}
  108.     <script>
  109.         let i, c, u, a, s, l, f, d, m;
  110.         i = 15e3;
  111.         c = 4e4;
  112.         u = "#0d6efd";
  113.         a = function (n) {
  114.             return "\n    ".concat("body::before", " { \n        transform: scaleX(0.99);\n        transition-duration: ").concat(n, "ms;\n        transition-timing-function: cubic-bezier(0,1,0.5,1);\n    }\n")
  115.         };
  116.         s = function () {
  117.             return "\n    ".concat("body::before", " {\n        transform: scaleX(1);\n        transition-duration: ").concat(300, "ms;\n        animation: none;\n        background-image: none;\n    }\n")
  118.         };
  119.         l = function () {
  120.             return "\n    ".concat("body::before", " {\n        transform: scaleX(0);\n        transition-duration: 0ms;\n        animation: none;\n        background-image: none;\n    }\n")
  121.         };
  122.         f = function () {
  123.             return "\n    @keyframes shimmer {\n        from {\n            left: -80%; \n            width: 80%; \n        }\n        \n        to {\n            left: 110%; \n            width: 10%;\n        }\n    }\n"
  124.         };
  125.         d = function (n) {
  126.             return "\n        ".concat("body::before", " {\n            transform: scaleX(1);\n            transition-duration: 0ms;\n            background: ").concat(n, ";\n            animation: shimmer 2s infinite;\n        }\n    ")
  127.         };
  128.         m = function (n) {
  129.             document && document.hidden ? n() : requestAnimationFrame((function () {
  130.                     n()
  131.                 }
  132.             ))
  133.         };
  134.         let g = function (n) {
  135.             const e = (n || {}).sheet;
  136.             if (e) {
  137.                 let t = !1
  138.                     , o = !1
  139.                     , r = null
  140.                     , g = null
  141.                     , R = null;
  142.                 return {
  143.                     inProgress: function() {
  144.                         return t
  145.                     },
  146.                     start: function () {
  147.                         const n = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : i;
  148.                         t || (t = !0,
  149.                             m((function () {
  150.                                     e.insertRule(a(n), e.cssRules.length)
  151.                                 }
  152.                             )),
  153.                             g = setTimeout((function () {
  154.                                     t && (o = !0,
  155.                                         m((function () {
  156.                                                 e.insertRule(f(), e.cssRules.length),
  157.                                                     e.insertRule(d(u), e.cssRules.length)
  158.                                             }
  159.                                         )))
  160.                                 }
  161.                             ), i),
  162.                             R = setTimeout((function () {
  163.                                     t && (t = !1,
  164.                                         o = !1,
  165.                                         m((function () {
  166.                                                 e.insertRule(l(), e.cssRules.length)
  167.                                             }
  168.                                         )),
  169.                                         clearTimeout(r),
  170.                                         clearTimeout(g),
  171.                                         clearTimeout(R))
  172.                                 }
  173.                             ), c))
  174.                     },
  175.                     end: function () {
  176.                         if (t) {
  177.                             if (t = !1,
  178.                                 o)
  179.                                 return o = !1,
  180.                                     clearTimeout(r),
  181.                                     clearTimeout(R),
  182.                                     clearTimeout(g),
  183.                                     void m((function () {
  184.                                             e.insertRule(l(), e.cssRules.length)
  185.                                         }
  186.                                     ));
  187.                             m((function () {
  188.                                     e.insertRule(s(), e.cssRules.length)
  189.                                 }
  190.                             )),
  191.                                 r = setTimeout((function () {
  192.                                         clearTimeout(r),
  193.                                             clearTimeout(R),
  194.                                             clearTimeout(g),
  195.                                             m((function () {
  196.                                                     e.insertRule(l(), e.cssRules.length)
  197.                                                 }
  198.                                             ))
  199.                                     }
  200.                                 ), 800)
  201.                         }
  202.                     },
  203.                     reset: function () {
  204.                         t = !1,
  205.                             o = !1,
  206.                             clearTimeout(r),
  207.                             clearTimeout(g),
  208.                             clearTimeout(R),
  209.                             m((function () {
  210.                                     e.insertRule(l(), e.cssRules.length)
  211.                                 }
  212.                             ))
  213.                     }
  214.                 }
  215.             }
  216.         };
  218.         !function () {
  219.             const n = document.getElementById("progressStyles");
  220.             n && n.sheet && (window.seewhen_progress_bar = g(n),
  221.             window.seewhen_progress_bar && window.seewhen_progress_bar.start && window.seewhen_progress_bar.start())
  222.         }()
  224.     </script>
  225.     {#    <script src="{{ asset('packages/ui.js') }}"></script>#}
  226.     {{ encore_entry_script_tags('app') }}
  228. {% endblock javascripts %}
  230. {% block modals %}
  231.     {% if orders.invited|length>0 or orders.purchased|length>0 %}
  232.         <div class="modal fade" id="barcodeModal" tabindex="-1" role="dialog" aria-labelledby="ModalLabel" aria-hidden="true">
  233.             <div class="modal-dialog my-tickets">
  234.                 <div class="modal-content">
  235.                     <div class="modal-header justify-content-center">
  236.                         <h5 class="title title-up">My Lowdefest Tickets</h5>
  237.                     </div>
  238.                     <div class="modal-body text-center ">
  239.                         {% if orders.invited|length>1 or orders.purchased|length>1 or (orders.invited|length==1 and orders.purchased|length==1) %}
  240.                         <div id="orderTickets" class="carousel slide" data-ride="carousel" data-interval="false">
  241.                             <ol class="carousel-indicators">
  242.                                 {% for order in orders.purchased %}
  243.                                 <li data-target="#orderTickets" data-slide-to="{{ loop.index-1 }}" {% if loop.first %}class="active"{% endif %}></li>
  244.                                 {% endfor %}
  245.                                 {% for order in orders.invited %}
  246.                                 <li data-target="#orderTickets" data-slide-to="{{ orders.purchased|length + loop.index-1 }}" {% if loop.first and orders.purchased|length==0 %}class="active"{% endif %}></li>
  247.                                 {% endfor %}
  248.                             </ol>
  249.                             <div class="carousel-inner">
  250.                                 {% for order in orders.purchased %}
  251.                                     <div class="carousel-item {% if loop.first %}active{% endif %} sharable" data-id="{{ path('feapp_share_ticket',{id:order.id}) }}">
  252.                                         <img class="img-fluid" src="{{ url('img_qrcode_get_order',{'id':order.id}) }}">
  253.                                         <hr>
  254.                                         {% for ticket in order.tickets %}
  255.                                             <p>{{ ticket.type.name }}</p>
  256.                                         {% endfor %}
  257.                                     </div>
  258.                                 {% endfor%}
  259.                                 {% for order in orders.invited %}
  260.                                     <div class="carousel-item {% if loop.first and orders.purchased|length==0 %}active{% endif %}" data-id="{{ path('feapp_share_ticket',{id:order.id}) }}">
  261.                                         <img class="img-fluid" src="{{ url('img_qrcode_get_order',{'id':order.id}) }}">
  262.                                         <h6>{{ order.firstName }} {{ order.lastName }} shared this ticket with you</h6>
  263.                                         <hr>
  264.                                         {% for ticket in order.tickets %}
  265.                                             <p>{{ ticket.type.name }}</p>
  266.                                         {% endfor %}
  267.                                     </div>
  268.                                 {% endfor%}
  269.                             </div>
  270.                             <button class="carousel-control-prev" type="button" data-target="#orderTickets" data-slide="prev">
  271.                                 <span class="carousel-control-prev-icon" aria-hidden="true"></span>
  272.                                 <span class="sr-only">Previous</span>
  273.                             </button>
  274.                             <button class="carousel-control-next" type="button" data-target="#orderTickets" data-slide="next">
  275.                                 <span class="carousel-control-next-icon" aria-hidden="true"></span>
  276.                                 <span class="sr-only">Next</span>
  277.                             </button>
  278.                         </div>
  279.                         {% else %}
  280.                             {% if orders.purchased|length>0 %}
  281.                                 <img
  282.                                         class="img-fluid purchased"
  283.                                         src="{{ url('img_qrcode_get_order',{'id':orders.purchased.0.id}) }}"
  284.                                         data-id="{{ path('feapp_share_ticket',{id:orders.purchased.0.id}) }}"
  285.                                 >
  286.                                 <hr>
  287.                                 {% for ticket in orders.purchased.0.tickets %}
  288.                                     <p>{{ ticket.type.name }}</p>
  289.                                 {% endfor %}
  290.                             {% else %}
  291.                                 <img class="img-fluid" src="{{ url('img_qrcode_get_order',{'id':orders.invited.0.id}) }}">
  292.                                 <h6 class="sharedTickerInfo">{{ orders.invited.0.firstName }} {{ orders.invited.0.lastName }} shared this ticket with you</h6>
  293.                                 <hr>
  294.                                 {% for ticket in orders.invited.0.tickets %}
  295.                                     <p>{{ ticket.type.name }}</p>
  296.                                 {% endfor %}
  297.                             {% endif %}
  298.                         {% endif %}
  299.                     </div>
  300.                     <div class="modal-footer member">
  301.                         <button  type="button" class="btn btn-secondary" id="shareTicket">Send ticket</button>
  302.                         <button  type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
  303.                     </div>
  304.                 </div>
  305.             </div>
  306.         </div>
  308.         <div class="modal fade" id="barcodeSharingModal" tabindex="-1" role="dialog" aria-labelledby="ModalLabel" aria-hidden="true">
  309.             <div class="modal-dialog my-tickets">
  310.                 <div class="modal-content">
  311.                     {{ form_start(shareForm) }}
  312.                     <div class="modal-header justify-content-center">
  313.                         <h5 class="title title-up">Send ticket to</h5>
  314.                     </div>
  315.                     <div class="modal-body text-center ">
  316.                         <div class="alert alert-info">
  317.                             <b>Important:</b> Only share your ticket with someone who should be able to use the QR code
  318.                             to gain entry on the day. We will only allow one entry per ticket type.
  319.                         </div>
  320.                         {{ form_row(shareForm.email) }}
  321.                     </div>
  322.                     <div class="modal-footer member">
  323.                         <button  type="submit" class="btn btn-primary" >Send</button>
  324.                     </div>
  325.                     {{ form_end(shareForm) }}
  326.                 </div>
  327.             </div>
  328.         </div>
  329.     {% endif %}
  330. {% endblock modals%}
  332. </body>
  334. </html>