diff --git a/source/Ox.UI/js/Calendar/Ox.Calendar.js b/source/Ox.UI/js/Calendar/Ox.Calendar.js
index ad819409..5252449c 100644
--- a/source/Ox.UI/js/Calendar/Ox.Calendar.js
+++ b/source/Ox.UI/js/Calendar/Ox.Calendar.js
@@ -1216,12 +1216,13 @@ Ox.Calendar = function(options, self) {
         if (key == 'date') {
             
         } else if (key == 'height') {
-            //that.css({height: self.options.height + 'px'});
+            that.css({height: self.options.height + 'px'});
         } else if (key == 'selected') {
             selectEvent(value);
         } else if (key == 'width') {
-            //that.css({width: self.options.width + 'px'});
-            //self.$zoomInput.options({size: self.options.width});
+            that.css({width: self.options.width + 'px'});
+            self.options.showZoombar && self.$zoomInput.options({size: self.options.width});
+            renderOverlay();
             //getLines();
         } else if (key == 'zoom') {
             
diff --git a/source/Ox.UI/js/Core/Ox.Request.js b/source/Ox.UI/js/Core/Ox.Request.js
index 3d17a561..feaaa818 100644
--- a/source/Ox.UI/js/Core/Ox.Request.js
+++ b/source/Ox.UI/js/Core/Ox.Request.js
@@ -13,6 +13,7 @@ Ox.Request = (function() {
 
     var cache = {},
         //dfd = $.Deferred(),
+        $element = Ox.Element(),
         pending = {},
         requests = {},
         self = {
@@ -59,6 +60,10 @@ Ox.Request = (function() {
                 });
             }
         },
+        /*@
+        bindEvent <f> bindEvent to error/authrize requests
+        @*/
+        bindEvent: $element.bindEvent,
 
         // fixme: remove
         _leakCache: function() {
@@ -145,39 +150,8 @@ Ox.Request = (function() {
                 }
             }
 
-            /*
-            function debug(request) {
-                var $iframe = $('<iframe>')
-                        .css({ // fixme: should go into a class
-                            width: 768,
-                            height: 384
-                        }),
-                    $dialog = Ox.Dialog({
-                            title: 'Application Error',
-                            buttons: [
-                                Ox.Button({
-                                    title: 'Close'
-                                })
-                                .bindEvent({
-                                    click: function() {
-                                        $dialog.close();
-                                    }
-                                })
-                            ],
-                            content: $iframe,
-                            width: 768,
-                            height: 384
-                        })
-                        .open(),
-                    iframe = $iframe[0].contentDocument || $iframe[0].contentWindow.document;
-                iframe.open();
-                iframe.write(request.responseText);
-                iframe.close();
-            }
-            */
-
             function complete(request) {
-                var $dialog, data, error;
+                var $dialog, data;
                 try {
                     data = JSON.parse(request.responseText);
                 } catch (err) {
@@ -205,92 +179,8 @@ Ox.Request = (function() {
                         time: Ox.getTime()
                     };
                     callback(data);
-                } else if (data.status.code == 401 || data.status.code == 403) {
-                    // unauthorized or forbidden
-                    $dialog = Ox.Dialog({
-                        buttons: [
-                            Ox.Button({
-                                id: 'close',
-                                title: 'Close'
-                            })
-                            .bindEvent({
-                                click: function() {
-                                    $dialog.close();
-                                }
-                            })
-                        ],
-                        content: Ox.Element()
-                            .append(
-                                $('<img>')
-                                    .attr({src: Ox.UI.PATH + 'png/icon128.png'})
-                                    .css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'})
-                            )
-                            .append(
-                                Ox.Element()
-                                    .css({position: 'absolute', left: '96px', top: '16px', width: '256px'})
-                                    .html('Sorry, you have made an unauthorized request.')
-                            ),
-                        fixedSize: true,
-                        height: 192,
-                        keys: {enter: 'close', escape: 'close'},
-                        title: Ox.toTitleCase(data.status.text),
-                        width: 368
-                    })
-                    .open();
                 } else {
-                    // 0 (timeout) or 500 (error)
-                    error = data.status.code == 0 ? 'timeout' : 'error';
-                    // on window unload, pending request will time out, so
-                    // in order to keep the dialog from appearing, delay it
-                    setTimeout(function() {
-                        $dialog = Ox.Dialog({
-                            buttons: [
-                                /*
-                                Ox.Button({
-                                        id: 'details',
-                                        title: 'Details'
-                                    })
-                                    .bindEvent({
-                                        click: function() {
-                                            $dialog.close(function() {
-                                                debug(request);
-                                            });
-                                        }
-                                    }),
-                                */
-                                Ox.Button({
-                                        id: 'close',
-                                        title: 'Close'
-                                    })
-                                    .bindEvent({
-                                        click: function() {
-                                            $dialog.close();
-                                        }
-                                    })
-                            ],
-                            content: Ox.Element()
-                                .append(
-                                    $('<img>')
-                                        .attr({src: Ox.UI.PATH + 'png/icon128.png'})
-                                        .css({position: 'absolute', left: '16px', top: '16px', width: '64px', height: '64px'})
-                                )
-                                .append(
-                                    Ox.Element()
-                                        .css({position: 'absolute', left: '96px', top: '16px', width: '256px'})
-                                        .html(
-                                            'Sorry, a server ' + error
-                                            + ' occured while handling your request. To help us find out what went wrong, you may want to report this error to an administrator. Otherwise, please try again later.'
-                                        )
-                                ),
-                            fixedSize: true,
-                            height: 192,
-                            keys: {enter: 'close', escape: 'close'},
-                            title: 'Server ' + Ox.toTitleCase(error),
-                            width: 368
-                        })
-                        .open();
-                        // fixme: change this to Send / Don't Send
-                    }, error == 'timeout' ? 1000 : 0);
+                    $element.triggerEvent('error', data);
                 }
                 pending[options.id] = false;
             }
diff --git a/source/Ox.UI/js/Map/Ox.ListMap.js b/source/Ox.UI/js/Map/Ox.ListMap.js
index 9e436d77..a7efa8fc 100644
--- a/source/Ox.UI/js/Map/Ox.ListMap.js
+++ b/source/Ox.UI/js/Map/Ox.ListMap.js
@@ -10,6 +10,7 @@ Ox.ListMap <f:Ox.Element> ListMap object
     options <o> Options object
         height <n|256> Height in px
         labels <b|false> If true, show labels
+        names <a|f|null> Array or names (undefined places), or function
         places <a|f|null> Array of places, or function that returns places
         selected <a|[]> Selected places
         width <n|256> Width in px
@@ -26,10 +27,11 @@ Ox.ListMap = function(options, self) {
             getMatches: null,
             height: 256,
             labels: false,
+            names: null,
             pageLength: 100,
             places: null,
             removePlace: null,
-            selected: [],
+            selected: '',
             showControls: false,
             showLabels: false,
             showTypes: false,
@@ -220,6 +222,59 @@ Ox.ListMap = function(options, self) {
         size: 24
     });
 
+    if (self.options.names) {
+
+        self.$listSelect = Ox.Select({
+                items: [
+                    {id: 'places', title: 'Show Places'},
+                    {id: 'names', title: 'Show Names'}
+                ],
+                max: 1,
+                min: 1,
+                style: 'symbol',
+                title: 'set',
+                type: 'image',
+                value: 'places'
+            })
+            .css({float: 'left', margin: '4px 0 4px 4px'})
+            .bindEvent({
+                change: toggleList
+            })
+            .appendTo(self.$listToolbar);
+
+        self.$namesList = Ox.TextList({
+                columns: [
+                    {
+                        id: 'name',
+                        operator: '+',
+                        title: 'Name',
+                        visible: true,
+                        width: 256
+                    },
+                    {
+                        align: 'right',
+                        id: 'matches',
+                        operator: '-',
+                        title: 'Matches',
+                        visible: true,
+                        width: 64,
+                    }
+                ],
+                columnsVisible: true,
+                items: [],
+                max: 1,
+                min: 0,
+                scrollbarVisible: true,
+                sort: [{key: 'name', operator: '+'}]
+            })
+            .bindEvent({
+                select: function(data) {
+                    
+                }
+            });
+
+    }
+
     self.$findElement = Ox.FormElementGroup({
             elements: [
                 self.$findSelect = Ox.Select({
@@ -242,7 +297,7 @@ Ox.ListMap = function(options, self) {
                 self.$findInput = Ox.Input({
                         clear: true,
                         placeholder: 'Find in List',
-                        width: 234
+                        width: self.options.names ? 214 : 234
                     })
                     .bindEvent({
                         submit: function(data) {
@@ -267,8 +322,11 @@ Ox.ListMap = function(options, self) {
             columnsVisible: true,
             //items: Ox.clone(self.options.places),
             items: self.options.places,
+            max: 1,
+            min: 0,
             pageLength: self.options.pageLength,
             scrollbarVisible: true,
+            selected: self.options.selected ? [self.options.selected] : [],
             sort: self.options.sort
         })
         .bindEvent({
@@ -308,6 +366,7 @@ Ox.ListMap = function(options, self) {
         findPlaceholder: 'Find on Map',
         height: self.options.height,
         places: self.options.places,
+        selected: self.options.selected,
         //statusbar: true,
         showControls: self.options.showControls,
         showLabels: self.options.showLabels,
@@ -622,7 +681,7 @@ Ox.ListMap = function(options, self) {
             elements: [
                 {
                     collapsible: true,
-                    element: Ox.SplitPanel({
+                    element: self.$listPanel = Ox.SplitPanel({
                         elements: [
                             {
                                 element: self.$listToolbar,
@@ -821,6 +880,22 @@ Ox.ListMap = function(options, self) {
         return Ox.isNumber(val) ? val.toFixed(8) : val; // fixme: why can a string be passed ??
     }
 
+    function toggleList() {
+        var list = self.$listSelect.options('value');
+        list == 'names' && !self.namesLoaded ? load() : toggle();
+        function load() {
+            self.options.names(function(data) {
+                Ox.print('DATA IS', data);
+                self.$namesList.options({items: data});
+                self.namesLoaded = true;
+                toggle();
+            });
+        }
+        function toggle() {
+            self.$listPanel.replaceElement(1, self[list == 'places' ? '$list' : '$namesList']);
+        }
+    }
+
     function updateList(key, value) {
         var query = {
                 conditions: Ox.merge(
diff --git a/source/Ox.UI/js/Map/Ox.Map.js b/source/Ox.UI/js/Map/Ox.Map.js
index 36327a3d..a1138666 100644
--- a/source/Ox.UI/js/Map/Ox.Map.js
+++ b/source/Ox.UI/js/Map/Ox.Map.js
@@ -441,7 +441,13 @@ Ox.Map = function(options, self) {
         });
     }
 
-    if (!window.googleCallback) {
+    if (window.google) {
+        initMap();
+    } else if (window.googleCallback) {
+        (function interval() {
+            window.google ? initMap() : setTimeout(interval, 100);
+        }());
+    } else {
         window.googleCallback = function() {
             delete window.googleCallback;
             initMap();
@@ -450,10 +456,6 @@ Ox.Map = function(options, self) {
             document.location.protocol
             + '//maps.google.com/maps/api/js?callback=googleCallback&sensor=false'
         );
-    } else {
-        (function interval() {
-            window.google ? initMap() : setTimeout(interval, 100);
-        }());
     }
 
     function addPlaceToMap(place) {
@@ -775,7 +777,7 @@ Ox.Map = function(options, self) {
 
         getMapBounds(function(mapBounds) {
 
-            Ox.Log('Map', 'init', mapBounds.getSouthWest(), mapBounds.getNorthEast(), mapBounds.getCenter())
+            //Ox.Log('Map', 'init', mapBounds.getSouthWest(), mapBounds.getNorthEast(), mapBounds.getCenter())
 
             self.elevationService = new google.maps.ElevationService();
             self.geocoder = new google.maps.Geocoder();
@@ -853,22 +855,6 @@ Ox.Map = function(options, self) {
             Ox.forEach(self.$placeControls, function($placeControl) {
                 $placeControl.appendTo(self.$map);
             });
-            setTimeout(function() {
-                var $element;
-                try {
-                    $element = $(self.$map.find('a[href$="terms_maps.html"]').parent()).css({
-                        color: 'rgb(192, 192, 192)',
-                        textShadow: '1px 1px 0 rgb(64, 64, 64)'
-                    });
-                    ['moz', 'o', 'webkit'].forEach(function(browser) {
-                        $element.css({
-                            backgroundImage: '-' + browser
-                                + '-linear-gradient(left, rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.1) 50px)',
-                        });
-                    });
-                    $element.children().css({color: 'rgb(192, 192, 192)'});
-                } catch (e) {}
-            }, 0)
 		}
     }
 
@@ -880,6 +866,25 @@ Ox.Map = function(options, self) {
             && southWest.lng() == northEast.lng();
     }
 
+    function formatTerms() {
+        setTimeout(function() {
+            var $element;
+            try {
+                $element = $(self.$map.find('a[href$="terms_maps.html"]').parent()).css({
+                    color: 'rgb(192, 192, 192)',
+                    textShadow: '1px 1px 0 rgb(64, 64, 64)'
+                });
+                ['moz', 'o', 'webkit'].forEach(function(browser) {
+                    $element.css({
+                        backgroundImage: '-' + browser
+                            + '-linear-gradient(left, rgba(255, 255, 255, 0) 0px, rgba(255, 255, 255, 0.1) 50px)',
+                    });
+                });
+                $element.children().css({color: 'rgb(192, 192, 192)'});
+            } catch (e) {}
+        }, 0);
+    }
+
     function mapChanged() {
         // gets called after panning or zooming
         Ox.Log('Map', 'mapChanged');
@@ -969,6 +974,7 @@ Ox.Map = function(options, self) {
         if (self.zoomChanged) {
             self.zoomChanged = false;
         }
+        formatTerms();
     }
 
 	function pan(x, y) {
@@ -1360,6 +1366,7 @@ Ox.Map = function(options, self) {
 
     self.setOption = function(key, value) {
         if (key == 'height' || key == 'width') {
+            that.$element.css(key, value + 'px');
             that.resizeMap();
         } else if (key == 'places') {
             Ox.print('MAP SET OPTIONS PLACES', value);
diff --git a/source/Ox.UI/js/Video/Ox.AnnotationFolder.js b/source/Ox.UI/js/Video/Ox.AnnotationFolder.js
index df360803..3e99e159 100644
--- a/source/Ox.UI/js/Video/Ox.AnnotationFolder.js
+++ b/source/Ox.UI/js/Video/Ox.AnnotationFolder.js
@@ -42,116 +42,121 @@ Ox.AnnotationFolder = function(options, self) {
         })
         .options(options || {});
 
-    Ox.print('SO', self.options)
-
     self.sort = getSort();
     self.widget = self.options.type == 'event' ? 'Calendar'
         : self.options.type == 'place' ? 'Map' : '';
 
+    if (self.widget) {
+        self.$defineButton = Ox.Button({
+            disabled: !self.options.selected,
+            id: 'define',
+            style: 'symbol',
+            title: 'click',
+            tooltip: 'Define ' + Ox.toTitleCase(self.options.type),
+            type: 'image'
+        })
+        .bindEvent({
+            click: function() {
+                var item = Ox.getObjectById(self.options.items, self.options.selected);
+                that.triggerEvent('define', item.place ? {
+                    id: item.place.id
+                } : {
+                    name: item.value
+                });
+            }
+        });
+    }
+
+    self.$addButton = Ox.Button({
+        disabled: !self.options.editable,
+        id: 'add',
+        style: 'symbol',
+        title: 'add',
+        tooltip: 'Add ' + self.options.item,
+        type: 'image'
+    }).bindEvent({
+        click: function() {
+            that.triggerEvent('add', {value: ''});
+        }
+    });    
+
     that.setElement(
         Ox.CollapsePanel({
             collapsed: self.options.collapsed,
             extras: Ox.merge(
-                self.widget ? [
-                    Ox.MenuButton({
-                        items: [
-                            {id: 'show', title: 'Show ' + self.widget, checked: true}
-                        ],
-                        style: 'square',
-                        title: 'set',
-                        type: 'image'
-                    })
-                    .bindEvent({
-                        click: function(data) {
-                            
-                        }
-                    })
-                ] : [],
-                self.options.editable ? [
-                    Ox.Button({
-                        id: 'add',
-                        style: 'symbol',
-                        title: 'add',
-                        tooltip: 'Add ' + self.options.item,
-                        type: 'image'
-                    }).bindEvent({
-                        click: function(data) {
-                            that.triggerEvent('add', {value: ''});
-                        }
-                    })
-                ] : []
+                self.widget ? [self.$defineButton] : [],
+                [self.$addButton]
             ),
             size: 16,
             title: self.options.title
         })
         .addClass('OxAnnotationFolder')
         .bindEvent({
-            toggle: togglePanel
+            toggle: toggleLayer
         })
     );
     that.$content = that.$element.$content;
 
     if (self.widget) {
         self.widgetSize = self.options.showWidget * self.options.widgetSize;
-    }
-
-    if (self.options.type == 'event') {
+        Ox.print('FOO', self.widgetSize, self.options.showWidget, self.options.widgetSize)
         self.$outer = Ox.Element()
             .css({
                 display: 'table-cell',
-                width: self.options.width + 'px',
-                //height: '256px'
-            });
-        self.$calendar = Ox.Calendar({
-                events: getEvents(),
-                height: self.widgetSize,
-                width: self.options.width
-            })
-            .css({
-                width: self.options.width + 'px',
-                height: self.widgetSize + 'px'
-            })
-            .bindEvent({
-                select: function(data) {
-                    selectAnnotation({id: data.annotationId});
-                }
-            })
-            .appendTo(self.$outer);
-    } else if (self.options.type == 'place') {
-        Ox.print('SWS', self.widgetSize)
-        self.$outer = Ox.Element()
-            .css({
-                display: 'table-cell',
-                width: self.widgetSize + 'px',
+                width: self.options.width + 'px'
             })
             .appendTo(that.$content);
         self.$inner = Ox.Element()
-            .css({height: self.widgetSize + 'px', overflow: 'hidden'})
+            .css({
+                height: self.widgetSize + 'px',
+                overflow: 'hidden'
+            })
             .appendTo(self.$outer);
-        self.$map = Ox.Map({
-                places: getPlaces()
-                // showLabels: true
-            })
-            .css({height: self.widgetSize + 'px'})
-            .bindEvent({
-                // FIXME: should be select, not selectplace
-                selectplace: function(data) {
-                    self.$annotations.options({selected: data.annotationId});
-                    // selectAnnotation({id: data.annotationId});
-                }
-            })
-            .appendTo(self.$inner);
-    }
-
-    if (self.widget) {
-
+        if (options.type == 'event') {
+            self.$widget = self.$calendar = Ox.Calendar({
+                    events: getEvents(),
+                    height: self.widgetSize,
+                    showZoombar: true,
+                    width: self.options.width
+                })
+                .css({
+                    width: self.options.width + 'px',
+                    height: self.widgetSize + 'px'
+                })
+                .bindEvent({
+                    select: function(data) {
+                        selectAnnotation({id: data.annotationId});
+                    }
+                })
+                .appendTo(self.$inner);
+        } else { // place
+            self.$widget = self.$map = Ox.Map({
+                    places: getPlaces(),
+                    showTypes: true,
+                    // FIXME: should be showZoombar
+                    zoombar: true
+                    // showLabels: true
+                })
+                .css({
+                    width: self.options.width + 'px',
+                    height: self.widgetSize + 'px'
+                })
+                .bindEvent({
+                    // FIXME: should be select, not selectplace
+                    selectplace: function(data) {
+                        self.$annotations.options({selected: data.annotationId});
+                        // selectAnnotation({id: data.annotationId});
+                    }
+                })
+                .appendTo(self.$inner);
+        }
         self.$resizebar = Ox.Element({
                 tooltip: 'Drag to resize or click to toggle map' // fixme: update as w/ splitpanels
             })
             .addClass('OxResizebar OxHorizontal')
             .css({
                 position: 'absolute',
-                top: self.options.widgetSize + 'px',
+                top: self.widgetSize + 'px',
                 cursor: 'ns-resize'
             })
             .append($('<div>').addClass('OxSpace'))
@@ -164,13 +169,14 @@ Ox.AnnotationFolder = function(options, self) {
                 dragend: dragend
             })
             .appendTo(self.$outer);         
-
     }
 
     self.$annotations = Ox.ArrayEditable({
             editable: self.options.editable,
             items: getAnnotations(),
+            placeholder: 'No ' + self.options.title,
             selected: self.options.selected,
+            separator: ';',
             sort: self.sort,
             submitOnBlur: false,
             width: self.options.type == 'text' ? self.options.width + 8 : self.options.width,
@@ -179,12 +185,19 @@ Ox.AnnotationFolder = function(options, self) {
         //.css({marginTop: '256px'})
         .bindEvent({
             add: function(data) {
-                that.triggerEvent('add', {value: data.value || ''});
+                if (self.editing) {
+                    // FIXME: changed value will not be saved!
+                }
+                that.triggerEvent('add', {value: data.value || ''});                    
             },
             blur: function() {
+                // the video editor will, if it has not received focus,
+                // call blurItem
                 that.triggerEvent('blur');
             },
+            change: changeAnnotation,
             'delete': function(data) {
+                self.editing = false;
                 that.triggerEvent('remove', {id: data.id});
             },
             edit: function() {
@@ -208,33 +221,43 @@ Ox.AnnotationFolder = function(options, self) {
         selectAnnotation({id: self.options.selected});
     }, 0);
 
-    if (self.options.type == 'place') {
-        self.$annotations.find('.OxValue').each(function() {
-            var $element = $(this);
-            if (!Ox.getObject(self.options.items, 'value', $element.html()).place) {
-                $element.css({color: 'rgb(192, 64, 64)'});
-            }
-        });
+    showWarnings();
+
+    function changeAnnotation(data) {
+        var item = Ox.getObjectById(self.options.items, data.id);
+        item.value = data.value;
+        that.triggerEvent('change', item);
     }
 
     function dragstart() {
-        self.drag = {
-            startSize: self.options.widgetSize
-        };
+        if (self.options.showWidget) {
+            self.drag = {
+                startSize: self.options.widgetSize
+            };
+        }
     }
 
     function drag(e) {
-        self.options.widgetSize = Ox.limit(
-            self.drag.startSize + e.clientDY, 128, 384
-        );
-        Ox.print('DRAG', self.options.widgetSize, e.clientDY);
-        self.$resizebar.css({top: self.options.widgetSize + 'px'});
-        self.$inner.css({height: self.options.widgetSize + 'px'});
-        self.$map.css({height: self.options.widgetSize + 'px'}).resizeMap();        
+        if (self.options.showWidget) {
+            self.options.widgetSize = Ox.limit(
+                self.drag.startSize + e.clientDY, 128, 384
+            );
+            if (self.options.widgetSize >= 248 && self.options.widgetSize <= 264) {
+                self.options.widgetSize = 256;
+            }
+            self.$resizebar.css({top: self.options.widgetSize + 'px'});
+            self.$inner.css({height: self.options.widgetSize + 'px'});
+            self.$widget.css({
+                height: self.options.widgetSize + 'px'
+            });
+        }
+        //self.options.type == 'place' && self.$map.resizeMap();        
     }
 
     function dragend(e) {
-
+        if (self.options.showWidget) {
+            that.triggerEvent('resizewidget', {size: self.options.widgetSize});
+        }
     }
 
     function getAnnotations() {
@@ -296,6 +319,7 @@ Ox.AnnotationFolder = function(options, self) {
     function selectAnnotation(data) {
         var item = Ox.getObjectById(self.options.items, data.id);
         self.options.selected = item ? data.id : '';
+        self.widget && self.$defineButton.options({disabled: !self.options.selected});
         ///*
         if (self.options.type == 'place') {
             self.$map.options({
@@ -311,19 +335,33 @@ Ox.AnnotationFolder = function(options, self) {
         } : {}));
     }
 
+    function showWarnings() {
+        if (self.widget && self.options.items.length) {
+            self.$annotations.find('.OxValue').each(function() {
+                var $element = $(this);
+                try { // FIXME: bad data, remove later!!
+                    if (!Ox.getObject(
+                        self.options.items, 'value', $element.html()
+                    )[self.options.type]) {
+                        $element.css({color: 'rgb(192, 64, 64)'});
+                    }
+                } catch(e) {}
+            });
+        }
+    }
+
     function submitAnnotation(data) {
         var item = Ox.getObjectById(self.options.items, data.id);
         item.value = data.value;
         self.editing = false;
-        Ox.print('??:', self.options.items[0], self.$annotations.options('items')[0])
         //self.$annotations.options({items: self.options.items});
         self.options.sort == 'text' && self.$annotations.reloadItems();
         that.triggerEvent('submit', item);
     }
 
-    function togglePanel() {
+    function toggleLayer() {
         self.options.collapsed = !self.options.collapsed;
-        that.triggerEvent('toggle', {collapsed: self.options.collapsed});
+        that.triggerEvent('togglelayer', {collapsed: self.options.collapsed});
     }
 
     function toggleWidget() {
@@ -331,9 +369,21 @@ Ox.AnnotationFolder = function(options, self) {
         self.widgetSize = self.options.showWidget * self.options.widgetSize;
         self.$resizebar.animate({top: self.widgetSize + 'px'}, 250);
         self.$inner.animate({height: self.widgetSize + 'px'}, 250);
-        self.$map.animate({height: self.widgetSize + 'px'}, 250, function() {
-            self.$map.resizeMap();
+        self.$widget.animate({height: self.widgetSize + 'px'}, 250, function() {
+            self.$widget.options({height: self.widgetSize});
         });
+        that.triggerEvent('togglewidget', {collapsed: !self.options.showWidget});
+    }
+
+    function updateAnnotations() {
+        self.$annotations.options({items: getAnnotations()});
+        showWarnings();
+    }
+
+    function updateWidget() {
+        self.options.type == 'event'
+            ? self.$calendar.options({events: getEvents()})
+            : self.$map.options({places: getPlaces()});
     }
 
     self.setOption = function(key, value) {
@@ -344,19 +394,19 @@ Ox.AnnotationFolder = function(options, self) {
         }
         if (key == 'in') {
             //fixme: array editable should support item updates while editing
-            if (self.editing || self.options.range == 'selection') {
-                self.options.type == 'place' ? self.$map.options({places: getPlaces()})
-                    : self.$annotations.options({items: getAnnotations()});
+            if (self.options.range == 'selection') {
+                self.widget && updateWidget();
+                updateAnnotations();
             }
         } else if (key == 'out') {
-            if (self.editing || self.options.range == 'selection') {
-                self.options.type == 'place' ? self.$map.options({places: getPlaces()})
-                    : self.$annotations.options({items: getAnnotations()});
+            if (self.options.range == 'selection') {
+                self.widget && updateWidget();
+                updateAnnotations();
             }
         } else if (key == 'position') {
-            if (self.editing || self.options.range == 'position') {
-                self.options.type == 'place' ? self.$map.options({places: getPlaces()})
-                    : self.$annotations.options({items: getAnnotations()});
+            if (self.options.range == 'position') {
+                self.widget && updateWidget();
+                updateAnnotations();
             }
         } else if (key == 'range') {
             self.$annotations.options({items: getAnnotations()});
@@ -368,9 +418,16 @@ Ox.AnnotationFolder = function(options, self) {
         } else if (key == 'sort') {
             self.sort = getSort();
             self.$annotations.options({sort: self.sort});
+            showWarnings();
         } else if (key == 'users') {
-            self.$annotations.options({items: getAnnotations()});
+            updateAnnotations();
         } else if (key == 'width') {
+            Ox.print('RESIZE!!!!')
+            if (self.widget) {
+                self.$outer.options({width: self.options.width});
+                self.$inner.options({width: self.options.width});
+                self.$widget.options({width: self.options.width});
+            }
             self.$annotations.options({
                 width: self.options.type == 'text' ? self.options.width + 8 : self.options.width
             });
@@ -381,18 +438,26 @@ Ox.AnnotationFolder = function(options, self) {
     addItem <f> addItem
     @*/
     that.addItem = function(item) {
+        Ox.print('FOLDER ADD ITEM', item)
         var pos = 0;
         self.options.items.splice(pos, 0, item);
-        self.$annotations.addItem(pos, item);
-        self.$annotations.editItem(item.id);
+        self.$annotations
+            .addItem(pos, item)
+            .options({selected: item.id})
+            .editItem();
+        //selectAnnotation(item);
+        //that.triggerEvent('edit');
+        return that;
     };
 
     that.blurItem = function() {
         self.$annotations.blurItem();
+        return that;
     };
 
     that.editItem = function() {
         self.$annotations.editItem();
+        return that;
     };
 
     /*@
@@ -406,6 +471,14 @@ Ox.AnnotationFolder = function(options, self) {
     };
     */
 
+    that.updateItem = function(item) {
+        var index = Ox.getIndexById(self.options.items, item.id);
+        self.options.items[index] = item;
+        self.widget && updateWidget();
+        updateAnnotations();
+        return that;
+    }
+
     return that;
 
 };
diff --git a/source/Ox.UI/js/Video/Ox.AnnotationPanel.js b/source/Ox.UI/js/Video/Ox.AnnotationPanel.js
index 7af65d2e..4387cd0f 100644
--- a/source/Ox.UI/js/Video/Ox.AnnotationPanel.js
+++ b/source/Ox.UI/js/Video/Ox.AnnotationPanel.js
@@ -174,23 +174,39 @@ Ox.AnnotationPanel = function(options, self) {
                 blur: function() {
                     that.triggerEvent('blur');
                 },
+                change: function(data) {
+                    that.triggerEvent('change', Ox.extend({layer: layer.id}, data));
+                },
+                define: function(data) {
+                    that.triggerEvent('define', data);
+                },
                 edit: function() {
-                    that.triggerEvent('edit')
+                    that.triggerEvent('edit');
                 },
                 paused: function() {
                     that.triggerEvent('paused')
                 },
-                'remove': function(data) {
+                remove: function(data) {
                     that.triggerEvent('remove', Ox.extend({layer: layer.id}, data));
                 },
+                resizewidget: function(data) {
+                    that.triggerEvent('resize' + (
+                        layer.type == 'event' ? 'calendar' : 'map'
+                    ), data);
+                },
                 select: function(data) {
                     selectAnnotation(data, i);
                 },
                 submit: function(data) {
-                    that.triggerEvent('submit', data);
+                    that.triggerEvent('submit', Ox.extend({layer: layer.id}, data));
                 },
-                toggle: function(data) {
+                togglelayer: function(data) {
                     that.triggerEvent('togglelayer', Ox.extend({layer: layer.id}, data));
+                },
+                togglewidget: function(data) {
+                    that.triggerEvent('toggle' + (
+                        layer.type == 'event' ? 'calendar' : 'map'
+                    ), data);
                 }
             })
             .appendTo(self.$folders);
@@ -280,11 +296,11 @@ Ox.AnnotationPanel = function(options, self) {
     };
 
     that.addItem = function(layer, item) {
+        Ox.print('ADD ITEM', layer, item);
         var i = Ox.getIndexById(self.options.layers, layer);
         self.$folder[i].addItem(item);
     };
 
-
     that.blurItem = function() {
         getFolder(self.options.selected).blurItem();
     };
@@ -293,9 +309,9 @@ Ox.AnnotationPanel = function(options, self) {
         getFolder(self.options.selected).editItem();
     };
 
-    that.updateItem = function(layer, item) {
-        var i = Ox.getIndexById(self.options.layers, layer);
-        self.$folder[i].updateItem(item);
+    that.updateItem = function(item) {
+        Ox.print('UPDATE ITEM', item);
+        getFolder(item.id).updateItem(item);
     };
 
     return that;
diff --git a/source/Ox.UI/js/Video/Ox.VideoEditor.js b/source/Ox.UI/js/Video/Ox.VideoEditor.js
index 7e6247e6..7d12f2d6 100644
--- a/source/Ox.UI/js/Video/Ox.VideoEditor.js
+++ b/source/Ox.UI/js/Video/Ox.VideoEditor.js
@@ -58,9 +58,6 @@ Ox.VideoEditor = function(options, self) {
                 width: 0
             })
             .options(options || {})
-            .mousedown(function() {
-                that.gainFocus();
-            })
             .bindEvent({
                 key_0: toggleMuted,
                 key_shift_0: function() {
@@ -90,8 +87,9 @@ Ox.VideoEditor = function(options, self) {
                     movePositionBy(self.sizes.timeline[0].width);
                 },
                 key_enter: function() {
-                    if (self.editiing) {
-                        submitAnnotation();
+                    if (self.editing) {
+                        // submitAnnotation();
+                        blurAnnotation();
                     } else if (self.options.selected) {
                         editAnnotation();
                     }
@@ -211,8 +209,12 @@ Ox.VideoEditor = function(options, self) {
             // the following is needed to determine
             // how to handle annotation input blur
             if (self.editing) {
+                Ox.print('FOCUSED')
                 self.focused = true;
                 setTimeout(function() {
+                    // annotation folder will gain focus on blur
+                    // so we need to get focus back
+                    that.gainFocus();
                     self.focused = false;
                 }, 25);
             }
@@ -614,18 +616,26 @@ Ox.VideoEditor = function(options, self) {
                 addAnnotation(data.layer);
             },
             annotationsfont: function(data) {
+                self.options.annotationsFont = data.font;
                 that.triggerEvent('annotationsfont', data);
             },
             annotationsrange: function(data) {
+                self.options.annotationsRange = data.range;
                 that.triggerEvent('annotationsrange', data);
             },
             annotationssort: function(data) {
+                self.options.annotationsSort = data.sort;
                 that.triggerEvent('annotationssort', data);
             },
-            blur: function() {
-                Ox.print('VE-BLUR')
-                self.editing = false;
-                setTimelineState();
+            blur: function(data) {
+                Ox.print('VIDEO EDITOR BLUR')
+                !self.focused && blurAnnotation();
+            },
+            change: function(data) {
+                that.triggerEvent('editannotation', data);
+            },
+            define: function(data) {
+                that.triggerEvent('define', data);
             },
             edit: function() {
                 self.editing = true;
@@ -633,21 +643,39 @@ Ox.VideoEditor = function(options, self) {
             },
             paused: togglePaused,
             remove: function(data) {
-                that.triggerEvent('removeannotation', {
-                    id: data.id,
-                    layer: data.layer
-                });
+                Ox.print('?>???', data)
+                var layer = Ox.getObjectById(self.options.layers, data.layer),
+                    index = Ox.getIndexById(layer.items, data.id);
+                layer.items.splice(index, 1);
+                self.editing = false;
+                self.options.selected = '';
+                setTimelineState();
+                that.triggerEvent('removeannotation', data);
             },
             resize: resizeAnnotations,
             resizeend: resizeendAnnotations,
+            resizecalendar: function(data) {
+                that.triggerEvent('resizecalendar', data);
+            },
+            resizemap: function(data) {
+                that.triggerEvent('resizemap', data);
+            },
             select: selectAnnotation,
             submit: submitAnnotation,
             toggle: toggleAnnotations,
+            togglecalendar: function(data) {
+                self.options.showAnnotationsCalendar = !data.collapsed;
+                that.triggerEvent('togglecalendar', data);
+            },
             togglelayer: function(data) {
                 that.triggerEvent('togglelayer', {
                     collapsed: data.collapsed,
                     layer: data.layer
                 });
+            },
+            togglemap: function(data) {
+                self.options.showAnnotationsMap = !data.collapsed;
+                that.triggerEvent('togglemap', data);
             }
         });
 
@@ -673,7 +701,7 @@ Ox.VideoEditor = function(options, self) {
                     collapsible: true,
                     element: self.$annotationPanel,
                     resizable: true,
-                    resize: [192, 256, 320, 384],
+                    resize: [192, 256, 320, 384, 448, 512],
                     size: self.options.annotationsSize,
                     tooltip: self.options.tooltips ? 'annotations' : false
                 }
@@ -700,7 +728,17 @@ Ox.VideoEditor = function(options, self) {
     function blurAnnotation() {
         self.editing = false;
         setTimelineState();
-        self.$annotationPanel.blurItem();
+        if (
+            self.options.annotationsRange == 'position' && (
+                self.options.position < self.options['in']
+                || self.options.position > self.options.out
+            )
+        ) {
+            setPosition(self.options['in']);
+        }
+        // setPosition causes a folder redraw
+        // so blur once that's done
+        setTimeout(self.$annotationPanel.blurItem, 0);
     }
 
     function editAnnotation() {
@@ -920,7 +958,6 @@ Ox.VideoEditor = function(options, self) {
     }
 
     function selectAnnotation(data) {
-        //Ox.print('VE.sA')
         if (Ox.isUndefined(data)) {
             // doubleclick on small timeline
             data = getAnnotation();
@@ -929,13 +966,10 @@ Ox.VideoEditor = function(options, self) {
         }
         self.editing = false;
         self.options.selected = data.id;
-        // fixme: what is the following supposed to do?
-        if (self.options.selected && self.options.annotationsRange != 'position') {
-            setPosition(data['in']);
-        }
         if (self.options.selected) {
-            setPoint('in', data['in']);
-            setPoint('out', data.out);
+            self.options.annotationsRange != 'position' && setPosition(data['in']);
+            setPoint('in', data['in'], true);
+            setPoint('out', data.out, true);
         }
         self.$annotationPanel.options({selected: self.options.selected});
         setTimelineState();
@@ -964,16 +998,12 @@ Ox.VideoEditor = function(options, self) {
         setPoint('out', points.out);
     }
 
-    function setPoint(point, position, annotation) {
+    function setPoint(point, position, keepSelected) {
         var otherPoint = point == 'in' ? 'out' : 'in';
         self.options[point] = position;
-        /*
-        // should only happen through interaction
-        if (self.options.selected && !self.editing) {
-            self.options.selected = '';
-            setTimelineState();
+        if (self.options.selected && !self.editing && !keepSelected) {
+            selectAnnotation({id: ''});
         }
-        */
         self.$player.forEach(function($player) {
             $player.options(point, self.options[point]);
         });
@@ -984,22 +1014,22 @@ Ox.VideoEditor = function(options, self) {
             $timeline.options(point, self.options[point]);
         });
         if (self.options['in'] > self.options.out) {
-            setPoint(point == 'in' ? 'out' : 'in', position);
-        }
-        self.$annotationPanel.options({
-            'in': self.options['in'],
-            out: self.options.out
-        });
-        that.triggerEvent('points', {
-            'in': self.options['in'],
-            out: self.options.out
-        });
-        if (self.editing) {
-            that.triggerEvent('editannotation', {
-                id: self.options.selected,
+            setPoint(point == 'in' ? 'out' : 'in', position, keepSelected);
+        } else {
+            self.$annotationPanel.options({
                 'in': self.options['in'],
                 out: self.options.out
             });
+            that.triggerEvent('points', {
+                'in': self.options['in'],
+                out: self.options.out
+            });
+            self.editing && that.triggerEvent('editannotation', {
+                id: self.options.selected,
+                'in': self.options['in'],
+                out: self.options.out,
+                value: $('.OxEditableElement input:visible').val()
+            });
         }
     }
 
@@ -1056,6 +1086,17 @@ Ox.VideoEditor = function(options, self) {
     function submitAnnotation(data) {
         self.editing = false;
         setTimelineState();
+        Ox.print('....', self.options.annotationsRange == 'position',
+            self.options.position < self.options['in'],
+            self.options.position > self.options.out)
+        if (
+            self.options.annotationsRange == 'position' && (
+                self.options.position < self.options['in']
+                || self.options.position > self.options.out
+            )
+        ) {
+            setPosition(self.options['in']);
+        }
         data['in'] = self.options['in'];
         data.out = self.options.out;
         that.triggerEvent('editannotation', data);
@@ -1137,9 +1178,15 @@ Ox.VideoEditor = function(options, self) {
         annotation <o> annotation to add
     @*/
     that.addAnnotation = function(layer, annotation) {
+        // called from addannotation callback
         self.$annotationPanel.addItem(layer, annotation);
     };
 
+    that.updateAnnotation = function(annotation) {
+        // called from editannotation callback
+        self.$annotationPanel.updateItem(annotation);
+    }
+
     /*@
     removeAnnotation <f> remove annotation
         (layer, ids) -> <o> remove annotation from layer
diff --git a/source/Ox.UI/themes/classic/css/classic.css b/source/Ox.UI/themes/classic/css/classic.css
index 35740e19..f2edd359 100644
--- a/source/Ox.UI/themes/classic/css/classic.css
+++ b/source/Ox.UI/themes/classic/css/classic.css
@@ -740,6 +740,13 @@ Video
     background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 1), rgba(192, 192, 192, 1));
 }
 
+/* FIXME: the first two should apply for every ArrayEditable */
+.OxThemeClassic .OxAnnotationFolder .OxArrayEditable .OxSeparator {
+    color: rgb(96, 96, 96);
+}
+.OxThemeClassic .OxAnnotationFolder .OxEditableElement.OxPlaceholder .OxValue {
+    color: rgb(160, 160, 160);
+}
 .OxThemeClassic .OxAnnotationFolder .OxEditableElement.OxSelected {
     background: rgb(192, 192, 255);
     box-shadow: 0 0 1px rgb(64, 64, 64);