Working on editor

Author: andrewbrg

src/css/main.css

@@ -157,11 +157,6 @@ input.cmn-tgl-rnd-flt:checked + label:after {
     height: 100%;
 }
 
-.editor {
-    font-family: 'Roboto Mono', monospace;
-    font-size: 1.25rem !important;
-}
-
 .ace_gutter-cell {
     font-size: 1.1rem !important;
 }

src/html/modals/editor/appearance.html

@@ -9,16 +9,16 @@
                     </label>
                     <div>
                         <select data-action="ide-setting" data-option="fontSize">
-                            <option value="11">11</option>
-                            <option value="12">12</option>
-                            <option value="13">13</option>
-                            <option value="14">14</option>
-                            <option value="15">15</option>
-                            <option value="16">16</option>
-                            <option value="17">17</option>
-                            <option value="18">18</option>
-                            <option value="19">19</option>
-                            <option value="20">20</option>
+                            <option value="11pt">11</option>
+                            <option value="12pt">12</option>
+                            <option value="13pt">13</option>
+                            <option value="14pt">14</option>
+                            <option value="15pt">15</option>
+                            <option value="16pt">16</option>
+                            <option value="17pt">17</option>
+                            <option value="18pt">18</option>
+                            <option value="19pt">19</option>
+                            <option value="20pt">20</option>
                         </select>
                     </div>
                 </div>
@@ -28,10 +28,27 @@
                 <div class="form-group">
                     <label>
                         <strong>Font family</strong><br/>
-                        <span>Your preferred font-family</span>
+                        <span>Code editor font</span>
                     </label>
                     <div>
-                        <select data-action="ide-setting" data-option="fontFamily"></select>
+                        <select data-action="ide-setting" data-option="fontFamily">
+                            <option value="Anonymous Pro">Anonymous Pro</option>
+                            <option value="Architects Daughter">Architects Daughter</option>
+                            <option value="Cutive Mono">Cutive Mono</option>
+                            <option value="Dekko">Dekko</option>
+                            <option value="Inconsolata">Inconsolata</option>
+                            <option value="Kalam">Kalam</option>
+                            <option value="Montserrat">Montserrat</option>
+                            <option value="Open Sans">Open Sans</option>
+                            <option value="Overpass Mono">Overpass Mono</option>
+                            <option value="PT Sans">PT Sans</option>
+                            <option value="Patrick Hand">Patrick Hand</option>
+                            <option value="Roboto Mono">Roboto Mono</option>
+                            <option value="Source Code Pro">Source Code Pro</option>
+                            <option value="Space Mono">Space Mono</option>
+                            <option value="Ubuntu Mono">Ubuntu Mono</option>
+                            <option value="VT323">VT323</option>
+                        </select>
                     </div>
                 </div>
             </div>

src/js/handlers/editors.js

@@ -10,6 +10,7 @@ var EditorsHandler = function () {
     this.newFileDropdownEntry = '<a class="dropdown-item action-add-tab" href="#"></a>';
     this.defaultFileName      = 'untitled';
     this.defaultFileExt       = 'js';
+    this.defaultFont          = 'Roboto Mono';
     this.undefinedFileExt     = 'text';
     this.undefinedFileIcon    = 'icon-html';
 
@@ -30,6 +31,7 @@ var EditorsHandler = function () {
 
         aceEditor.setTheme('ace/theme/monokai');
         aceEditor.setOptions({
+            fontFamily: this.defaultFont,
             enableSnippets: true,
             enableLiveAutocompletion: true,
             enableBasicAutocompletion: true

src/js/handlers/ide.settings.js

@@ -22,7 +22,7 @@ var IdeSettingsHandler = function () {
 
             obj[that.parentKey][key] = val;
             chrome.storage.sync.set(obj);
-
+            console.log('Saving: ' + key + ' with ' + val);
         });
     };