File modules/cms/ui/themes/default/script/openrat/view.js

Last commit: Tue Feb 14 00:21:26 2023 +0100	Jan Dankert	Show fatal error messages in the UI notice window.


     1 import $ from  '../jquery-global.js';
     2 import Callback from "./callback.js";
     3 import Form     from "./form.js";
     4 import Notice   from "./notice.js";
     5 import Workbench from "./workbench.js";
     6 
     7 /**
     8  * View.
     9  * A view is a part of the page. An Action is loaded into this view.
    10  *
    11  * @param action
    12  * @param method
    13  * @param id
    14  * @param params
    15  * @constructor
    16  */
    17 export default class View {
    18 
    19 	constructor( action,method,id,params ) {
    20 		this.action = action;
    21 		this.method = method;
    22 		this.id = id;
    23 		this.params = params;
    24 
    25 		this.onCloseHandler = new Callback();
    26 
    27 		this.onChangeHandler = new Callback();
    28 		this.onSaveHandler = new Callback();
    29 	}
    30 
    31     before() {
    32 
    33 	};
    34 
    35 	/**
    36 	 * @param element
    37 	 * @returns {Promise}
    38 	 */
    39 	start( element ) {
    40 
    41         this.before();
    42         this.element = element;
    43         return this.loadView();
    44     }
    45 
    46     afterLoad() {
    47 
    48     }
    49 
    50     close() {
    51 
    52 		this.onCloseHandler.fire();
    53     }
    54 
    55 
    56     fireViewLoadedEvents(element) {
    57 
    58 		Callback.afterViewLoadedHandler.fire( element );
    59     }
    60 
    61 
    62 	/**
    63 	 * Loads the content of this view
    64 	 *
    65 	 * @returns Promise
    66 	 */
    67 	async loadView() {
    68 
    69         let url     = View.createUrl(this.action, this.method, this.id, this.params); // URL für das Laden erzeugen.
    70         let element = this.element;
    71         let view    = this;
    72 
    73 		//$(this.element).addClass('loader');
    74 		console.debug( view );
    75 
    76 		try {
    77 			let response = await fetch( url,{
    78 				method: 'GET',
    79 				headers: {
    80 					'Accept': 'text/html',
    81 				}
    82 			} );
    83 			$(element).html("");
    84 
    85 			if   ( ! response.ok ) {
    86 
    87 				$(element).html('<div class="or-view-central"><i class="or-image-icon or-image-icon--method-logout" /></div>');
    88 
    89 				if   ( response.status == 403 ) {
    90 					throw "Permission denied";
    91 				}
    92 				else if   ( response.status == 503 ) {
    93 
    94 					let data = await response.text();
    95 					if   ( ! data )
    96 						data = '';
    97 					const errorDoc = new DOMParser().parseFromString(data,"text/html");
    98 					const error    = errorDoc.getElementById("cms-error-log");
    99 					throw "CMS Service unavailable\n" + error.innerText;
   100 				}
   101 				else if   ( response.status == 500 ) {
   102 
   103 					let data = await response.text();
   104 					if   ( ! data )
   105 						data = '';
   106 					const errorDoc = new DOMParser().parseFromString(data,"text/html");
   107 					const error    = errorDoc.getElementById("cms-error-log");
   108 					throw "CMS Server Error\n" + error.innerText;
   109 				}
   110 				else
   111 					throw "Failed to load the view: " + response.status + " " + response.statusText;
   112 
   113 			}
   114 
   115 			let data = await response.text();
   116 
   117 			if   ( ! data )
   118 				data = '';
   119 
   120 			$(element).html(data);
   121 
   122 			$(element).find('form').each( function() {
   123 
   124 				let form = new Form();
   125 
   126 				form.onChangeHandler.add( () => { view.onChangeHandler.fire() } );
   127 				form.onSaveHandler  .add( () => { view.onSaveHandler  .fire() } );
   128 				form.onCloseHandler .add( () => { view.close()                } );
   129 
   130 				form.forwardHandler.add( (action, subaction, id, data) => {
   131 					view.action = action;
   132 					view.method = subaction;
   133 					view.id     = id;
   134 					view.params = data;
   135 					view.loadView();
   136 				} );
   137 
   138 				form.initOnElement(this);
   139 			});
   140 
   141 			view.fireViewLoadedEvents( element );
   142 		}
   143 		catch( cause ) {
   144 
   145 			console.error( {view:view, url:url, cause: cause} );
   146 
   147 			let notice = new Notice();
   148 			notice.setStatus('error');
   149 			//notice.msg = Workbench.language.ERROR;
   150 			notice.msg = Workbench.language.NOTHING_DONE;
   151 			notice.log = cause;
   152 			notice.show();
   153 		}
   154 		finally {
   155 			//$(element).removeClass("loader");
   156 		}
   157 	}
   158 
   159 
   160 
   161 
   162     /**
   163 	 * Erzeugt eine URL, um die gewünschte Action vom Server zu laden.
   164 	 *
   165 	 * @param action
   166 	 * @param subaction
   167 	 * @param id
   168 	 * @param extraid
   169 	 * @returns string
   170 	 */
   171     static createUrl(action, subaction, id= 0, extraid = {}) {
   172         let url = './?';
   173 
   174         if(action)
   175             url += '&action='+action;
   176         if(subaction)
   177             url += '&subaction='+subaction;
   178         if(id)
   179             url += '&id='+id;
   180 
   181         if   ( extraid instanceof FormData ) {
   182 			for (let pair of extraid.entries()) {
   183 				// value is already encoded.
   184 				// this does not support multiple values.
   185 				url += '&' + pair[0] + '=' + pair[1];
   186 			}
   187 		}
   188         else if	( extraid instanceof Object ) {
   189 
   190 			Object.keys(extraid).forEach( (key) =>  {
   191 				url += '&' + key + '=' + extraid[key];
   192 			});
   193         }
   194         else
   195         	throw "Illegal argument";
   196 
   197         return url;
   198     }
   199 
   200 
   201 }



Download modules/cms/ui/themes/default/script/openrat/view.js


History
Tue, 14 Feb 2023 00:21:26 +0100	Jan Dankert	Show fatal error messages in the UI notice window.
Mon, 13 Feb 2023 22:46:58 +0100	Jan Dankert	Show server error messages in the UI notice window.
Fri, 11 Feb 2022 01:28:51 +0100	dankert	Fixed some UI problems: The dialogs are now closed after submitting the data; Workbench is reloaded after login/logout.
Sun, 6 Feb 2022 22:06:09 +0100	dankert	Refactoring: Ommit unnecessary parameters.
Sun, 6 Feb 2022 21:34:42 +0100	dankert	New: Use Accept-Header instead of "output" request parameter, this is the cleaner way.
Sun, 30 Jan 2022 23:38:42 +0100	dankert	Refactoring: Only 1 http-endpoint for both the UI and the API. Path "/api" is not available any more, all API data is served under "/".
Fri, 31 Dec 2021 01:07:48 +0100	dankert	Detect permission errors from API response.
Sat, 18 Dec 2021 03:47:23 +0100	dankert	New: Every ES6-Module should have a minified version for performance reasons. Bad: The Minifier "Jsqueeze" is unable to minify ES6-modules, so we had to implement a simple JS-Minifier which strips out all comments.
Mon, 29 Nov 2021 23:54:33 +0100	Jan Dankert	New: Spinner image with pure css. So we can colorize it now.
Wed, 31 Mar 2021 01:52:57 +0200	Jan Dankert	New: Replace JQuery with OQuery, a selfmade light JQuery replacement.
Sat, 27 Mar 2021 10:40:59 +0100	Jan Dankert	Only generate the actual necessary theme style.
Sat, 27 Mar 2021 10:19:39 +0100	Jan Dankert	Fix: Register component scripts only once.
Sat, 27 Mar 2021 05:14:11 +0100	Jan Dankert	Refactoring: Converting all script files to ES6 modules (work in progress); removed jquery-ui (drag and drop will be replaced by HTML5, sortable by a small lib)
Wed, 17 Mar 2021 22:27:33 +0100	Jan Dankert	Refactoring: Using ES6-Modules (experimental)
Wed, 17 Mar 2021 02:18:50 +0100	Jan Dankert	Refactoring: Using "Jquery slim" without ajax and effects.
Wed, 17 Mar 2021 00:57:14 +0100	Jan Dankert	Replaced all Jquery ajax methods by the native fetch api.
Tue, 16 Mar 2021 23:52:22 +0100	Jan Dankert	Refactoring: Use ES6 classes.
Tue, 16 Mar 2021 02:38:13 +0100	Jan Dankert	Fix: Using the new FormData object instead of JQuery (JQuery's serialize-functions are not available in the slim version)
Mon, 15 Mar 2021 23:29:48 +0100	Jan Dankert	Refactoring: Use ES6 classes.
Thu, 18 Feb 2021 01:55:01 +0100	Jan Dankert	New: Action for displaying a navigation while no other action is selected.
Wed, 17 Feb 2021 02:34:51 +0100	Jan Dankert	Refactoring: Extract Dialog into a separate js class
Wed, 17 Feb 2021 00:37:45 +0100	Jan Dankert	Refactoring: Extract Notices into a separate js class
Sun, 14 Feb 2021 23:18:14 +0100	Jan Dankert	New: Confirmation needed if a dialog is closed which has unsaved changes.
Tue, 9 Feb 2021 19:25:59 +0100	Jan Dankert	New: Adding console messages instead of weired dialog messages.
Thu, 12 Nov 2020 01:12:45 +0100	Jan Dankert	Fix: Workflow for changing the users email adress; Mail sending; Forwarding forms
Mon, 2 Nov 2020 23:59:36 +0100	Jan Dankert	Refactoring: The promise of the ajax requests are returned to the caller. All view requests are collected into a singlel promise.
Sun, 4 Oct 2020 23:53:25 +0200	Jan Dankert	New: The tree is now hidable with a dedicated button. No more hover effect in the navigation.
Fri, 2 Oct 2020 23:11:48 +0200	Jan Dankert	Cleanup: No '.inputholder' any more, notices with links to objects.
Mon, 17 Aug 2020 21:31:53 +0200	Jan Dankert	Performance: For now disabling the data-loading and data-binding (was not used up to now)
Sun, 23 Feb 2020 04:01:30 +0100	Jan Dankert	Refactoring with Namespaces for the cms modules, part 1: moving.