Refactor IDE index to support EE specific code

**Why?**

- The web terminal feature is EE specific and will need to inject
  some specific options / functions into certain components.
This commit is contained in:
Paul Slaughter 2018-09-24 16:37:04 -05:00
parent 62dde35069
commit d9bb488a1e
2 changed files with 31 additions and 9 deletions

View file

@ -8,9 +8,21 @@ import { convertPermissionToBoolean } from '../lib/utils/common_utils';
Vue.use(Translate);
export function initIde(el) {
/**
* Initialize the IDE on the given element.
*
* @param {Element} el - The element that will contain the IDE.
* @param {Object} options - Extra options for the IDE (Used by EE).
* @param {(e:Element) => Object} options.extraInitialData -
* Function that returns extra properties to seed initial data.
*/
export function initIde(el, options = {}) {
if (!el) return null;
const {
extraInitialData = () => ({}),
} = options;
return new Vue({
el,
store,
@ -32,6 +44,7 @@ export function initIde(el) {
});
this.setInitialData({
clientsidePreviewEnabled: convertPermissionToBoolean(el.dataset.clientsidePreviewEnabled),
...extraInitialData(el),
});
},
methods: {
@ -52,3 +65,18 @@ export function resetServiceWorkersPublicPath() {
const webpackAssetPath = `${relativeRootPath}/assets/webpack/`;
__webpack_public_path__ = webpackAssetPath; // eslint-disable-line camelcase
}
/**
* Start the IDE.
*
* @param {Objects} options - Extra options for the IDE (Used by EE).
*/
export function startIde(options) {
document.addEventListener('DOMContentLoaded', () => {
const ideElement = document.getElementById('ide');
if (ideElement) {
resetServiceWorkersPublicPath();
initIde(ideElement, options);
}
});
}

View file

@ -1,9 +1,3 @@
import { initIde, resetServiceWorkersPublicPath } from '~/ide/index';
import { startIde } from '~/ide/index';
document.addEventListener('DOMContentLoaded', () => {
const ideElement = document.getElementById('ide');
if (ideElement) {
resetServiceWorkersPublicPath();
initIde(ideElement);
}
});
startIde();