Skip to content

Reactor js part 2 #1083

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 6 commits into from
Closed

Reactor js part 2 #1083

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
65658b1
use <details> element for template contexts
xi Aug 30, 2018
970a6d4
rm .djDebugToggle
xi Aug 31, 2018
aebcf7b
rm djDebugHoverable
xi Aug 31, 2018
081ee0b
do not close debugwindow twice
xi Sep 4, 2018
5c38802
do not remove .djdt-active twice
xi Sep 5, 2018
02d19b6
more explicit closing
xi Sep 5, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions debug_toolbar/panels/sql/utils.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,8 +30,8 @@ def reformat_sql(sql):
def swap_fields(sql):
expr = r'SELECT</strong> (...........*?) <strong>FROM'
subs = (r'SELECT</strong> '
r'<a class="djDebugUncollapsed djDebugToggle" href="#">&#8226;&#8226;&#8226;</a> '
r'<a class="djDebugCollapsed djDebugToggle" href="#">\1</a> '
r'<span class="djDebugUncollapsed" href="#">&#8226;&#8226;&#8226;</span> '
r'<span class="djDebugCollapsed" href="#">\1</span> '
r'<strong>FROM')
return re.sub(expr, subs, sql)

Expand Down
18 changes: 1 addition & 17 deletions debug_toolbar/static/debug_toolbar/css/toolbar.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -314,7 +314,7 @@
padding-right:.5em;
}

#djDebug .djTemplateHideContextDiv {
#djDebug .djTemplateContext {
background-color:#fff;
}

Expand Down Expand Up @@ -423,15 +423,6 @@
}


#djDebug a.djTemplateShowContext, #djDebug a.djTemplateShowContext span.toggleArrow {
color:#999;
}

#djDebug a.djTemplateShowContext:hover, #djDebug a.djTemplateShowContext:hover span.toggleArrow {
color:#000;
cursor:pointer;
}

#djDebug .djDebugSqlWrap {
position:relative;
}
Expand Down Expand Up @@ -541,13 +532,6 @@
#djDebug .djDebugEndTransaction div.djDebugLineChart strong {
border-right: 1px solid #94b24d;
}
#djDebug .djDebugHover div.djDebugLineChart strong {
background-color: #000;
}
#djDebug .djDebugInTransaction.djDebugHover div.djDebugLineChart strong {
background-color: #94b24d;
}


#djDebug .djdt-panelContent ul.djdt-stats {
position: relative;
Expand Down
70 changes: 26 additions & 44 deletions debug_toolbar/static/debug_toolbar/js/toolbar.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,13 @@
}
var current = $('#djDebug #' + this.className);
if (current.is(':visible')) {
$(document).trigger('close.djDebug');
$(this).parent().removeClass('djdt-active');
djdt.hide_panels();
} else {
$('.djdt-panelContent').hide(); // Hide any that are already open
djdt.hide_panels();

current.show();
$(this).parent().addClass('djdt-active');

var inner = current.find('.djDebugPanelContent .djdt-scroll'),
store_id = $('#djDebug').data('store-id');
if (store_id && inner.children().length === 0) {
Expand All @@ -37,15 +40,11 @@
$('#djDebugWindow').html(message).show();
});
}
current.show();
$('#djDebugToolbar li').removeClass('djdt-active');
$(this).parent().addClass('djdt-active');
}
});
$('#djDebug').on('click', 'a.djDebugClose', function(event) {
event.preventDefault();
$(document).trigger('close.djDebug');
$('#djDebugToolbar li').removeClass('djdt-active');
djdt.hide_one_level();
});
$('#djDebug').on('click', '.djDebugPanelButton input[type=checkbox]', function() {
djdt.cookie.set($(this).attr('data-cookie'), $(this).prop('checked') ? 'on' : 'off', {
Expand Down Expand Up @@ -82,11 +81,6 @@
var message = '<div class="djDebugPanelTitle"><a class="djDebugClose djDebugBack" href=""></a><h3>'+xhr.status+': '+xhr.statusText+'</h3></div>';
$('#djDebugWindow').html(message).show();
});

$('#djDebugWindow').on('click', 'a.djDebugBack', function(event) {
event.preventDefault();
$(this).parent().parent().hide();
});
});

// Used by the cache, profiling and SQL panels
Expand Down Expand Up @@ -166,50 +160,27 @@
}
});
$(document).on('close.djDebug', function() {
// If a sub-panel is open, close that
if ($('#djDebugWindow').is(':visible')) {
$('#djDebugWindow').hide();
return;
}
// If a panel is open, close that
if ($('.djdt-panelContent').is(':visible')) {
$('.djdt-panelContent').hide();
$('#djDebugToolbar li').removeClass('djdt-active');
return;
}
// Otherwise, just minimize the toolbar
if ($('#djDebugToolbar').is(':visible')) {
djdt.hide_toolbar(true);
return;
}
djdt.hide_one_level();
});
if (djdt.cookie.get('djdt') == 'hide') {
djdt.hide_toolbar(false);
} else {
djdt.show_toolbar(false);
}
$('#djDebug .djDebugHoverable').on('hover', function(){
$(this).addClass('djDebugHover');
}, function(){
$(this).removeClass('djDebugHover');
});
djdt.isReady = true;
$.each(djdt.events.ready, function(_, callback){
callback(djdt);
});
},
close: function() {
$(document).trigger('close.djDebug');
return false;
},
hide_toolbar: function(setCookie) {
// close any sub panels
hide_panels: function() {
$('#djDebugWindow').hide();
// close all panels
$('.djdt-panelContent').hide();
$('#djDebugToolbar li').removeClass('djdt-active');
// finally close toolbar
},
hide_toolbar: function(setCookie) {
djdt.hide_panels();
$('#djDebugToolbar').hide('fast');

var handle = $('#djDebugToolbarHandle');
handle.show();
// set handle position
Expand All @@ -218,20 +189,31 @@
handleTop = Math.min(handleTop, window.innerHeight - handle.outerHeight() - 10);
handle.css({top: handleTop + 'px'});
}

// Unbind keydown
$(document).off('keydown.djDebug');

if (setCookie) {
djdt.cookie.set('djdt', 'hide', {
path: '/',
expires: 10
});
}
},
hide_one_level: function() {
if ($('#djDebugWindow').is(':visible')) {
$('#djDebugWindow').hide();
} else if ($('.djdt-panelContent').is(':visible')) {
djdt.hide_panels();
} else {
djdt.hide_toolbar(true);
}
},
show_toolbar: function(animate) {
// Set up keybindings
$(document).on('keydown.djDebug', function(e) {
if (e.keyCode == 27) {
djdt.close();
djdt.hide_one_level();
}
});
$('#djDebugToolbarHandle').hide();
Expand Down Expand Up @@ -296,7 +278,7 @@
$.extend(publicAPI, {
show_toolbar: djdt.show_toolbar,
hide_toolbar: djdt.hide_toolbar,
close: djdt.close,
close: djdt.hide_one_level,
cookie: djdt.cookie,
applyStyle: djdt.applyStyle
});
Expand Down
5 changes: 0 additions & 5 deletions debug_toolbar/static/debug_toolbar/js/toolbar.sql.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,4 @@
(function ($) {
$('#djDebug a.djDebugToggle').on('click', function(event) {
event.preventDefault();
$(this).parent().find('.djDebugCollapsed').toggle();
$(this).parent().find('.djDebugUncollapsed').toggle();
});
djdt.applyStyle('background-color');
djdt.applyStyle('left');
djdt.applyStyle('width');
Expand Down
11 changes: 0 additions & 11 deletions debug_toolbar/static/debug_toolbar/js/toolbar.template.js
View file
Open in desktop

This file was deleted.

2 changes: 1 addition & 1 deletion debug_toolbar/templates/debug_toolbar/panels/cache.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ <h4>{% trans "Calls" %}</h4>
<td>{{ call.kwargs|escape }}</td>
<td>{{ call.backend }}</td>
</tr>
<tr class="djUnselected djDebugHoverable {% cycle 'djDebugOdd' 'djDebugEven' %} djToggleDetails_{{ forloop.counter }}" id="cacheDetails_{{ forloop.counter }}">
<tr class="djUnselected {% cycle 'djDebugOdd' 'djDebugEven' %} djToggleDetails_{{ forloop.counter }}" id="cacheDetails_{{ forloop.counter }}">
<td colspan="1"></td>
<td colspan="5"><pre class="djdt-stack">{{ call.trace }}</pre></td>
</tr>
Expand Down
4 changes: 2 additions & 2 deletions debug_toolbar/templates/debug_toolbar/panels/sql.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
</thead>
<tbody>
{% for query in queries %}
<tr class="djDebugHoverable {% cycle 'djDebugOdd' 'djDebugEven' %}{% if query.is_slow %} djDebugRowWarning{% endif %}{% if query.starts_trans %} djDebugStartTransaction{% endif %}{% if query.ends_trans %} djDebugEndTransaction{% endif %}{% if query.in_trans %} djDebugInTransaction{% endif %}" id="sqlMain_{{ forloop.counter }}">
<tr class="{% cycle 'djDebugOdd' 'djDebugEven' %}{% if query.is_slow %} djDebugRowWarning{% endif %}{% if query.starts_trans %} djDebugStartTransaction{% endif %}{% if query.ends_trans %} djDebugEndTransaction{% endif %}{% if query.in_trans %} djDebugInTransaction{% endif %}" id="sqlMain_{{ forloop.counter }}">
<td class="djdt-color"><span data-background-color="rgb({{ query.rgb_color|join:", " }})">&#160;</span></td>
<td class="djdt-toggle">
<a class="djToggleSwitch" data-toggle-name="sqlMain" data-toggle-id="{{ forloop.counter }}" data-toggle-open="+" data-toggle-close="-" href="">+</a>
Expand Down Expand Up @@ -66,7 +66,7 @@
{% endif %}
</td>
</tr>
<tr class="djUnselected djDebugHoverable {% cycle 'djDebugOdd' 'djDebugEven' %}{% if query.is_slow %} djDebugRowWarning{% endif %} djToggleDetails_{{ forloop.counter }}" id="sqlDetails_{{ forloop.counter }}">
<tr class="djUnselected {% cycle 'djDebugOdd' 'djDebugEven' %}{% if query.is_slow %} djDebugRowWarning{% endif %} djToggleDetails_{{ forloop.counter }}" id="sqlDetails_{{ forloop.counter }}">
<td colspan="2"></td>
<td colspan="4">
<div class="djSQLDetailsDiv">
Expand Down
14 changes: 8 additions & 6 deletions debug_toolbar/templates/debug_toolbar/panels/templates.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,10 @@ <h4>{% blocktrans count templates|length as template_count %}Template{% plural %
<dd><samp>{{ template.template.origin_name|addslashes }}</samp></dd>
{% if template.context %}
<dd>
<div class="djTemplateShowContextDiv"><a class="djTemplateShowContext"><span class="toggleArrow">&#x25B6;</span> {% trans "Toggle context" %}</a></div>
<div class="djTemplateHideContextDiv djdt-hidden"><code>{{ template.context }}</code></div>
<details>
<summary>{% trans "Toggle context" %}</summary>
<code class="djTemplateContext">{{ template.context }}</code>
</details>
</dd>
{% endif %}
{% endfor %}
Expand All @@ -34,13 +36,13 @@ <h4>{% blocktrans count context_processors|length as context_processors_count %}
{% for key, value in context_processors.items %}
<dt><strong>{{ key|escape }}</strong></dt>
<dd>
<div class="djTemplateShowContextDiv"><a class="djTemplateShowContext"><span class="toggleArrow">&#x25B6;</span> {% trans "Toggle context" %}</a></div>
<div class="djTemplateHideContextDiv djdt-hidden"><code>{{ value|escape }}</code></div>
<details>
<summary>{% trans "Toggle context" %}</summary>
<code class="djTemplateContext">{{ value|escape }}</code>
</details>
</dd>
{% endfor %}
</dl>
{% else %}
<p>{% trans "None" %}</p>
{% endif %}

<script src="{% static 'debug_toolbar/js/toolbar.template.js' %}"></script>