diff --git a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components.d.ts b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components.d.ts index a25c45fcc7e..8c234c8b0fe 100644 --- a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components.d.ts +++ b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components.d.ts @@ -195,6 +195,14 @@ export interface DnnRmFolderListItemCustomEvent extends CustomEvent { detail: T; target: HTMLDnnRmFolderListItemElement; } +export interface DnnRmItemsCardviewCustomEvent extends CustomEvent { + detail: T; + target: HTMLDnnRmItemsCardviewElement; +} +export interface DnnRmItemsListviewCustomEvent extends CustomEvent { + detail: T; + target: HTMLDnnRmItemsListviewElement; +} export interface DnnRmMoveItemsCustomEvent extends CustomEvent { detail: T; target: HTMLDnnRmMoveItemsElement; @@ -558,12 +566,20 @@ declare namespace LocalJSX { * The list of current items. */ "currentItems": GetFolderContentResponse; + /** + * Fires when a folder is double-clicked and emits the folder ID into the event.detail + */ + "onDnnRmFolderDoubleClicked"?: (event: DnnRmItemsCardviewCustomEvent) => void; } interface DnnRmItemsListview { /** * The list of current items. */ "currentItems": GetFolderContentResponse; + /** + * Fires when a folder is double-clicked and emits the folder ID into the event.detail + */ + "onDnnRmFolderDoubleClicked"?: (event: DnnRmItemsListviewCustomEvent) => void; } interface DnnRmLeftPane { } diff --git a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-folder-list-item/dnn-rm-folder-list-item.tsx b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-folder-list-item/dnn-rm-folder-list-item.tsx index 30197539fe1..fcd2565e9df 100644 --- a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-folder-list-item/dnn-rm-folder-list-item.tsx +++ b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-folder-list-item/dnn-rm-folder-list-item.tsx @@ -32,6 +32,15 @@ export class DnnRmFolderListItem { } } + @Listen("dnnRmFolderDoubleClicked", {target: "document"}) + handleFolderDoubleClicked(e: CustomEvent) { + if (e.detail == Number.parseInt(this.folder.data.key)) { + this.dnnRmFolderListItemClicked.emit(this.folder); + this.handleUserExpanded(); + this.expanded = true; + } + } + @State() folderIconUrl: string; @Element() el!: HTMLDnnRmFolderListItemElement; diff --git a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-cardview/dnn-rm-items-cardview.tsx b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-cardview/dnn-rm-items-cardview.tsx index f7d305232da..e48f9495bda 100644 --- a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-cardview/dnn-rm-items-cardview.tsx +++ b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-cardview/dnn-rm-items-cardview.tsx @@ -1,4 +1,4 @@ -import { Component, Host, h, Prop, Element } from '@stencil/core'; +import { Component, Event, EventEmitter, Host, h, Prop, Element } from '@stencil/core'; import { GetFolderContentResponse, Item } from '../../services/ItemsClient'; import state from '../../store/store'; import { selectionUtilities } from '../../utilities/selection-utilities'; @@ -15,6 +15,9 @@ export class DnnRmItemsCardview { @Element() el: HTMLDnnRmItemsCardviewElement; + /** Fires when a folder is double-clicked and emits the folder ID into the event.detail */ + @Event() dnnRmFolderDoubleClicked: EventEmitter; + componentWillLoad() { document.addEventListener("click", this.dismissContextMenu.bind(this)); } @@ -48,6 +51,12 @@ export class DnnRmItemsCardview { return; } + private handleDoubleClick(item: Item): void { + if (item.isFolder) { + this.dnnRmFolderDoubleClicked.emit(item.itemId); + } + } + render() { return ( @@ -58,6 +67,7 @@ export class DnnRmItemsCardview { class="card" onClick={() => selectionUtilities.toggleItemSelected(item)} onContextMenu={e => this.handleContextMenu(e, item)} + onDblClick={() => this.handleDoubleClick(item)} >
{selectionUtilities.isItemSelected(item) && diff --git a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-cardview/readme.md b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-cardview/readme.md index de2eb180ede..1bbcbb053c9 100644 --- a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-cardview/readme.md +++ b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-cardview/readme.md @@ -12,6 +12,13 @@ | `currentItems` _(required)_ | -- | The list of current items. | `GetFolderContentResponse` | `undefined` | +## Events + +| Event | Description | Type | +| -------------------------- | ----------------------------------------------------------------------------------- | --------------------- | +| `dnnRmFolderDoubleClicked` | Fires when a folder is double-clicked and emits the folder ID into the event.detail | `CustomEvent` | + + ## Dependencies ### Used by diff --git a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-listview/dnn-rm-items-listview.tsx b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-listview/dnn-rm-items-listview.tsx index 1832c8641f0..30d0fb813b1 100644 --- a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-listview/dnn-rm-items-listview.tsx +++ b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-listview/dnn-rm-items-listview.tsx @@ -1,4 +1,4 @@ -import { Component, Host, h, Prop, Element } from '@stencil/core'; +import { Component, Event, EventEmitter, Host, h, Prop, Element } from '@stencil/core'; import { GetFolderContentResponse, Item } from '../../services/ItemsClient' import state from '../../store/store'; import { selectionUtilities } from "../../utilities/selection-utilities"; @@ -15,6 +15,9 @@ export class DnnRmItemsListview { @Element() el: HTMLDnnRmItemsListviewElement; + /** Fires when a folder is double-clicked and emits the folder ID into the event.detail */ + @Event() dnnRmFolderDoubleClicked: EventEmitter; + componentWillLoad() { document.addEventListener("click", this.dismissContextMenu.bind(this)); } @@ -79,6 +82,12 @@ export class DnnRmItemsListview { return; } + private handleDoubleClick(item: Item): void { + if (item.isFolder) { + this.dnnRmFolderDoubleClicked.emit(item.itemId); + } + } + render() { return ( @@ -102,6 +111,7 @@ export class DnnRmItemsListview { onKeyDown={e => this.handleRowKeyDown(e, item)} onClick={() => selectionUtilities.toggleItemSelected(item)} onContextMenu={e => this.handleContextMenu(e, item)} + onDblClick={() => this.handleDoubleClick(item)} > {selectionUtilities.isItemSelected(item) && diff --git a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-listview/readme.md b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-listview/readme.md index 468ddc6e038..5cc9a555235 100644 --- a/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-listview/readme.md +++ b/DNN Platform/Modules/ResourceManager/ResourceManager.Web/src/components/dnn-rm-items-listview/readme.md @@ -12,6 +12,13 @@ | `currentItems` _(required)_ | -- | The list of current items. | `GetFolderContentResponse` | `undefined` | +## Events + +| Event | Description | Type | +| -------------------------- | ----------------------------------------------------------------------------------- | --------------------- | +| `dnnRmFolderDoubleClicked` | Fires when a folder is double-clicked and emits the folder ID into the event.detail | `CustomEvent` | + + ## Dependencies ### Used by