First commit

application/demo/page/news.page.js

@@ -0,0 +1,254 @@
+
+import news 					from '../news.js';
+
+import newsPageTitle 			from './news.page.title.js';
+
+import newsPageBody				from './news.page.body.js';
+
+import groups					from '/user/group/user.group.permission.js';
+
+import commentsMessages			from '../comment/comments.messages.js';
+
+import editComment 				from '../comment/edit/comment.edit.js';
+
+import createComment 			from '../comment/create/comment.create.js';
+
+import saveButton				from './news.page.save.js';
+
+import backButton				from "./news.page.backButton.js"
+
+import editButton				from "./news.page.edit.button.js"
+
+import filler					from "/elements/filler.js";
+
+import searchComments			from "./search.comments.js";
+
+import tools					from "/unify/tools.js";
+
+
+
+
+class testDiv{
+
+	pageTitle				= new newsPageTitle();
+
+}
+
+class testSuffixes{
+
+	layers				= 1;
+
+	useCustomElement	= true;
+
+	customElement		= document.createElement("a")
+
+	text				= "visit Unify";
+
+
+
+	visitedColor		= "green";
+
+	linkColor			= "#009688"
+
+	activeColor			= "red"
+
+
+	create() {
+
+		this.element.setAttribute("href", "https://unifyjs.org")
+
+	}
+
+}
+
+
+export default class newsPage extends news{
+	
+	willChange					= "transform";
+
+	transform;
+
+	minHeight					= "100%";
+
+	transition					= "1s"
+
+
+	scrollbarWidth					= "6px";
+
+	scrollbarTrackBackground		= "#1c1d1e";
+
+	scrollbarThumbBackground		= "#404040"
+
+	scrollbarThumbBorderRadius		= "4px"
+
+	scrollbarThumbHoverBackground	= "grey";
+
+
+	#ifdef MACOS
+
+		#ifdef LIGHT
+
+			background			= "white"; 
+
+		#endif
+
+
+		#ifdef DARK
+
+			background			= "#282828";
+
+		#endif
+
+	#endif
+
+
+	#ifdef WINDOWS
+
+		#ifdef LIGHT
+
+			background			= "rgb(255 255 255 / 75%)";
+
+		#endif
+
+
+		#ifdef DARK
+
+			background			= "#202020cc";
+
+		#endif
+
+	#endif
+
+
+	#ifdef ANDROID
+
+		height		= "100vh";
+
+		paddingTop	= "";
+
+		boxWidth	= "100vw";
+
+		width		= "100vw";
+
+		#ifdef LIGHT
+
+			background		= "#f2f2f2";
+
+		#endif
+
+
+	#endif
+
+
+	flexDirection		= "column"
+
+	_backButton			= new backButton();
+
+	_testDiv			= new testDiv();
+
+	body				= new newsPageBody();
+
+
+	editButton			= new editButton();
+	//testSuffixes			= new testSuffixes();
+
+	debug				= true;
+
+	width				= 600;
+
+	sizing				= "border-box";
+
+	layers				= 1;
+
+	height				= "70vh"
+
+	overflowY			= "auto"
+
+
+	searchComments		= new searchComments();
+
+	commentsMessages	= new commentsMessages( editComment, this.comments );
+
+	createComment		= new createComment( this.comments );
+
+	filler				= new filler();
+
+	async afterLoad() {
+
+		var pathName		= window.location.pathname;
+
+		var pathParts  		= pathName.split("/");
+
+		var id 				= parseFloat( pathParts[1] );
+
+
+		if( id ) {
+
+			this.stateMachine.composeState();
+
+			this.showParents();
+
+			this.show();
+
+			await this.loadPage( id )
+
+		}
+
+	}
+
+	state async loadPage( id ) {
+
+		var rightSide 	= this.parents("newsPages");
+
+		var boundBox	= this.defaultElement.getBoundingClientRect();
+
+		var width		= boundBox.width;
+		
+
+		#ifdef ANDROID
+
+			rightSide.newsItemPage.translateX	= -width;
+
+		#elif
+
+			rightSide.newsItemPage.transform	= "translateX(-600px)";
+
+			rightSide.newsPage.transform		= "translateX(-600px)";
+
+
+		#endif
+
+		this.id = id;
+
+		await this.sync();
+
+		this.createComment.create();
+
+	}
+
+	async create() {
+
+		await this.commentsMessages.sync();
+
+	}
+
+	permission() {
+
+		this.allow( groups.member, "WRITE" );
+
+		this.allow( groups.admin, "WRITE" );
+
+		this.allow( groups.visitor, "WRITE" );
+
+
+
+		this.allow( groups.member, "READ" );
+
+		this.allow( groups.admin, "READ" );
+
+		this.allow( groups.visitor, "READ" );
+	
+	}
+
+
+}