File Purging Tool

100%

File Purging Tool

✓ Published0🌍 Public

Last edited Dec 26, 2022

Created on Dec 26, 2022

This interactive file purging tool lets users assemble collections of parameters and assign them to processing targets through a drag-and-drop interface. The tool uses custom HTML elements (`vc-dragitem`, `vc-dragcontainer`) built on native HTML5 drag-and-drop APIs, with SVG shapes serving as sample data items. Users can create, delete, and collapse draggable collections, while buttons allow them to save and restore connection configurations. The SVG hints at geometric data representations, but the main focus is on managing and connecting file groups through direct manipulation.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Dragging HTML Elements 2

This interactive example demonstrates a drag-and-drop workload modeller built with custom HTML elements. It shows how items (including nested SVG graphics) can be moved between containers, reordered within collections, and grouped into targets using vc-dragitem and vc-dragcontainer elements. The implementation relies on the native HTML5 Drag and Drop API, custom elements defined via customElements.define, and CSS grid for layout. Users can select multiple items, collapse/delete collections, and save or restore connection configurations.

AAndre J Denais

75% match

Loading thumbnail…

Fork of Dragging HTML Elements 2

This interactive workflow modeller demonstrates a drag-and-drop interface for composing workload selections. Users arrange draggable items from an available pool into collection containers and target slots, with support for multi-selection, cloning, and collapsible or deletable groups. The interface relies on custom HTML elements, including `vc-dragcontainer`, `vc-dragitem`, and `vc-dragclosebutton`, which manage drag events, drop groups, and selection states. The code also includes save and restore functions for persisting connection configurations, with inline SVG graphics used within certain draggable items.

Cchristian jensen

74% match

Loading thumbnail…

Fork of Dragging HTML Elements 2

This example demonstrates a drag-and-drop interface for organizing items into hierarchical collections, built with custom HTML elements and the HTML5 Drag and Drop API. Users can drag individual items or multiple selected items between containers, with items either moving or cloning depending on the source container. The interface includes collapsible collection groups, delete buttons, and buttons to save and restore connection states. Code uses custom elements (`vc-dragitem`, `vc-dragcontainer`, `vc-dragclosebutton`, `vc-dragdeletebutton`) and embedded SVG graphics inside draggable items.

PPiotr Paszek

72% match

Loading thumbnail…

purging tool activity

This example presents a file purge tool interface with a parameter-entry table for specifying file directories, masks, archive locations, and retention periods, alongside an archival activity log showing timestamps, actions, and filenames. The plain HTML page uses CSS for styling, tables for structured data layout, and JavaScript-driven buttons for browsing, loading, saving, and clearing inputs. The browser-based React starter framework supports user interactions, while the interface relies on standard HTML form elements and table markup rather than visualization libraries.

Aakshayms0

71% match

Loading thumbnail…

File Purging Tool

This interactive web tool displays a basic file management interface. It presents a title, a "Browse" button, a search input field, and a "Load" button, all styled with custom CSS. The interface uses simple HTML anchor tags for navigation to placeholder pages and a standard text input for search queries. The page contains no JavaScript; it relies entirely on static HTML and embedded CSS for its presentation. The layout and styling are defined entirely within the `<style>` block in the `index.html` file.

Aakshayms0

70% match

Loading thumbnail…

Dragging HTML Elements 2

This example demonstrates a drag-and-drop interface for building workload models. Users can select items from an available pool and drag them into different collection and target containers, organizing them into a hierarchical structure. The interface supports creating clones, deleting items, collapsing containers, and saving or restoring connection states. It is implemented using custom HTML elements defined through the Web Components API, with drag-and-drop handled by native HTML5 events and SVG graphics embedded within draggable items.

WWillimnot

69% match

Loading thumbnail…

Dragging Elements

This example demonstrates a drag-and-drop interface for organizing items into nested containers. Users can select and move draggable cards between an available items pool, collection containers, and target containers, with support for multi-selection, cloning, and collapsible sub-containers. The interface is built with custom HTML elements and the Drag and Drop API, using `dragstart`, `dragover`, and `drop` events to manage item movement. SVG graphics render simple shapes within some draggable items, while JavaScript handles selection state, group permissions, and data saving/restoring via button controls.

Xxieyunli111

67% match

Loading thumbnail…

Interactive tool for creating directed graphs using d3.js.

This interactive tool lets users build and edit directed graphs entirely in the browser. Nodes are created with a shift-click, connected by dragging between them, and can be deleted or retitled, while the whole graph supports pan and zoom. The visualization uses d3.v3’s `d3.behavior.zoom` and `d3.behavior.drag` to manipulate SVG circles and paths, and includes file upload and download via the FileSaver API. The code uses `d3.select` for event handling and manipulates the DOM directly, with a JSON format for saving graph data.

FFrissAnalytics

64% match