From 84bfa764f77b862fa186077899da40b102535f21 Mon Sep 17 00:00:00 2001
From: Kushagra Gour <chinchang457@gmail.com>
Date: Sun, 12 Mar 2017 20:30:24 +0530
Subject: [PATCH] show indentation size value besides the range slider

---
 src/index.html | 1 +
 src/script.js  | 7 ++++++-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/index.html b/src/index.html
index 70a7040..8b815de 100644
--- a/src/index.html
+++ b/src/index.html
@@ -311,6 +311,7 @@
 					</div>
 					<label class="line">
 						Indentation Size <input type="range" class="va-m ml-1" value="2" min="1" max="7" list="indentationSizeList" data-setting="indentSize" d-change="updateSetting">
+						<span id="indentationSizeValueEl"></span>
 						<datalist id="indentationSizeList">
 							<option>1</option>
 							<option>2</option>
diff --git a/src/script.js b/src/script.js
index 95d5494..91d9507 100644
--- a/src/script.js
+++ b/src/script.js
@@ -4,7 +4,7 @@ onboardModal, layoutBtn1, layoutBtn2, layoutBtn3, layoutBtn4, helpBtn, onboardMo
 addLibraryModal, addLibraryModal, notificationsBtn, notificationsModal, notificationsModal,
 notificationsModal, notificationsBtn, codepenBtn, saveHtmlBtn, saveBtn, settingsBtn,
 onboardModal, settingsModal, notificationsBtn, onboardShowInTabOptionBtn, editorThemeLinkTag,
-onboardDontShowInTabOptionBtn, TextareaAutoComplete, savedItemCountEl */
+onboardDontShowInTabOptionBtn, TextareaAutoComplete, savedItemCountEl, indentationSizeValueEl */
 /* eslint-disable no-extra-semi */
 ;(function (alertsService) {
 
@@ -1189,6 +1189,7 @@ onboardDontShowInTabOptionBtn, TextareaAutoComplete, savedItemCountEl */
 		$('[data-setting=cssMode]').value = prefs.cssMode;
 		$('[data-setting=jsMode]').value = prefs.jsMode;
 		$('[data-setting=indentSize]').value = prefs.indentSize;
+		indentationSizeValueEl.textContent = prefs.indentSize;
 		$('[data-setting=indentWith][value=' + (prefs.indentWith || 'spaces') + ']').checked = true;
 		$('[data-setting=isCodeBlastOn]').checked = prefs.isCodeBlastOn;
 		$('[data-setting=editorTheme]').value = prefs.editorTheme;
@@ -1217,6 +1218,10 @@ onboardDontShowInTabOptionBtn, TextareaAutoComplete, savedItemCountEl */
 		htmlCode.querySelector('.CodeMirror').style.fontSize = prefs.fontSize;
 		cssCode.querySelector('.CodeMirror').style.fontSize = prefs.fontSize;
 		jsCode.querySelector('.CodeMirror').style.fontSize = prefs.fontSize;
+
+		// Update indentation count when slider is updated
+		indentationSizeValueEl.textContent = $('[data-setting=indentSize]').value;
+
 		['html', 'js', 'css'].forEach((type) => {
 			scope.cm[type].setOption(
 				'indentWithTabs',