Only show fast buttons for days zoom

2sky · Jul 22, 2016 · dfe8541 · dfe8541
1 parent b38b248
commit dfe8541
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 5 deletions.
diff --git a/src/WebComponents/DatePicker/date-picker.html b/src/WebComponents/DatePicker/date-picker.html
@@ -9,11 +9,11 @@
             <vi-icon header source="Calendar"></vi-icon>
             <div class="calendar" content>
                 <header class="horizontal layout">
-                    <button is="vi-button" n="-1" on-tap="_fast"><vi-icon source="FastBackward"></vi-icon></button>
+                    <button is="vi-button" n="-1" on-tap="_fast" hidden$="[[!canFast]]"><vi-icon source="FastBackward"></vi-icon></button>
                     <button is="vi-button" n="-1" on-tap="_slow"><vi-icon source="Backward"></vi-icon></button>
                     <button is="vi-button" class="flex" on-tap="_zoomOut" label="[[header]]"></button>
                     <button is="vi-button" n="1" on-tap="_slow"><vi-icon source="Forward"></vi-icon></button>
-                    <button is="vi-button" n="1" on-tap="_fast"><vi-icon source="FastForward"></vi-icon></button>
+                    <button is="vi-button" n="1" on-tap="_fast" hidden$="[[!canFast]]"><vi-icon source="FastForward"></vi-icon></button>
                 </header>
                 <main class="layout horizontal wrap" zoom$="[[zoom]]">
                     <template is="dom-if" if="[[!deferredCellsUpdate]]">

diff --git a/src/WebComponents/DatePicker/date-picker.ts b/src/WebComponents/DatePicker/date-picker.ts
@@ -15,6 +15,10 @@
                 reflectToAttribute: true,
                 observer: "_zoomChanged"
             },
+            canFast: {
+                type: Boolean,
+                readOnly: true
+            },
             currentDate: {
                 type: Object,
                 readOnly: true
@@ -71,6 +75,7 @@
         cells: IDatePickerCell[];
 
         private _setCells: (cells: IDatePickerCell[]) => void;
+        private _setCanFast: (canFast: boolean) => void;
         private _setCurrentDate: (date: moment.Moment) => void;
         private _setToday: (date: moment.Moment) => void;
         private _setHeader: (header: string) => void;
@@ -102,11 +107,13 @@
                 }).toArray());
 
                 this._setCells(cells);
+                this._setCanFast(true);
             }
             else {
                 this._setCells(Enumerable.range(1, 12).select(d => {
                     return { type: zoom.substr(0, zoom.length - 1) };
                 }).toArray());
+                this._setCanFast(false);
             }
         }
 
@@ -135,7 +142,7 @@
             else if (this.zoom === "months") {
                 const loop = currentDateMoment.startOf("year");
                 const end = loop.clone().add(12, "months");
-                
+
                 let index = 0;
                 do {
                     this.set(`cells.${index}.date`, loop.clone());
@@ -201,15 +208,14 @@
                 this.currentDate.add(amount, "years");
             else
                 this.currentDate.add(amount * 12, "years");
-            
+
             this._setCurrentDate(this.currentDate.clone());
 
             e.stopPropagation();
         }
 
         private _fast(e: Event) {
             const amount = parseInt((<Vidyano.WebComponents.Button>e.currentTarget).getAttribute("n"));
-
             this._setCurrentDate(this.currentDate.add(amount, "years").clone());
 
             e.stopPropagation();