diff --git a/src/index.html b/src/index.html
index e56e129..5128374 100644
--- a/src/index.html
+++ b/src/index.html
@@ -67,16 +67,16 @@
 						Add library <span id="js-external-lib-count" style="display:none;" class="count-label"></span>
 					</a>
 
-					<a id="newBtn" class="flex  flex-v-center hint--bottom-left" aria-label="Start a new creation">
+					<a class="flex  flex-v-center hint--bottom-left" aria-label="Start a new creation" d-click="onNewBtnClick">
 						<svg style="vertical-align:middle;width:14px;height:14px" viewBox="0 0 24 24">
     						<path d="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z" />
 						</svg>New
 					</a>
-					<a id="saveBtn" class="flex  flex-v-center hint--bottom-left" aria-label="Save current creation (Ctrl/⌘ + S)">
+					<a id="saveBtn" class="flex  flex-v-center hint--bottom-left" aria-label="Save current creation (Ctrl/⌘ + S)" d-click="onSaveBtnClick">
 						<svg style="vertical-align:middle;width:14px;height:14px" viewBox="0 0 24 24">
     						<path d="M15,9H5V5H15M12,19A3,3 0 0,1 9,16A3,3 0 0,1 12,13A3,3 0 0,1 15,16A3,3 0 0,1 12,19M17,3H5C3.89,3 3,3.9 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V7L17,3Z" />
 						</svg>Save</a>
-					<a id="openBtn" class="flex  flex-v-center  hint--bottom-left" aria-label="Open a saved creation (Ctrl/⌘ + O)">
+					<a class="flex  flex-v-center  hint--bottom-left" aria-label="Open a saved creation (Ctrl/⌘ + O)" d-click="onOpenBtnClick">
 						<svg style="width:14px;height:14px;vertical-align:middle;" viewBox="0 0 24 24">
 						    <path d="M13,9V3.5L18.5,9M6,2C4.89,2 4,2.89 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2H6Z" />
 						</svg>Open
diff --git a/src/script.js b/src/script.js
index 0d8030c..add5460 100644
--- a/src/script.js
+++ b/src/script.js
@@ -2,7 +2,7 @@
 /* global layoutBtn1, layoutBtn2, layoutBtn3, helpModal, notificationsModal, addLibraryModal,
 onboardModal, layoutBtn1, layoutBtn2, layoutBtn3, layoutBtn4, helpBtn, onboardModal, onboardModal,
 addLibraryModal, addLibraryModal, notificationsBtn, notificationsModal, notificationsModal,
-notificationsModal, notificationsBtn, codepenBtn, saveHtmlBtn, openBtn, saveBtn, newBtn,
+notificationsModal, notificationsBtn, codepenBtn, saveHtmlBtn, saveBtn,
 settingsBtn, onboardModal, settingsModal, notificationsBtn, onboardShowInTabOptionBtn,
 onboardDontShowInTabOptionBtn, TextareaAutoComplete */
 /* eslint-disable no-extra-semi */
@@ -1170,9 +1170,29 @@ onboardDontShowInTabOptionBtn, TextareaAutoComplete */
 			scope.cm[type].setOption('tabSize', $('[data-setting=indentSize]').value);
 			scope.cm[type].setOption('theme', $('[data-setting=editorTheme]').value);
 			scope.cm[type].setOption('keyMap', $('[data-setting=keymap]').value);
+			scope.cm[type].setOption('keyMap', $('[data-setting=keymap]').value);
+			scope.cm[type].refresh();
 		});
 	};
 
+	scope.onNewBtnClick = function () {
+		trackEvent('ui', 'newBtnClick');
+		if (unsavedEditCount) {
+			var shouldDiscard = confirm('You have unsaved changes. Do you still want to create something new?');
+			if (shouldDiscard) {
+				createNewItem();
+			}
+		}
+	};
+	scope.onOpenBtnClick = function () {
+		trackEvent('ui', 'openBtnClick');
+		openSavedItemsPane();
+	};
+	scope.onSaveBtnClick = function () {
+		trackEvent('ui', 'saveBtnClick', currentItem.id ? 'saved' : 'new');
+		saveItem();
+	};
+
 	function compileNodes() {
 		var nodes = [].slice.call($all('[d-click]'));
 		nodes.forEach(function (el) {
@@ -1261,18 +1281,7 @@ onboardDontShowInTabOptionBtn, TextareaAutoComplete */
 			saveFile();
 			trackEvent('ui', 'saveHtmlClick');
 		});
-		utils.onButtonClick(openBtn, function () {
-			openSavedItemsPane();
-			trackEvent('ui', 'openBtnClick');
-		});
-		utils.onButtonClick(saveBtn, function () {
-			trackEvent('ui', 'saveBtnClick', currentItem.id ? 'saved' : 'new');
-			saveItem();
-		});
-		utils.onButtonClick(newBtn, function () {
-			createNewItem();
-			trackEvent('ui', 'newBtnClick');
-		});
+
 		utils.onButtonClick(savedItemsPaneCloseBtn, toggleSavedItemsPane);
 		utils.onButtonClick(savedItemsPane, function (e) {
 			if (e.target.classList.contains('js-saved-item-tile')) {