fix dayview position & size in print sheets
authorCornelius Weiß <mail@corneliusweiss.de>
Thu, 22 Jan 2015 13:02:00 +0000 (14:02 +0100)
committerPhilipp Schüle <p.schuele@metaways.de>
Tue, 3 Feb 2015 15:27:01 +0000 (16:27 +0100)
* position all day events with percentages

Change-Id: If92869e42540bc2ad06ed8448812857b6ade7b10
Reviewed-on: http://gerrit.tine20.com/customers/1557
Tested-by: Jenkins CI (http://ci.tine20.com/)
Reviewed-by: Philipp Schüle <p.schuele@metaways.de>
tine20/Calendar/js/EventUI.js
tine20/Calendar/js/Printer/DaysView.js
tine20/Tinebase/js/ux/Printer/renderers/Base.js

index 1d237ca..0c18cec 100644 (file)
@@ -305,9 +305,13 @@ Tine.Calendar.DaysViewEventUI = Ext.extend(Tine.Calendar.EventUI, {
         
         var offsetWidth = Ext.fly(view.wholeDayArea).getWidth();
         
-        var width = Math.round(offsetWidth * (this.dtEnd.getTime() - this.dtStart.getTime()) / (view.numOfDays * Date.msDAY)) -5;
-        var left = Math.round(offsetWidth * (this.dtStart.getTime() - view.startDate.getTime()) / (view.numOfDays * Date.msDAY));
-        
+        //var width = Math.round(offsetWidth * (this.dtEnd.getTime() - this.dtStart.getTime()) / (view.numOfDays * Date.msDAY)) -5;
+        //var left = Math.round(offsetWidth * (this.dtStart.getTime() - view.startDate.getTime()) / (view.numOfDays * Date.msDAY));
+
+        var width = Math.floor(1000 * (this.dtEnd.getTime() - this.dtStart.getTime()) / (view.numOfDays * Date.msDAY) -5) /10;
+        var left = 100 * (this.dtStart.getTime() - view.startDate.getTime()) / (view.numOfDays * Date.msDAY);
+
+
         if (left < 0) {
             width = width + left;
             left = 0;
@@ -332,9 +336,9 @@ Tine.Calendar.DaysViewEventUI = Ext.extend(Tine.Calendar.EventUI, {
             bgColor: this.colorSet.light,
             textColor: this.colorSet.text,
             zIndex: 100,
-            width: width  +'px',
+            width: width  +'%',
             height: '15px',
-            left: left + 'px',
+            left: left + '%',
             top: pos * 18 + 'px',//'1px'
             statusIcons: this.statusIcons
         }, true);
index 867e0e4..0e2fa39 100644 (file)
@@ -31,17 +31,32 @@ Tine.Calendar.Printer.DaysViewRenderer = Ext.extend(Tine.Calendar.Printer.BaseRe
         
         return head;
     },
-    
+
+    onBeforePrint: function(document, view) {
+        //if (this.printMode == 'sheet') {
+        //    // FF has scale to page option but scrambles everything after the first page
+        //    // @TODO downscale to fit one page
+        //
+        //    // Chrome does not have a scale to page option
+        //    // A4 Landscape is about 1000px in my chrome ;-)
+        //    var zoom = 1000 / vw;
+        //    document.body.style.zoom = zoom;
+        //    document.body.style.MozTransform = 'scale(' + zoom + ')';
+        //    document.body.style.MozTransformOrigin = 'top left';
+        //}
+    },
+
     generateSheetHTML: function(view) {
         var node = view.el.dom.cloneNode(true),
             header = node.getElementsByClassName('cal-daysviewpanel-wholedayheader-scroller')[0],
-            scroller = node.getElementsByClassName('cal-daysviewpanel-scroller')[0];
+            scroller = node.getElementsByClassName('cal-daysviewpanel-scroller')[0],
+            fullHeight = view.dayEndPx - view.getTimeOffset(view.dayStart) + 20;
         
         // resize header/scroller to fullsize
         header.style.height = [header.firstChild.style.height, header.style.height].sort().pop();
-        scroller.style.height = view.dayEndPx - view.getTimeOffset(view.dayStart) + 20 + 'px';
+        scroller.style.height =  fullHeight + 'px';
         scroller.style.width = null;
-        
+
         return this.generateTitle(view) + node.innerHTML;
     },
     
index 133c425..69644c5 100644 (file)
@@ -20,7 +20,15 @@ Ext.ux.Printer.BaseRenderer = Ext.extend(Object, {
     }
     Ext.ux.Printer.BaseRenderer.superclass.constructor.call(this, config);
   },
-  
+
+  /**
+   * template method to intercept when document is ready
+   *
+   * @param {Document} document
+   * @pram {Ext.Component} component
+   */
+  onBeforePrint: Ext.emptyFn,
+
   /**
    * Prints the component
    * @param {Ext.Component} component The component to print
@@ -42,7 +50,9 @@ Ext.ux.Printer.BaseRenderer = Ext.extend(Object, {
     
     win.document.write(this.generateHTML(component));
     win.document.close();
-    
+
+    this.onBeforePrint(win.document, component);
+
     // gecko looses its document after document.close(). but fortunally waits with printing till css is loaded itself
     if (Ext.isGecko) {
         win.print();
@@ -87,7 +97,9 @@ Ext.ux.Printer.BaseRenderer = Ext.extend(Object, {
     doc.open();
     doc.write(this.generateHTML(component));
     doc.close();
-    
+
+    this.onBeforePrint(doc, component);
+
     this.doPrintOnStylesheetLoad.defer(10, this, [frame.contentWindow]);
 //    frame.contentWindow.focus();
 //    frame.contentWindow.print();