First commit

application/demo/leftSide/leftSide.button.animations.js

@@ -0,0 +1,51 @@
+
+
+import menuButton					from './leftSide.button.js';
+
+export default class settingsButton extends menuButton{
+
+	text				= "Animations";
+
+	create() {
+
+		//this.activateButton();
+
+	}
+
+	touchstart() {
+
+		this.click();
+
+	}
+	
+	async click() {
+
+		this.stateMachine.composeState( "Animations" );
+
+		this.openPage();
+
+
+	}
+
+	state openPage() {
+
+		var application		= this.parent.parent;
+
+		var rightSide		= application.rightSide;
+		var menu 			= application.leftSide;
+
+		this.deactivateButtons();
+		this.activateButton();
+
+		rightSide.hideChildren();
+		rightSide.animations.show();
+
+		#ifdef ANDROID
+
+			application.minimizeButton.close();
+
+		#endif
+
+	}
+
+}

application/demo/leftSide/leftSide.button.fileManager.js

@@ -0,0 +1,51 @@
+
+
+import menuButton					from './leftSide.button.js';
+
+export default class fileMangerButton extends menuButton{
+
+	text				= "File Manager";
+
+	create() {
+
+		//this.activateButton();
+
+	}
+
+	touchstart() {
+
+		this.click();
+
+	}
+	
+	async click() {
+
+		this.stateMachine.composeState( "File Manager" );
+
+		this.openPage();
+
+	}
+
+	state openPage() {
+
+		var application		= this.parent.parent;
+
+		var rightSide		= application.rightSide;
+
+		this.deactivateButtons();
+		this.activateButton();
+
+		rightSide.hideChildren();
+		rightSide.fileManager.show();
+
+		rightSide.fileManager.fileList.create();
+
+		#ifdef ANDROID
+
+			application.minimizeButton.close();
+
+		#endif
+
+	}
+
+}

application/demo/leftSide/leftSide.button.grid.js

@@ -0,0 +1,51 @@
+
+
+import menuButton					from './leftSide.button.js';
+
+export default class settingsButton extends menuButton{
+
+	text				= "Grids";
+
+	create() {
+
+		//this.activateButton();
+
+	}
+
+	touchstart() {
+
+		this.click();
+
+	}
+	
+	async click() {
+
+		this.stateMachine.composeState( "Appearance" );
+
+		this.openPage();
+
+	}
+
+	state openPage() {
+
+		var application		= this.parent.parent;
+
+		var rightSide		= application.rightSide;
+		var menu 			= application.leftSide;
+
+		this.deactivateButtons();
+		this.activateButton();
+
+		rightSide.hideChildren();
+		rightSide.gridExample.show();
+
+		#ifdef ANDROID
+
+			application.minimizeButton.close();
+
+		#endif
+
+
+	}
+
+}

application/demo/leftSide/leftSide.button.js

@@ -0,0 +1,202 @@
+export default class menuButton{
+
+	width				= 110;
+
+	color;
+
+	background;
+
+	fontWeight;
+
+	#ifdef ANDROID
+
+		width			= "80vw";
+
+		borderRadius	= 18;
+
+		textAlign		= "center"
+
+		padding			= 20;
+
+		margin			= "0 auto"
+
+		marginTop		= 8;
+
+		fontSize		= 20;
+
+		height			= 24;				
+
+		fontWeight	 	= "600"
+
+		fontColor		= "#313131";
+
+		#ifdef LIGHT
+
+			borderBottom	= "1px solid #ececec";
+
+			background		= "white";
+
+		#endif
+
+
+	#endif
+
+	#ifdef WINDOWS
+
+		borderRadius		= 6;	
+
+		width				= 160
+
+		padding				= 10;
+
+		marginTop			= 2;
+
+		marginBottom		= 2;
+
+		paddingLeft			= 30;
+
+	#endif
+
+
+	activated			= false;
+
+	propegateEvent		= false;
+
+	cursor				= "pointer";
+
+	#ifdef WINDOWS
+
+		#ifdef DARK
+
+			hightlightBackgroundColor 		= "#2d2d2d";
+
+			hightlightBackgroundColor 		= "#0c0e165c";
+	
+
+		#endif
+
+		#ifdef LIGHT
+
+			hightlightBackgroundColor 		= "rgb(141 180 189 / 12%)";
+
+		#endif
+
+	#endif
+
+	#ifdef MACOS
+
+		borderRadius		= 8;
+
+		padding				= 10;
+
+		paddingLeft			= 20;
+
+		fontSize			= 16;
+
+		fontWeight			= "600";
+
+
+		hightlightBackgroundColor	= "rgb(189 193 221 / 22%)"
+
+
+		#ifdef LIGHT
+
+			color 		= "#343434";
+
+		#endif
+
+	#endif
+
+
+	activated			= false;
+
+	state activateButton() {
+
+		this.activated			= true;
+
+		this.highlightButton();
+
+	}
+
+	state deactivateButton() {
+
+		this.activated			= false;
+
+		this.lowlightButton();
+
+	}
+
+	highlightButton() {
+
+		this.background			= this.hightlightBackgroundColor;
+
+		if( !this.activated ) {
+
+		
+		}
+
+	}
+
+	lowlightButton() {
+
+		if( !this.activated ) {
+
+			this.background			= "";
+
+		}
+
+	}
+
+	mouseover() {
+
+		this.highlightButton();
+
+	}
+
+	mouseleave() {
+
+		if( !this.activated ) {
+
+			this.lowLightButtons();
+
+		}
+
+	}
+
+	deactivateButtons() {
+
+		var children = this.parent.getChildren();
+
+		for (var i = 0; i < children.length; i++) {
+
+			var child = children[i];
+
+			if( child.deactivateButton ) {
+
+				child.deactivateButton();
+
+			}
+
+		}
+
+	}
+
+	lowLightButtons() {
+
+		var children = this.parent.getChildren();
+
+		for (var i = 0; i < children.length; i++) {
+
+			var child = children[i];
+
+			if( child.lowlightButton ){
+
+				child.lowlightButton();
+			
+			}
+
+		}
+
+	}
+
+}

application/demo/leftSide/leftSide.button.news.js

@@ -0,0 +1,74 @@
+
+
+import menuButton					from './leftSide.button.js';
+
+export default class newsButton extends menuButton{
+
+	text				= "Home";
+
+	#ifdef MACOS
+
+		borderTopLeftRadius	= 8;
+
+	#endif
+
+
+
+	create() {
+
+		var pathName		= window.location.pathname;
+
+		var pathParts  		= pathName.split("/");
+
+		if( !pathParts[1] ) {
+
+			this.stateMachine.composeState( );
+
+		}
+
+		//this.activateButton();
+
+		this.openPage();
+
+	}
+	
+	async click() {
+
+		this.stateMachine.composeState( "Home" );
+
+		this.openPage();
+
+	}
+
+	state openPage() {
+
+		var application		= this.parent.parent;
+
+		var rightSide		= application.rightSide;
+
+
+		#ifdef ANDROID
+
+			application.minimizeButton.close();
+
+		#endif
+
+		this.deactivateButtons();
+
+		//this.activateButton();
+
+		console.log("rightSide", rightSide);
+
+		rightSide.newsPages.newsItemPage.transform	= "translateX(0)";
+
+		rightSide.newsPages.newsPage.transform		= "translateX(0)";
+
+		rightSide.hideChildren();
+
+		rightSide.newsPages.show();
+
+		//rightSide.newsPages.newsItemPage.newsListTable.body.sync()
+
+	}
+
+}

application/demo/leftSide/leftSide.button.settings.js

@@ -0,0 +1,51 @@
+
+
+import menuButton					from './leftSide.button.js';
+
+export default class settingsButton extends menuButton{
+
+	text				= "Appearance";
+
+	create() {
+
+		//this.activateButton();
+
+	}
+
+	touchstart() {
+
+		this.click();
+
+	}
+	
+	async click() {
+
+		this.stateMachine.composeState( "Appearance" );
+
+		this.openPage();
+
+	}
+
+	state openPage() {
+
+		var application		= this.parent.parent;
+
+		var rightSide		= application.rightSide;
+		var menu 			= application.leftSide;
+
+		this.deactivateButtons();
+		this.activateButton();
+
+		rightSide.hideChildren();
+		rightSide.settings.show();
+
+		#ifdef ANDROID
+
+			application.minimizeButton.close();
+
+		#endif
+
+
+	}
+
+}

application/demo/leftSide/leftSide.button.signin.js

@@ -0,0 +1,62 @@
+
+
+import menuButton					from './leftSide.button.js';
+
+import groups						from '/user/group/user.group.permission.js';
+
+
+export default class signinPageButton extends menuButton{
+
+	text				= "Signin";
+
+	click() {
+
+		this.stateMachine.composeState( "Signin" );
+
+		this.openPage();
+		
+	}
+
+	state openPage() {
+
+		this.deactivateButtons();
+		this.activateButton();
+
+		var application		= this.parent.parent;
+
+		var rightSide		= application.rightSide;
+
+		rightSide.width		= "";
+
+		rightSide.hideChildren();
+
+		rightSide.signin.show();
+
+		#ifdef ANDROID
+
+			application.minimizeButton.close();
+
+		#endif
+
+	}
+
+	enableREAD() {
+
+		this.hide();
+
+	}
+
+	disableREAD() {
+
+		this.show();
+
+	}
+
+	permission() {
+
+		this.allow( groups.member , "READ" );
+		this.allow( groups.admin ,  "READ" );
+		
+	}
+
+}

application/demo/leftSide/leftSide.button.signout.js

@@ -0,0 +1,94 @@
+
+
+import menuButton					from './leftSide.button.js';
+
+import groups						from '/user/group/user.group.permission.js';
+
+import userManager					from '/server/userManager.js';
+
+
+export default class signoutButton extends menuButton{
+
+	text				= "Signout";
+
+	create(){
+
+		this.hide();
+
+	}
+
+	async click() {
+
+		this.stateMachine.composeState( "Signout" );
+
+		await this.openPage();
+
+	}
+
+	state async openPage() {
+
+		this.deactivateButtons();
+		this.activateButton();
+
+		console.log("before process",this);
+
+		var visitorUser = await this.signout();
+
+
+		localStorage.setItem( "username", false );
+
+		localStorage.setItem( "sessionKey", false );
+
+		this.getCore().updatePermissions( visitorUser.permissionObjects );	
+
+	}
+
+	createVisitor( client ) {
+	
+		var userInstance = new user(); 
+		
+		userInstance.username.value			= "Visitor";
+
+		userInstance.id 					= 0;
+		
+		userInstance.permissionObjects 		= userManager.getPermissions( userInstance, client );
+
+		return userInstance;
+	
+	}
+
+	node async signout( object, client ) {
+
+		var newUser = this.createVisitor( this.client );
+
+		this.client.user = newUser;
+
+		global.core.setUserObjects( false, this.client );
+
+		return newUser;
+
+	}
+
+	enableREAD() {
+
+		this.show();
+		
+	}
+
+	disableREAD() {
+
+		this.hide();
+
+	}
+
+	permission() {
+
+		this.allow( groups.member , "PROCESS" );
+		this.allow( groups.admin ,  "PROCESS" );
+
+		this.allow( groups.member , "READ" );
+		this.allow( groups.admin ,  "READ" );
+		
+	}
+
+}

application/demo/leftSide/leftSide.button.signup.js

@@ -0,0 +1,37 @@
+
+import menuButton					from './leftSide.button.js';
+
+export default class signinButton extends menuButton{
+
+	text				= "Signup";
+
+	click() {
+
+		this.stateMachine.composeState( "Signup" );
+
+		this.openPage();
+
+	}
+
+	state openPage() {
+
+		this.deactivateButtons();
+		this.activateButton();
+
+		var application		= this.parent.parent;
+
+		var rightSide		= application.rightSide;
+
+		rightSide.hideChildren();
+
+		rightSide.signup.show();
+
+		#ifdef ANDROID
+
+			application.minimizeButton.close();
+
+		#endif
+
+	}
+
+}

application/demo/leftSide/leftSide.button.users.js

@@ -0,0 +1,68 @@
+
+
+import menuButton					from './leftSide.button.js';
+
+import groups						from '/user/group/user.group.permission.js';
+
+
+export default class usersPageButton extends menuButton{
+
+	text				= "Users";
+
+	click() {
+
+		this.stateMachine.composeState( "Users" );
+
+		this.openPage();
+		
+	}
+
+	state openPage() {
+
+		this.deactivateButtons();
+		
+		this.activateButton();
+
+		var application		= this.parent.parent;
+
+		var rightSide		= application.rightSide;
+
+		rightSide.width		= "";
+
+		rightSide.hideChildren();
+
+		rightSide.userListPage.show();
+
+		rightSide.userListPage.userTable.body.create()
+
+		#ifdef ANDROID
+
+			application.minimizeButton.close();
+
+		#endif
+
+	}
+
+	enableREAD() {
+
+		this.show();
+		
+	}
+
+	disableREAD() {
+
+		this.hide();
+
+	}
+
+	permission() {
+
+		this.allow( groups.member , "PROCESS" );
+		this.allow( groups.admin ,  "PROCESS" );
+
+		this.allow( groups.member , "READ" );
+		this.allow( groups.admin ,  "READ" );
+		
+	}
+
+}

application/demo/leftSide/leftSide.header.js

@@ -0,0 +1,33 @@
+
+import header						from "/elements/header.js";
+
+export default class menuHeader extends header{
+
+	text 				= "Menu";
+
+	flexDirection		= "column";
+
+	fontSize			= 36;
+
+	paddingTop			= 100;
+
+	fontWeight			= "300"
+
+	paddingBottom		= 100;
+
+	textAlign			= "center";
+
+	width				=  "100vw";
+
+	#ifdef ANDROID
+
+		display			= "flex";
+
+	#else
+
+		display			= "none";
+
+	#endif
+
+	
+}

application/demo/leftSide/leftSide.js

@@ -0,0 +1,179 @@
+
+
+import button						from '/elements/button.js';
+
+import newsButton					from './leftSide.button.news.js';
+
+import settingsButton				from './leftSide.button.settings.js';
+
+import signinButton					from './leftSide.button.signin.js';
+
+import signupButton					from './leftSide.button.signup.js';
+
+import signoutButton				from './leftSide.button.signout.js';
+
+import fileManagerButton			from './leftSide.button.fileManager.js';
+
+import animationsButton				from './leftSide.button.animations.js';
+
+import usersButton					from './leftSide.button.users.js';
+
+import gridButton					from './leftSide.button.grid.js';
+
+import menuHeader					from './leftSide.header.js';
+
+
+
+export default class leftSide{
+
+	state				= "visible";
+
+	boxOverflow			= "hidden";
+
+	boxTransition		= "0.3S";
+
+	#ifdef ANDROID
+
+		boxHeight			= "100vh";
+
+	#else
+
+		boxHeight			= "";
+
+	#endif
+
+	boxWidth			= 220;
+
+	width				= 220;
+
+	flexDirection		= "column";
+
+	//borderRight		= "1px solid #3D3D3D"
+	paddingTop			= 30;
+
+	//minHeight			= "40vh"
+
+	header				= new menuHeader();
+
+	#ifdef ANDROID
+
+		height		= "100vh";
+
+		paddingTop	= "";
+
+		boxWidth	= "100vw";
+
+		width		= "100vw";
+
+		#ifdef LIGHT
+
+			boxBackground		= "#f2f2f2";
+
+			//background			= "white";
+
+		#endif
+
+
+	#endif
+
+	#ifdef WINDOWS
+
+		paddingLeft		= 4;
+
+		paddingRight	= 4;
+
+		#ifdef DARK
+
+			background			= "#202020cc";
+
+			color				= "white"
+
+			borderRight			= "1px solid black"
+
+			fontWeight			= "500";
+
+		#endif 
+
+		#ifdef LIGHT
+
+			background			= "rgb(255 255 255 / 75%)";
+
+			color				= "black";
+
+
+			fontWeight			= "200";
+
+		#endif
+	#endif
+
+	#ifdef MACOS
+
+		paddingTop			= 40;
+
+		paddingLeft			= 20;
+
+
+		#ifdef DARK
+
+			background		= "rgb(40 22 22 / 75%)";
+
+			color			= "white"
+
+			borderRight		= "1px solid black"
+
+			fontWeight			= "bold";
+
+		#endif 
+
+		#ifdef LIGHT
+
+			background		= "rgb(255 255 255 / 75%)";
+
+			color			= "black";
+
+
+			fontWeight			= "200";
+
+		#endif
+
+	#endif
+
+	render() {
+
+
+
+	}
+
+	//opacity			= "90%";
+
+	//backdropFilter	= "blur(20px)";
+
+	borderTopLeftRadius			= 8;
+
+	borderBottomLeftRadius		= 8;
+
+	borderTopLeftRadius			= "12px";
+
+	borderBottomLeftRadius		= "12px";
+
+ 
+
+	newsButton			= new newsButton();
+
+	settingsButton		= new settingsButton();
+
+	usersButton			= new usersButton();
+
+	signinButton		= new signinButton();
+
+	signoutButton		= new signoutButton();
+
+	signupButton		= new signupButton();
+
+	animationsButton	= new animationsButton();
+
+	gridButton			= new gridButton();
+
+	fileManagerButton	= new fileManagerButton();
+
+}

application/demo/leftSide/testChild.js

@@ -0,0 +1,21 @@
+export default class testChild{
+
+	text	= "test";
+
+	width	= 160;
+
+	height	= 30;
+
+	background	= "red";
+
+
+	fontSize		= 24;
+
+	constructor( abc ) {
+
+		this.text = abc;
+
+	}
+
+
+}