KEYCLOAK-10074: Account Console Performance

This commit is contained in:
Stan Silvert 2019-04-18 08:29:01 -04:00 committed by Bruno Oliveira da Silva
parent e5092bb617
commit e52be73d41
5 changed files with 1289 additions and 80 deletions

View file

@ -9,6 +9,17 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<script>
<#if properties.developmentMode?has_content && properties.developmentMode == "true">
var developmentMode = true;
var reactRuntime = 'react.development.js';
var reactDOMRuntime = 'react-dom.development.js';
var reactRouterRuntime = 'react-router-dom.js';
<#else>
var developmentMode = false;
var reactRuntime = 'react.production.min.js';
var reactDOMRuntime = 'react-dom.production.min.js';
var reactRouterRuntime = 'react-router-dom.min.js';
</#if>
var authUrl = '${authUrl}';
var baseUrl = '${baseUrl}';
var realm = '${realm.name}';
@ -65,9 +76,6 @@
</#list>
</#if>
<!-- TODO: We should save these css and js into variables and then load in
main.ts for better performance. These might be loaded twice.
-->
<#if properties.scripts?has_content>
<#list properties.scripts?split(' ') as script>
<script type="text/javascript" src="${resourceUrl}/${script}"></script>
@ -80,21 +88,19 @@
<script>
var keycloak = Keycloak('${authUrl}/realms/${realm.name}/account/keycloak.json');
keycloak.init({onLoad: 'check-sso'}).success(function(authenticated) {
loadjs("/node_modules/react/umd/react.development.js", function() {
loadjs("/node_modules/react-dom/umd/react-dom.development.js", function() {
loadjs("/node_modules/systemjs/dist/system.src.js", function() {
loadjs("/systemjs.config.js", function() {
System.import('${resourceUrl}/Main.js').catch(function (err) {
console.error(err);
});
if (!keycloak.authenticated) {
document.getElementById("signInButton").style.display='inline';
document.getElementById("signInLink").style.display='inline';
} else {
document.getElementById("signOutButton").style.display='inline';
document.getElementById("signOutLink").style.display='inline';
}
});
toggleReact();
if (!keycloak.authenticated) {
document.getElementById("signInButton").style.display='inline';
document.getElementById("signInLink").style.display='inline';
} else {
document.getElementById("signOutButton").style.display='inline';
document.getElementById("signOutLink").style.display='inline';
}
loadjs("/node_modules/systemjs/dist/system.src.js", function() {
loadjs("/systemjs.config.js", function() {
System.import('${resourceUrl}/Main.js').catch(function (err) {
console.error(err);
});
});
});
@ -124,7 +130,7 @@
<div class="pf-c-background-image">
<svg xmlns="http://www.w3.org/2000/svg" class="pf-c-background-image__filter" width="0" height="0">
<filter id="image_overlay" width="">
<filter id="image_overlay">
<feColorMatrix type="matrix" values="1 0 0 0 0
1 0 0 0 0
1 0 0 0 0

View file

@ -23,13 +23,7 @@ import {App} from './app/App';
const e = React.createElement;
export interface MainProps {
}
//declare function loadjs(url,loadListener?);
//loadjs('/js/MyExtension.js');
export interface MainProps {}
export class Main extends React.Component<MainProps> {
public constructor(props: MainProps) {

View file

@ -59,7 +59,6 @@ export class App extends React.Component<AppProps> {
public constructor(props: AppProps) {
super(props);
console.log('Called into App constructor');
toggleReact();
}

View file

@ -1,3 +1,4 @@
parent=base
deprecatedMode=false
scripts=WelcomePageScripts.js
#developmentMode=true