Wondering what’s next for npm?Check out our public roadmap! »

    spaceman

    0.1.0 • Public • Published

    It's a React and Flux based workspace manager aiming to implement all the feature that you got use to in modern graphics editors. (like Adobe or Autodesk products) Work is in progress but the API will look something like this:

    import {Spaceman, SpacemanStore} from 'spaceman'
    import defaultWorkspace from './defaultWorkspace'
     
    var workspace = localStoreage.lastWorkspace || defaultWorkspace
    Workspace = new SpacemanStore(workspace)
     
    Workspace.setTabContent('view', <Viewport/>)
    Workspace.setTabContent('tree', <TreeView/>)
    Workspace.setTabContent('style', <StyleView/>)
    ...
    Workspace.selectTab('tree')
     
    Workspace.on('change', () => {//on change tabs, resize, etc.
      localStoreage.lastWorkspace = Workspace.model.getSource()
    })
     
    React.render(<Spaceman store={Workspace}/>, mountNode)

    defaultWorkspace.js

    export default
    {type: 'divider', direction: 'row', children: [
      {type: 'divider', direction: 'column', size: 7, children: [
        //Status bar
        {type: 'block', size: 34, sizeMode: 'fix', resizeable: false, children: [
          {type: 'tab', id: 'statusBar', hideableHead: true},
        ]},
        {type: 'divider', children: [
          {type: 'divider', direction: 'row', children: [
            //left Toolbar
            {type: 'divider', size: 1, direction: 'column', collapsed: true, children: [
              {type: 'block', children: [
                {type: 'tab', id: 'assets', icon: 'cloud-upload', label: 'Assets'},
                {type: 'tab', id: 'catalogue', icon: 'cubes', label: 'Catalogue'},
                {type: 'tab', id: 'config', icon: 'cog', label: 'Config'},
              ]},
            ]},
            //Viewport
            {type: 'block', size: 4, children: [
              {type: 'tab', id: 'view', label: 'View', hideableHead: true},
            ]},
          ]}
        ]},
      ]},
      {type: 'divider', size: 1.89, direction: 'column', children: [
        {type: 'block', currTabIdx: 1, children: [
          {type: 'tab', id: 'props', label: 'Props'},
          {type: 'tab', id: 'style', label: 'Style'},
        ]},
        {type: 'block', children: [
          {type: 'tab', id: 'tree', label: 'Navigator'},
        ]},
      ]}
    ]}

    Install

    npm i spaceman

    DownloadsWeekly Downloads

    2

    Version

    0.1.0

    License

    MIT

    Last publish

    Collaborators

    • avatar
    • avatar