Changeset 4042

Timestamp:

08/14/10 12:54:49 (21 months ago)

Author:

mszopinski

Message:

calendar, one-week display
fixes

Location:

ssme/trunk

Files:

• flex/Calendar/src/Calendar.mxml (modified) (5 diffs)
• flex/Calendar/src/com/kh/ssme/components/DayCanvas.as (modified) (5 diffs)
• flex/Calendar/src/com/kh/ssme/components/EventField.as (modified) (4 diffs)
• flex/Calendar/src/com/kh/ssme/components/SimpleEventDisplay.as (modified) (1 diff)
• flex/Common/src/com/kh/ssme/components/GridCanvas.as (modified) (6 diffs)
• flex/Common/src/com/kh/ssme/components/RoundedCornerContainer.as (modified) (2 diffs)
• web/flex/Calendar.swf (modified) (previous)

ssme/trunk/flex/Calendar/src/Calendar.mxml

@@ -251 +251 @@
         import com.kh.ssme.entity.CalendarEntity;
         import com.kh.ssme.entity.ErrorMessageEntity;
+        import com.kh.ssme.entity.TimeFrameEntity;
+        import com.kh.ssme.util.DateProperty;
         import com.kh.ssme.util.DateUtil;
+        import com.kh.ssme.util.HashArray;
         import com.kh.ssme.util.Logger;
 
@@ -280 +283 @@
 
             currentState = "day";
-
+            theDayCanvas = canvas_1;
+            dayCanvas = [ canvas_1, canvas_2, canvas_3, canvas_4, canvas_5, canvas_6, canvas_7 ];
         }
 
@@ -351 +355 @@
 
         private var calendarEntity:CalendarEntity;
+        private var currentDay:Date, weekBeginDay:Date, monthBeginDay:Date, dayOfTheWeek:int = 0; 
         private function onCalendarGetResponse(event:Event):void {
             var result:ConnectorResult = (event as SsmeEvent).eventProperties['result'];
@@ -359 +364 @@
                     Logger.debug( result.lastResult as String, LoggingComponentsEnum.CAL );
                     calendarEntity = (new CalendarEntity()).parseJSONString( result.lastResult as String, EVENTS_RECURSION );
+                    currentDay = chosenDate.selectedDate;
+                    weekBeginDay = (new DateUtil( currentDay )).weekBegin( 0 ).date;
+                    monthBeginDay = (new DateUtil( currentDay )).monthBegin().date;
+                    dayOfTheWeek = currentDay.getDay() - weekBeginDay.getDay();
                     switch( state.selectedIndex ){  // determine time range
                         case DAY: {
@@ -388 +397 @@
         }
 
-        private var theDayCanvas:DayCanvas = canvas_1;
-        private var dayCanvas:Array = [ canvas_1, canvas_2, canvas_3, canvas_4, canvas_5, canvas_6, canvas_7 ];
+        private var theDayCanvas:DayCanvas;
+        private var dayCanvas:Array;
         private function showDayEvents():void {
-            canvas_1.currentDay = chosenDate.selectedDate; 
+            canvas_1.currentDay = currentDay;
             canvas_1.dataProvider = calendarEntity.timeFramesEntitites;
+            //dayCanvas[ dayOfTheWeek ].currentDay = currentDay;
+            //dayCanvas[ dayOfTheWeek ].dataProvider = calendarEntity.timeFramesEntitites;
         }
 
         private function showWeekEvents():void {
 
+            // create data structure
+            var dataProviders:Array = [  ], i:int, timeFrame:TimeFrameEntity;
+            for(i=0; i<7; i++)  dataProviders.push( new HashArray() );
+
+            // divide events among days            
+            for each( timeFrame in calendarEntity.timeFramesEntitites ){
+                if( timeFrame.from.getDay() == timeFrame.to.getDay() ){
+                    // starts and ends in the same day
+                    dataProviders[ timeFrame.from.getDay() ].put( timeFrame.UUID, timeFrame );    
+                } else {
+                    // split over some days so add it to all of them
+                    for(i=timeFrame.from.getDay(); i<=timeFrame.to.getDay();i++){
+                        dataProviders[ i ].put( timeFrame.UUID, timeFrame );          
+                    }                    
+                }
+            }
+
+            // set dataProviders
+            var weekBegin:DateUtil = new DateUtil( weekBeginDay );
+            for(i=0; i<7; i++){
+                (dayCanvas[ i ] as DayCanvas).currentDay = weekBegin.date;
+                (dayCanvas[ i ] as DayCanvas).dataProvider = dataProviders[ i ];
+                weekBegin.add( DateProperty.DATE, 1 );
+            }
         }        
 

ssme/trunk/flex/Calendar/src/com/kh/ssme/components/DayCanvas.as

@@ -24 +24 @@
 
     import com.kh.ssme.entity.TimeFrameEntity;
-import com.kh.ssme.util.DateUtil;
-import com.kh.ssme.util.HashArray;
-
-import flash.display.DisplayObject;
-
-import mx.containers.Canvas;
-import mx.controls.Label;
-import mx.controls.TextArea;
-
-public class DayCanvas extends GridCanvas {
+    import com.kh.ssme.util.DateUtil;
+    import com.kh.ssme.util.HashArray;
+
+import com.kh.ssme.util.Logger;
+import com.kh.ssme.util.Logger;
+
+    public class DayCanvas extends GridCanvas {
 
         public function DayCanvas() {
@@ -41 +38 @@
         public var currentDay:Date;
 
+        private var oldWidth:Number, oldHeight:Number;
         override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
 
-            if(visible){    // repaint only if visible
+            if(visible){    // necessary only if visible
+
                 // call first in order to get grid drawn correctly
-                super.updateDisplayList(unscaledWidth, unscaledHeight);
+                super.updateDisplayList(unscaledWidth, unscaledHeight);                
+
+                // call repaint only if dimensions were changed
+                if((unscaledWidth+unscaledHeight) - (oldWidth+oldHeight)){
+                    oldWidth = unscaledWidth;
+                    oldHeight = unscaledHeight;
+                    repaint();    
+                }
             }
         }
@@ -51 +57 @@
         [ArrayElementType("com.kh.ssme.entity.TimeFrameEntity")]
         private var dataProvider_:HashArray;
+        private var eventsMap:HashArray = new HashArray();
+
         public function set dataProvider(value:HashArray):void{
+            dataProviderAvailable = false;
+            eventFieldsUpToDate = false;
+            recreateEvents = true;
             dataProvider_ = value;
             
@@ -57 +68 @@
                 if( eventsMap.getValueAt(i) ){
                     this.removeChild( eventsMap.getValueAt(i) );                    
-                    trace( "REMOVE : "+eventsMap.getValueAt(i).data+" - ["+eventsMap.getValueAt(i).data.UUID+"] " );
                 }
             }
             eventsMap.clear();
-            
-            createEvents();
+            dataProviderAvailable = true;            
+
+            repaint();
             validateNow();
         }
@@ -69 +80 @@
         }    
 
-        private var eventsMap:HashArray = new HashArray();
-        public function createEvents():void{
-
-            // prepare additional data about events
-            
-
-            // create events
+        private var dataProviderAvailable:Boolean = false;
+        private var recreateEvents:Boolean = false;        
+        private var eventFieldsUpToDate:Boolean = false;
+        public function repaint():void{
+            if(dataProviderAvailable){
+                createEvents();
+                repaintEvents();
+            }
+        }
+
+        /**
+         * Create display object for each TimeFrameEntity in dataProvider
+         */
+        protected function createEvents():void{
+
+            // in order to save time we recreate EventFields
+            // only if it is necessary
+            if(recreateEvents){
+
+                // create events
+                var ev:EventField;
+                var i:int = 0, timeBegin:int, timeEnd:int;
+                var from:DateUtil, to:DateUtil, current:DateUtil = (new DateUtil(currentDay)).dayBegin();
+                for each(var json:TimeFrameEntity in dataProvider_){
+                    ev = new EventField();
+                    eventsMap.put(json.UUID, ev);
+
+                    ev.eventInfo = new SimpleEventDisplay();
+                    ev.data = json;
+                    ev.name = json.UUID;
+
+                    // event boundaries, index
+                    timeBegin = (json.from.getHours() * 4) + ((json.from.getMinutes() as int)/15);
+                    timeEnd = (json.to.getHours() * 4) + ((json.to.getMinutes() as int)/15);
+                    // check if event exceed current day
+                    from = (new DateUtil(json.from)).dayBegin();
+                    to = (new DateUtil(json.to)).dayBegin();
+                    if( current.compare(from) > 0 )    timeBegin = 0;
+                    if( current.compare(to) < 0 )       timeEnd = rowsPosition[1].length - 1;
+                    // store for future use
+                    ev.beginIndex = timeBegin;
+                    ev.endIndex = timeEnd;
+
+                    ev.setStyle("borderThickness", 5);
+                    ev.setStyle("cornerRadius", 20);
+
+                    addChild( ev );
+                }
+
+                recreateEvents = false;
+            }
+        }
+
+        // used by repaint
+        private var clusterOfEventsMap:HashArray = new HashArray();        
+        /**
+         * Calculates rank and coordinates for each TimeFrame display object  
+         */
+        protected function repaintEvents():void{
             var ev:EventField;
-            var i:int = 0;
-            for each(var json:TimeFrameEntity in dataProvider_){                
-                ev = new EventField();
-                eventsMap.put(json.UUID, ev);
+            var countArray:Array;
+            var i:int, j:int = 0;
+
+            // in order to save time we recalculate ranks, clusters etc.
+            // only if it is necessary
+            if(!eventFieldsUpToDate){
+                //------------------------------------------------
+                // "rank" events
+                // count number of events for each quarter
+                countArray = new Array(96);
+                for each(ev in eventsMap){
+                    for(i=ev.beginIndex; i<ev.endIndex; i++){
+                        if(countArray[i]<0 || isNaN(countArray[i]))     countArray[i]=0;
+                        countArray[i]++;
+                    }
+                }
+
+                // calculate rank and number of neighbours for each event
+                var neighbours:int;
+                for each(ev in eventsMap){
+                    neighbours = 0;
+                    for(i=ev.beginIndex; i<ev.endIndex; i++)   neighbours = Math.max( neighbours, countArray[i] );
+                    ev.neighbours = neighbours - 1;
+                    ev.rank = neighbours*10000 + (ev.endIndex - ev.beginIndex)*100 + ev.beginIndex;
+                }
+                //------------------------------------------------
+
+
+                //------------------------------------------------
+                //clustering events into separated groups which don't intersect each other
+                var clusterIndex:Array = new Array(96);
+                var helpMap:HashArray, lastCreatedClusterID:int = 1;
+                var trace:String = "";
+
+                // clear old clusters
+                clusterOfEventsMap.clear();
                 
-                ev.eventInfo = new SimpleEventDisplay();
-                ev.data = json;
-                ev.name = json.UUID;
-                ev.setStyle("borderThickness", 5);
-                ev.setStyle("cornerRadius", 20);
-                trace( "ADD : "+ev.data+" - ["+ev.data.UUID+"] " );                     
-
-                addChild( ev );
-                sizeEvent( ev, i );
-                i += 100;
-
-            }
-
-        }
-
-        private function sizeEvent(ev:EventField, i:int):void{
+                // for each of the events
+                for each(ev in eventsMap){
+                    helpMap = new HashArray();
+
+                    // check the time span of current event
+                    // if there were already clusters defined for this span then collect their ids
+                    for(i=ev.beginIndex; i<ev.endIndex; i++){
+                        if(clusterIndex[i]<0 || isNaN(clusterIndex[i]))     clusterIndex[i]=0;
+                        if(!helpMap.containsKey(clusterIndex[i]) && clusterIndex[i]>0){
+                            helpMap.put(clusterIndex[i], clusterIndex[i]);
+                        }
+                    }
+
+                    if(helpMap.size == 0){  //  helpMap.size == #clusters
+                        // there were no clusters so far for this span,
+                        // so we 'book' the span and create new cluster on the base of current event
+                        for(i=ev.beginIndex; i<ev.endIndex; i++)    clusterIndex[i] = lastCreatedClusterID;
+                        clusterOfEventsMap.put(lastCreatedClusterID, [ ev ]);
+                        lastCreatedClusterID++;
+                    }
+                    if(helpMap.size == 1){
+                        // there was one cluster for this span
+                        // so we just join current event to cluster we found
+                        var currentCluster:int = helpMap.getKeyAt(0);
+                        for(i=ev.beginIndex; i<ev.endIndex; i++)    clusterIndex[i] = currentCluster;
+                        clusterOfEventsMap[currentCluster].push( ev );
+                    }
+                    if(helpMap.size > 1){
+                        // there was more than one cluster for this span
+                        // we join cluster we found into new single one
+                        // so we just join current event to cluster we found
+                        var temp:Array = [ ev ];
+                        var minIndex:int = ev.beginIndex, maxIndex:int = ev.endIndex;
+                        for each(var value:* in helpMap){
+                            for each(var clusterElement:EventField in clusterOfEventsMap[value]){
+                                temp.push( clusterElement ); // add to new cluster
+                                minIndex = Math.min(minIndex, clusterElement.beginIndex );
+                                maxIndex = Math.max(maxIndex, clusterElement.beginIndex );
+                            }
+                            clusterOfEventsMap.deleteWithKey(value);
+                        }
+                        for(i=minIndex; i<maxIndex; i++)    clusterIndex[i] = lastCreatedClusterID;
+                        clusterOfEventsMap.put(lastCreatedClusterID, temp);
+                        lastCreatedClusterID++;
+                    }
+
+                }
+
+                for (var key:String in clusterOfEventsMap){
+                    trace = "";
+                    var el:EventField;
+                    for each(el in clusterOfEventsMap[key])  trace+= (el.data as TimeFrameEntity).UUID.substr(0, 3)+"|";
+                    Logger.debug( "~("+key+") -> ["+trace+"]" );
+                }
+                //------------------------------------------------
+
+                eventFieldsUpToDate = true;
+            }
+
+
+            //------------------------------------------------
+            // for each cluster size it's events
+            j = 0;
+            var placeArray:Array = new Array(96);
+            var minPosition:int = 0, numberOfPositions:int = 0;
+            for each(var eventsArray:Array in clusterOfEventsMap){
+                // sort events by rank
+                eventsArray.sort( sortEventsByRank );
+
+                // calculate sub-optimal position within cluster
+                // surely there's a better algorithm :)
+                numberOfPositions = 0;                
+                for each(ev in eventsArray){
+                    minPosition = 0;
+                    // find minimal possible position (maximum of available position in span)
+                    for(i=ev.beginIndex; i<ev.endIndex; i++){
+                        if(placeArray[i]<0 || isNaN(placeArray[i]))     placeArray[i]=0;
+                        minPosition = Math.max( minPosition, placeArray[i] );
+                    }
+                    // store information in event
+                    ev.leftPosition = minPosition;
+                    //update position availability array for current span
+                    for(i=ev.beginIndex; i<ev.endIndex; i++){
+                        placeArray[i] = minPosition + 1;
+                    }
+                    numberOfPositions = Math.max( numberOfPositions, minPosition );
+                }                
+
+                // size events
+                for each(ev in eventsArray){
+                    sizeEvent( ev, eventsArray.length, numberOfPositions, j );
+                    j += 100;
+                }
+            }
+            //------------------------------------------------        
+        }
+        private function sortEventsByRank(a:EventField, b:EventField):int {
+            return ( a.rank < b.rank ) ? -1 : (( a.rank > b.rank ) ? 1 : 0 );
+        }    
+
+        private function sizeEvent(ev:EventField, clusterSize:int, numberOfPositions:int, i:int):void{
             var data:TimeFrameEntity = ev.eventInfo.eventData;
             if(data){
-                var timeBegin:int = (data.from.getHours() * 4) + ((data.from.getMinutes() as int)/15);
-                var timeEnd:int = (data.to.getHours() * 4) + ((data.to.getMinutes() as int)/15);
-
-                // if event exceed current day
-                var from:DateUtil = (new DateUtil(data.from)).dayBegin();
-                var current:DateUtil = (new DateUtil(currentDay)).dayBegin();
-                var to:DateUtil = (new DateUtil(data.to)).dayBegin();
-           
-                if( current.compare(from) > 0 ){
-                    timeBegin = 0;
-                }
-                if( current.compare(to) < 0 ){
-                    timeEnd = rowsPosition[1].length - 1;
-                }
-       
-                ev.width = 200;//XXX
-                ev.height = rowsPosition[1][timeEnd] - rowsPosition[1][timeBegin];                
-                ev.x = 50+i;//XXX
-                ev.y = rowsPosition[1][timeBegin];
+                var availableWidth:Number = this.width - this.leftHorizontalMargin_ - this.rightHorizontalMargin_;
+                ev.width = availableWidth * (2 / (numberOfPositions+2));
+                ev.height = rowsPosition[1][ev.endIndex] - rowsPosition[1][ev.beginIndex];
+                ev.x = this.leftHorizontalMargin_ + ((availableWidth / (numberOfPositions+2)) * ev.leftPosition);
+                ev.y = rowsPosition[1][ev.beginIndex];
+                this.setChildIndex( ev, 0 );
                 ev.invalidateSize();
                 ev.invalidateDisplayList();

ssme/trunk/flex/Calendar/src/com/kh/ssme/components/EventField.as

@@ -24 +24 @@
 
 import com.kh.ssme.entity.TimeFrameEntity;
-
-import flash.display.DisplayObject;
-
+   
     import mx.binding.utils.BindingUtils;
-    import mx.binding.utils.ChangeWatcher;
-    import mx.controls.TextArea;
     import mx.core.Container;
     import mx.core.UIComponent;
+    import mx.events.ToolTipEvent;
+    import mx.managers.ToolTipManager;
 
     public class EventField extends RoundedCornerContainer {
@@ -40 +38 @@
             container_.visible = container_.includeInLayout = true;
             this.addChild( container_ );
+
+            this.toolTip = "";            
         }
 
@@ -68 +68 @@
         }
 
+        /**
+         * Index of beginning quarter
+         */
+        public var beginIndex:int;
+
+        /**
+         * Index of ending quarter
+         */
+        public var endIndex:int;
+
+        /**
+         * number of neighbour events
+         */
+        public var neighbours:int;
+
+        /**
+         * Component position rank
+         */
+        public var rank:int;
+
+        /**
+         * Component left alignment
+         */
+        public var leftPosition:int;
 
         protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
@@ -75 +99 @@
             container_.y = this.borderThickness_;
             container_.width = this.width - this.borderThickness_*2;
-            container_.height = this.height - this.borderThickness_*2;            
+            container_.height = this.height - this.borderThickness_*2;
+
+            this.toolTip = "Indexes : ["+beginIndex+" - "+endIndex+"]\n" +
+                            "neighbours: "+neighbours+"; rank:"+rank+"\n" +
+                            "x: "+x+"; y:"+y+"; width:"+width+"; height:"+height+
+                            "UUID:"+data.UUID;
         }
 

ssme/trunk/flex/Calendar/src/com/kh/ssme/components/SimpleEventDisplay.as

@@ -50 +50 @@
                 this.text += eventData_.description+"\n";
 
-                this.toolTip = this.text;
+                //this.toolTip = this.text;
             }
         }

ssme/trunk/flex/Common/src/com/kh/ssme/components/GridCanvas.as

@@ -78 +78 @@
         }
         public function get outerBorderThickness_():Number{
-            return this.getStyle("outerBorderThickness");
+            return this.getStyle_("outerBorderThickness", 1);
         }
         public function set outerBorderColor_(value:uint):void{
@@ -84 +84 @@
         }
         public function get outerBorderColor_():uint{
-            return this.getStyle("outerBorderColor");
+            return this.getStyle_("outerBorderColor", 0x000000);
         }
         public function set outerBorderAlpha_(value:Number):void{
@@ -90 +90 @@
         }
         public function get outerBorderAlpha_():Number{
-            return this.getStyle("outerBorderAlpha");
+            return this.getStyle_("outerBorderAlpha", 1.0);
         }
         public function set innerBorderThicknesses_(value:Array):void{
             this.setStyle("innerBorderThicknesses", value);
         }
+        [ArrayElementType("int")]        
         public function get innerBorderThicknesses_():Array{
-            return this.getStyle("innerBorderThicknesses");
+            return this.getStyle_("innerBorderThicknesses", [ 0 ]);
         }
         public function set innerBorderColors_(value:Array):void{
             this.setStyle("innerBorderColors", value);
         }
+        [ArrayElementType("uint")]        
         public function get innerBorderColors_():Array{
-            return this.getStyle("innerBorderColors");
+            return this.getStyle_("innerBorderColors", [ 0x000000 ]);
         }
         public function set innerBorderAlphas_(value:Array):void{
             this.setStyle("innerBorderAlphas", value);
         }
+        [ArrayElementType("Number")]        
         public function get innerBorderAlphas_():Array{
-            return this.getStyle("innerBorderAlphas");
-        }
-
+            return this.getStyle_("innerBorderAlphas", [1.0]);
+        }
+        public function set cornerRadius_(value:Number):void{
+            this.setStyle("cornerRadius", value);
+        }
+        public function get cornerRadius_():Number{
+            return this.getStyle_("cornerRadius", 0);
+        }
         public function set verticalMargin_(value:Number):void{
             this.setStyle("verticalMargin", value);
         }
         public function get verticalMargin_():Number{
-            return this.getStyle("verticalMargin");
+            return this.getStyle_("verticalMargin", 0);
         }
         public function set leftHorizontalMargin_(value:Number):void{
@@ -121 +129 @@
         }
         public function get leftHorizontalMargin_():Number{
-            return this.getStyle("leftHorizontalMargin");
+            return this.getStyle_("leftHorizontalMargin", 0);
         }
         public function set rightHorizontalMargin_(value:Number):void{
@@ -127 +135 @@
         }
         public function get rightHorizontalMargin_():Number{
-            return this.getStyle("rightHorizontalMargin");
+            return this.getStyle_("rightHorizontalMargin", 0);
         }
         //---------------------------------------------
@@ -137 +145 @@
          */
         override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
-            var outBorderThickness:Number = getStyle_("outerBorderThickness", 1);
-            var outBorderColor:uint = getStyle_("outerBorderColor", 0x000000);
-            var outBorderAlpha:Number = getStyle_("outerBorderAlpha", 1.0);
-            [ArrayElementType("int")]
-            var inBorderThicknesses:Array = getStyle_("innerBorderThicknesses", [ 0 ]);
-            [ArrayElementType("uint")]
-            var inBorderColors:Array = getStyle_("innerBorderColors", [ 0x000000 ]);
-            [ArrayElementType("Number")]
-            var inBorderAlphas:Array = getStyle_("innerBorderAlphas", [ 1.0 ]);
-            var cornerRadius:Number = getStyle_("cornerRadius", 0.0);
-            var verticalMargin:Number = getStyle_("verticalMargin",0);
-            var leftHorizontalMargin:Number = getStyle_("leftHorizontalMargin",0);
-            var rightHorizontalMargin:Number = getStyle_("rightHorizontalMargin",0);            
+            var outBorderThickness:Number = outerBorderThickness_;
+            var outBorderColor:uint = outerBorderColor_;
+            var outBorderAlpha:Number = outerBorderAlpha_;
+
+            var inBorderThicknesses:Array = innerBorderThicknesses_;
+            var inBorderColors:Array = innerBorderColors_;
+            var inBorderAlphas:Array = innerBorderAlphas_;
+
+            var cornerRadius:Number = cornerRadius_;
+            var verticalMargin:Number = verticalMargin_;
+            var leftHorizontalMargin:Number = leftHorizontalMargin_;
+            var rightHorizontalMargin:Number = rightHorizontalMargin_;
 
 

ssme/trunk/flex/Common/src/com/kh/ssme/components/RoundedCornerContainer.as

@@ -72 +72 @@
         // OVERRIDE
         protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{
+
             var borderThickness:Number = getStyle_("borderThickness", 10);
             var borderColor:uint = getStyle_("borderColor", 0x000000);
             var borderAlpha:Number = 1.0;
             var cornerRadius:Number = getStyle_("cornerRadius", 10);
-            var backgroundAlpha = getStyle_("backgroundAlpha", 1.0);
+            var backgroundAlpha:Number = getStyle_("backgroundAlpha", 1.0);
 
 
@@ -93 +94 @@
 
             //border
-            if (borderThickness > 0)
-            {
+            if (borderThickness > 0){
                 graphics.lineStyle(borderThickness,
                                    borderColor,