First commit

application/demo/list/header/news.list.header.actions.js

@@ -0,0 +1,29 @@
+
+import groups				from '/user/group/user.group.permission.js';
+
+import gridViewColumn		from '/elements/gridView/gridView.header.row.column.js';
+
+
+export default class newsListHeaderActions extends gridViewColumn {
+	
+	text				= "Actions";
+
+	enableDELETE() {
+
+		this.show();
+
+	}
+
+	disableDELETE() {
+
+		this.hide();
+
+	}
+
+	permission() {
+
+		this.allow( groups.admin, "DELETE" );
+		
+	}
+
+}

application/demo/list/header/news.list.header.body.js

@@ -0,0 +1,9 @@
+
+
+import gridViewColumn		from '/elements/gridView/gridView.header.row.column.js';
+
+export default class newsListHeaderBody extends gridViewColumn{
+
+	text				= "Message";
+
+}

application/demo/list/header/news.list.header.js

@@ -0,0 +1,26 @@
+
+
+import news							from '../../news.js';
+
+import body							from './news.list.header.body.js';
+
+import title						from './news.list.header.title.js';
+
+import price						from './news.list.header.price.js';
+
+import actions						from './news.list.header.actions.js';
+
+import gridViewRow					from '/elements/gridView/gridView.header.row.js';
+
+
+export default class newsListHeader extends news, gridViewRow { 
+
+	body				= new body();
+
+	title				= new title();
+
+	price				= new price();
+
+	actions				= new actions();
+
+}

application/demo/list/header/news.list.header.price.js

@@ -0,0 +1,10 @@
+
+
+import gridViewColumn		from '/elements/gridView/gridView.header.row.column.js';
+
+
+export default class newsListHeaderPrice extends gridViewColumn{
+
+	text				= "Price";
+
+}

application/demo/list/header/news.list.header.title.js

@@ -0,0 +1,12 @@
+
+
+import newsTitle 			from '../../news.title.js';
+
+import gridViewColumn		from '/elements/gridView/gridView.header.row.column.js';
+
+
+export default class newsListHeaderTitle extends gridViewColumn{
+
+	text				= "Title";
+
+}

application/demo/list/item/news.list.item.actions.deleteButton.js

@@ -0,0 +1,32 @@
+
+import button 				from "/elements/button.js";
+
+import groups				from '/user/group/user.group.permission.js';
+
+export default class deleteButton extends button {
+
+	text			= "Delete";
+
+	propegateEvent	= false;
+
+
+	async click() {
+
+		var sure = confirm("Are you sure you want to delete this item");
+
+		if( sure ) {
+			
+			await this.parent.parent.delete();
+			
+			this.parent.parent.remove();
+
+		}
+	}
+
+	permission() {
+
+		this.allow( groups.admin, "DELETE" );
+		
+	}
+
+}

application/demo/list/item/news.list.item.actions.js

@@ -0,0 +1,23 @@
+
+import gridViewColumn		from '/elements/gridView/gridView.body.row.column.js';
+
+import deleteButton			from "./news.list.item.actions.deleteButton.js"
+
+
+export default class newsListItemActions extends gridViewColumn, gridViewColumn{
+
+	useCustomElement	= false;
+
+	padding				= 20;
+
+	display				= "table-cell";
+
+	layers				= 1;
+
+	paddingLeft			= 30;
+
+	borderRadius;
+
+	deleteButton		= new deleteButton();
+
+}

application/demo/list/item/news.list.item.body.js

@@ -0,0 +1,9 @@
+
+import newsBody 			from '../../news.body.js';
+
+import gridViewColumn		from '/elements/gridView/gridView.body.row.column.js';
+
+export default class newsListItemBody extends newsBody, gridViewColumn{
+
+	
+}

application/demo/list/item/news.list.item.js

@@ -0,0 +1,123 @@
+import news						from '../../news.js';
+
+import body						from './news.list.item.body.js';
+
+import title					from './news.list.item.title.js';
+
+import price					from './news.list.item.price.js';
+
+import actions					from './news.list.item.actions.js';
+
+import groups					from '/user/group/user.group.permission.js';
+
+import gridViewRow				from '/elements/gridView/gridView.body.row.js';
+
+export default class newsListItem extends news, gridViewRow { 
+
+	body				= new body();
+
+	title				= new title();
+
+	price				= new price();
+
+	actions				= new actions();
+
+	cursor				= "pointer";
+
+	background;
+
+	#ifdef MACOS
+
+		fontSize	= 14;
+
+	#endif
+
+	hoverBackgroundColor	= "#363333"
+
+	#ifdef DARK
+
+		//mouseHoverColor	= "#363333";
+
+	#endif
+
+	#ifdef LIGHT
+
+		//mouseHoverColor	= "rgb(255 255 255 / 95%)";
+
+	#endif
+
+	async click() {
+
+		this.stateMachine.composeState( this.id, this.value );
+
+		await this.loadPage( this.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
+
+		var newsPage = rightSide.newsPage;
+
+		newsPage.id = this.id;
+
+		await newsPage.sync();
+
+		newsPage.createComment.create();
+
+		//newsPage.updateFrostglass();
+
+		//newsPage.show();
+
+	}
+
+	mouseover() {
+
+		//this.background	= this.mouseHoverColor;
+
+	}
+
+	mouseleave() {
+
+		//this.background	= "none";
+
+	}
+
+	enableDELETE() {
+
+		this.actions.show();
+
+	}
+
+	disableDELETE() {
+
+		this.actions.hide();
+
+	}
+
+	permission() {
+
+		this.allow( groups.admin, "DELETE" );
+		
+	}
+
+}

application/demo/list/item/news.list.item.price.js

@@ -0,0 +1,20 @@
+
+import newsPrice 			from '../../news.price.js';
+
+import gridViewColumn		from '/elements/gridView/gridView.body.row.column.js';
+
+
+export default class newsListItemPrice extends newsPrice, gridViewColumn{
+
+	create() {
+
+		const formatter = new Intl.NumberFormat('en-US', {
+			style: 'currency',
+			currency: 'EUR',
+		});
+
+		this.text	= formatter.format( this.value );
+
+	}
+
+}

application/demo/list/item/news.list.item.title.js

@@ -0,0 +1,10 @@
+import newsTitle 			from '../../news.title.js';
+
+import gridViewColumn		from '/elements/gridView/gridView.body.row.column.js';
+
+
+export default class newsListItemTitle extends newsTitle, gridViewColumn{
+
+
+
+}

application/demo/list/news.list.table.body.js

@@ -0,0 +1,168 @@
+
+
+import renderCollection				from '/unify/renderCollection.js';
+
+import groups						from '/user/group/user.group.permission.js';
+
+import gridViewBody					from '/elements/gridView/gridView.body.js';
+
+import OR							from '/unify/sql/OR.js';
+
+import AND							from '/unify/sql/AND.js';
+	
+import LIKE							from '/unify/sql/LIKE.js';
+
+import GREATER						from '/unify/sql/GREATER_OR_EQUAL.js';
+
+import SMALLER						from '/unify/sql/SMALLER_OR_EQUAL.js';
+
+
+export default class newsListTableBody extends renderCollection, gridViewBody { 
+
+	debug					= true;
+
+	sort					= "title";
+
+	page					= 0;
+
+	limit					= 2;
+
+	async create() {
+
+		//this.update();
+
+	}
+
+	async update( updatePagination = true ) {
+
+		if( updatePagination ) {
+
+			this.page	= 0;
+
+		}
+
+		this.numberOfPages = await this.filterSearch( this.searchType, this.searchTerm, this.sort, this.direction, this.limit, this.page );
+
+		await this.sync();
+
+		if( updatePagination ) {
+
+			this.parents("newsItemPage").tableControl.pagination.create();
+
+		}
+
+	}
+
+	node async filterSearch( searchType, searchTerm, order, direction, limit, page ) {
+
+		console.log("searchType", searchType);
+
+		console.log("search input", searchTerm);
+
+		console.log("search order", order);
+
+		console.log("direction", direction);
+
+		console.log("limit", limit);
+
+		console.log("from", page * limit);
+
+
+
+		var filter 			= this.getFilter();
+
+		switch( searchType ) {
+
+			case 0:
+
+				filter.search 		= OR( OR( LIKE( filter.title, searchTerm ), LIKE( filter.comments.body, searchTerm ) ), LIKE( filter.body, searchTerm ) );
+
+
+			break;
+
+			case 1:
+
+				filter.search 		= GREATER( filter.price, searchTerm );
+
+			break;
+
+			case 2:
+
+				filter.search 		= SMALLER( filter.price, searchTerm );
+
+			break;
+
+		}
+
+		if( !searchTerm ) {
+
+			filter.search	= false;
+
+		}
+
+		switch( order ) {
+
+			case "title":
+
+				filter.order			= filter.title;
+
+			break;
+
+			case "body":
+
+				filter.order			= filter.body;
+
+			break;
+
+			case "price":
+
+				filter.order			= filter.price;
+
+			break;
+
+		}
+
+		if( direction == "desc" ) {
+
+			filter.direction 		= "desc";
+
+		} else {
+
+			filter.direction 		= "asc";
+
+		}
+
+		filter.limit			= 1000;
+
+		filter.from				= 0;
+
+		// See how many searched rows there are in total
+		this.get();
+
+		filter.limit			= parseInt( limit );
+
+		filter.from				= parseInt( page * limit );
+
+		var numberOfPages		= Math.ceil( this.rows.length / limit );
+
+		console.log("numberOfPages", numberOfPages);
+
+		console.log("this.rows.length", this.rows.length);
+
+		console.log("limit", limit);
+
+		return numberOfPages;
+
+	}
+	
+	permission() {
+
+		this.allow( groups.visitor, "READ" );
+	
+		this.allow( groups.member, "READ" );
+
+		this.allow( groups.admin, "READ" );
+
+	}
+
+}

application/demo/list/news.list.table.header.js

@@ -0,0 +1,13 @@
+
+import newsListHeaderRow			from "./header/news.list.header.js";
+
+import document						from '/unify/document.js';
+
+import gridViewHeader				from '/elements/gridView/gridView.header.js';
+
+
+export default class newsListTableHeader extends gridViewHeader { 
+
+	newsListHeaderRow		= new newsListHeaderRow();
+
+}

application/demo/list/news.list.table.js

@@ -0,0 +1,34 @@
+
+
+import newsListTableHeader			from "./news.list.table.header.js";
+
+import newsListTableBody			from "./news.list.table.body.js";
+
+
+import collection					from '/unify/collection.js';
+
+import newsListItem					from '../list/item/news.list.item.js';
+
+import news							from '../news.js';
+
+import gridView						from '/elements/gridView/gridView.js';
+
+
+
+export default class newsListTable extends gridView{
+
+	header	= new newsListTableHeader();
+
+	body	= new newsListTableBody( newsListItem, new collection( news ) );
+
+	#ifdef MACOS
+
+		marginLeft	= 6;
+
+		width		= "auto"
+
+		margin		= "6px -2px 10px 6px"
+
+	#endif
+
+}