Skip to content

Instantly share code, notes, and snippets.

@jpommerening
Last active June 26, 2017 11:56
Show Gist options
  • Save jpommerening/d6bc79f5f954b1608eb13f9c0a8a410f to your computer and use it in GitHub Desktop.
Save jpommerening/d6bc79f5f954b1608eb13f9c0a8a410f to your computer and use it in GitHub Desktop.
laxar-developer-tools-widget
const context = require.context('!!file-loader?context=' + __dirname + '/content/&name=devtools/[path][name].[ext]!./content/var/dist/', true, /\.(css|eof|js|png|svg|ttf|woff2?)(\.map)?$/);
const index = require('!!file-loader?context=' + __dirname + '/content/&name=devtools/[path][name].[ext]!./content/index.html');
const keys = context.keys();
module.exports = {
index: index,
scripts: keys.filter(file => (file.substr(-3) === '.js')).map(context),
styles: keys.filter(file => (file.substr(-4) === '.css')).map(context)
};
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LaxarJS Developer Tools</title>
<link rel="icon" sizes="16x16" href="http://laxarjs.org/wp-content/themes/laxar/img/favicons/others/favicon-16.png">
<link rel="icon" sizes="32x32" href="http://laxarjs.org/wp-content/themes/laxar/img/favicons/others/favicon-32.png">
<!--[if IE]><link rel="shortcut icon" href="http://laxarjs.org/wp-content/themes/laxar/img/favicons/ie/favicon.ico"><![endif]-->
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="http://laxarjs.org/wp-content/themes/laxar/img/favicons/ie10+/tileicon.png">
</head>
<body>
<div data-ax-page></div>
</body>
</html>
import contentBundle from './content-bundle';
function openContentWindow() {
var settings = {
resizable: 'yes',
scrollbars: 'yes',
status: 'yes',
width: 1280,
height: 700
};
var settingsString = Object.keys( settings ).map( function( key ) {
return key + '=' + settings[ key ];
} ).join( ',' );
if( !contentWindow || contentWindow.closed ) {
contentWindow = window.open( contentBundle.index, 'axDeveloperTools', settingsString );
}
contentWindow.addEventListener('load', () => {
const { document } = contentWindow;
const elements = [
...contentBundle.styles.map(script => {
const element = document.createElement('link');
element.rel = 'stylesheet';
element.href = script;
return element;
}),
...contentBundle.scripts.map(script => {
const element = document.createElement('script');
element.src= script;
return element;
})
];
elements.forEach(element => {
document.body.appendChild(element);
});
});
try {
contentWindow.focus();
}
catch( e ) {
log.warn(
'AxDeveloperToolsWidget: Popup was blocked. Unblock in browser, or use the "button" feature.'
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment