1
0
mirror of https://github.com/chinchang/web-maker.git synced 2025-07-29 17:50:09 +02:00

call setPreviewContent only when required instead of componentUpdate callback

This commit is contained in:
Kushagra Gour
2018-06-02 11:11:00 +05:30
parent 652b0a727d
commit 2c42238f7f
2 changed files with 12 additions and 11 deletions

View File

@@ -2,7 +2,7 @@ import { h, Component } from 'preact';
import UserCodeMirror from './UserCodeMirror.jsx'; import UserCodeMirror from './UserCodeMirror.jsx';
import { computeHtml, computeCss, computeJs } from '../computes'; import { computeHtml, computeCss, computeJs } from '../computes';
import { HtmlModes, CssModes, JsModes } from '../codeModes'; import { HtmlModes, CssModes, JsModes } from '../codeModes';
import { log } from '../utils';
const BASE_PATH = chrome.extension || window.DEBUG ? '/' : '/app'; const BASE_PATH = chrome.extension || window.DEBUG ? '/' : '/app';
export default class ContentWrap extends Component { export default class ContentWrap extends Component {
@@ -256,7 +256,7 @@ export default class ContentWrap extends Component {
css: this.cmCodes.css, css: this.cmCodes.css,
js: this.cmCodes.js js: this.cmCodes.js
}; };
// utils.log('🔎 setPreviewContent', isForced); log('🔎 setPreviewContent', isForced);
const targetFrame = this.detachedWindow const targetFrame = this.detachedWindow
? this.detachedWindow.document.querySelector('iframe') ? this.detachedWindow.document.querySelector('iframe')
: this.frame; : this.frame;
@@ -295,7 +295,7 @@ export default class ContentWrap extends Component {
this.cm.html.setValue(this.cmCodes.html || ''); this.cm.html.setValue(this.cmCodes.html || '');
this.cm.css.setValue(this.cmCodes.css || ''); this.cm.css.setValue(this.cmCodes.css || '');
this.cm.js.setValue(this.cmCodes.js || ''); this.cm.js.setValue(this.cmCodes.js || '');
this.setPreviewContent(true); // this.setPreviewContent(true);
// console.log('componentdidupdate', this.props.currentItem); // console.log('componentdidupdate', this.props.currentItem);
} }
componentDidMount() { componentDidMount() {

View File

@@ -194,7 +194,7 @@ export default class App extends Component {
layoutMode: this.state.currentLayoutMode layoutMode: this.state.currentLayoutMode
}); });
this.refreshEditor(); this.refreshEditor();
// alertsService.add('New item created'); alertsService.add('New item created');
} }
setCurrentItem(item) { setCurrentItem(item) {
this.state.currentItem = item; this.state.currentItem = item;
@@ -329,7 +329,7 @@ export default class App extends Component {
event.keyCode === 53 event.keyCode === 53
) { ) {
event.preventDefault(); event.preventDefault();
// scope.setPreviewContent(true, true); this.contentWrap.setPreviewContent(true, true);
trackEvent('ui', 'previewKeyboardShortcut'); trackEvent('ui', 'previewKeyboardShortcut');
} else if ((event.ctrlKey || event.metaKey) && event.keyCode === 79) { } else if ((event.ctrlKey || event.metaKey) && event.keyCode === 79) {
// Ctrl/⌘ + O // Ctrl/⌘ + O
@@ -381,7 +381,7 @@ export default class App extends Component {
var blob = new Blob([fileContent], { type: 'text/html;charset=UTF-8' }); var blob = new Blob([fileContent], { type: 'text/html;charset=UTF-8' });
utils.downloadFile(fileName, blob); utils.downloadFile(fileName, blob);
// trackEvent('fn', 'saveFileComplete'); trackEvent('fn', 'saveFileComplete');
}); });
} }
@@ -400,7 +400,8 @@ export default class App extends Component {
this.setState({ this.setState({
currentItem: { ...this.state.currentItem } currentItem: { ...this.state.currentItem }
}); });
// alertsService.add('Libraries updated.'); this.contentWrap.setPreviewContent(true);
alertsService.add('Libraries updated.');
} }
updateExternalLibCount() { updateExternalLibCount() {
// Calculate no. of external libs // Calculate no. of external libs
@@ -435,12 +436,12 @@ export default class App extends Component {
document.body.classList.add('layout-' + mode); document.body.classList.add('layout-' + mode);
// resetSplitting(); // resetSplitting();
// scope.setPreviewContent(true); this.contentWrap.setPreviewContent(true);
} }
layoutBtnClickHandler(layoutId) { layoutBtnClickHandler(layoutId) {
// saveSetting('layoutMode', mode); // saveSetting('layoutMode', mode);
// trackEvent('ui', 'toggleLayoutClick', mode); trackEvent('ui', 'toggleLayoutClick', mode);
this.toggleLayout(layoutId); this.toggleLayout(layoutId);
} }
saveSetting(setting, value) { saveSetting(setting, value) {
@@ -565,7 +566,7 @@ export default class App extends Component {
// We always save locally so that it gets fetched // We always save locally so that it gets fetched
// faster on future loads. // faster on future loads.
db.sync.set(obj, function() { db.sync.set(obj, function() {
// alertsService.add('Setting saved'); alertsService.add('Setting saved');
}); });
if (window.user) { if (window.user) {
window.db.getDb().then(remoteDb => { window.db.getDb().then(remoteDb => {
@@ -581,7 +582,7 @@ export default class App extends Component {
.catch(error => utils.log(error)); .catch(error => utils.log(error));
}); });
} }
// trackEvent('ui', 'updatePref-' + settingName, prefs[settingName]); trackEvent('ui', 'updatePref-' + settingName, prefs[settingName]);
} }
const prefs = this.state.prefs; const prefs = this.state.prefs;