<?php $__env->startSection('content'); ?>
  <div class="split-layout">
    <div class="columns is-desktop">
      <div class="column is-11-of-24 is-hidden-touch left-image-container"></div>
      <div class="column is-13-of-24 is-offset-1-of-24 right-content-container">
        <div class="right-content image-uploader">
          <h1><?php echo Lang::get('frontend.get_involved.title'); ?></h1>
          <h4><?php echo Lang::get('frontend.get_involved.subtitle'); ?></h4>
          <p class="terms-description"><?php echo Lang::get('frontend.get_involved.terms', ['link' => lang_url('terms-condition')]); ?></p>
          <form class="upload">
            <div class="columns">
              <div class="column left-column">
                <div class="user-data-form">
                  <div class="email-container">
                    <label for="email"><?php echo Lang::get('frontend.get_involved.label.email'); ?></label>
                    <div class="email-input">
                      <input id="email" type="email" name="email" class="ami-input trackable" required
                             data-ga-event="fillinEmail">
                      <i class="icon-ok success"></i>
                      <i class="icon-cancel error"></i>
                      <div class="validation-message"></div>
                    </div>
                  </div>
                  <div class="recaptcha">
                    <div class="g-recaptcha" data-theme="dark"
                         data-sitekey="<?php echo Config::get('project/recaptcha.clientKey'); ?>"
                         data-callback="validateRecaptcha"></div>
                  </div>
                  <div class="js-terms-and-conditions">
                    <input type="checkbox" name="terms-and-conditions" id="terms-and-conditions">
                    <label for="terms-and-conditions"><?php echo Lang::get('frontend.get_involved.label.terms', ['link' => lang_url('terms-condition')]); ?></label>
                  </div>
                </div>
              </div>
              <div class="column right-column">
                <div class="image-editting-column">
                  <div class="dropzone-net trackable" id="dropzone-net" data-ga-event="uploadImage">
                    <div class="image-editor"></div>
                    <div class="dz-default dz-message">
                      <div class="for-desktop">
                        <i class="icon-upload"></i>
                        <div><?php echo Lang::get('frontend.get_involved.uploader.dragndrop'); ?></div>
                        <div class=""><?php echo Lang::get('frontend.get_involved.uploader.divider'); ?></div>
                        <a href="#" class="ami-link"><?php echo Lang::get('frontend.get_involved.uploader.link'); ?></a>
                      </div>
                      <div class="for-mobile">
                        <button type="button"
                                class="ami-button"><?php echo Lang::get('frontend.get_involved.uploader.cta_load'); ?></button>
                      </div>
                    </div>
                    <div class="file-error-message-overlay hidden">
                      <div class="file-error-message"></div>
                    </div>
                    <i class="icon-trash js-remove-image remove-image-desktop hidden" title="Remove image"></i>
                    <span
                      class="drag-info-box icon-move hidden"><?php echo Lang::get('frontend.get_involved.uploader.drag'); ?></span>
                    <div class="banners hidden"></div>
                    <div class="mobile-overlay hidden enabled">
                      <img src="<?php echo Config::get('path.frontend.img'); ?>/two-fingers-swipe.svg" alt="Swipe icon">
                      <div class=""><?php echo Lang::get('frontend.get_involved.uploader.move'); ?></div>
                    </div>
                    <div class="email-required-message-overlay">
                      <div class="email-message"><?php echo Lang::get('frontend.get_involved.uploader.email'); ?></div>
                    </div>
                  </div>
                  <div class="dropzone-tools hidden">
                    <span
                      class="icon-trash js-remove-image"><?php echo Lang::get('frontend.get_involved.uploader.change'); ?></span>
                    <span class="icon-help-circled js-show-mobile-overlay help-icon"></span>
                  </div>
                  <div class="zoom-controls hidden">
                    <div class="zoom-label"><?php echo Lang::get('frontend.get_involved.uploader.zoom'); ?></div>
                    <input class="zoom-slider" type="range" min="0" max="100" value="0">
                    <div class="zoom-slider-runner-lower"></div>
                  </div>
                </div>
              </div>
            </div>
            <input type="submit" class="hidden">
          </form>
          <div class="error-message-container"></div>
          <div class="button-container">
            <button class="ami-button highlight next-step trackable" type="button" name="next-step"
                    data-ga-event="submitParticipation">
              <?php echo Lang::get('frontend.get_involved.uploader.cta_join'); ?>

            </button>
          </div>
        </div>
        <div class="right-content image-downloader hidden">
          <h3><?php echo Lang::get('frontend.get_involved.thanks.title'); ?></h3>
          <p class="page-description"><?php echo Lang::get('frontend.get_involved.thanks.subtitle'); ?></p>
          <div class="columns">
            <div class="column is-half left-column">
              <div class="share">
                <div class="column-title"><?php echo Lang::get('frontend.get_involved.thanks.share.title'); ?></div>
                <div class="column-description"><?php echo Lang::get('frontend.get_involved.thanks.share.subtitle'); ?></div>
                <div class="share-buttons columns is-multiline">
                  <div class="column is-half-mobile is-12-desktop is-half-widescreen">
                    <button class="ami-button js-sharer trackable track-on-click facebook" data-ga-event="shareFacebook" type="button" name="button" data-sharer-type="facebook">
                      <i class="icon-facebook-official"></i>
                      <span><?php echo Lang::get('frontend.get_involved.thanks.share.facebook'); ?></span>
                      <span class="checkmark icon-ok"></span>
                    </button>
                    <a href="mailto:?subject=tmp&amp;body=tmp" class="ami-button js-sharer trackable track-on-click mail" data-ga-event="shareEmail" data-sharer-type="email">
                      <i class="icon-mail-alt"></i>
                      <span><?php echo Lang::get('frontend.get_involved.thanks.share.email'); ?></span>
                      <span class="checkmark icon-ok"></span>
                    </a>
                  </div>
                  <div class="column is-half-mobile is-12-desktop is-half-widescreen">
                    <button class="ami-button js-sharer trackable track-on-click twitter" data-ga-event="shareTwitter" type="button" name="button" data-sharer-type="twitter">
                      <i class="icon-twitter"></i>
                      <span><?php echo Lang::get('frontend.get_involved.thanks.share.twitter'); ?></span>
                      <span class="checkmark icon-ok"></span>
                    </button>
                    <button class="ami-button js-sharer trackable track-on-click pinterest" data-ga-event="sharePinterest" type="button" name="button" data-sharer-type="pinterest">
                      <i class="icon-pinterest-circled"></i>
                      <span><?php echo Lang::get('frontend.get_involved.thanks.share.pinterest'); ?></span>
                      <span class="checkmark icon-ok"></span>
                    </button>
                  </div>
                  <div class="column is-12 ami-toolbar">
                    <div class="copy-link ami-button">
                      <input type="text" id="copy-link-content" class="copy-link-content" value="" readonly>
                    </div>
                    <div class="copy-link-button ami-button trackable track-on-click js-sharer" data-sharer-type="copy" data-ga-event="shareLink" data-alt-text="Copied!">
                      <i class="icon-link"></i>
                      <?php echo Lang::get('frontend.get_involved.thanks.share.copy'); ?>

                      <div class="checkmark icon-ok"></div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="donate">
                <div class="column-title"><?php echo Lang::get('frontend.get_involved.thanks.donate.title'); ?></div>
                <div class="column-description"><?php echo Lang::get('frontend.get_involved.thanks.donate.subtitle'); ?></div>
                <a class="ami-link column-link trackable track-on-click" href="<?php echo Lang::get('frontend.get_involved.thanks.donate.url'); ?>" target="_blank" rel="noopener" data-ga-event="clickDonationButton"><?php echo Lang::get('frontend.get_involved.thanks.donate.cta'); ?></a>
              </div>
            </div>
            <div class="column is-5 right-column">
              <div class="column-title"><?php echo Lang::get('frontend.get_involved.thanks.download.title'); ?></div>
              <div class="column-description"><?php echo Lang::get('frontend.get_involved.thanks.download.subtitle'); ?></div>
              <a class="ami-link column-link trackable track-on-click download-image" href="" download target="_blank" rel="noopener"
                 data-ga-event="downloadImage">
                <?php echo Lang::get('frontend.get_involved.thanks.download.cta'); ?>

              </a>
            </div>
          </div>
          <div class="button-container">
            <a class="ami-button highlight trackable track-on-click js-see-your-image" href="" data-ga-event="clickGalleryButton" target="_blank" rel="noopener">
              <?php echo Lang::get('frontend.get_involved.thanks.gallery_button'); ?>

            </a>
          </div>
        </div>
      </div>
    </div>

    <div class="hidden">
      <img id="banners" src="<?php echo Config::get('path.frontend.img'); ?>/banners.svg" alt="Banners">
      <canvas id="canvas"></canvas>
    </div>
    <div class="loader-container">
      <div class="loader"></div>
    </div>
  </div>
<?php $__env->stopSection(); ?>
<?php $__env->startSection('scripts'); ?>
  <script type="text/javascript">
    function validateRecaptcha(response) {
      localStorage.setItem('recaptchaResponse', response);
    }
  </script>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('frontend.main.main_nofooter', array_except(get_defined_vars(), array('__data', '__path')))->render(); ?>