{assign var=displayRegister value= ($hubbub && !$hubbub->isUserRegistrationDisabled())?true:false}
{if $jumpToFullScreen eq true || $outputDevice eq 'mobile'}
<script type="text/javascript">
  var hrefString=window.location.href;
  hrefString=hrefString.replace('jumpToFullScreen=1','jumpToFullScreen=0');
  window.location.reload();
</script>
{else}

<section class="mdl-login">
  <header class="mdl-login__header">
    {if intval($hubbub->joined.obj_hubbub_logofile->data.file_id) ne 0}
      <div class="mdl-login__image">
        {include file=Template::get('showImageCloudinary.html') alt=$hubbub->data.hubbub_name showFile=$hubbub->joined.obj_hubbub_logofile xSize=300 ySize=60 loadType='c_fit'}
      </div>
    {/if}
    <h2 class="mdl-login__title type-style-headerM">{if isset($hubbub) && $hubbub ne false}{$hubbub->data.hubbub_name}{else}Crowdicity{/if}</h2>
  </header>
  {if $hubbub->hubbub_arrOptions.allowSocialMediaLogin eq 1 || $hubbub->hubbub_arrOptions.allowSAML2Login eq 1 || $hubbub->hubbub_arrOptions.allowYammerLogin eq 1 || $hubbub->hubbub_arrOptions.allowAzureLogin eq 1 || ($hubbub && $hubbub->isOIDC())}
  {if isset($errors.noAccessReasonOIDC)}<div class="mdl-alert -error">{$errors.noAccessReasonOIDC}</div>{/if}
      <div class="mdl-grid -x2">
        <div>      
          <h3 class="type-style-subHeaderM">{"How do you want to sign in?"|gettext}</h3>
          <ul class="mdl-type-selector" id="signInSelector">
            {foreach from=$hubbub->hubbub_arrOptions.signInOrderList item=signInMethod}
              {if $signInMethod eq 'openidsso'}
                  {if $hubbub && $hubbub->isOIDC()}
                    <li class="active mdl-type-selector__item" id="OpenIDSSOOpt" onclick="User.signInTabSelect('OpenIDSSOlogin', this); {if $displayRegister}$('registrationFooter').hide();{/if}">
                      <span class="mdl-icon -dark"><svg><use href="#team"></use></svg></span>
                      <span class="mdl-type-selector__item-name">{"%s account"|gettext|sprintf:$hubbub->getOIDCProviderName()}</span>
                    </li>
                  {/if}
              {/if}
              {if $signInMethod eq 'crowdicity'}
                {if $hubbub->hubbub_arrOptions.allowCrowdicityLogin eq 1}
                  <li class="active mdl-type-selector__item" id="ccOpt" onclick="User.signInTabSelect('cwLogin', this); {if $displayRegister}$('registrationFooter').show();{/if}">
                    <span class="mdl-icon -dark"><svg><use href="#crowdworks"></use></svg></span>
                    <span class="mdl-type-selector__item-name">{$hubbub->hubbub_arrOptions.crowdicityLoginDisplayName}</span>
                  </li>
                {/if}
              {/if}
              {if $signInMethod eq 'social'}
                {if $hubbub->hubbub_arrOptions.allowSocialMediaLogin eq 1}
                  <li id="socialOpt" class="mdl-type-selector__item" onclick="User.signInTabSelect('socialLogin', this); {if $displayRegister}$('registrationFooter').hide();{/if}">
                    <span class="mdl-icon -dark"><svg><use href="#comment"></use></svg></span>
                    <span class="mdl-type-selector__item-name">{"Social media account"|gettext}</span>
                  </li>
                {/if}
              {/if}
              {if $signInMethod eq 'yammer'}
                {if $hubbub->hubbub_arrOptions.allowYammerLogin eq 1}
                  <li id="yammerOpt" class="mdl-type-selector__item" onclick="User.signInTabSelect('yammerLogin', this); {if $displayRegister}$('registrationFooter').hide();{/if}">
                    <span class="mdl-icon -dark"><svg><use href="#team"></use></svg></span>
                    <span class="mdl-type-selector__item-name">{"Yammer account"|gettext}</span>
                  </li>
                {/if}
              {/if}
              {if $signInMethod eq 'azure'}
                {if $hubbub->hubbub_arrOptions.allowAzureLogin eq 1}
                  <li id="azureOpt" class="mdl-type-selector__item" onclick="User.signInTabSelect('azureLogin', this); {if $displayRegister}$('registrationFooter').hide();{/if}">
                    <span class="mdl-icon -dark"><svg><use href="#team"></use></svg></span>
                    <span class="mdl-type-selector__item-name">{$hubbub->hubbub_arrOptions.azureDisplayName}</span>
                  </li>
                {/if}
              {/if}
              {if $signInMethod eq 'samlv2'}
                {if $hubbub->hubbub_arrOptions.allowSAML2Login eq 1}
                  <li id="organisationOpt" class="mdl-type-selector__item" onclick="User.signInTabSelect('organisationLogin', this); {if $displayRegister}$('registrationFooter').hide();{/if}">
                    <span class="mdl-icon -dark"><svg><use href="#team"></use></svg></span>
                    <span class="mdl-type-selector__item-name">{$hubbub->hubbub_arrOptions.samlDisplayName}</span>
                  </li>
                {/if}
              {/if}
            {foreachelse}
              <li class="active mdl-login__selector-item" id="ccOpt" onclick="User.signInTabSelect('cwLogin', this);">
                <span class="mdl-icon -dark"><svg><use href="#crowdworks"></use></svg></span>
                <span class="mdl-type-selector__item-name">{"Crowdicity account"|gettext}</span>
              </li>
            {/foreach}
          </ul>
        </div>
        <div id="loginFormsContainer" class="loginFormsContainer">
            {include file="$templateSource/html/user/signin_crowdicity.html"}
            {include file="$templateSource/html/user/signin_social.html"}
            {include file="$templateSource/html/user/signin_yammer.html"}
            {include file="$templateSource/html/user/signin_azure.html"}
            {include file="$templateSource/html/user/signin_samlv2.html"}
            {include file="$templateSource/html/user/signin_openidsso.html"}
        </div>
      </div>
    {else}
      {include file="$templateSource/html/user/signin_crowdicity_solo.html"}
    {/if}
  {if $displayRegister}
    <div class="mdl-form__button-row -flush" id="registrationFooter">
      <p class="requestAccessFooter -left">
        {if $hubbub->data.hubbub_closed eq 1}
          {"Please register an account to request access to this community"|gettext}
        {else}
          {"Register an account to join this community"|gettext}?
        {/if}
      </p>
      <a href="/user/registerform?returnTo={$returnTo}{if isset($smarty.request.useraccess_pendingkey)}&useraccess_pendingkey={$smarty.request.useraccess_pendingkey|escapeonce}{/if}{$smarty.capture.apiData}" class="mdl-button">{"Register"|gettext}</a>
    </div>
  {/if}
</section>




  <div id="signinContainer" class="signinContainer">


  </div>

  <script type="text/javascript">
      if($('yammerOpt')) {
          $('yammerOpt').observe('click', function() {
              activateYammerLogin();
          });
      }
      {if $hubbub != false}
          {assign var=firstSignInOption value=$hubbub->getFirstSignInOption()}
      {else}
          {assign var=firstSignInOption value='crowdicity'} 
      {/if}
      {if $firstSignInOption eq 'crowdicity'}
          User.signInTabSelect('cwLogin', $('ccOpt'));
      {elseif $firstSignInOption eq 'social'}
          User.signInTabSelect('socialLogin', $('socialOpt'));
      {elseif $firstSignInOption eq 'yammer'}
          User.signInTabSelect('yammerLogin', $('yammerOpt'));
      {elseif $firstSignInOption eq 'samlv2'}
          User.signInTabSelect('organisationLogin', $('organisationOpt'));
      {elseif $firstSignInOption eq 'azure'}
          User.signInTabSelect('azureLogin', $('azureOpt'));
      {elseif $firstSignInOption eq 'openidsso'}
          User.signInTabSelect('OpenIDSSOlogin', $('OpenIDSSOOpt'));
      {/if}
      processMdlInputs();
  </script>

  {if $vars.ajax}
      <script type="text/javascript">
          loginBoxFix();
      </script>
  {/if}
{/if}