setting: preview wait time change setting

src/components/ContentWrap.jsx

@@ -25,7 +25,6 @@ export default class ContentWrap extends Component {
 		};
 
 		this.updateTimer = null;
-		this.updateDelay = 500;
 		this.htmlMode = HtmlModes.HTML;
 		this.jsMode = HtmlModes.HTML;
 		this.cssMode = CssModes.CSS;
@@ -124,7 +123,7 @@ export default class ContentWrap extends Component {
 					trackEvent('fn', 'usingPreview');
 				}
 			}
-		}, this.updateDelay);
+		}, this.props.prefs.previewDelay);
 	}
 
 	createPreviewFile(html, css, js) {

src/components/ContentWrapFiles.jsx

@@ -41,7 +41,6 @@ export default class ContentWrapFiles extends Component {
 
 		this.fileBuffers = {};
 		this.updateTimer = null;
-		this.updateDelay = 500;
 		this.htmlMode = HtmlModes.HTML;
 		this.prefs = {};
 		this.cmCodes = { html: props.currentItem.html, css: '', js: '' };
@@ -229,7 +228,7 @@ export default class ContentWrapFiles extends Component {
 					trackEvent('fn', 'usingPreview');
 				}
 			}
-		}, this.updateDelay);
+		}, this.props.prefs.previewDelay);
 	}
 
 	createPreviewFile() {

src/components/Settings.jsx

@@ -340,6 +340,25 @@ export default class Settings extends Component {
 						</HelpText>
 					</TabPanel>
 					<TabPanel label="Advanced">
+						<div>
+							<label class="line">
+								Preview refresh wait time
+								<div>
+									<input
+										type="number"
+										style="width:120px"
+										value={prefs.previewDelay}
+										onChange={e => this.updateSetting(e, 'previewDelay')}
+									/>{' '}
+									ms
+								</div>
+							</label>
+							<HelpText>
+								Once you stop typing, the preview waits for this much time
+								before getting updated. Too low value might choke your browser!
+							</HelpText>
+						</div>
+						<Divider />
 						<div>
 							<label class="line">
 								Maximum time allowed in a loop iteration
@@ -359,22 +378,24 @@ export default class Settings extends Component {
 								stopped.
 							</HelpText>
 						</div>
-						<Divider />
-
-						<div>
+						{/*
+							<Divider />
+							
+							<div>
 							<label class="line">
-								Language
-								<select
-									value={prefs.lang}
-									onChange={e => this.updateSetting(e, 'lang')}
-								>
-									<option value="en">English</option>
-									<option value="hi">Hindi</option>
-									<option value="sa">Sanskrit</option>
-									<option value="es">Spanish</option>
-								</select>
+							Language
+							<select
+							value={prefs.lang}
+							onChange={e => this.updateSetting(e, 'lang')}
+							>
+							<option value="en">English</option>
+							<option value="hi">Hindi</option>
+							<option value="sa">Sanskrit</option>
+							<option value="es">Spanish</option>
+							</select>
 							</label>
-						</div>
+							</div>
+						*/}
 					</TabPanel>
 				</Tabs>
 			</div>

src/components/app.jsx

@@ -135,7 +135,8 @@ export default class App extends Component {
 			isJs13kModeOn: false,
 			autoCloseTags: true,
 			lang: 'en',
-			isMonacoEditorOn: false
+			isMonacoEditorOn: false,
+			previewDelay: 500
 		};
 		this.prefs = {};