def createComponents(self):
        components = list()

        label = Label('This is a long text block that will wrap.')
        label.setWidth('120px')
        components.append(label)

        image = Embedded('', ThemeResource('../runo/icons/64/document.png'))
        components.append(image)

        documentLayout = CssLayout()
        documentLayout.setWidth('19px')
        for _ in range(5):
            e = Embedded(None, ThemeResource('../runo/icons/16/document.png'))
            e.setHeight('16px')
            e.setWidth('16px')
            documentLayout.addComponent(e)
        components.append(documentLayout)

        buttonLayout = VerticalLayout()
        button = Button('Button')

        button.addListener(ButtonClickListener(self), IClickListener)
        buttonLayout.addComponent(button)
        buttonLayout.setComponentAlignment(button, Alignment.MIDDLE_CENTER)
        components.append(buttonLayout)

        return components

class TextAreaExample(HorizontalLayout, IValueChangeListener):

    _initialText = 'The quick brown fox jumps over the lazy dog.'

    def __init__(self):
        super(TextAreaExample, self).__init__()

        self.setSpacing(True)

        self.setWidth('100%')

        self._editor = TextArea(None, self._initialText)
        self._editor.setRows(20)
        self._editor.setColumns(20)
        self._editor.addListener(self, IValueChangeListener)
        self._editor.setImmediate(True)
        self.addComponent(self._editor)

        # the TextArea is immediate, and it's valueCahnge updates the Label,
        # so this button actually does nothing
        self.addComponent(Button('>'))
        self._plainText = Label(self._initialText)
        self._plainText.setContentMode(Label.CONTENT_XHTML)
        self.addComponent(self._plainText)
        self.setExpandRatio(self._plainText, 1)

    # Catch the valuechange event of the textfield and update the value of the
    # label component
    def valueChange(self, event):
        text = self._editor.getValue()
        if text is not None:
            # replace newline with BR, because we're using Label.CONTENT_XHTML
            text = text.replace('\n', '<br/>')
        self._plainText.setValue(text)

    def _add_statusbar ( self ):
        """ Adds a statusbar to the dialog.
        """
        if self.ui.view.statusbar is not None:
            control = HorizontalLayout()
            control.setSizeGripEnabled(self.ui.view.resizable)
            listeners = []
            for item in self.ui.view.statusbar:
                # Create the status widget with initial text
                name = item.name
                item_control = Label()
                item_control.setValue(self.ui.get_extended_value(name))

                # Add the widget to the control with correct size
                width = abs(item.width)
                stretch = 0
                if width <= 1.0:
                    stretch = int(100 * width)
                else:
                    item_control.setWidth('%dpx' % width)
                control.addComponent(item_control)

                # Set up event listener for updating the status text
                col = name.find('.')
                obj = 'object'
                if col >= 0:
                    obj = name[:col]
                    name = name[col+1:]
                obj = self.ui.context[obj]
                set_text = self._set_status_text(item_control)
                obj.on_trait_change(set_text, name, dispatch='ui')
                listeners.append((obj, set_text, name))

            self.control.addComponent(control)
            self.ui._statusbar = listeners

    def __init__(self):
        super(WebLayoutWindow, self).__init__()

        # Our main layout is a horizontal layout
        main = HorizontalLayout()
        main.setMargin(True)
        main.setSpacing(True)
        self.setContent(main)

        # Tree to the left
        tree = Tree()
        tree.setContainerDataSource( ExampleUtil.getHardwareContainer() )
        tree.setItemCaptionPropertyId( ExampleUtil.hw_PROPERTY_NAME )
        for idd in tree.rootItemIds():
            tree.expandItemsRecursively(idd)
        self.addComponent(tree)

        # vertically divide the right area
        left = VerticalLayout()
        left.setSpacing(True)
        self.addComponent(left)

        # table on top
        tbl = Table()
        tbl.setWidth('500px')
        tbl.setContainerDataSource( ExampleUtil.getISO3166Container() )
        tbl.setSortDisabled(True)
        tbl.setPageLength(7)
        left.addComponent(tbl)

        # Label on bottom
        text = Label(ExampleUtil.lorem, Label.CONTENT_XHTML)
        text.setWidth('500px')  # some limit is good for text
        left.addComponent(text)

    def init(self):
        main = Window("CSS Tools Add-on Test")
        self.setMainWindow(main)

        testWindow = Window("Normal Window")
        testWindow.addComponent(Label("<p>This window is used as the component to measure.</p>", Label.CONTENT_XHTML))
        main.addWindow(testWindow)
        testWindow.center()

        title = Label("CSS Properties to Retrieve")
        title.addStyleName(Reindeer.LABEL_H2)
        main.addComponent(title)

        target = NativeSelect("Target Component")
        main.addComponent(target)

        get = Button("Refresh Properties", GetClickListener(self, target))
        main.addComponent(get)

        main.addComponent(self.buildLabels())

        target.addItem(main.getContent())
        target.setItemCaption(main.getContent(), "Root layout")
        target.addItem(testWindow)
        target.setItemCaption(testWindow, "Sub window")
        target.addItem(get)
        target.setItemCaption(get, "The '" + get.getCaption() + "' Button")
        target.setNullSelectionAllowed(False)
        target.select(testWindow)

class LabelRichExample(VerticalLayout, IClickListener):

    def __init__(self):
        super(LabelRichExample, self).__init__()

        self.setSpacing(True)

        self._editor = RichTextArea()
        self._richText = Label('<h1>Rich text example</h1>'
                '<p>The <b>quick</b> brown fox jumps <sup>over</sup> '
                'the <b>lazy</b> dog.</p>'
                '<p>This text can be edited with the <i>Edit</i> -button</p>')
        self._richText.setContentMode(Label.CONTENT_XHTML)
        self.addComponent(self._richText)

        self._b = Button('Edit')
        self._b.addListener(self, IClickListener)
        self.addComponent(self._b)

        self._editor.setWidth('100%')


    def buttonClick(self, event):
        if self.getComponentIterator().next() == self._richText:
            self._editor.setValue(self._richText.getValue())
            self.replaceComponent(self._richText, self._editor)
            self._b.setCaption('Apply')
        else:
            self._richText.setValue(self._editor.getValue())
            self.replaceComponent(self._editor, self._richText)
            self._b.setCaption('Edit')

    def __init__(self):
        super(PopupViewContentsExample, self).__init__()

        self.setSpacing(True)

        # ------
        # Static content for the minimized view
        # ------

        # Create the content for the popup
        content = Label('This is a simple Label component inside the popup. '
                'You can place any Muntjac components here.')

        # The PopupView popup will be as large as needed by the content
        content.setWidth('300px')

        # Construct the PopupView with simple HTML text representing the
        # minimized view
        popup = PopupView('Static HTML content', content)
        self.addComponent(popup)

        # ------
        # Dynamic content for the minimized view
        # ------

        # In this sample we update the minimized view value with the content of
        # the TextField inside the popup.
        popup = PopupView( PopupTextField() )
        popup.setDescription('Click to edit')
        popup.setHideOnMouseOut(False)
        self.addComponent(popup)

class JSApiExample(VerticalLayout):

    def __init__(self):
        super(JSApiExample, self).__init__()

        self._toBeUpdatedFromThread = None
        self._startThread = None
        self._running = Label('')

        self.setSpacing(True)

        javascript = Label("<h3>Run Native JavaScript</h3>",
                Label.CONTENT_XHTML)
        self.addComponent(javascript)

        script = TextArea()
        script.setWidth('100%')
        script.setRows(3)
        script.setValue('alert(\"Hello Muntjac\");')
        self.addComponent(script)

        self.addComponent(Button('Run script', RunListener(self, script)))
        sync = Label("<h3>Force Server Syncronization</h3>",
                Label.CONTENT_XHTML)
        self.addComponent(sync)

        self.addComponent(Label('For advanced client side programmers '
                'Muntjac offers a simple method which can be used to force '
                'the client to synchronize with the server. This may be '
                'needed for example if another part of a mashup changes '
                'things on server.'))

        self._toBeUpdatedFromThread = Label("This Label component will be "
                "updated by a background thread. Click \"Start "
                "background thread\" button and start clicking "
                "on the link below to force "
                "synchronization.", Label.CONTENT_XHTML)
        self.addComponent(self._toBeUpdatedFromThread)

        # This label will be show for 10 seconds while the background process
        # is working
        self._running.setCaption('Background process is running for 10 '
                'seconds, click the link below')
        self._running.setIcon(
                ThemeResource('../base/common/img/ajax-loader-medium.gif'))

        # Clicking on this button will start a repeating thread that updates
        # the label value
        self._startThread = Button('Start background thread',
                StartListener(self))
        self.addComponent(self._startThread)

        # This link will make an Ajax request to the server that will respond
        # with UI changes that have happened since last request
        self.addComponent(Label("<a href=\"javascript:vaadin.forceSync();\">"
                "javascript: vaadin.forceSync();</a>", Label.CONTENT_XHTML))

class Calc2(Application, IClickListener):
    """A simple calculator using Muntjac."""

    def __init__(self):
        super(Calc2, self).__init__()

        # All variables are automatically stored in the session.
        self._current = 0.0
        self._stored = 0.0
        self._lastOperationRequested = 'C'

        self.pure_calc = PureCalc()

        # User interface components
        self._display = Label('0.0')


    def init(self):

        layout = GridLayout(4, 5)

        self.setMainWindow(Window('Calculator Application', layout))

        layout.addComponent(self._display, 0, 0, 3, 0)

        operations = ['7', '8', '9', '/', '4', '5', '6',
                '*', '1', '2', '3', '-', '0', '=', 'C', '+']

        for caption in operations:
            # Create a button and use this application for event handling
            button = Button(caption)
            button.addListener(self)

            # Add the button to our main layout
            layout.addComponent(button)


    def buttonClick(self, event):
        # Event handler for button clicks. Called for all the buttons in
        # the application.

        # Get the button that was clicked
        button = event.getButton()

        # Get the requested operation from the button caption
        requestedOperation = button.getCaption()[0]

        self.pure_calc.proc_char(requestedOperation)
        if self.pure_calc.digit_operation(requestedOperation):
            newValue = self.pure_calc._current
        else:
            newValue = self.pure_calc._stored

        # Update the result label with the new value
        self._display.setValue(newValue)

    def __init__(self):
        super(LabelPlainExample, self).__init__()

        self.setSpacing(True)

        plainText = Label('This is an example of a Label'
                ' component. The content mode of this label is set'
                ' to CONTENT_TEXT. This means that it will display'
                ' the content text as is. HTML and XML special characters'
                ' (<,>,&) are escaped properly to allow displaying them.')
        plainText.setContentMode(Label.CONTENT_TEXT)
        self.addComponent(plainText)

 def buildLabels(self):
     grid = GridLayout()
     grid.setSpacing(True)
     grid.setWidth("100%")
     grid.setColumns(6)
     for prop in CssProperty.values():
         l = Label("-")
         l.setSizeUndefined()
         l.setCaption(str(prop))
         self._props[prop] = l
         grid.addComponent(l)
     return grid

    def init(self):
#        super(GoogleMapWidgetApp, self).__init__()

        self.setMainWindow(Window('Google Map add-on demo'))

        # Create a new map instance centered on the IT Mill offices
        self._googleMap = GoogleMap(self, (22.3, 60.4522), 8)

        self._googleMap.setWidth('640px')
        self._googleMap.setHeight('480px')

        # Create a marker at the IT Mill offices
        self._mark1 = BasicMarker(1L, (22.3, 60.4522), 'Test marker 1')
        self._mark2 = BasicMarker(2L, (22.4, 60.4522), 'Test marker 2')
        self._mark3 = BasicMarker(4L, (22.6, 60.4522), 'Test marker 3')
        self._mark4 = BasicMarker(5L, (22.7, 60.4522), 'Test marker 4')

        l = MarkerClickListener(self)
        self._googleMap.addListener(l, IMarkerClickListener)

        # Marker with information window pupup
        self._mark5 = BasicMarker(6L, (22.8, 60.4522), 'Marker 5')
        self._mark5.setInfoWindowContent(self._googleMap,
                Label('Hello Marker 5!'))

        content = Label('Hello Marker 2!')
        content.setWidth('60px')
        self._mark2.setInfoWindowContent(self._googleMap, content)

        self._googleMap.addMarker(self._mark1)
        self._googleMap.addMarker(self._mark2)
        self._googleMap.addMarker(self._mark3)
        self._googleMap.addMarker(self._mark4)
        self._googleMap.addMarker(self._mark5)
        self.getMainWindow().getContent().addComponent(self._googleMap)

        # Add a Marker click listener to catch marker click events.
        # Note, works only if marker has information window content
        l = MarkerClickListener2(self)
        self._googleMap.addListener(l, IMarkerClickListener)

        # Add a MarkerMovedListener to catch events when a marker is dragged to
        # a new location
        l = MarkerMovedListener(self)
        self._googleMap.addListener(l, IMarkerMovedListener)

        l = MapMoveListener(self)
        self._googleMap.addListener(l, IMapMoveListener)

        self._googleMap.addControl(MapControl.MapTypeControl)

        self.addTestButtons()  # Add buttons that trigger tests map features

 def __init__(self):
     super(LabelPreformattedExample, self).__init__()
     self.setSpacing(True)
     preformattedText = Label('This is an example of a Label component.\n'
             '\nThe content mode of this label is set'
             '\nto CONTENT_PREFORMATTED. This means'
             '\nthat it will display the content text'
             '\nusing a fixed-width font. You also have'
             '\nto insert the line breaks yourself.\n'
             '\n\tHTML and XML special characters'
             '\n\t(<,>,&) are escaped properly to'
             '\n\tallow displaying them.')
     preformattedText.setContentMode(Label.CONTENT_PREFORMATTED)
     self.addComponent(preformattedText)

    def __init__(self):
        super(PackageIconsExample, self).__init__()

        self._icons = ['arrow-down.png', 'arrow-left.png', 'arrow-right.png',
            'arrow-up.png', 'attention.png', 'calendar.png', 'cancel.png',
            'document.png', 'document-add.png', 'document-delete.png',
            'document-doc.png', 'document-image.png', 'document-pdf.png',
            'document-ppt.png', 'document-txt.png', 'document-web.png',
            'document-xsl.png', 'email.png', 'email-reply.png',
            'email-send.png', 'folder.png', 'folder-add.png',
            'folder-delete.png', 'globe.png', 'help.png', 'lock.png',
            'note.png', 'ok.png', 'reload.png', 'settings.png', 'trash.png',
            'trash-full.png', 'user.png', 'users.png']

        self._sizes = ['16', '32', '64']

        self.setSpacing(True)

        tabSheet = TabSheet()
        tabSheet.setStyleName(Reindeer.TABSHEET_MINIMAL)

        for size in self._sizes:
            iconsSideBySide = 2 if size == '64' else 3
            grid = GridLayout(iconsSideBySide * 2, 1)
            grid.setSpacing(True)
            grid.setMargin(True)
            tabSheet.addTab(grid, size + 'x' + size, None)

            tabSheet.addComponent(grid)
            for icon in self._icons:
                res = ThemeResource('../runo/icons/' + size + '/' + icon)

                e = Embedded(None, res)

                # Set size to avoid flickering when loading
                e.setWidth(size + 'px')
                e.setHeight(size + 'px')

                name = Label(icon)
                if size == '64':
                    name.setWidth('185px')
                else:
                    name.setWidth('150px')

                grid.addComponent(e)
                grid.addComponent(name)

                grid.setComponentAlignment(name, Alignment.MIDDLE_LEFT)

        self.addComponent(tabSheet)

    def resynch_editor ( self ):
        """ Resynchronizes the contents of the editor when the object trait
        changes externally to the editor.
        """
        panel = self._panel
        if panel is not None:
            # Dispose of the previous contents of the panel:
            layout = panel.getParent()
            if layout is None:
                layout = VerticalLayout()
                panel.addComponent(layout)
#                layout.setParent(panel)
                layout.setMargin(False)
            elif self._ui is not None:
                self._ui.dispose()
                self._ui = None
            else:
                layout.removeAllComponents()

            # Create the new content for the panel:
            stretch = 0
            value   = self.value
            if not isinstance( value, HasTraits ):
                str_value = ''
                if value is not None:
                    str_value = self.str_value
                control = Label()
                control.setValue(str_value)
            else:
                view    = self.view_for( value, self.item_for( value ) )
                context = value.trait_context()
                handler = None
                if isinstance( value, Handler ):
                    handler = value
                context.setdefault( 'context', self.object )
                context.setdefault( 'context_handler', self.ui.handler )
                self._ui = ui = view.ui( context, panel, 'subpanel',
                                         value.trait_view_elements(), handler,
                                         self.factory.id )
                control         = ui.control
                self.scrollable = ui._scrollable
                ui.parent       = self.ui

                if view.resizable or view.scrollable or ui._scrollable:
                    stretch = 1

            # FIXME: Handle stretch.
            layout.addComponent(control)

    def create(self, parent):
        """ Creates the underlying widget to display HTML.

        """
        self.widget = Label()
        self.widget.setContentMode(Label.CONTENT_XHTML)
        parent.addComponent(self.widget)

    def __init__(self):
        super(ApplicationLayoutWindow, self).__init__()

        # Our main layout is a horizontal layout
        main = HorizontalLayout()
        main.setSizeFull()
        self.setContent(main)

        # Tree to the left
        treePanel = Panel()  # for scrollbars
        treePanel.setStyleName(Reindeer.PANEL_LIGHT)
        treePanel.setHeight('100%')
        treePanel.setWidth(None)
        treePanel.getContent().setSizeUndefined()
        self.addComponent(treePanel)

        tree = Tree()
        tree.setContainerDataSource(ExampleUtil.getHardwareContainer())
        tree.setItemCaptionPropertyId(ExampleUtil.hw_PROPERTY_NAME)
        for idd in tree.rootItemIds():
            tree.expandItemsRecursively(idd)
        treePanel.addComponent(tree)

        # vertically divide the right area
        left = VerticalLayout()
        left.setSizeFull()
        self.addComponent(left)
        main.setExpandRatio(left, 1.0)  # use all available space

        # table on top
        tbl = Table()
        tbl.setWidth('100%')
        tbl.setContainerDataSource(ExampleUtil.getISO3166Container())
        tbl.setSortDisabled(True)
        tbl.setPageLength(7)
        left.addComponent(tbl)

        # Label on bottom
        textPanel = Panel()  # for scrollbars
        textPanel.setStyleName(Reindeer.PANEL_LIGHT)
        textPanel.setSizeFull()
        left.addComponent(textPanel)
        left.setExpandRatio(textPanel, 1.0)  # use all available space

        text = Label(ExampleUtil.lorem, Label.CONTENT_XHTML)
        text.setWidth('500px')  # some limit is good for text
        textPanel.addComponent(text)

    def _create_label(self, item, ui, desc, suffix = ':'):
        """Creates an item label.
        """
        label = item.get_label(ui)
        if (label == '') or (label[-1:] in '?=:;,.<>/\\"\'-+#|'):
            suffix = ''

        control = Label(label + suffix)
        control.setSizeUndefined()

        if item.emphasized:
            self._add_emphasis(control)

        # FIXME: Decide what to do about the help.
        control.help = item.get_help(ui)

        return control

    def __init__(self):
        super(Calc, self).__init__()

        # All variables are automatically stored in the session.
        self._current = 0.0
        self._stored = 0.0
        self._lastOperationRequested = 'C'

        # User interface components
        self._display = Label('0.0')

 def setPath(self, path):
     # could be optimized: always builds path from scratch home
     self._layout.removeAllComponents()
     link = ActiveLink('Home', ExternalResource('#'))
     link.addListener(self, ILinkActivatedListener)
     self._layout.addComponent(link)
     if path is not None and not ('' == path):
         parts = path.split('/')
         link = None
         for part in parts:
             separator = Label("»", Label.CONTENT_XHTML);
             separator.setSizeUndefined()
             self._layout.addComponent(separator)
             f = FeatureSet.FEATURES.getFeature(part)
             link = ActiveLink(f.getName(),
                     ExternalResource('#' + f.getFragmentName()))
             link.setData(f)
             link.addListener(self, ILinkActivatedListener)
             self._layout.addComponent(link)
         if link is not None:
             link.setStyleName('bold')