rc-1.0.x-dev/templates/rc-user-popup-block.html.twig

{{ attach_library('rc/popup_block') }}

{% if token %}

  <script type="application/javascript">
    function ChatLoginUserPopup(){
      document.getElementById('rc-user-popup-iframe').contentWindow.postMessage({
        externalCommand: 'login-with-token',
        token: '{{ token }}'
      }, '{{ server_url }}');
    }
  </script>

  <div id="rc-user-popup">

    {% if button_element == 'icon'  %}
      <input type="image" class="rc-button button-icon" src="{{ button_icon_path }}" onclick="openRcUserPopupBlock()"  alt="Open chat"/>
    {% elseif button_element == 'text'  %}
      <button class="rc-button button-text" onclick="openRcUserPopupBlock()">{{ button_text }}</button>
    {% endif %}

    <div id="rc-user-popup-block" class="popup-block" style="height: {{ height }}; width: {{ width }}">
      <div class="rc-header">

        <div class="rc-close rc-header-element">
          <span onclick="closeRcUserPopupBlock()">x</span>
        </div>

        <div class="rc-reload rc-header-element">
          <span onclick="reloadRcUserPopupBlock()">Refresh</span>
        </div>

        {%  if web %}
          <div class="rc-app-web rc-header-element">
            <a href="{{ web }}" class="rc-app" target="_blank">Web App</a>
          </div>
        {% endif %}

        {%  if mobile %}
          <div class="rc-app-mobile rc-header-element" style="margin-bottom: 3px;">
            <a href="{{ mobile }}" style="float: right" target="_blank">Mobile App</a>
          </div>
        {% endif %}

        {% if open_new_window %}
          <div class="rc-new-window rc-header-element">
            <a class="button" href="{{ url }}" onclick="document.open(this.href,'targetWindow',
              `toolbar=no,
              location=no,
              status=no,
              menubar=no,
              scrollbars=yes,
              resizable=yes,
              width={{ new_window_width }},
              height={{ new_window_height }}`);

              return false;">new window</a>
          </div>
        {% endif %}
      </div>

      <iframe id="rc-user-popup-iframe" name="rc-user-popup-iframe" onload="ChatLoginUserPopup()" src="{{ url }}" style="height: {{ height }}; width: {{ width }}"></iframe>

      <noscript>
        <a href="{{ url }}" target="_blank"><button>{{ 'Press here to Open chat'|t }}</button></a>
      </noscript>
    </div>

  </div>

{% else %}

  <div id="rc-user-block">
    <div id="rc-group-block-header" class="rc-header">
      <div class="rc-close rc-header-element">
        <span onclick="closeRcUserPopupBlock()">x</span>
      </div>
    </div>
    <div class="error-container">
      <p>Something went wrong! <br />Try to log out and login again.
        <br />If the issue persists, contact your site administration team.</p>
      <p><a href="{{ url('user.logout') }}" title="User Logout" class="btn btn-primary">Logout</a></p>
    </div>
  </div>
{% endif %}