Home

Graphite View

Major Classes

GraphicContainer

• GraphicContainer wraps and manages a given HTMLElement which will contain graphical contents.

    interface GraphicContainer {
        attribute HTMLElement mask;
        void setElement(HTMLElement element);
        HTMLElement getElement();
        void setContents(Widget contents);
        Widget getContents();
        void setGraphicContextFactory(GraphicContextFactory Factory);
        GraphicContextFactory getGraphicContextFactory();
        GraphicContext getGraphicContext();
    };

    <div id='container'></div>

    //Pseudo code.
    var element = document.getElementById('container');
    var container = new GraphicContainer(element, GraphicContextFactory);

• GraphicContainer provides a way to setup user's content root.

    //Pseudo code.
    var userContentRoot = new SomeWidget();
    container.setContents(userContentRoot);

• GraphicContainer should create and return GraphicContext.

    //Pseudo code.
    var graphicContext = container.getGraphicContext();

• GraphicContainer has an attribute mask, which receives all the events occurred on GraphicContainer.

    //Pseudo code.
    var mask = container.mask;
    mask.addEventListener();
    //This is just an example, you don't need to do this,
    //graphite automatically listens events from mask.

GraphicContext

• GraphicContext is a place which user's contents will be painted.

    interface GraphicContext {
        Layer getLayer(in String id);
        Widget getContextRoot();
    };

• GraphicContext provides ways to access specific graphic contexts such as svg, document, connection, grid, feedback, guide, handle, mask, viewport and any user defined graphic context.

    var svgLayer = graphicContext.getLayer('SVG_LAYER');
    var rect = new Rect();
    svgLayer.append(rect);

• GraphicContext can be configured by user defined GraphicContextFactory. Without user defined GraphicContextFactory, GraphicContainer makes default contexts(layers) using DefaultGraphicContextFactory.

GraphicContextFactory

• GraphicContextFactory constructs a structure for GraphicContext.

    interface GraphicContextFactory {
        GraphicContext createGraphicContext();
    };

• Basically and internally, DefaultGraphicContextFactory will be used.
• If you need custom layer structure for GraphicContext, you can make your own GraphicContextFactory.

    var shell = new GraphiteShell('container', SomeGraphicContextFactory);

• GraphicContextFactory should inherits GraphicContextFactory abstract constructor.