From 02cc0063a0afc3a98f1cd25969edc7c81ee680ab Mon Sep 17 00:00:00 2001 From: Mathieu Santostefano Date: Tue, 27 Jun 2017 12:25:21 +0200 Subject: [PATCH 1/3] Allow to select/deselect all translation keys at once --- Resources/public/js/symfonyProfiler.js | 9 +++++++++ Resources/views/SymfonyProfiler/translation.html.twig | 10 ++++++---- 2 files changed, 15 insertions(+), 4 deletions(-) diff --git a/Resources/public/js/symfonyProfiler.js b/Resources/public/js/symfonyProfiler.js index 4f5069b9..2b5849d5 100644 --- a/Resources/public/js/symfonyProfiler.js +++ b/Resources/public/js/symfonyProfiler.js @@ -35,6 +35,7 @@ function syncMessage(key) { { method: 'POST' } ); } + function syncAll() { Sfjs.request( translationSyncAllUrl, @@ -98,6 +99,14 @@ function cancelEditForm(key, orgMessage) { el[0].innerHTML = orgMessage; } +function toggleCheckAll(controller) { + var checkboxes = document.querySelectorAll('.translation-key-checkbox'); + + for (var i = 0; i < checkboxes.length; i++) { + checkboxes[i].checked = controller.checked; + } +} + var serializeQueryString = function(obj, prefix) { var str = []; for(var p in obj) { diff --git a/Resources/views/SymfonyProfiler/translation.html.twig b/Resources/views/SymfonyProfiler/translation.html.twig index bf22703a..205d2303 100644 --- a/Resources/views/SymfonyProfiler/translation.html.twig +++ b/Resources/views/SymfonyProfiler/translation.html.twig @@ -101,7 +101,7 @@

There are no messages of this category.

{% else %} - {{ translation_helper.render_table(messages_missing) }} + {{ translation_helper.render_table(messages_missing, true) }} {% endif %} @@ -117,11 +117,13 @@ {% include "@Translation/SymfonyProfiler/javascripts.html.twig" %} {% endblock %} -{% macro render_table(messages) %} +{% macro render_table(messages, checkedByDefault = false) %} - + @@ -135,7 +137,7 @@ - +
+ + Locale Domain Times used
{% if message.state == constant('Symfony\\Component\\Translation\\DataCollectorTranslator::MESSAGE_MISSING') %} - + {% else %} {% endif %} From eba59e24fa6232ded61ad2f4e5a2d046f8565399 Mon Sep 17 00:00:00 2001 From: Mathieu Santostefano Date: Tue, 27 Jun 2017 14:09:51 +0200 Subject: [PATCH 2/3] Add loaders during ajax requests --- Resources/public/css/images/loader.svg | 33 +++++++++++++ Resources/public/js/symfonyProfiler.js | 46 +++++++++++++++---- .../SymfonyProfiler/translation.html.twig | 11 +++-- 3 files changed, 77 insertions(+), 13 deletions(-) create mode 100755 Resources/public/css/images/loader.svg diff --git a/Resources/public/css/images/loader.svg b/Resources/public/css/images/loader.svg new file mode 100755 index 00000000..7c713340 --- /dev/null +++ b/Resources/public/css/images/loader.svg @@ -0,0 +1,33 @@ + + + + + + + + + + + + + + + diff --git a/Resources/public/js/symfonyProfiler.js b/Resources/public/js/symfonyProfiler.js index 2b5849d5..7067bc8d 100644 --- a/Resources/public/js/symfonyProfiler.js +++ b/Resources/public/js/symfonyProfiler.js @@ -16,11 +16,13 @@ function clearState(key) { } function syncMessage(key) { + var el = document.getElementById(key).getElementsByClassName("translation"); + el[0].innerHTML = getLoaderHTML(); + Sfjs.request( translationSyncUrl, function(xhr) { // Success - var el = document.getElementById(key).getElementsByClassName("translation"); el[0].innerHTML = xhr.responseText; if (xhr.responseText !== "") { @@ -29,7 +31,7 @@ function syncMessage(key) { }, function(xhr) { // Error - console.log("Syncing message "+key + " - Error"); + el[0].innerHTML = "Error - Syncing message " + key + ""; }, serializeQueryString({message_id: key}), { method: 'POST' } @@ -37,16 +39,18 @@ function syncMessage(key) { } function syncAll() { + var el = document.getElementById("top-result-area"); + el[0].innerHTML = getLoaderHTML(); + Sfjs.request( translationSyncAllUrl, function(xhr) { // Success - var el = document.getElementById("top-result-area"); el.innerHTML = xhr.responseText; }, function(xhr) { // Error - console.log("Syncing message "+key + " - Error"); + el[0].innerHTML = "Error - Syncing all messages"; }, {}, { method: 'POST' } @@ -54,29 +58,31 @@ function syncAll() { } function getEditForm(key) { + var el = document.getElementById(key).getElementsByClassName("translation"); + el[0].innerHTML = getLoaderHTML(); Sfjs.request( translationEditUrl + "?" + serializeQueryString({message_id: key}), function(xhr) { // Success - var el = document.getElementById(key).getElementsByClassName("translation"); el[0].innerHTML = xhr.responseText; }, function(xhr) { // Error - console.log("Getting edit form "+key+" - Error"); + el[0].innerHTML = "Error - Getting edit form " + key + ""; }, { method: 'GET' } ); } function saveEditForm(key, translation) { + var el = document.getElementById(key).getElementsByClassName("translation"); + el[0].innerHTML = getLoaderHTML(); Sfjs.request( translationEditUrl, function(xhr) { // Success - var el = document.getElementById(key).getElementsByClassName("translation"); el[0].innerHTML = xhr.responseText; if (xhr.responseText !== "") { @@ -85,7 +91,7 @@ function saveEditForm(key, translation) { }, function(xhr) { // Error - console.log("Saving edit form "+key +" - Error"); + el[0].innerHTML = "Error - Saving edit form " + key + ""; }, serializeQueryString({message_id: key, translation:translation}), { method: 'POST' } @@ -107,6 +113,12 @@ function toggleCheckAll(controller) { } } +function getLoaderHTML() { + var loader = document.getElementById('svg-loader'); + + return loader.outerHTML; +} + var serializeQueryString = function(obj, prefix) { var str = []; for(var p in obj) { @@ -131,11 +143,14 @@ var serializeQueryString = function(obj, prefix) { var saveTranslations = function(form) { "use strict"; + if (typeof(form.translationKey) === 'undefined') { return false; } + var inputs = form.translationKey; var selected = []; + if (!inputs.value) { for (var val in inputs) { if (inputs.hasOwnProperty(val) && inputs[val].value) { @@ -147,15 +162,26 @@ var saveTranslations = function(form) { } else if (inputs.checked) { selected.push(inputs.value); } + + var el = document.getElementById('translationResult'); + el.innerHTML = getLoaderHTML(); + el.classList.remove('label'); + el.classList.remove('status-error'); + el.classList.remove('status-success'); + Sfjs.request( form.action, function(xhr) { // Success - document.getElementById('translationResult').innerHTML = xhr.responseText; + el.classList.add('label'); + el.classList.add('status-success'); + el.innerHTML = xhr.responseText; }, function(xhr) { // Error - document.getElementById('translationResult').innerHTML = xhr.responseText; + el.classList.add('label'); + el.classList.add('status-error'); + el.innerHTML = xhr.responseText; }, serializeQueryString({selected: selected}), { method: 'POST' } diff --git a/Resources/views/SymfonyProfiler/translation.html.twig b/Resources/views/SymfonyProfiler/translation.html.twig index 205d2303..1177b7a4 100644 --- a/Resources/views/SymfonyProfiler/translation.html.twig +++ b/Resources/views/SymfonyProfiler/translation.html.twig @@ -47,6 +47,9 @@
+
@@ -107,12 +110,12 @@
+

+ -
-
{% include "@Translation/SymfonyProfiler/javascripts.html.twig" %} {% endblock %} @@ -163,7 +166,9 @@ {% endif %} 		{{ message.translation }} + {{ message.translation }} + {% spaceless %} Edit From 782056ed8d7c212d5fdb185d06d102be8ca233c9 Mon Sep 17 00:00:00 2001 From: Mathieu Santostefano Date: Tue, 27 Jun 2017 14:18:30 +0200 Subject: [PATCH 3/3] Add line in changelog --- Changelog.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/Changelog.md b/Changelog.md index 567df8bc..5114589c 100644 --- a/Changelog.md +++ b/Changelog.md @@ -2,6 +2,12 @@ The change log describes what is "Added", "Removed", "Changed" or "Fixed" between each release. +## 0.3.6 + +### Added + +- Improve UI/UX in Profiler (loader during AJAX requests, select/deselect all messages) + ## 0.3.5 ### Fixed