{% extends "base.html" %}
{% block title %}{{ _('Debugger - ') + function_name }}{% endblock %}
{% block init_script %}

try {
  require(
    ['sources/generated/debugger_direct'],
    function(pgDirectDebug) {
      var pgDirectDebug = pgDirectDebug || pgAdmin.Tools.DirectDebug;
      var $ = pgDirectDebug.jquery;

      pgDirectDebug.init({{ uniqueId }}, {{ debug_type }});
      window.onbeforeunload = function(ev) {
        $.ajax({
          url: "{{ url_for('debugger.index') }}close/{{ uniqueId }}",
          method: 'DELETE'
        });
      };
    },
    function() {
      console.log(arguments);
    });
} catch (err) {
  console.log(err);
}
{% endblock %}
{% block body %}
{% if is_desktop_mode and is_linux %}
<style>
    body
    .alertify .ajs-dimmer,.alertify .ajs-modal{-webkit-transform: none;}
    .alertify-notifier{-webkit-transform: none;}
    .alertify-notifier .ajs-message{-webkit-transform: none;}
    .alertify .ajs-dialog.ajs-shake{-webkit-animation-name: none;}
    .debugger-container .wcLoadingIcon.fa-pulse{-webkit-animation: none;}
</style>
{% endif %}
<nav class="navbar-inverse navbar-fixed-top">
    <div id="btn-toolbar" class="btn-toolbar pg-prop-btn-group bg-gray-2 border-gray-3" role="toolbar" aria-label="">
        <div class="btn-group" role="group" aria-label="">
            <button type="button" class="btn btn-default btn-step-into" title="{{ _('Step into') }}">
                <i class="fa fa-indent"></i>
            </button>
            <button type="button" class="btn btn-default btn-step-over" title="{{ _('Step over') }}">
                <i class="fa fa-outdent"></i>
            </button>
            <button type="button" class="btn btn-default btn-continue" title="{{ _('Continue/Start') }}">
                <i class="fa fa-play-circle"></i>
            </button>
        </div>
        <div class="btn-group" role="group" aria-label="">
            <button type="button" class="btn btn-default btn-toggle-breakpoint" title="{{ _('Toggle breakpoint') }}">
                <i class="fa fa-circle"></i>
            </button>
            <button type="button" class="btn btn-default btn-clear-breakpoint" title="{{ _('Clear all breakpoints') }}">
                <i class="fa fa-ban"></i>
            </button>
        </div>
        <div class="btn-group" role="group" aria-label="">
            <button type="button" class="btn btn-default btn-stop" title="{{ _('Stop') }}">
                <i class="fa fa-stop-circle"></i>
            </button>
        </div>
    </div>
</nav>
<div id="container" class="debugger-container"></div>
{% endblock %}


{% block css_link %}
{% for stylesheet in stylesheets %}
<link type="text/css" rel="stylesheet" href="{{ stylesheet }}"/>
{% endfor %}
{% endblock %}