13. Javascript code files

Function content

13.1. Functions in file dlgboxes_generic.js

13.1.1. media_update_progress_dialogbox()

media_update_progress_dialogbox(newim_cnt, newvi_cnt, putbim_cnt, putbvi_cnt, uname, sid, wdir)
Arguments:
  • newim_cnt (Integer) – number of new images,
  • newvi_cnt (Integer) – number of new videos,
  • putbim_cnt (Integer) – number of images which are put back (after removal, and original image is still available),
  • putbvi_cnt (Integer) – number of videos which are put back (after removal, and original video is still available),
  • uname (String) – username,
  • sid (String) – session identification number,
  • wdir (String) – working directory.
Returns:

Void

13.1.1.1. Source code

function media_update_progress_dialogbox(newim_cnt,newvi_cnt,putbim_cnt,putbvi_cnt,uname,sid,wdir){
// Script called by prepareDirOverviewGallery() (generate_jssor_code.js)
// Inp 1: new images count
// Inp 2: new videos count
// Inp 3: put back images count
// Inp 4: put back videos count
// Inp 5: username
// Inp 6: session ID
// Inp 7: work directory
	if ((newim_cnt+newvi_cnt+putbim_cnt+putbvi_cnt)==0){
		var params="uname="+uname+"&sid="+sid+"&wdir="+wdir;
		$.ajax({
			url:'php/media-update-progress.php',
			type:'post',
			data:{uname:uname,sid:sid,wdir:wdir,upd:0},
			success:function(response){
			}
		});
	}
	else {
		var im_upd_cnt=newim_cnt+putbim_cnt;
		var vi_upd_cnt=newvi_cnt+putbvi_cnt;
		vex.open({
			className:'vex-theme-os',
			content: '<div>Updating ' + im_upd_cnt + ' new images:</div>'+
						"<progress id=\"progressor_new_im\" max=\"100\" value=\"0\" style=\"width:100%\"></progress>"+
						'<div>Updating ' + vi_upd_cnt + ' new videos:</div>'+
						"<progress id=\"progressor_new_vi\" max=\"100\" value=\"0\" style=\"width:100%\"></progress>"+
						"<div>Return message</div>"+"<div id=\"progress_message\"></div>",
			showCloseButton:true,
			callback:function(data){
				if (data===false) {return console.log('Close');}
			}
		});
		if (!window.XMLHttpRequest){
			log_message("Your browser does not support the native XMLHttpRequest object.");
			return;
		}
		try {
			var xhr=new XMLHttpRequest();
			var params="uname="+uname+"&sid="+sid+"&wdir="+wdir;
			var progressBar_im=document.getElementById("progressor_new_im");
			var progressBar_vi=document.getElementById("progressor_new_vi");
			xhr.open('POST','php/media-update-progress.php',true);
			xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//			xhr.setRequestHeader("Content-length",params.length);
			xhr.previous_text='';
			var str='';
			xhr.onreadystatechange=function(){
				try {
					if (xhr.readyState==4){ // Operation complete
						eval(str);
					}
					else if (xhr.readyState>2){ // Loading responseText
						var new_response=xhr.responseText.substring(xhr.previous_text.length);
						if (new_response.length>0){
							var result=JSON.parse(new_response);
							if (result.status==1){
								if (result.hasOwnProperty('im_progress')) progressBar_im.value=result.im_progress/(newim_cnt+putbim_cnt)*100;
								if (result.hasOwnProperty('vi_progress')) progressBar_vi.value=result.vi_progress/(newvi_cnt+putbvi_cnt)*100;
								result.status=0;
							}
							else if (result.status==2){
								document.getElementById('progress_message').innerHTML+=result.message+'<br>';
								result.status=0;
							}
							else if (result.status==3){
//									eval(result.html);
								str+=result.html;
							}
						}
						xhr.previous_text=xhr.responseText;
					}
				}
				catch (e){
//						document.getElementById('progress_message').innerHTML+=new_response+'<br>';
					xhr.previous_text=xhr.responseText;
				}
			}
			xhr.send(params);
		}
		catch (e){log_message("<b>[XHR] Exception(2): "+" "+e+"</b>");}
	}
}

13.2. Functions in file dlgboxes_private.js

13.2.1. user_menu_dialogbox()

user_menu_dialogbox(event)
Arguments:
  • parent (Object) – JQuery Event Object
Returns:

13.2.1.1. Source code

function user_menu_dialogbox(event){
	var data = event.data;
	var sitepage=data.sitepage;
	var cname= data.cname;
	vex.dialog.open({
		className:'vex-theme-os',
		showCloseButton:true,
		message:name,
		buttons: [
			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'Logout',
				click:function($vexContent,event) {
					$vexContent.data().vex.value=LOGOUT;
					vex.close($vexContent.data().vex.id);
			}}),
			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'wijzig wachtwoord',
				click:function($vexContent,event) {
					$vexContent.data().vex.value=WIJZIG_WACHTWOORD;
					vex.close($vexContent.data().vex.id);
			}}),
			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'Admin tools',
				click:function($vexContent,event) {
				$vexContent.data().vex.value=USER_ADMIN;
				vex.close($vexContent.data().vex.id);
			}}),
			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'Media filemanager',
				click:function($vexContent,event) {
				$vexContent.data().vex.value=FILEMANAGER;
				vex.close($vexContent.data().vex.id);
			}}),
			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'Media update progress tester',
				click:function($vexContent,event) {
				$vexContent.data().vex.value=MEDIA_UPDATE_PROGRESS_TEST;
				vex.close($vexContent.data().vex.id);
			}}),
            $.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'System info',
				click:function($vexContent,event) {
				$vexContent.data().vex.value=SYSTEM_INFO;
				vex.close($vexContent.data().vex.id);
			}})

		],
		callback:function(data){
			if (data===false) {return console.log('Cancelled');}
			switch (data){
				case LOGOUT:
					logout(cname);
					return console.log('Logout');
				break;
				case WIJZIG_WACHTWOORD:
					wachtwoord_wijzigen_dialogbox();
					return console.log('wijzig wachtwoord (user_menu_dialogbox())');
				break;
				case USER_ADMIN:
					admininistrator_tools_dialogbox();
					return console.log('Admin tools');
				break;
				case FILEMANAGER:
					OpenMediaFilemanager(sitepage);
					return console.log('media filemanager');
				break;
				case MEDIA_UPDATE_PROGRESS_TEST:
					media_update_progress_dialogbox(20,4,WEBSITE_VISTOR,'0');
					return console.log('media update progress tester');
				break;
            case SYSTEM_INFO:
               system_info_dialogbox();
               return console.log('System info');
            break;
			}
		}
	});
	$("[value='Media update progress tester']").attr('style','display:none');
	if (name!=='admin'){
		$("[value='Registreer nieuwe gebruiker']").attr('style','display:none');
		$("[value='Admin tools']").attr('style','display:none');
//				$("[value='Media filemanager']").attr('style','display:none');
	}
}

13.2.2. logout()

logout(cname)

Function is called by user_menu_dialogbox()

Arguments:
  • cname (String) – target URL (webpage) after logging off.
Returns:

13.2.2.1. Source code

function logout(cname){
	$.ajax({
		url:'login/logout.php',type:'post',
		data:{vex:1,redirectUrl:cname},
//		dataType:'json',
		dataType:'text',
		success:function(response){
			resp=JSON.parse(response);
			if (resp.url_parameters===null) window.location.replace(resp.redirectUrl);
			else window.location.replace(resp.redirectUrl+'?'+resp.url_parameters);
		},
		error:function(xhr,status,error){
			console.log(error);
		}
	});
	return true;
}

13.2.3. adminuser_dialogbox()

adminuser_dialogbox()
Param:
Returns:

13.2.3.1. Source code

function adminuser_dialogbox(){
	vex.dialog.open({
		className:'vex-theme-os',
		showCloseButton:true,
		message:'Media update is waarschijnlijk nodig.<br> Log uit, en log in als admin gebruiker, of <br> toon status window',
		buttons: [$.extend({},vex.dialog.buttons.YES,{text:'Admin login',
				click:function($vexContent,event) {
					$vexContent.data().vex.value=LOGOFF;
					vex.close($vexContent.data().vex.id);
				}}),
				$.extend({},vex.dialog.buttons.NO,{text:'Cancel'}),
				$.extend({},vex.dialog.buttons.NO,{text:'Status window',
				click:function($vexContent,event) {
					$vexContent.data().vex.value=STATUS_WINDOW;
					vex.close($vexContent.data().vex.id);
			}})],
		callback:function(data){
			if (data === false) {
				overlayClose();
				return console.log('Cancelled');
			}
			switch (data){
				case LOGOFF:
					overlayClose();
					logout();
					$('#login_button').trigger('click',[{placeholder:'admin'}]);
				break;
				case STATUS_WINDOW:$('.modal-overlay .modal-body2').css({'display':'inline-block'});
				break;
			}
		}
	});
}

13.2.4. admininistrator_tools_dialogbox()

admininistrator_tools_dialogbox()
Param:
Returns:

13.2.4.1. Source code

function admininistrator_tools_dialogbox(){
	vex.dialog.open({
		className:'vex-theme-os',
		showCloseButton:true,
		message:name,
		buttons: [
			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'Registreer nieuwe gebruiker',
				click:function($vexContent,event) {
				$vexContent.data().vex.value=RNG;
				vex.close($vexContent.data().vex.id);
			}}),
			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'View web-log visit table',
				click:function($vexContent,event) {
				$vexContent.data().vex.value=WEBLOG_VISITS;
				vex.close($vexContent.data().vex.id);
			}}),
//			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
//				text:'Server PHP-version/MYSQL',
//				click:function($vexContent,event) {
//				$vexContent.data().vex.value=PHP_VERSION;
//				vex.close($vexContent.data().vex.id);
//			}}),
			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'Backup MYSQL database(all tables)',
				click:function($vexContent,event) {
				$vexContent.data().vex.value=MYSQL_BACKUP;
				vex.close($vexContent.data().vex.id);
			}}),
			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'Session info',
				click:function($vexContent,event) {
				$vexContent.data().vex.value=SESSION_INFO;
				vex.close($vexContent.data().vex.id);
			}})
		],
		callback:function(data){
			if (data===false) {return console.log('Cancelled');}
			switch (data){
				case RNG:
					register_new_user_dialogbox();
				break;
				case WEBLOG_VISITS:
					file_viewer_dialogbox();
				break;
				case PHP_VERSION:
					phpversion_dialogbox();
				break;
				case MYSQL_BACKUP:
                    mysql_backup_dialogbox();
				break;
				case SESSION_INFO:
					session_info_dialogbox();
				break;
			}
		}
	});
}

13.2.5. file_viewer_dialogbox()

file_viewer_dialogbox()

Function is called by admininistrator_tools_dialogbox()

Param:
Returns:

13.2.5.1. Source code

function file_viewer_dialogbox(){ // Function called by admininistrator_tools_dialogbox()
	Modal.open();
	$('#modal_popup h2').html('Webpage visit log');
	file_viewer('../log/webpage_visits.log');
}

13.2.6. file_viewer()

file_viewer(fname)

Function is called by file_viewer_dialogbox()

Arguments:
  • fname (String) – filename
Returns:

13.2.6.1. Source code

function file_viewer(fname){ // Function called by file_viewer_dialogbox()
	$.ajax({
		url:'/php/file_viewer.php',
		type:'post',
		data:{fname:fname},
		success: function(response){
			var obj=jQuery.parseJSON(response);
			$('#modal_popup .modal-content').html(obj.message);
		},
		error:function(xhr,status,error){
			var err = eval("(" + xhr.responseText + ")");
			alert(err.Message);
		}			
	});
}

13.2.7. system_info_dialogbox()

system_info_dialogbox()
Param:
Returns:

13.2.7.1. Source code

function system_info_dialogbox(){
	vex.dialog.open({
		className:'vex-theme-os',
		showCloseButton:true,
		message:name,
		buttons: [
			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'Server PHP-version/MYSQL',
				click:function($vexContent,event) {
				$vexContent.data().vex.value=PHP_VERSION;
				vex.close($vexContent.data().vex.id);
			}}),
         $.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'Server PHP-INFO',
				click:function($vexContent,event) {
				$vexContent.data().vex.value=PHP_INFO;
				vex.close($vexContent.data().vex.id);
			}}),
			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'Setting of local host definition',
				click:function($vexContent,event) {
				$vexContent.data().vex.value=LOCALHOST_DEF;
				vex.close($vexContent.data().vex.id);
			}})
		],
		callback:function(data){
			if (data===false) {return console.log('Cancelled');}
			switch (data){
				case PHP_VERSION:
					phpversion_dialogbox();
				break;
            case PHP_INFO:
               phpinfo_ajax();
            break;
				case LOCALHOST_DEF:
					localhost_definition_dialogbox();
				break;
			}
		}
	});
}

13.2.8. mysql_backup_dialogbox()

mysql_backup_dialogbox()

Function is called by admininistrator_tools_dialogbox()

Param:
Returns:

13.2.8.1. Source code

function mysql_backup_dialogbox(){
	vex.dialog.open({
		className:'vex-theme-os',
		showCloseButton:true,
		message:name,
		buttons: [
			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'Backup login DB on local host (.sql file)',
				click:function($vexContent,event) {
				$vexContent.data().vex.value=LOCAL_DB;
				vex.close($vexContent.data().vex.id);
			}}),
			$.extend({},vex.dialog.buttons.NO,{className:'vex-dialog-button full-width',
				text:'Backup login DB on ISP host (.sql file)',
				click:function($vexContent,event) {
				$vexContent.data().vex.value=ISP_DB;
				vex.close($vexContent.data().vex.id);
			}})
		],
		callback:function(data){
			if (data!==false) {
                switch (data){
                    case LOCAL_DB:
                        mysql_backup(LOCAL_DB);
                    break;
                    case ISP_DB:
                        mysql_backup(ISP_DB);
                    break;
                }
            }
		}
	});
}

13.2.9. mysql_backup()

mysql_backup(data)

Function is called by mysql_backup_dialogbox()

Arguments:
  • data (Object) – callback data object
Returns:

13.2.9.1. Source code

function mysql_backup(data){
    $.ajax({
        url:'/php/mysql/mysql_backup.php',
        type:'post',
        data:{host_type:data},
        success:function(response){
            var obj=jQuery.parseJSON(response);
            if (obj.hasOwnProperty('mysql_backup')){
                msg=obj.mysql_backup.message;
                if (obj.mysql_backup.code!=1){// NOT SUCCESSFUL
                    for (const key in obj) {
                        if (key==='register_new_user') continue;
                        let value=obj[key];
                        msg+="<br>"+key +"("+value.code+"), ";
                    }
                }
                vex.dialog.alert({className:'vex-theme-os',message:msg});
            }
            else vex.dialog.alert({className:'vex-theme-os',message:'MYSQL backup: probably wrong PHP - function has been called.'});
        }
	});
}

13.2.10. register_new_user_dialogbox()

register_new_user_dialogbox()

Function is called by admininistrator_tools_dialogbox()

Param:
Returns:

13.2.10.1. Source code

function register_new_user_dialogbox(){
	vex.dialog.open({
		className:'vex-theme-os',
		showCloseButton:true,
		message:'Registreer nieuwe gebruiker.',
		input: '<div style="font-size:1.2em"></div>' + 
		"<input name=\"username\" type=\"text\" placeholder=\"Gebruikersnaam\" pattern=\".{4,}\" \
		required title=\"Minimum 4 karakters vereist\" />" +
		'' +
		"<input name=\"email\" type=\"email\" placeholder=\"e-mail adres\" required>" +
		"<input id=\"rng_password1\" name=\"password\" type=\"password\" placeholder=\"Wachtwoord\" pattern=\".{5,}\" \
		required title=\"Minimum 5 karakters vereist\" />" +
		'' +
		"<input id=\"rng_password2\" name=\"confirmpwd\" type=\"password\" placeholder=\"Herhaal wachtwoord\" \
		pattern=\".{5,}\" required title=\"Minimum 5 karakters vereist\" />",
		buttons:[$.extend({},vex.dialog.buttons.YES,{text:'Registreer'}),
			$.extend({},vex.dialog.buttons.NO,{text:'Cancel'})],
		callback:function(data){
			if (data === false) {return console.log('Cancelled');}
			register_new_user(data);
            return console.log('Registreer nieuwe gebruiker');
        }
	});
	pw1=$("#rng_password1");
	pw2=$("#rng_password2");
	pw1.change({id1:pw1.attr("id"),id2:pw2.attr("id")},function(event){validatePassword2(event);});
	pw2.keyup({id1:pw1.attr("id"),id2:pw2.attr("id")},function(event){validatePassword2(event);});
}

13.2.11. register_new_user()

register_new_user(data)

Function is called by register_new_user_dialogbox()

Arguments:
  • data (Object) – callback data object
Returns:

13.2.11.1. Source code

function register_new_user(data){
    $.ajax({
        url:'/login/register2a.php',
        type:'post',
        data:{vex:1,username:data.username,email:data.email,password:data.password,confirm_password:data.confirmpwd},
        success:function(response){
            var obj=jQuery.parseJSON(response);
            if (obj.hasOwnProperty('register_new_user')){
                msg=obj.register_new_user.message;
                if (obj.register_new_user.code!=1){// NOT SUCCESSFUL
                    for (const key in obj) {
                        if (key==='register_new_user') continue;
                        let value=obj[key];
                        msg+="<br>"+key +"("+value.code+"), ";
                    }
                }
                vex.dialog.alert({className:'vex-theme-os',message:msg});
            }
            else vex.dialog.alert({className:'vex-theme-os',message:'Change password: probably wrong PHP - function has been called.'});
        }
	});
}

13.2.12. wachtwoord_wijzigen_dialogbox()

wachtwoord_wijzigen_dialogbox()

Function is called by user_menu_dialogbox()

Param:
Returns:

13.2.12.1. Source code

function wachtwoord_wijzigen_dialogbox(){
	vex.dialog.open({
		className:'vex-theme-os',
		showCloseButton:true,
		message:'Wachtwoord wijzigen van gebruiker '+name,
		formID:'wachtwoord_wijzigen_form',
		input: '<div style="font-size:1.2em"></div>' + 
		"<input id=\"old_password\" name=\"old_password\" type=\"password\" placeholder=\"Huidig wachtwoord\" required>" +
		'' + "<input id=\"password1\" name=\"password\" type=\"password\" placeholder=\"Nieuw wachtwoord\" \
			pattern=\".{5,}\" required title=\"Minimum 5 characters required\">" +
		'' + "<input id=\"password2\" name=\"confirm_password\" type=\"password\" \
		placeholder=\"Herhaal nieuw wachtwoord\" pattern=\".{5,}\" required \
		title=\"Minimum 5 characters required\">",
		buttons:[$.extend({},vex.dialog.buttons.YES,{text:'Wijzig wachtwoord'}),
			$.extend({},vex.dialog.buttons.NO,{text:'Cancel'})],
		callback:function(data){
			if (data === false) {return console.log('Cancelled');}
			wachtwoord_wijzigen(data);
			return console.log('Wijzig wachtwoord (wachtwoord_wijzigen_dialogbox)');
		}
	});
	pw1=$("#password1");
	pw2=$("#password2");
	pw1.change({id1:pw1.attr("id"),id2:pw2.attr("id")},function(event){validatePassword2(event);});
	pw2.keyup({id1:pw1.attr("id"),id2:pw2.attr("id")},function(event){validatePassword2(event);});
}

13.2.13. wachtwoord_wijzigen()

wachtwoord_wijzigen(data)

Function is called by wachtwoord_wijzigen_dialogbox()

Arguments:
  • data (Object) – callback data object
Returns:

13.2.13.1. Source code

function wachtwoord_wijzigen(data){
	$.ajax({
		url:'/login/changepassword.php',
		type:'post',
		data:{vex: 1,old_password:data.old_password,password:data.password},
		success:function(response){
			var obj=jQuery.parseJSON(response);
			var msg="<strong>Change password:</strong>";
			if (obj.hasOwnProperty('changepassword')){
				if (obj.changepassword.code!=1){// NOT SUCCESSFUL
					for (const key in obj) {
						let value=obj[key];
						msg+="<br>&#9679; "+key +"("+value.code+"), "+value.message;// Bullet symbol
					}
					vex.dialog.alert({className:'vex-theme-os',message:msg});
				}
				else window.location.replace(document.referrer);
			}
			else vex.dialog.alert({className:'vex-theme-os',message:'Change password: probably wrong PHP - function has been called.'});
		}
	});
}

13.3. Functions in file dlgboxes_public.js

13.3.1. adminuser_dialogbox_pub()

adminuser_dialogbox_pub()
Param:
Returns:

13.3.1.1. Source code

function adminuser_dialogbox_pub(reason){
	const STATUS_WINDOW=7;
	const LOGIN=2;
	var message = 'Media update is waarschijnlijk nodig. ';
	if (reason !== undefined) {
		message += 'Redenen: <br>'+ reason;
	}
	message += 'Log in als geregistreerde of admin gebruiker, of toon status window.';
	vex.dialog.open({
		className:'vex-theme-os',
		showCloseButton:true,
		message:message,
		buttons: [$.extend({},vex.dialog.buttons.YES,{text:'Login',
				click:function($vexContent,event) {
					$vexContent.data().vex.value=LOGIN;
					vex.close($vexContent.data().vex.id);
				}}),
				$.extend({},vex.dialog.buttons.NO,{text:'Cancel'}),
				$.extend({},vex.dialog.buttons.NO,{text:'Status window',
				click:function($vexContent,event) {
					$vexContent.data().vex.value=STATUS_WINDOW;
					vex.close($vexContent.data().vex.id);
			}})],
		callback:function(data){
			if (data === false) {
				overlayClose();			
				return;
			}
			switch (data){
				case LOGIN:
					overlayClose();
					$('#login_button').trigger('click',[{placeholder:'admin'}]);
				break;
				case STATUS_WINDOW:$('.modal-overlay .modal-body2').css({'display':'inline-block'});
				break;
			}
		}
	});
}

13.3.2. login_dialogbox()

login_dialogbox(event, params)

Function is called by callback function of login button.

Arguments:
  • event (Object) –
  • params (Object) – Parameters for future extensions. For example: placeholder string values for a variety of languages. Now it is undefined 🡺 language is Dutch.
Returns:

Void

13.3.2.1. Source code

function login_dialogbox(event,params){
   var placeholder
	if (params === undefined || params === null) placeholder = 'Gebruikersnaam';
	else placeholder = params.placeholder;
	vex.dialog.open({
		className:'vex-theme-os',
		showCloseButton:true,
		message:'Login voor family',
		input: '<div style="font-size:1.1em">Gebruiker</div>'+ "<input name=\"username\" type=\"text\" placeholder=" + placeholder + " minlength=\"3\" pattern=\"^\\s*\\S+\\s*$\" required /> " +
			'' + "<input name=\"password\" type=\"password\" placeholder=\"Wachtwoord\" required />",
		buttons:[$.extend({},vex.dialog.buttons.YES,{text:'Aanmelden'}),
			$.extend({},vex.dialog.buttons.NO,{
				text:'Wachtwoord vergeten',
				click: function($vexContent, event) {
					$vexContent.data().vex.value = 'wachtwoord_vergeten';
					vex.close($vexContent.data().vex.id);
				}
			})
		],
		callback:function(data){
			if (data === false){return console.log('Cancel');}
			else if (data === 'wachtwoord_vergeten'){
				wachtwoord_vergeten_dialogbox();
				return;
			}
			login2(data,event);
		}
	});
}

13.3.3. login2()

login2(data, event)

Function is called by login_dialogbox(). The original function name was login(), but is renamed to login2() (apparently login is a reserved word in Sphinx and cannot be used as a reference name). The function itself will execute an AJAX call to login.min.php. When login is successful, the user SID is stored in the window sessionStorage property with name user_sid. (sessionStorage object stores data for only one session, which means that the data is deleted when the browser tab is closed.) sessionStorage info is used to determine to apply the private mode of a webpage or not.

Arguments:
  • data (Object) – callback data from VEX dialog box object,
  • event (Object) – Event data from login button click (see also Table 1.9).
Returns:

Void.

13.3.3.1. Source code

function login2(data,event){
	$.ajax({
		url:'login/login.min.php',
		type:'post',
		data:{username:data.username,password:data.password,page:event.data.sitepage.toString()},
		success:function(response,status){
			var msg;
			var obj=jQuery.parseJSON(response);
			var obj_login;
			if (obj.hasOwnProperty('SqlServerStat')){
				if (obj.SqlServerStat.code==0){
					if (obj.hasOwnProperty('login')){
						obj_login=obj.login;
						switch (obj_login.code){
							case -100:// MYSQL connection error,
							case -5: // Cannot create PHPMailer object
							case -4: // Database does not exist,
							case -3: // MYSQL connection error,
							case -2: // Wachtwoord niet juist,
							case -1: // Unknown user,
							case 0: // Unknown status code,
								msg="<strong>Login failed:</strong>";
								for (const key in obj) {
									let value=obj[key];
									msg+="<br>&#9679; "+key +"("+value.code+"), "+value.message;
								}                
								vex.dialog.alert({className:'vex-theme-os',message:msg});
							break;
							case 2:
								vex.dialog.alert({className:'vex-theme-os',message:obj_login.message});// Admin user
								window.sessionStorage.setItem("user_sid",obj.SID.code);
								window.location.replace(obj_login.private_url);
							break;
							case 1:
								window.sessionStorage.setItem("user_sid",obj.SID.code);
								window.location.replace(obj_login.private_url);
							break;
						}
					}
				}
				else {
					msg="<strong>Login failed:</strong>";
					for (const key in obj) {
						let value=obj[key];
						msg+="<br>&#9679; "+key +"("+value.code+"), "+value.message;
					}
					vex.dialog.alert({className:'vex-theme-os',message:msg});
				}
			}
		},
		error: function(xhr,desc,err) {
			console.log(xhr);
			console.log("Details: "+desc+"\nError:"+err);
		}
	});
}

13.3.4. wachtwoord_vergeten_dialogbox()

wachtwoord_vergeten_dialogbox(event)

Function is called by login_dialogbox()

Arguments:
  • event (Object) –
Returns:

13.3.4.1. Source code

function wachtwoord_vergeten_dialogbox(event){
	vex.dialog.open({
		className:'vex-theme-os',
		showCloseButton:true,
		message:'Wachtwoord vergeten',
		input:'<div style="font-size:1.2em">Gebruiker</div>'+ "<input name=\"username\" type=\"text\" placeholder=\"Username\" minlength=\"3\" pattern=\"^\\s*\\S+\\s*$\" required /> " +
			'' + "<input name=\"email\" type=\"email\" placeholder=\"e-mail address\" required />",
		buttons: [$.extend({},vex.dialog.buttons.YES,{text: 'Verstuur'}),
				$.extend({},vex.dialog.buttons.NO,{text:'Cancel'})],
		callback: function(data){
			if (data!==false) wachtwoord_vergeten(data);
			return;
		}
	});
}

13.3.5. wachtwoord_vergeten()

wachtwoord_vergeten(data)

Function is called by wachtwoord_vergeten_dialogbox()

Arguments:
  • data (Object) – callback data object,
  • params (Object) –
Returns:

13.3.5.1. Source code

function wachtwoord_vergeten(data){
	$.ajax({
		url:'login/wachtwoordvergeten.min.php',
		type:'post',
		data:{username:data.username,email:data.email},
		success:function(response){
			var obj=jQuery.parseJSON(response);
         var msg="<strong>Request for password reset:</strong>";
//         if (obj.hasOwnProperty('ForgotPassword')) msg=obj.ForgotPassword.message;
//            msg=obj.ForgotPassword.message;
         for (const key in obj) {
//            if (key==='ForgotPassword') continue;
            let value=obj[key];// Possible key values: email, LogDbTable
            msg+="<br>&#9679; "+key +"("+value.code+"), "+value.message;
         }
         vex.dialog.alert({className:'vex-theme-os',message:msg});
//         }
		}
	});
}

13.4. Functions in file generate_jssor_code.js

13.4.1. chainedXHRequest()

chainedXHRequest(dir, url, method, params, containerID)

Function is called by prepareDirOverviewGallery(), and does the actual AJAX XMLHttpRequest to the server. When the XMLHttpRequest is finished the function processResponse() is called to process the retruned JSON string.

Arguments:
  • dir (String) – Directory path of album with respect to document root
  • url (String) – php\prepareDirOverviewGalleryAjax.php
  • method (String) – ‘POST’
  • params (String) –
  • containerID (String) – ID of div element
Returns:

Object promise:

13.4.1.1. Source code

function chainedXHRequest(dir,url,method,params,containerID){
	return new Promise(function(resolve,reject) {
		var request = getXHR();
		var albumDirThumbStatHtml;

		request.responseType = 'text';
		request.previous_text='';
		request.open(method,url,true);
		request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
		request.send(params);
		request.onreadystatechange = function() {
			if (request.readyState == 4) {// request finished and response is ready
				switch(request.status){
					case 200: //
						albumDirThumbStatHtml = processResponse(dir,request.responseText,containerID);
						if (albumDirThumbStatHtml.status.albumExists) resolve(albumDirThumbStatHtml); // Fullfilled
						else reject('Album directory '+dir+' does not exist'); // Promise rejected --> catch
					break;
					case 203,204: // See https://www.w3schools.com/tags/ref_httpmessages.asp
					break;
					default:
						reject(request.status);
				}
			}
		};
		request.onerror = function() {
			console.log("Network Error");
			reject(Error("Network Error"));
		};
	});
}

13.4.2. generateDirectoryOverview()

generateDirectoryOverview(jsList, phpDef, containerID)
Arguments:
  • jsList (JSON_Object) –
  • phpDef (Boolean) –
  • containerID (String) –
Returns:

13.4.2.1. Source code

function generateDirectoryOverview(jsList,phpDef,containerID){
// Description: see document WWW-notes.docx, section 10.6 (Directory overview of an album)
	var container = document.getElementById(containerID);
	var i,len1,j,entry;
	var e,div1,div2,a,a2,a3,thumb,caption,divStory,divStoryContent,divButton;
	len1=jsList.length;
	if (phpDef.dirDescription){
		for (i=0;i<len1;i++){
			entry=jsList[i];
			div1=document.createElement('div');
			div1.setAttribute('class','directoryThumbs');
			div1.style.width='100%';
			a=document.createElement('a');
			a.setAttribute('class','directoryThumbsAnchor');
			a.setAttribute('href',entry[0]['attrib']['href']);
			div1.appendChild(a);
			div2=document.createElement('div');
			div2.setAttribute('class','directoryThumb');
			thumb=document.createElement('img');
			thumb.setAttribute('src',entry[1]['attrib']['src']);
			thumb.setAttribute('class',entry[1]['attrib']['class']);
			thumb.setAttribute('title',entry[1]['attrib']['title']);
			caption=document.createElement('div');
			caption.innerHTML=entry[2]['attrib']['innerHTML'];
			divStory=document.createElement('div');
			divStory.setAttribute('class','directoryStory');
			a2=document.createElement('a');
			a2.setAttribute('class','txt-2');
			a2.setAttribute('id',entry[3]['attrib']['id']);
			a2.setAttribute('href',entry[3]['attrib']['href']);
			a2.innerHTML=entry[3]['attrib']['innerHTML'];
			divStoryContent=document.createElement('div');
			divStoryContent.setAttribute('class','StoryContent');
			divStoryContent.setAttribute('id',entry[4]['attrib']['id']);
			divStoryContent.innerHTML=entry[4]['attrib']['innerHTML'];
			divButton=document.createElement('div');
			divButton.setAttribute('class','p3');
			a3=document.createElement('a');
			a3.setAttribute('class','btn1');
//			j=Object.keys(entry[5]).length-1;
//			a3.setAttribute('onclick',Object.values(entry[5].attrib)[j]);
			a3.setAttribute('onclick',entry[5]['attrib']['onclick']);
			a3.innerHTML=entry[5]['attrib']['innerHTML'];
			divButton.appendChild(a3);
			divStory.appendChild(a2);
			divStory.appendChild(divStoryContent);
			div2.appendChild(thumb);
			div2.appendChild(caption);
			div1.appendChild(divStory);
			div1.appendChild(divButton);
			a.appendChild(div2);
			container.appendChild(div1);
		}
	}
	else {
		var frag=document.createDocumentFragment();
		for (i=0;i<len1;i++){
			entry=jsList[i];
			div1=document.createElement('div');
			div1.className='directoryThumbs';
			frag.appendChild(div1);
			a=document.createElement('a');
			a.setAttribute('href',entry[0]['attrib']['href']);
			div1.appendChild(a);
			div2=document.createElement('div');
			div2.className='directoryThumb';
			a.appendChild(div2);
			thumb=document.createElement('img');
			thumb.className='directoryThumb';
			thumb.setAttribute('src',entry[1]['attrib']['src']);
			div2.appendChild(thumb);
			caption=document.createElement('div');
			caption.innerHTML=entry[2]['attrib']['innerHTML'];
			div2.appendChild(caption);			
		}
		container.appendChild(frag);
	}
}

13.4.3. prepareDirOverviewGallery()

prepareDirOverviewGallery(parent, dir, gpf, private_, caller, containerID)

Function is alled by generateOverview(). The album overview (media is structured in different directories) is generated using the promise concept by calling the function chainedXHRequest().

Arguments:
  • parent (String) – For the current albums the values for parent directory are: reizen, and dany\reizen.
  • dir (String) – location directory
  • gpf (String) – HTML or PHP filename with implementation gallery code (familie-gallery.php, familie-gallery-private.php, dany-fietsgallery.php, dany-fietsgallery-private.php).
  • private (Boolean) –
  • caller (String) –
  • containerID (String) – ID tag of div element in which the code of the album overview is generated.
Returns:

13.4.3.1. Source code

function prepareDirOverviewGallery(parent,dir,gpf,private_,caller,containerID){
	var pageReload;
	var new_im_cnt,new_vi_cnt,putback_im_cnt,putback_vi_cnt;
	var vP=window.sessionStorage.getItem("previousPage");
	var cP=window.sessionStorage.getItem("currentPage");
	var wdir=parent+'/'+dir;
	var uname,sid;

	if(vP == cP){pageReload=true;}
	else{pageReload=false;}
	var params='parent='+parent+'&dir='+dir+'&gpf='+gpf+'&private='+private_+'&caller='+caller+'&pageReload='+pageReload;
	chainedXHRequest(wdir,'php/prepareDirOverviewGalleryAjax.php','POST',params,containerID)
		.then(function (albumDirThumbStatHtml) {
// Argument of anonymous function in the promise.then method is determined by the argument of the resolve function in the promise
			if (albumDirThumbStatHtml.status.updateProgressDialogBox){
				uname=albumDirThumbStatHtml.server_info.uname;
				sid=albumDirThumbStatHtml.server_info.sid;
				new_im_cnt=albumDirThumbStatHtml.media.iminfo.NewImageCnt;
				new_vi_cnt=albumDirThumbStatHtml.media.iminfo.NewVideoCnt;
				putback_im_cnt=albumDirThumbStatHtml.media.iminfo.PutBackM_ImageCnt;
				putback_vi_cnt=albumDirThumbStatHtml.media.iminfo.PutBackM_VideoCnt;
				media_update_progress_dialogbox(new_im_cnt,new_vi_cnt,putback_im_cnt,putback_vi_cnt,uname,sid,wdir);
				console.log('prepareDirOverviewGallery: chainedXHRequest->Succes: UPDATE PROCESS DIALOG WINDOW');				
			} else {
				console.log('prepareDirOverviewGallery: chainedXHRequest->Succes: NO UPDATE PROCESS DIALOG WINDOW');
			}
		}
	)
	.catch(function(rej){console.log('prepareDirOverviewGallery: chainedXHRequest->reject: '+ rej)});
// Argument of anonymous function in the promise.catch method is determined by the argument of the reject function in the promise
}

13.4.4. processResponse()

processResponse(dir, responseText, containerID)
Arguments:
  • dir (String) – parent directory
  • responseText (String) –
  • containerID (String) –
Returns:

13.4.4.1. Source code

function processResponse(dir,responseText,containerID){
	var albumDirThumbStatHtml=JSON.parse(responseText);
	var dirImList=albumDirThumbStatHtml.dirImList;
	var servInfo=albumDirThumbStatHtml.server_info;

	if (!albumDirThumbStatHtml.status.albumExists) return (albumDirThumbStatHtml);
	if (servInfo.debugJS){
      console.log("processResponse: Global STATUS CODE (bin.rep.): "+ albumDirThumbStatHtml.infoDialogBox.globalstat2binstr.all_parts);
		console.log("processResponse: username: "+servInfo.uname+", hostaddress: "+servInfo.hostaddress);
		if (albumDirThumbStatHtml.status.updIminfoCMIF_1!=null) {
			console.log("processResponse(->check_mediacount_iminfo_files[=CMIF]): directory, out#1, out#2-modus");
			console.log(albumDirThumbStatHtml.status.updIminfoCMIF_1);
			console.log(albumDirThumbStatHtml.media.iminfo);
		}
	}
	if (albumDirThumbStatHtml.phpDef.exists){
		// albumDirThumbStatHtml.jsList is assigned in PHP function GenerateDirOverview() implemented in file prepareDirOverviewGallery.php
		generateDirectoryOverview(albumDirThumbStatHtml.jsList,albumDirThumbStatHtml.phpDef,containerID);
		if (albumDirThumbStatHtml.infoDialogBox.show){mediaProcessingDialogBox(albumDirThumbStatHtml);}
	}
	else {
		if ((dirImList.length==1)&&(!dirImList[0].isDir)){
			$("#innerWrapper").append("<div class=\"inner-6\"><div class=\"txt-2\">Directory "+dirList[0].name+" does not exist.</div></div>");
			console.log("processResponse: Folder "+dirImList[0]);
		}
		else if (dirImList.length>0){ // SEE MYFUNCTION.PHP: CreateJSORR_Gallery2
			var hasCaptions=false;
			var len,html_str;
			var i,j,len1;

			len=dirImList.length;
			$("#innerWrapper").append("<div id=\"slider1_container\" class=\"jssor_container\">");
			html_str="<div id=\"load_div\" u=\"loading\" style=\"position:absolute;top:0px;left:0px;\">";
			html_str+="<div style=\"filter:alpha(opacity=70);opacity:0.7;position:absolute;display:block;background-color:#000000;top:0px;left:0px;width:100%;height:100%;\"></div>";
			html_str+="<div style=\"position:absolute;display:block;background:url(images/loading.gif) no-repeat center center;top:0px;left:0px;width:100%;height:100%;\"></div>";
			html_str+="</div>";
			html_str+="<div id=\"mySlideBox\" class=\"SlideBox2\" u=\"slides\">";
			if (hasCaptions==false){
				for (i=0;i<len;i++) {
					len1=dirImList[i].imList.length;
					for (j=0;j<len1;j++){
						html_str+="<div>\n";
						html_str+="<img u=\"image\" src="+dir+'/'+dirImList[i].imList[j]+" />\n";
						html_str+="<div u=\"thumb\">Krekels</div>\n";
						html_str+="</div>\n";
//						cname=dir+'/'+dirImList[i].imList[j];
//						console.log("processResponse: " + j+ "  "+cname);
					}
				}
			}
			else {
				for (i=0;i<len;i++) {
					len1=dirImList[i].imList.length;
					for (j=0;j<len1;j++){
						html_str+="<div>\n";
						html_str+="<img u=\"image\" src="+dir+'/'+dirImList[i].imList[j]+" />\n";
						html_str+="<div u=\"thumb\">Krekels</div>\n";
						html_str+="<div u=\"caption\" style=\"position:absolute;bottom:0px;left:0px;width:100%;height:40px\">\n";
						html_str+="<div class=\"CaptSizePos CaptBackground\"></div>\n";
						html_str+="<div class=\"CaptSizePos CaptStrProp\"></div>\n";
						html_str+="</div>\n";
						html_str+="</div>\n";
//						cname=dir+'/'+dirImList[i].imList[j];
//						console.log("processResponse: " + j+"  "+cname);
					}
				}
			}
			html_str+="</div>\n";
			html_str+="<span u=\"arrowleft\" class=\"jssora05l\" style=\"width:40px;height:40px;top:350px;left:8px;\"></span>";
			html_str+="<span u=\"arrowright\" class=\"jssora05r\" style=\"width:40px;height:40px;top:350px;right:8px\"></span>";
			$("#slider1_container").append(html_str);
			console.log("processResponse: Number of directories in basic album: "+dirImList.length);
		}
		else{console.log("processResponse: Folder "+dir+" has no media.");}
	}
	if (albumDirThumbStatHtml.status.proposeRegUserOrAdmin.login){
		if (servInfo.uname==WEBSITE_VISITOR){
			adminuser_dialogbox_pub(albumDirThumbStatHtml.status.proposeRegUserOrAdmin.reason);
		}
		else if (albumDirThumbStatHtml.status.permissionLevel.current > VISITOR_PERMISSION_LEVEL){
			adminuser_dialogbox();
		}
	}
	$.getScript("js/myjs/vakantie.js");
	return (albumDirThumbStatHtml);
}

13.5. Functions in file generate_jssor_code(2).js

13.5.1. createGalleryContent2()

createGalleryContent2(private, divWrapper, uppage, queryParam)
Arguments:
  • private (Boolean) –
  • divWrapper (String) –
  • uppage (String) –
  • queryParam (String) –
Returns:

13.5.1.1. Source code

function createGalleryContent2(private,divWrapper,uppage,queryParam){
//	let p1=await loadHTML_file("htmlInclude/gallery.html",divWrapper);
	var xhr=getXHR();
	var parent=$_GET("parent");
	var locDir=$_GET("locDir");
	var vacDir=$_GET("vacDir");
	var title=unescape(getQuerystring('title'));
	var vP=window.sessionStorage.getItem("previousPage");
	var cP=window.sessionStorage.getItem("currentPage");
	var fullUpPage="/"+uppage+"?"+encodeQueryData(queryParam);

	if(vP===cP){pageReload=true;}
	else{pageReload=false;}
	var params='parent='+parent+'&locDir='+locDir+'&vacDir='+vacDir+'&private='+private+'&pageReload='+pageReload;
	
	fetch("htmlInclude/gallery.html")
		.then(status)
		.then(function(response){return response.text();})
		.then(function(data){ document.getElementById(divWrapper).innerHTML=data;return 1;})
		.then(function(data){
			xhr.open('POST','php/prepareGalleryAjax.php',true);
			xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
			xhr.send(params);
			xhr.onreadystatechange=function(){
				try {
					if (xhr.readyState==4){ // Operation complete
						albumDir4Html=JSON.parse(xhr.responseText);
						generateGalleryCode(albumDir4Html,"slider1_container");
						var script=document.createElement('script');
						script.src="js/myjs/vakantie.js";
						document.getElementsByTagName('head')[0].appendChild(script);
		//				$.getScript("js/myjs/vakantie.js");
		//				addCallerArgumentToURL(".buttonHolder a",document.referrer);
						addCallerArgumentToURL(".buttonHolder a",fullUpPage);
					}
				}
				catch (e){console.log("[XHR] Exception(2): " + e);}	
			}
			$('#TitleSlideShow').append(unescape(vacDir) + ": " + title);
		})
		.catch(function(error){console.log('loadHTML_file: Request failed',error);});
}

13.6. Functions in file overzicht.js

13.6.1. generateOverview()

generateOverview(type, parentDir, gallery, uppage, private_modus)

High level function to generate album directory overview (media of an album are distributed over different directories), and is called from familie-vakantie.php, familie-vakantie-private.php, dany-fiets.php, and dany-fiets-private.php. See also section Section 4.3, and Table 4.1. The functions prepareDirOverviewGallery() and vakantie_overzicht() are called. The major album code generating actions are implemented in the function prepareDirOverviewGallery(). Note: there is also a low-level function for generating album directory overview (i.e. JavaScript code which actually generates HTML code: generateDirectoryOverview().

Arguments:
  • type (Enumeration) – Possible values are: bicycle, holiday
  • parentDir (String) – parent directory. For the current albums the values for parent directory are: reizen, and dany\reizen.
  • gallery (String) – HTML or PHP filename with implementation gallery code. For the current albums the gallery files are dany-fietsgallery.php, dany-fietsgallery-private.php, familie-gallery.php, and familie-gallery-private.php
  • uppage (String) – HTML or PHP filename (URL) to be called when back button is pressed. See also Fig. 1.4.
  • private_modus (Boolean) –
Returns:

Nothing

13.6.1.1. Source code

// JavaScript Document: this file must be included after all HTML code.
// Reason is that there are references to HTML ID objects. If called at the beginning
// these ID's are not yet defined! This means the functions are loaded into memory when 
// reading the script file, and not loaded when they are called
function generateOverview(type,parentDir,gallery,uppage,private_modus){
	var vakantieDir;
	var vakantiefile;
	var str;
	var caller=$_GET("caller");
	
	if (type==="bicycle"){
		vakantieDir=$_GET("fietsDir");
		vakantiefile=$_GET("fietsfile");
		str="fietsDir";
	}
	else if (type==="holiday"){
		vakantieDir=$_GET("vakantieDir");
		vakantiefile=$_GET("vakantiefile");
		str="vakantieDir";
	}
	phpGeneratedHTMLCode=false;
	if (vakantieDir!=null){
		if (caller==null) caller='parent';
		prepareDirOverviewGallery(parentDir,vakantieDir,gallery,private_modus,caller,"innerWrapper");
	}
	else if (vakantiefile!=null) loadHTML_file(vakantiefile,"innerWrapper");
	vakantie_overzicht(str,phpGeneratedHTMLCode,uppage)
}

13.6.2. vakantie_overzicht()

vakantie_overzicht(gquerystr, phpGeneratedHTMLCode, uppage)

Add some additional features to the album’s overview container box: title of album, up page button with callack.

Arguments:
  • gquerystr –
  • phpGeneratedHTMLCode (Boolean) –
  • uppage –
Returns:

Nothing
_images/Fig_Function_Vakantie_overzicht.png

Fig. 13.1 Added features are indicated.

13.6.2.1. Source code

function vakantie_overzicht(gquerystr,phpGeneratedHTMLCode,uppage){
// Arg 2 Boolean: phpGeneratedHTMLCode. If true, the album HTML code will be generated by a direct PHP function. If false HTML code is generated with AJAX call
// Arg 3 String: uppage. Filename of the parent of the calling webpage. ("back")
	var vDir=unescape(getQuerystring(gquerystr));
	var _anchor=document.querySelector('.button.cross');
// Setting of height is not needed anymore: scrolling is disabled (overflow: hidden), and top and bottom are set to 0.
//	var height=$('#content').height();
//	height+=$('header.mysite').height();
//	height+=$('footer').height();
//	$('#process_popup').height(height);
	$('#TitleHoliday').append('&#160;'+vDir);
	_anchor.setAttribute('title',uppage);
	_anchor.href='/'+uppage;
//	var w1=$('#part-1-table').width();
//	var w2=$('#part-2-table').width();
//	var w3=$('#part-3-table').width();
//	$('.content section').css({'display':'none'});
//	Modal.init();
	// Generate dialog box with tabs for table with media processing info
	new CBPFWTabs( document.getElementById('tabs'));
	if (phpGeneratedHTMLCode==true){
		str=$('.modal-overlay section #part-4-table').html();
		if (str.length==0) $('#tab4').parent().css({'display':'none'});
	}
//	if (propose_admin_user) adminuser_dialogbox();
}

13.7. Functions in file public_private.js

13.7.1. Source code

function getQuerystring(key, default_)
// Reference:
{
  if (default_==null) default_=""; 
  key=key.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
  var regex=new RegExp("[\\?&]"+key+"=([^&#]*)");
  var qs=regex.exec(window.location.href);
  if(qs==null)
    return default_;
  else
    return qs[1];
}

// Reference: https://www.creativejuiz.fr/blog/en/javascript-en/read-url-get-parameters-with-javascript
// Without argument $_GET returns all the parameters an array of strings
function $_GET(param) {
	var vars = {};
	window.location.href.replace( location.hash, '' ).replace(/[?&]+([^=&]+)=?([^&]*)?/gi, // regexp
		function(m,key,value) { // callback
			vars[key] = value !== undefined ? value : '';
		}
	);
	if (param){
		return vars[param]?vars[param]:null;
	}
	return vars;
}

// delete_fotoproc_file_Begin
function delete_fotoproc_file(event){
// Reference: http://api.jquery.com/on/
// The function overlayClose is not yet defined when loading this file!
	var dirname=event.data.arg1; // Directory name
	var debug=event.data.arg2;
	var close_status_window=event.data.closeParent;
	$.ajax({
		type:'post',
		url:'php/delete.php',
		data:{dirname:dirname,fname:'fproc.txt'},
		success:function(response_from_delete){
			if (debug){
				var str=response_from_delete;
// Alert window will normally not pop up because its parent window is immediately closed,
// unless another alert popup is initiated in some debug code.
				alert(str);
			}
		}
	});
	if (close_status_window) overlayClose();
}
// delete_fotoproc_file_End

// delete_fotoproc_file_back2calling_page_Begin
function delete_fotoproc_file_back2calling_page(event){
// Reference: http://api.jquery.com/on/
// The function overlayClose is not yet defined when loading this file!
	var dirname=event.data.arg1; // Directory name
	var debug=event.data.arg2;
	var close_status_window=event.data.closeParent;
	$.ajax({
		type:'post',
		url:'php/delete.php',
		data:{dirname:dirname,fname:'fproc.txt'},
		success:function(response_from_delete){
			if (debug){
				var str=response_from_delete;
				alert(str);
			}
		}
	});
	if (close_status_window) overlayClose();
	$('.button.cross')[0].click();
}
// delete_fotoproc_file_back2calling_page_End

// AnalyseDeletedAndNewMedia_Begin
function AnalyseDeletedAndNewMedia(event){
// Script is called by StatusInfoWindow in myFunction.php / prepareDirOverviewGalleryAjax.php
// In the FULL JAVASCRIPT option the script is called by StatusInfoWindow_ok_Callbacks implemented in generate_jssor_code.js
// THIS FUNCTION USES HTML5 FEATURES!!
//	http://www.codeproject.com/Articles/18869/File-Handling-at-Client-Side-Using-Javascript
// Can only be used on IE
//	var root = "C:\\Dany\\PrivateWWW\\Dreamweaver\\Benoy-2\\";
//	var fso = new ActiveXObject("Scripting.FileSystemObject");
// 2=overwrite, true=create if not exist, 0 = ASCII
//	varFileObject = fso.OpenTextFile(root+'test.txt', 2, true,0);
//	varFileObject.write("File handling in Javascript");
//	varFileObject.close();
// http://jsfiddle.net/s4tyk/
//	var dirname=event.data.arg1;
	var info=event.data.arg1;// Already converted to JSON string in PHP code
//	var ndmt_id=event.data.arg2;// ID of new or deleted media table
	var newMedia=event.data.arg2;// Already converted to JSON string in PHP code
	var remMedia=event.data.arg3;// Already converted to JSON string in PHP code
	var headersText=[];
	var myRows=[]; // Declared as array. Note multidimensional associative arrays can not be declared 
	var Names=[];
//	var ndmt_id='#'+info.ndmt; NOT USED
// GET TABLE HEADERS
	var $headers = $("#NewOrDeletedMedia-table th");
// GET TABLE DATA: Loop through grabbing everything
	var $rows=$("#NewOrDeletedMedia-table > tbody tr").each(function(index){
		$cells=$(this).find("td");
		myRows[index]={}; // Each element of the array is an object (--> can be an associative array)
		Names[index]={};
		Names[index]['orgname']=$cells[1].dataset.orgname;
		Names[index]['pub_priv']=$cells[1].dataset.pubpriv;
		$cells.each(function(colNr) {// colNr is column counter
// Set the header text for each column
			if(headersText[colNr]===undefined){ // First time in the loop the headersText is undefined
				headersText[colNr]=$($headers[colNr]).text();
			}
// Update the row object with the header/cell combo
			if (colNr==4){
				// Level 1 firstChild is div
				// Level 2 firstChild is radio button input
//				myRows[index][colNr]=$cells[4].firstChild.firstChild.checked?1:0;
				myRows[index][colNr]=$cells[4].firstChild.querySelector('input').checked?1:0;
//				btnStat=$cells[4].firstChild.querySelector('input').checked;
			} 
			else {
				myRows[index][colNr]=$(this).html();
			}
		});
	});
	var json_str1=JSON.stringify(myRows);
	var json_str2=JSON.stringify(Names);
	$.ajax({
		type:'post',
		url:'php/analyse_status_table.php',
		data:{json_str1:json_str1,json_str2:json_str2,json_str3:newMedia,json_str4:remMedia,info:info},
		success:function(response_from_analysis){
			if ((response_from_analysis.length)>0) alert(response_from_analysis);
		},
		error: function(req,status,err ){
         console.log('something went wrong',status,err);
  	   }
	});
	overlayClose();
}
// AnalyseDeletedAndNewMedia_End

function addCallerArgumentToURL(elmt, url_org){
	if (url_org.search('caller=child')===-1){
		var url_new=url_org+'&caller=child';
		$(elmt).attr({'href':url_new,'title':url_new});
	}
	else $(elmt).attr({'href':url_org,'title':url_org});
}

// Reference: http://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript
function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, "\\$&");
    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, " "));
}

// References: 
// 1) http://jsfiddle.net/philfreo/MqM76/
// 2) http://stackoverflow.com/questions/1582534/calculating-text-width/15302051#15302051
$.fn.textWidth = function(text, font) {
    if (!$.fn.textWidth.fakeEl) $.fn.textWidth.fakeEl = $('<span>').hide().appendTo(document.body);
    $.fn.textWidth.fakeEl.text(text || this.val() || this.text()).css('font', font || this.css('font'));
    return $.fn.textWidth.fakeEl.width();
}

function checkCookie(){
	var cookieEnabled = navigator.cookieEnabled;
		if (!cookieEnabled){ 
			document.cookie = "testcookie";
			cookieEnabled = document.cookie.indexOf("testcookie")!=-1;
		}
		return cookieEnabled || cookies_blocked_dialogbox();
}

function GetClock(){
	var d=new Date();
	var nday=d.getDay(),nmonth=d.getMonth(),ndate=d.getDate(),nyear=d.getYear(),nhour=d.getHours(),nmin=d.getMinutes(),nsec=d.getSeconds(),ap;
	if(nhour==0){ap=" AM";nhour=12;}
	else if(nhour<12){ap=" AM";}
	else if(nhour==12){ap=" PM";}
	else if(nhour>12){ap=" PM";nhour-=12;}
	if(nyear<1000) nyear+=1900;
	if(nmin<=9) nmin="0"+nmin;
	if(nsec<=9) nsec="0"+nsec;
	document.getElementById('clockbox').innerHTML=""+(nmonth+1)+"/"+ndate+"/"+nyear+" "+nhour+":"+nmin+":"+nsec+ap+"";
}

// initSessionStorage_Begin
function initSessionStorage(menupage,sitepage){
	if (sitepage===undefined){sitepage=menupage;}
	if(window.sessionStorage.getItem("currentPage") !== null){
		window.sessionStorage.setItem("previousPage", window.sessionStorage.getItem("currentPage"));
	}
	else {
		window.sessionStorage.setItem("previousPage", null);
	}
	window.sessionStorage.setItem("currentPage", sitepage);
}
// initSessionStorage_End

// https://stackoverflow.com/questions/16772568/xmlhttprequest-browser-support
// Gets an XMLHttpRequest. For Internet Explorer 6, attempts to use MSXML 6.0, then falls back to MXSML 3.0.
// Returns null if the object could not be created. @return {XMLHttpRequest or equivalent ActiveXObject} 
function getXHR() { 
	if (window.XMLHttpRequest) {
	// Chrome, Firefox, IE7+, Opera, Safari
		return new XMLHttpRequest(); 
	} 
	// IE6
	try { 
	 // The latest stable version. It has the best security, performance, 
	 // reliability, and W3C conformance. Ships with Vista, and available 
	 // with other OS's via downloads and updates. 
		return new ActiveXObject('MSXML2.XMLHTTP.6.0');
	}
	catch (e) { 
		try { 
		// The fallback.
			return new ActiveXObject('MSXML2.XMLHTTP.3.0');
		}
		catch (e) { 
			alert('This browser is not AJAX enabled.'); 
			return null;
		} 
	} 
}

function encodeQueryData(qdata) {
	var ret=[];
	for (d in qdata){
		ret.push(d+'='+qdata[d]);
	}
	return ret.join('&');
}

function status(response) {
	if (response.status >= 200 && response.status < 300) return Promise.resolve(response)
	else return Promise.reject(new Error(response.statusText))
}

function loadHTML_file(fname,divID){  
// Fetch API is not yet supported by all webbrowsers --> ab XMLHttpRequest based method is needed --> includeHTML()
// Fetch returns a Promise object
	fetch(fname)
		.then(status)
		.then(function(response){return response.text();})
		.then(function(data){ document.getElementById(divID).innerHTML=data;})
		.catch(function(error){console.log('loadHTML_file: Request failed',error);});
}

function includeHTML() { 
// Reference https://www.w3schools.com/howto/tryit.asp?filename=tryhow_html_include_1
// An alternative is function loadHTML_file()
	var z,i,elmnt,file,xhttp;
	/*loop through a collection of all HTML elements:*/
	z = document.getElementsByTagName("*");
	for (i=0; i < z.length;i++) {
		elmnt=z[i];
		/*search for elements with a certain atrribute:*/
		file=elmnt.getAttribute("w3-include-html");
		if (file) {
		/*make an HTTP request using the attribute value as the file name:*/
			xhttp = new XMLHttpRequest();
			xhttp.onreadystatechange=function() {
				if (this.readyState==4) {
					if (this.status==200) {elmnt.innerHTML=this.responseText;}
					if (this.status==404) {elmnt.innerHTML="Page not found.";}
				/*remove the attribute, and call this function once more:*/
					elmnt.removeAttribute("w3-include-html");
					includeHTML();
				}
			}      
			xhttp.open("GET",file,true);
			xhttp.send();
			return;
		}
	}
}

13.7.2. AnalyseDeletedAndNewMedia()

AnalyseDeletedAndNewMedia(event)
Arguments:
  • event (Object) –
Returns:

Nothing

13.7.2.1. Source code

function AnalyseDeletedAndNewMedia(event){
// Script is called by StatusInfoWindow in myFunction.php / prepareDirOverviewGalleryAjax.php
// In the FULL JAVASCRIPT option the script is called by StatusInfoWindow_ok_Callbacks implemented in generate_jssor_code.js
// THIS FUNCTION USES HTML5 FEATURES!!
//	http://www.codeproject.com/Articles/18869/File-Handling-at-Client-Side-Using-Javascript
// Can only be used on IE
//	var root = "C:\\Dany\\PrivateWWW\\Dreamweaver\\Benoy-2\\";
//	var fso = new ActiveXObject("Scripting.FileSystemObject");
// 2=overwrite, true=create if not exist, 0 = ASCII
//	varFileObject = fso.OpenTextFile(root+'test.txt', 2, true,0);
//	varFileObject.write("File handling in Javascript");
//	varFileObject.close();
// http://jsfiddle.net/s4tyk/
//	var dirname=event.data.arg1;
	var info=event.data.arg1;// Already converted to JSON string in PHP code
//	var ndmt_id=event.data.arg2;// ID of new or deleted media table
	var newMedia=event.data.arg2;// Already converted to JSON string in PHP code
	var remMedia=event.data.arg3;// Already converted to JSON string in PHP code
	var headersText=[];
	var myRows=[]; // Declared as array. Note multidimensional associative arrays can not be declared 
	var Names=[];
//	var ndmt_id='#'+info.ndmt; NOT USED
// GET TABLE HEADERS
	var $headers = $("#NewOrDeletedMedia-table th");
// GET TABLE DATA: Loop through grabbing everything
	var $rows=$("#NewOrDeletedMedia-table > tbody tr").each(function(index){
		$cells=$(this).find("td");
		myRows[index]={}; // Each element of the array is an object (--> can be an associative array)
		Names[index]={};
		Names[index]['orgname']=$cells[1].dataset.orgname;
		Names[index]['pub_priv']=$cells[1].dataset.pubpriv;
		$cells.each(function(colNr) {// colNr is column counter
// Set the header text for each column
			if(headersText[colNr]===undefined){ // First time in the loop the headersText is undefined
				headersText[colNr]=$($headers[colNr]).text();
			}
// Update the row object with the header/cell combo
			if (colNr==4){
				// Level 1 firstChild is div
				// Level 2 firstChild is radio button input
//				myRows[index][colNr]=$cells[4].firstChild.firstChild.checked?1:0;
				myRows[index][colNr]=$cells[4].firstChild.querySelector('input').checked?1:0;
//				btnStat=$cells[4].firstChild.querySelector('input').checked;
			} 
			else {
				myRows[index][colNr]=$(this).html();
			}
		});
	});
	var json_str1=JSON.stringify(myRows);
	var json_str2=JSON.stringify(Names);
	$.ajax({
		type:'post',
		url:'php/analyse_status_table.php',
		data:{json_str1:json_str1,json_str2:json_str2,json_str3:newMedia,json_str4:remMedia,info:info},
		success:function(response_from_analysis){
			if ((response_from_analysis.length)>0) alert(response_from_analysis);
		},
		error: function(req,status,err ){
         console.log('something went wrong',status,err);
  	   }
	});
	overlayClose();
}

13.7.3. delete_fotoproc_file_back2calling_page()

delete_fotoproc_file_back2calling_page(event)

Additional callback function of StatusInfoWindow_ok_Callbacks(). The additional callback function is an AJAX interface function to php/delete.php.

Arguments:
  • event (Object) –
Returns:

Nothing

13.7.3.1. Source code

function delete_fotoproc_file_back2calling_page(event){
// Reference: http://api.jquery.com/on/
// The function overlayClose is not yet defined when loading this file!
	var dirname=event.data.arg1; // Directory name
	var debug=event.data.arg2;
	var close_status_window=event.data.closeParent;
	$.ajax({
		type:'post',
		url:'php/delete.php',
		data:{dirname:dirname,fname:'fproc.txt'},
		success:function(response_from_delete){
			if (debug){
				var str=response_from_delete;
				alert(str);
			}
		}
	});
	if (close_status_window) overlayClose();
	$('.button.cross')[0].click();
}

13.7.4. initSessionStorage()

initSessionStorage(menupage, sitepage)
Arguments:
  • menupage (Integer) –
  • sitepage (Integer) –
Returns:

Nothing

13.7.4.1. Source code

function initSessionStorage(menupage,sitepage){
	if (sitepage===undefined){sitepage=menupage;}
	if(window.sessionStorage.getItem("currentPage") !== null){
		window.sessionStorage.setItem("previousPage", window.sessionStorage.getItem("currentPage"));
	}
	else {
		window.sessionStorage.setItem("previousPage", null);
	}
	window.sessionStorage.setItem("currentPage", sitepage);
}