Skip to content

Commit

Permalink
menus still in progress
Browse files Browse the repository at this point in the history
  • Loading branch information
@chinonso098
chinonso098 committed Aug 20, 2024
1 parent 1a6d12d commit e022200
Show file tree
Hide file tree
Showing 6 changed files with 92 additions and 73 deletions.
2 changes: 1 addition & 1 deletion src/app/system-apps/desktop/desktop.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<main class="main-desktop" id="vanta" (contextmenu)="showDesktopContextMenu($event)" (click)="hideContextMenu()" #desktopContainer>
<main class="main-desktop" id="vanta" (contextmenu)="showDesktopContextMenu($event)" (click)="hideContextMenu(name)" #desktopContainer>

<div [@slideStatusAnimation]="slideState" class="dsktp-screen-preview-container" *ngIf="showDesktopScreenShotPreview">
<img [src]="dsktpPrevImg"/>
Expand Down
8 changes: 7 additions & 1 deletion src/app/system-apps/desktop/desktop.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -235,6 +235,7 @@ export class DesktopComponent implements OnInit, OnDestroy, AfterViewInit{
const evtOriginator = this._runningProcessService.getEventOrginator();

if(evtOriginator == ''){
this._menuService.hideContextMenus.next();
this.showDesktopCntxtMenu = true;
this.dskTopCntxtMenuStyle = {
'position':'absolute',
Expand Down Expand Up @@ -294,9 +295,14 @@ export class DesktopComponent implements OnInit, OnDestroy, AfterViewInit{
}
}

hideContextMenu():void{
hideContextMenu(caller?:string):void{
this.showDesktopCntxtMenu = false;
this.showTskBarCntxtMenu = false;

// to prevent an endless loop of calls,
if(caller !== undefined && caller === this.name){
this._menuService.hideContextMenus.next();
}
}

viewByLargeIcon():void{
Expand Down
2 changes: 1 addition & 1 deletion src/app/system-apps/fileexplorer/fileexplorer.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -257,7 +257,7 @@
<!-- ngDraggable [inBounds]="true" zIndex="1" [preventDefaultEvent]="true"
(stopped)="onDragEnd($event)" (started)="onDragStart($event)" -->

<ol [ngClass]="olClassName" (dragover)="onDragOver($event)" (drop)="onDrop($event)" (click)="onHideIconContextMenu()" (contextmenu)="onShowFileExplorerContextMenu($event)" id="olElmnt-{{this.processId}}">
<ol [ngClass]="olClassName" (dragover)="onDragOver($event)" (drop)="onDrop($event)" (click)="onHideIconContextMenu(name)" (contextmenu)="onShowFileExplorerContextMenu($event)" id="olElmnt-{{this.processId}}">
<ng-container [ngTemplateOutlet]="currentViewOption === smallIconsView ? iconsView :
currentViewOption === mediumIconsView ? iconsView :
currentViewOption === largeIconsView ? iconsView :
Expand Down
143 changes: 75 additions & 68 deletions src/app/system-apps/fileexplorer/fileexplorer.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -758,6 +758,7 @@ export class FileExplorerComponent implements BaseComponent, OnInit, AfterViewIn
if(this.showFileExplrCntxtMenu){
this.showFileExplrCntxtMenu = false;
this.fileExplrCntxtCntr = 0;
this._menuService.hideContextMenus.next();
}

const rect = this.fileExplrCntntCntnr.nativeElement.getBoundingClientRect();
Expand Down Expand Up @@ -786,6 +787,80 @@ export class FileExplorerComponent implements BaseComponent, OnInit, AfterViewIn
evt.preventDefault();
}

onShowFileExplorerContextMenu(evt:MouseEvent):void{

const menuHeight = 230; //this is not ideal
this.fileExplrCntxtCntr++;
if(this.iconCntxtCntr >= this.fileExplrCntxtCntr)
return;
else{
this.showIconCntxtMenu = false;
this.iconCntxtCntr = 0;
this._menuService.hideContextMenus.next();
}

const rect = this.fileExplrCntntCntnr.nativeElement.getBoundingClientRect();
const axis = this.checkAndHandleMenuBounds(rect, evt, menuHeight);

const uid = `${this.name}-${this.processId}`;
this._runningProcessService.addEventOriginator(uid);

if(!this.showFileExplrCntxtMenu)
this.showFileExplrCntxtMenu = !this.showFileExplrCntxtMenu;

this.fileExplrCntxtMenuStyle = {
'position': 'absolute',
'transform':`translate(${String(axis.xAxis)}px, ${String(axis.yAxis)}px)`,
'z-index': 2,
}
evt.preventDefault();
}

onHideIconContextMenu(caller?:string):void{
this.showIconCntxtMenu = false;
this.showFileExplrCntxtMenu = false;
this.isShiftSubMenuLeft = false;
this.iconCntxtCntr = 0;
this.fileExplrCntxtCntr = 0;

//First case - I'm clicking only on the desktop icons
if((this.isBtnClickEvt && this.btnClickCnt >= 1) && (!this.isHideCntxtMenuEvt && this.hideCntxtMenuEvtCnt == 0)){

if(this.isRenameActive){
this.isFormDirty();
}
if(this.isIconInFocusDueToPriorAction){
if(this.hideCntxtMenuEvtCnt >= 0)
this.setBtnStyle(this.selectedElementId,false);
}
if(!this.isRenameActive){
this.isBtnClickEvt = false;
this.btnClickCnt = 0;
}
}else{
this.hideCntxtMenuEvtCnt++;
this.isHideCntxtMenuEvt = true;
//Second case - I was only clicking on the desktop
if((this.isHideCntxtMenuEvt && this.hideCntxtMenuEvtCnt >= 1) && (!this.isBtnClickEvt && this.btnClickCnt == 0)){
this.isIconInFocusDueToCurrentAction = false;
this.btnStyleAndValuesChange();
}

// //Third case - I was clicking on the desktop icons, then i click on the desktop.
// //clicking on the desktop triggers a hideContextMenuEvt
// if((this.isBtnClickEvt && this.btnClickCnt >= 1) && (this.isHideCntxtMenuEvt && this.hideCntxtMenuEvtCnt > 1)){
// this.isIconInFocusDueToCurrentAction = false;
// console.log('3rd----this.isIconInFocusDueToCurrentAction:', this.isIconInFocusDueToCurrentAction );
// this.btnStyleAndValuesReset();
// }
}

// to prevent an endless loop of calls,
if(caller !== undefined && caller === this.name){
this._menuService.hideContextMenus.next();
}
}

doBtnClickThings(id:number):void{

this.isIconInFocusDueToCurrentAction = true;
Expand Down Expand Up @@ -892,74 +967,6 @@ export class FileExplorerComponent implements BaseComponent, OnInit, AfterViewIn
this._menuService.storeData.next([path, action]);
}

onHideIconContextMenu():void{
this.showIconCntxtMenu = false;
this.showFileExplrCntxtMenu = false;
this.isShiftSubMenuLeft = false;
this.iconCntxtCntr = 0;
this.fileExplrCntxtCntr = 0;

//First case - I'm clicking only on the desktop icons
if((this.isBtnClickEvt && this.btnClickCnt >= 1) && (!this.isHideCntxtMenuEvt && this.hideCntxtMenuEvtCnt == 0)){

if(this.isRenameActive){
this.isFormDirty();
}
if(this.isIconInFocusDueToPriorAction){
if(this.hideCntxtMenuEvtCnt >= 0)
this.setBtnStyle(this.selectedElementId,false);
}
if(!this.isRenameActive){
this.isBtnClickEvt = false;
this.btnClickCnt = 0;
}
}else{
this.hideCntxtMenuEvtCnt++;
this.isHideCntxtMenuEvt = true;
//Second case - I was only clicking on the desktop
if((this.isHideCntxtMenuEvt && this.hideCntxtMenuEvtCnt >= 1) && (!this.isBtnClickEvt && this.btnClickCnt == 0)){
this.isIconInFocusDueToCurrentAction = false;
this.btnStyleAndValuesChange();
}

// //Third case - I was clicking on the desktop icons, then i click on the desktop.
// //clicking on the desktop triggers a hideContextMenuEvt
// if((this.isBtnClickEvt && this.btnClickCnt >= 1) && (this.isHideCntxtMenuEvt && this.hideCntxtMenuEvtCnt > 1)){
// this.isIconInFocusDueToCurrentAction = false;
// console.log('3rd----this.isIconInFocusDueToCurrentAction:', this.isIconInFocusDueToCurrentAction );
// this.btnStyleAndValuesReset();
// }
}
}

onShowFileExplorerContextMenu(evt:MouseEvent):void{

const menuHeight = 230; //this is not ideal
this.fileExplrCntxtCntr++;
if(this.iconCntxtCntr >= this.fileExplrCntxtCntr)
return;
else{
this.showIconCntxtMenu = false;
this.iconCntxtCntr = 0;
}

const rect = this.fileExplrCntntCntnr.nativeElement.getBoundingClientRect();
const axis = this.checkAndHandleMenuBounds(rect, evt, menuHeight);

const uid = `${this.name}-${this.processId}`;
this._runningProcessService.addEventOriginator(uid);

if(!this.showFileExplrCntxtMenu)
this.showFileExplrCntxtMenu = !this.showFileExplrCntxtMenu;

this.fileExplrCntxtMenuStyle = {
'position': 'absolute',
'transform':`translate(${String(axis.xAxis)}px, ${String(axis.yAxis)}px)`,
'z-index': 2,
}
evt.preventDefault();
}

checkAndHandleMenuBounds(rect:DOMRect, evt:MouseEvent, menuHeight:number):{ xAxis: number; yAxis: number; }{

let xAxis = 0;
Expand Down
2 changes: 1 addition & 1 deletion src/app/system-apps/filemanager/filemanager.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<ol (dragover)="onDragOver($event)" (drop)="onDrop($event)" (click)="onHideIconContextMenu()" #myBounds>
<ol (dragover)="onDragOver($event)" (drop)="onDrop($event)" (click)="onHideIconContextMenu(name)" #myBounds>
<li *ngFor="let file of files; let i = index">
<button (dblclick)="runProcess(file)" (mouseenter)="onMouseEnter(i)" (mouseleave)="onMouseLeave(i)"
ngDraggable [bounds]="myBounds" [inBounds]="true" [gridSize]="gridSize" zIndex="1" [preventDefaultEvent]="true"
Expand Down
8 changes: 7 additions & 1 deletion src/app/system-apps/filemanager/filemanager.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -205,6 +205,7 @@ export class FileManagerComponent implements BaseComponent, OnInit, AfterViewIni
onShowIconContextMenu(evt:MouseEvent, file:FileInfo, id:number):void{
const uid = `${this.name}-${this.processId}`;
this._runningProcessService.addEventOriginator(uid);
this._menuService.hideContextMenus.next();

this.selectedFile = file;
this.showCntxtMenu = !this.showCntxtMenu;
Expand Down Expand Up @@ -254,7 +255,7 @@ export class FileManagerComponent implements BaseComponent, OnInit, AfterViewIni
}
}

onHideIconContextMenu():void{
onHideIconContextMenu(caller?:string):void{
this.showCntxtMenu = false;

//First case - I'm clicking only on the desktop icons
Expand Down Expand Up @@ -284,6 +285,11 @@ export class FileManagerComponent implements BaseComponent, OnInit, AfterViewIni
if((this.isBtnClickEvt && this.btnClickCnt >= 1) && (this.isHideCntxtMenuEvt && this.hideCntxtMenuEvtCnt > 1))
this.btnStyleAndValuesReset();
}

// to prevent an endless loop of calls,
if(caller !== undefined && caller === this.name){
this._menuService.hideContextMenus.next();
}
}

onDragEnd(evt:any):void{
Expand Down

0 comments on commit e022200

Please sign in to comment.