Welcome to WebCabin.org! Your developers cabin, on the web!
Here at Web Cabin, we sincerely believe that anyone with the proper tools can become a developer! The open source community provides us with a powerful network for sharing, inspiring, and revolutionizing the world! It is awfully daunting, viewing the long road ahead through our small cabin window, but all memorable journeys must have a beginning. Will you join us?
I've create a new theme builder panel that appears right on the demonstration front page! Build your own custom themes live within the page view!
wcDocker (Web Cabin Docker) is a responsive IDE interface designed for the developer at heart! Compartmentalize your environment into smaller components, put each of those parts into a docker panel, and organize your environment however you like, whenever you like!
See the Getting Started tutorial.
WARNING: Before upgrading to this version from 2.2.0, You will need to make the following changes in your implementation:
Themes are no longer linked directly to the page using the <link> tag, instead use wcDocker.theme().
If your themes are not found in the "Themes" folder, you will need to assign the correct path when you construct your wcDocker instance.
new wcDocker(domNode, {themePath: 'New/theme/folder'});
All wcDocker.DOCK
, wcDocker.EVENT
, and wcDocker.ORIENTATION
enumerations have changed slightly, instead of each being one variable, they are broken into objects.
// OLD format...
wcDocker.DOCK_LEFT;
wcDocker.EVENT_BUTTON;
wcDocker.ORIENTATION_HORIZONTAL;
// NEW format...
wcDocker.DOCK.LEFT;
wcDocker.EVENT.BUTTON;
wcDocker.ORIENTATION.HORIZONTAL;
// Notice how each used to be one variable name...
// Now they each are an object with the same enumeration inside them,
// just replace the first '_' with a '.' and they should work fine again!
wcLayout's
have changed in the following ways:
wcLayoutTable.addItem()
and wcLayoutTable.item()
no longer return a jQuery object. Instead, they return a layout table item that can be used to make alterations to that cell.To use the simple layout on your panel, include the layout option when registering your panel:
myDocker.registerPanelType('Simple Panel', {
// Use the simple layout for the entire panel.
layout: wcDocker.LAYOUT.SIMPLE,
onCreate: function(myPanel) {
// Create a splitter widget with simple layouts.
var splitter = new wcSplitter($someContainer, myPanel, wcDocker.ORIENTATION.HORIZONTAL);
splitter.initLayouts(wcDocker.LAYOUT.SIMPLE, wcDocker.LAYOUT.SIMPLE);
// Create a tab frame widget with a tab that uses a simple layout.
var tabFrame = new wcTabFrame($someContainer, myPanel);
tabFrame.addTab('Custom Tab 1', 0, wcDocker.LAYOUT.SIMPLE).addItem($someItem);
}
});
The following functions are now deprecated
and will be removed in an upcoming version:
wcDocker.basicMenu()
, renamed to wcDocker.menu()
.Collapsible panels:
Panels can now be collapsed to the side or bottom of the screen, where they become a slide-out drawer above the main layout.
Panel creation elements:
Instead of relying on the context-menu controls to add new panels, you can now add the CSS class "wcCreatePanel"
to any dom element along with the data attribute "panel"
and wcDocker will treat it as a panel creation control. A user will then be able to drag-drop that element into their view to create new panels of the specified type.
{@lang xml}<span class="wcCreatePanel" data-panel="My Custom Panel Type">Create My Custom Panel Type</span>
Tab orientation:
Tab controls displayed on panels and the custom tab widget can now be oriented to the left, right, or bottom edges (browser must support css transforms).
myDocker.addPanel('Some Panel', wcDocker.DOCK.STACKED, parentPanel, {tabOrientation: wcDocker.TAB.BOTTOM});
var myCustomTabFrame = new wcTabFrame(domElem, myPanel);
myCustomTabFrame.tabOrientation(wcDocker.TAB.LEFT);
Built in loading screens for both panels (wcPanel.startLoading()
and wcPanel.finishLoading()
), and the entire window (wcDocker.startLoading()
and wcDocker.finishLoading()
), and also included a new wcDocker.EVENT.LOADED
event that is triggered once all panels have been initialized and have finished their loading screens if they've started one.
Great improvements to splitter bar movement, moving one splitter no longer causes others to move (unless it explicitly pushes them).
Improvements to the wcLayout object, css changes to the table cells and rows are now persistent even if the grid size changes.
Tab widgets now only show on panel frames that contain more than one panel.
Panels can now be registered as persistent
.
myDocker.registerPanelType('persistent panel', {
isPersistent: true,
onCreate: function(myPanel) {
myPanel.on(wcDocker.EVENT.PERSISTENT_CLOSED, function() {
// The user has closed this panel, but instead of being destroyed, it is only hidden.
});
myPanel.on(wcDocker.EVENT.PERSISTENT_OPENED, function() {
// The user added this panel type, but actually only re-shown this persistent version of the panel instead.
});
}
});
The collapse direction button on a panel can now be overridden if the built in calculation does not meet your needs. See wcPanel#collapseDirection for more information.
// You can override the direction with your own calculation function callback
myPanel.collapseDirection(function(bounds) {
return wcDocker.DOCK.LEFT;
});
// Or you can set it to a static direction
myPanel.collapseDirection(wcDocker.DOCK.RIGHT);
// Or you can restore it back to the default calculation
myPanel.collapseDirection(false);
Source code now supports DCL!
Front page Theme Builder is now built into the libraries.
myDocker.registerPanelType('Theme Builder', {
faicon: 'map',
onCreate: wcThemeBuilder
});
wcDocker
is now published to npm.
wcDocker.css
(now use wcDocker.css
with Themes/default.css
).wcDocker.panelTypeInfo()
and wcPanel.info()
that will retrieve the registration data of a panel.wcDocker.panelTypes()
to retrieve a list of all registered panel types.wcDocker.EVENT.INIT
.wcPanel
functions initPos
, initSize
, minSize
, and maxSize
can now take a string value with a 'px'
or '%'
suffix.wcTabFrame
widget within your panels.wcIFrame
widget within your panels.wcDocker
now has Bower support for easy package management.wcSplitter
is now usable inside a panel.wcPanel.focus()
now actually sets itself as the current active tab.wcDocker.registerPanelType()
has a new option {limit: Number}
that limits the total number of copies for this panel.wcDocker.EVENT.VISIBILITY_CHANGED
, triggered whenever the panel gains or loses visibility. Use wcPanel.isVisible()
to retrieve the current state.wcDocker.EVENT.BEGIN_DOCK
and wcDocker.EVENT.END_DOCK
that trigger whenever the user is dragging a panel to a new location.wcDocker.EVENT.GAIN_FOCUS
and wcDocker.EVENT.LOST_FOCUS
that trigger whenever a panel is brought it and out of focus.wcLayout.item()
added to retrieve an already existing item in the layout.wcDocker
can now send and receive events.wcLayout
can now batch large numbers of elements added without page refreshing between each.wcPanel
can now contain custom buttons that appear within the title bar.wcDocker.basicMenu()
now has an option to include the default menu options along with your custom ones.wcDocker.basicMenu()
can now accept a dynamic callback function that returns custom menu's at the time of the event.wcDocker
constructor now takes an options object.wcDocker
now has an option to disable the default context menu.wcDocker.registerPanelType()
can now take an options object instead of just a single callback.© 2014-2016 Jeff Houde (lochemage@webcabin.org)
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
Please feel free to contact me, Jeff Houde (lochemage@webcabin.org), for any information or to give feedback and suggestions. Also, if you are a web programmer, and believe you can help, please let me know!
Thank you