ionic2-calendar - npm Package Compare versions

Comparing version 0.0.3 to 0.0.4

package.json

 {
   "name": "ionic2-calendar",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "description": "Ionic2 calendar component",
@@ -5,0 +5,0 @@ "keywords": [

src/calendar.js

@@ -51,2 +51,3 @@ "use strict";
         this.setAttributeValue(native, 'showEventDetail');
+        this.showEventDetail = this.showEventDetail.toString() == 'true';
         this.setAttributeValue(native, 'startingDayMonth');
@@ -53,0 +54,0 @@ this.setAttributeValue(native, 'startingDayWeek');

src/dayview.js

@@ -350,3 +350,3 @@ "use strict";
             selector: 'dayview',
-            template: "\n        <div class=\"dayview\">\n            <ion-slides #daySlider [options]=\"slideOption\" (ionDidChange)=\"onSlideChanged()\">\n                <ion-slide *ngFor=\"let view of views; let viewIndex=index\">\n                    <div class=\"dayview-allday-table\">\n                        <div class=\"dayview-allday-label\">{{allDayLabel}}</div>\n                        <ion-scroll scrollY=\"true\" zoom=\"false\" class=\"dayview-allday-content-wrapper\">\n                            <table class=\"table table-bordered dayview-allday-content-table\">\n                                <tbody>\n                                <tr>\n                                    <td class=\"calendar-cell\" [ngClass]=\"{'calendar-event-wrap':allDayEvents}\"\n                                        *ngIf=\"viewIndex===currentViewIndex\">\n                                        <div *ngFor=\"let displayEvent of view.allDayEvents; let eventIndex=index\"\n                                             class=\"calendar-event\"\n                                             (click)=\"eventSelected(displayEvent.event)\"\n                                             [ngStyle]=\"{top: 25*eventIndex+'px',width: '100%',height:'25px'}\">\n                                            <div class=\"calendar-event-inner\">{{displayEvent.event.title}}</div>\n                                        </div>\n                                    </td>\n                                    <td class=\"calendar-cell\" *ngIf=\"viewIndex!==currentViewIndex\">\n                                    </td>\n                                </tr>\n                                </tbody>\n                            </table>\n                        </ion-scroll>\n                    </div>\n                    <ion-scroll scrollY=\"true\" class=\"dayview-normal-event-container\">\n                        <table class=\"table table-bordered table-fixed dayview-normal-event-table\"\n                               *ngIf=\"viewIndex===currentViewIndex\">\n                            <tbody>\n                            <tr *ngFor=\"let tm of view.rows\">\n                                <td class=\"calendar-hour-column text-center\">\n                                    {{tm.time | date: formatHourColumn}}\n                                </td>\n                                <td class=\"calendar-cell\" (click)=\"select(tm.time, tm.events)\">\n                                    <div [ngClass]=\"{'calendar-event-wrap': tm.events}\" *ngIf=\"tm.events\">\n                                        <div *ngFor=\"let displayEvent of tm.events\" class=\"calendar-event\"\n                                             (click)=\"eventSelected(displayEvent.event)\"\n                                             [ngStyle]=\"{top: (37*displayEvent.startOffset/hourParts)+'px', left: 100/displayEvent.overlapNumber*displayEvent.position+'%', width: 100/displayEvent.overlapNumber+'%', height: 37*(displayEvent.endIndex -displayEvent.startIndex - (displayEvent.endOffset + displayEvent.startOffset)/hourParts)+'px'}\">\n                                            <div class=\"calendar-event-inner\">{{displayEvent.event.title}}</div>\n                                        </div>\n                                    </div>\n                                </td>\n                            </tr>\n                            </tbody>\n                        </table>\n                        <table class=\"table table-bordered table-fixed dayview-normal-event-table\"\n                               *ngIf=\"viewIndex!==currentViewIndex\">\n                            <tbody>\n                            <tr *ngFor=\"let tm of view.rows\">\n                                <td class=\"calendar-hour-column text-center\">\n                                    {{tm.time | date: formatHourColumn}}\n                                </td>\n                                <td class=\"calendar-cell\">\n                                </td>\n                            </tr>\n                            </tbody>\n                        </table>\n                    </ion-scroll>\n                </ion-slide>\n            </ion-slides>\n        </div>\n    ",
+            template: "\n        <div class=\"dayview\">\n            <ion-slides #daySlider [options]=\"slideOption\" (ionDidChange)=\"onSlideChanged()\">\n                <ion-slide *ngFor=\"let view of views; let viewIndex=index\">\n                    <div class=\"dayview-allday-table\">\n                        <div class=\"dayview-allday-label\">{{allDayLabel}}</div>\n                        <ion-scroll scrollY=\"true\" zoom=\"false\" class=\"dayview-allday-content-wrapper\">\n                            <table class=\"table table-bordered dayview-allday-content-table\">\n                                <tbody>\n                                <tr>\n                                    <td class=\"calendar-cell\" [ngClass]=\"{'calendar-event-wrap':view.allDayEvents.length>0}\"\n                                        [ngStyle]=\"{height: 25*view.allDayEvents.length+'px'}\"\n                                        *ngIf=\"viewIndex===currentViewIndex\">\n                                        <div *ngFor=\"let displayEvent of view.allDayEvents; let eventIndex=index\"\n                                             class=\"calendar-event\"\n                                             (click)=\"eventSelected(displayEvent.event)\"\n                                             [ngStyle]=\"{top: 25*eventIndex+'px',width: '100%',height:'25px'}\">\n                                            <div class=\"calendar-event-inner\">{{displayEvent.event.title}}</div>\n                                        </div>\n                                    </td>\n                                    <td class=\"calendar-cell\" *ngIf=\"viewIndex!==currentViewIndex\">\n                                    </td>\n                                </tr>\n                                </tbody>\n                            </table>\n                        </ion-scroll>\n                    </div>\n                    <ion-scroll scrollY=\"true\" class=\"dayview-normal-event-container\">\n                        <table class=\"table table-bordered table-fixed dayview-normal-event-table\"\n                               *ngIf=\"viewIndex===currentViewIndex\">\n                            <tbody>\n                            <tr *ngFor=\"let tm of view.rows\">\n                                <td class=\"calendar-hour-column text-center\">\n                                    {{tm.time | date: formatHourColumn}}\n                                </td>\n                                <td class=\"calendar-cell\" (click)=\"select(tm.time, tm.events)\">\n                                    <div [ngClass]=\"{'calendar-event-wrap': tm.events}\" *ngIf=\"tm.events\">\n                                        <div *ngFor=\"let displayEvent of tm.events\" class=\"calendar-event\"\n                                             (click)=\"eventSelected(displayEvent.event)\"\n                                             [ngStyle]=\"{top: (37*displayEvent.startOffset/hourParts)+'px', left: 100/displayEvent.overlapNumber*displayEvent.position+'%', width: 100/displayEvent.overlapNumber+'%', height: 37*(displayEvent.endIndex -displayEvent.startIndex - (displayEvent.endOffset + displayEvent.startOffset)/hourParts)+'px'}\">\n                                            <div class=\"calendar-event-inner\">{{displayEvent.event.title}}</div>\n                                        </div>\n                                    </div>\n                                </td>\n                            </tr>\n                            </tbody>\n                        </table>\n                        <table class=\"table table-bordered table-fixed dayview-normal-event-table\"\n                               *ngIf=\"viewIndex!==currentViewIndex\">\n                            <tbody>\n                            <tr *ngFor=\"let tm of view.rows\">\n                                <td class=\"calendar-hour-column text-center\">\n                                    {{tm.time | date: formatHourColumn}}\n                                </td>\n                                <td class=\"calendar-cell\">\n                                </td>\n                            </tr>\n                            </tbody>\n                        </table>\n                    </ion-scroll>\n                </ion-slide>\n            </ion-slides>\n        </div>\n    ",
             styles: ["\n        .scrollable {\n          width: 100%;\n          overflow-x: hidden;\n          overflow-y: auto;\n        }\n\n        .table-fixed {\n          table-layout: fixed;\n        }\n\n        .table {\n          width: 100%;\n          max-width: 100%;\n          background-color: transparent;\n        }\n\n        .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td,\n        .table > tbody > tr > td, .table > tfoot > tr > td {\n          padding: 8px;\n          line-height: 20px;\n          vertical-align: top;\n        }\n\n        .table > thead > tr > th {\n          vertical-align: bottom;\n          border-bottom: 2px solid #ddd;\n        }\n\n        .table > thead:first-child > tr:first-child > th, .table > thead:first-child > tr:first-child > td {\n          border-top: 0\n        }\n\n        .table > tbody + tbody {\n          border-top: 2px solid #ddd;\n        }\n\n        .table-bordered {\n          border: 1px solid #ddd;\n        }\n\n        .table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th,\n        .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td {\n          border: 1px solid #ddd;\n        }\n\n        .table-bordered > thead > tr > th, .table-bordered > thead > tr > td {\n          border-bottom-width: 2px;\n        }\n\n        .table-striped > tbody > tr:nth-child(odd) > td, .table-striped > tbody > tr:nth-child(odd) > th {\n          background-color: #f9f9f9\n        }\n\n        .calendar-hour-column {\n          width: 50px;\n          white-space: nowrap;\n        }\n\n        .calendar-event-wrap {\n          position: relative;\n          width: 100%;\n          height: 100%;\n        }\n\n        .calendar-event {\n          position: absolute;\n          padding: 2px;\n          cursor: pointer;\n          z-index: 10000;\n        }\n\n        .calendar-event-inner {\n          overflow: hidden;\n          background-color: #3a87ad;\n          color: white;\n          height: 100%;\n          width: 100%;\n          padding: 2px;\n          line-height: 15px;\n        }\n\n        .calendar-cell {\n          padding: 0 !important;\n          height: 37px;\n        }\n\n        .dayview-allday-label {\n          float: left;\n          height: 100%;\n          line-height: 50px;\n          text-align: center;\n          width: 50px;\n        }\n\n        .dayview-allday-content-wrapper {\n          margin-left: 50px;\n          overflow: hidden;\n          height: 51px;\n        }\n\n        .dayview-allday-content-table {\n          min-height: 50px;\n        }\n\n        .dayview-allday-content-table td {\n          border-left: 1px solid #ddd;\n          border-right: 1px solid #ddd;\n        }\n\n        .dayview {\n          height: 100%;\n        }\n\n        .dayview-allday-table {\n          height: 50px;\n          position: relative;\n          border-bottom: 1px solid #ddd;\n          font-size: 14px;\n        }\n\n        .dayview-normal-event-container {\n          margin-top: 50px;\n          overflow: hidden;\n          left: 0;\n          right: 0;\n          top: 0;\n          bottom: 0;\n          position: absolute;\n          font-size: 14px;\n        }\n\n        .dayview .slide-zoom {\n          height: 100%;\n        }\n\n        .dayview-allday-content-wrapper scroll-content {\n          width: 100%;\n        }\n\n        ::-webkit-scrollbar,\n        *::-webkit-scrollbar {\n          display: none;\n        }\n\n        .table > tbody > tr > td.calendar-hour-column {\n          padding-left: 0;\n          padding-right: 0;\n          vertical-align: middle;\n        }\n\n        @media (max-width: 750px) {\n          .dayview-allday-label, .calendar-hour-column {\n            width: 31px;\n            font-size: 12px;\n          }\n\n          .dayview-allday-label {\n            padding-top: 4px;\n          }\n\n          .table > tbody > tr > td.calendar-hour-column {\n            padding-left: 0;\n            padding-right: 0;\n            vertical-align: middle;\n            line-height: 12px;\n          }\n\n          .dayview-allday-label {\n            line-height: 20px;\n          }\n\n          .dayview-allday-content-wrapper {\n            margin-left: 31px;\n          }\n\n          .calendar-event-inner {\n            font-size: 12px;\n          }\n        }\n    "],
@@ -353,0 +353,0 @@ encapsulation: core_1.ViewEncapsulation.None,

src/monthview.js

@@ -376,3 +376,3 @@ "use strict";
             selector: 'monthview',
-            template: "\n        <div>\n            <ion-slides #monthSlider [options]=\"slideOption\" (ionDidChange)=\"onSlideChanged()\">\n                <ion-slide *ngFor=\"let view of views; let viewIndex=index\">\n                    <table *ngIf=\"viewIndex===currentViewIndex\" class=\"table table-bordered table-fixed monthview-datetable\">\n                        <thead>\n                        <tr>\n                            <th *ngFor=\"let day of view.dates.slice(0,7)\">\n                                <small>{{day.date | date: formatDayHeader}}</small>\n                            </th>\n                        </tr>\n                        </thead>\n                        <tbody>\n                        <tr *ngFor=\"let row of [0,1,2,3,4,5]\">\n                            <td *ngFor=\"let col of [0,1,2,3,4,5,6]\" (click)=\"select(view.dates[row*7+col].date)\"\n                                [ngClass]=\"getHighlightClass(view.dates[row*7+col])\">{{view.dates[row*7+col].label}}\n                            </td>\n                        </tr>\n                        </tbody>\n                    </table>\n                    <table *ngIf=\"viewIndex!==currentViewIndex\" class=\"table table-bordered table-fixed monthview-datetable\">\n                        <thead>\n                        <tr class=\"text-center\">\n                            <th *ngFor=\"let day of view.dates.slice(0,7)\">\n                                <small>{{day.date | date: formatDayHeader}}</small>\n                            </th>\n                        </tr>\n                        </thead>\n                        <tbody>\n                        <tr *ngFor=\"let row of [0,1,2,3,4,5]\">\n                            <td *ngFor=\"let col of [0,1,2,3,4,5,6]\">\n                                {{view.dates[row*7+col].label}}\n                            </td>\n                        <tr>\n                        </tbody>\n                    </table>\n                </ion-slide>\n            </ion-slides>\n            <ion-list class=\"event-detail-container2\" has-bouncing=\"false\" *ngIf=\"showEventDetail\" overflow-scroll=\"false\">\n                <ion-item *ngFor=\"let event of selectedDate?.events\" (click)=\"eventSelected(event)\">\n                        <span *ngIf=\"!event.allDay\" class=\"monthview-eventdetail-timecolumn\">{{event.startTime|date: 'HH:mm'}}\n                            -\n                            {{event.endTime|date: 'HH:mm'}}\n                        </span>\n                    <span *ngIf=\"event.allDay\" class=\"monthview-eventdetail-timecolumn\">All day</span>\n                    <span class=\"event-detail\">  |  {{event.title}}</span>\n                </ion-item>\n                <ion-item *ngIf=\"!selectedDate?.events\">\n                    <td class=\"no-events-label\">{{noEventsLabel}}</td>\n                </ion-item>\n            </ion-list>\n        </div>\n    ",
+            template: "\n        <div>\n            <ion-slides #monthSlider [options]=\"slideOption\" (ionDidChange)=\"onSlideChanged()\">\n                <ion-slide *ngFor=\"let view of views; let viewIndex=index\">\n                    <table *ngIf=\"viewIndex===currentViewIndex\" class=\"table table-bordered table-fixed monthview-datetable\">\n                        <thead>\n                        <tr>\n                            <th *ngFor=\"let day of view.dates.slice(0,7)\">\n                                <small>{{day.date | date: formatDayHeader}}</small>\n                            </th>\n                        </tr>\n                        </thead>\n                        <tbody>\n                        <tr *ngFor=\"let row of [0,1,2,3,4,5]\">\n                            <td *ngFor=\"let col of [0,1,2,3,4,5,6]\" (click)=\"select(view.dates[row*7+col].date)\"\n                                [ngClass]=\"getHighlightClass(view.dates[row*7+col])\">{{view.dates[row*7+col].label}}\n                            </td>\n                        </tr>\n                        </tbody>\n                    </table>\n                    <table *ngIf=\"viewIndex!==currentViewIndex\" class=\"table table-bordered table-fixed monthview-datetable\">\n                        <thead>\n                        <tr class=\"text-center\">\n                            <th *ngFor=\"let day of view.dates.slice(0,7)\">\n                                <small>{{day.date | date: formatDayHeader}}</small>\n                            </th>\n                        </tr>\n                        </thead>\n                        <tbody>\n                        <tr *ngFor=\"let row of [0,1,2,3,4,5]\">\n                            <td *ngFor=\"let col of [0,1,2,3,4,5,6]\">\n                                {{view.dates[row*7+col].label}}\n                            </td>\n                        <tr>\n                        </tbody>\n                    </table>\n                </ion-slide>\n            </ion-slides>\n            <ion-list class=\"event-detail-container\" has-bouncing=\"false\" *ngIf=\"showEventDetail\" overflow-scroll=\"false\">\n                <ion-item *ngFor=\"let event of selectedDate?.events\" (click)=\"eventSelected(event)\">\n                        <span *ngIf=\"!event.allDay\" class=\"monthview-eventdetail-timecolumn\">{{event.startTime|date: 'HH:mm'}}\n                            -\n                            aa{{event.endTime|date: 'HH:mm'}}\n                        </span>\n                    <span *ngIf=\"event.allDay\" class=\"monthview-eventdetail-timecolumn\">All day</span>\n                    <span class=\"event-detail\">  |  {{event.title}}</span>\n                </ion-item>\n                <ion-item *ngIf=\"!selectedDate?.events\">\n                    <td class=\"no-events-label\">{{noEventsLabel}}</td>\n                </ion-item>\n            </ion-list>\n        </div>\n    ",
             styles: ["\n        .scrollable {\n          width: 100%;\n          overflow-x: hidden;\n          overflow-y: auto;\n        }\n\n        .text-muted {\n          color: #999;\n        }\n\n        .table-fixed {\n          table-layout: fixed;\n        }\n\n        .table {\n          width: 100%;\n          max-width: 100%;\n          background-color: transparent;\n        }\n\n        .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td,\n        .table > tbody > tr > td, .table > tfoot > tr > td {\n          padding: 8px;\n          line-height: 20px;\n          vertical-align: top;\n        }\n\n        .table > thead > tr > th {\n          vertical-align: bottom;\n          border-bottom: 2px solid #ddd;\n        }\n\n        .table > thead:first-child > tr:first-child > th, .table > thead:first-child > tr:first-child > td {\n          border-top: 0\n        }\n\n        .table > tbody + tbody {\n          border-top: 2px solid #ddd;\n        }\n\n        .table-bordered {\n          border: 1px solid #ddd;\n        }\n\n        .table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th,\n        .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td {\n          border: 1px solid #ddd;\n        }\n\n        .table-bordered > thead > tr > th, .table-bordered > thead > tr > td {\n          border-bottom-width: 2px;\n        }\n\n        .table-striped > tbody > tr:nth-child(odd) > td, .table-striped > tbody > tr:nth-child(odd) > th {\n          background-color: #f9f9f9\n        }\n\n        .no-event-label {\n          font-weight: bold;\n          color: darkgrey;\n          text-align: center;\n        }\n\n        .event-detail-container {\n          border-top: 2px darkgrey solid;\n          margin-top: 262px;\n        }\n\n        .event-detail {\n          cursor: pointer;\n          white-space: nowrap;\n          text-overflow: ellipsis;\n        }\n\n        .monthview-primary-with-event {\n          background-color: #3a87ad;\n          color: white;\n        }\n\n        .monthview-current {\n          background-color: lightgrey;\n        }\n\n        .monthview-selected {\n          background-color: #009900;\n          color: white;\n        }\n\n        .monthview-eventdetail-timecolumn {\n          width: 110px;\n          overflow: hidden;\n        }\n\n        .monthview-datetable th {\n          text-align: center;\n        }\n\n        .monthview-datetable td {\n          cursor: pointer;\n          text-align: center;\n        }\n\n        .monthview-secondary-with-event {\n          background-color: #d9edf7;\n        }\n\n        ::-webkit-scrollbar,\n        *::-webkit-scrollbar {\n          display: none;\n        }\n\n        @media (max-width: 750px) {\n          .table > tbody > tr > td.calendar-hour-column {\n            padding-left: 0;\n            padding-right: 0;\n            vertical-align: middle;\n            line-height: 12px;\n          }\n        }\n    "]
@@ -379,0 +379,0 @@ }),

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

163563

0.16%

Lines of code

1790

0.06%

No dependency changes