Skip to content

SVG virtual desktop library that lets you build beautiful desktop like user interfaces.

License

Notifications You must be signed in to change notification settings

coderitual/jtop

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

30 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Jtop

Builld beautiful UI similar to real desktop.

Demo

Getting Started

See the live version.

Features

  • Drag & drop for desktop elements
  • 📦 Basic elements included: Icon, Panel, Tooltip, Menu
  • 📝 SVG Text with drop shadow and ellispis
  • ✏️ Inline text editing (Panels)
  • ↕️ Resizable elements

Example

const desktop = jtop.init('jtop', {
  scrollView: {
    initY: 25
  }
});

const tooltop = desktop.tooltip({
  offsetLeft: 30,
  offsetTop: -120
});

const menu = jtop.popupmenu().addMenuElement(
  'open project',
  null,
  sender => {
    console.log(`open project ${sender.title}`);
  },
  'edit-item'
);

const icon = desktop
  .icon({ title: 'Icon', image: 'test/images/db.png', gridX: 1, gridY: 1 })
  .menu(cMenuProject)
  .tooltip(iconTooltip);

For more, visit the example page inside test directory and look into main.js.

Built With

Authors

License

Jtop is available under the MIT license. See the LICENSE file for more info.

About

SVG virtual desktop library that lets you build beautiful desktop like user interfaces.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages