From 6a4b3c9cf908f4223e805bcadfeb2049f667436d Mon Sep 17 00:00:00 2001
From: tophf <tophf@gmx.com>
Date: Tue, 3 Jul 2018 10:12:36 +0300
Subject: [PATCH] show + and - on all applies-to items in standard editor

---
 edit/edit.css    |  9 +--------
 edit/sections.js | 47 +++++++++++++++++++++++++++++++----------------
 2 files changed, 32 insertions(+), 24 deletions(-)

diff --git a/edit/edit.css b/edit/edit.css
index 1c924bab..6890094b 100644
--- a/edit/edit.css
+++ b/edit/edit.css
@@ -405,13 +405,6 @@ body[data-match-highlight="selection"] .CodeMirror-selection-highlight-scrollbar
 .applies-to li:not(.applies-to-everything) > * {
   margin: 0 .2rem .5rem 0;
 }
-html:not(.usercss) .applies-to li .add-applies-to {
-  visibility: hidden;
-  text-align: left;
-}
-html:not(.usercss) .applies-to li:last-child .add-applies-to {
-  visibility: visible
-}
 .applies-to li .add-applies-to:first-child {
   margin-left: 1rem;
 }
@@ -905,4 +898,4 @@ html:not(.usercss) .usercss-only,
   #help-popup.big {
     left: 3rem;
   }
-}
\ No newline at end of file
+}
diff --git a/edit/sections.js b/edit/sections.js
index 5bee5a0e..77a0f61a 100644
--- a/edit/sections.js
+++ b/edit/sections.js
@@ -150,29 +150,44 @@ function addSection(event, section) {
   return div;
 }
 
-function addAppliesTo(list, name, value) {
-  const showingEverything = $('.applies-to-everything', list) !== null;
+// may be invoked as a DOM listener
+function addAppliesTo(list, type, value) {
+  let clickedItem;
+  if (this instanceof Node) {
+    clickedItem = this.closest('.applies-to-item');
+    list = this.closest('.applies-to-list');
+  }
+  const showingEverything = $('.applies-to-everything', list);
   // blow away 'Everything' if it's there
   if (showingEverything) {
     list.removeChild(list.firstChild);
   }
-  let e;
-  if (name) {
-    e = template.appliesTo.cloneNode(true);
-    $('[name=applies-type]', e).value = name;
-    $('[name=applies-value]', e).value = value;
-    $('.remove-applies-to', e).addEventListener('click', removeAppliesTo, false);
-  } else if (showingEverything || list.hasChildNodes()) {
-    e = template.appliesTo.cloneNode(true);
-    if (list.hasChildNodes()) {
-      $('[name=applies-type]', e).value = $('li:last-child [name="applies-type"]', list).value;
+  let item, toFocus;
+
+  // a section is added with known applies-to
+  if (type) {
+    item = template.appliesTo.cloneNode(true);
+    $('[name=applies-type]', item).value = type;
+    $('[name=applies-value]', item).value = value;
+    $('.remove-applies-to', item).addEventListener('click', removeAppliesTo);
+
+  // a "+" button was clicked
+  } else if (showingEverything || clickedItem) {
+    item = template.appliesTo.cloneNode(true);
+    toFocus = $('[name=applies-type]', item);
+    if (clickedItem) {
+      $('[name=applies-type]', item).value = $('[name="applies-type"]', clickedItem).value;
     }
-    $('.remove-applies-to', e).addEventListener('click', removeAppliesTo, false);
+    $('.remove-applies-to', item).addEventListener('click', removeAppliesTo);
+
+  // a global section is added
   } else {
-    e = template.appliesToEverything.cloneNode(true);
+    item = template.appliesToEverything.cloneNode(true);
   }
-  $('.add-applies-to', e).addEventListener('click', () => addAppliesTo(list));
-  list.appendChild(e);
+
+  $('.add-applies-to', item).addEventListener('click', addAppliesTo);
+  list.insertBefore(item, clickedItem && clickedItem.nextElementSibling);
+  if (toFocus) toFocus.focus();
 }
 
 function setupCodeMirror(sectionDiv, code, index) {