honeymoose
/
sp-dev-fx-webparts
mirror of https://github.com/pnp/sp-dev-fx-webparts.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Cleaned imports and resolved TypeScript warnings (#902) 

* replace var with const and let

* remove imports not being used

* Resolved most stylelint warnings
This commit is contained in:
Joel Rodrigues 2019-07-05 13:58:14 +01:00 committed by Vesa Juvonen
parent 9650938465
commit fd2a0857e7
14 changed files with 197 additions and 242 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
samples/react-calendar/src/controls/Event/Event.module.scss
View File

@ -1,4 +1,4 @@
@import '~@microsoft/sp-office-ui-fabric-core/dist/sass/SPFabricCore.scss';
@import "~@microsoft/sp-office-ui-fabric-core/dist/sass/SPFabricCore.scss";
.description {
border: 1px solid #a6a6a6;
@ -13,27 +13,32 @@
}
.description:hover {
border-color: rgb( 51, 51, 51 );
border-color: rgb(51, 51, 51);
}
.calendar {
.container {
max-width: 100%;
min-height: 400px;
height: 600px;
margin: 0px auto;
margin: 0 auto;
}
.eventTitle {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.row {
@include ms-Grid-row;
@include ms-fontColor-white;
background-color: $ms-color-themeDark;
padding: 20px;
border-style: solid;
}
.column {
@include ms-Grid-col;
@include ms-lg10;
@ -41,18 +46,22 @@
@include ms-xlPush2;
@include ms-lgPush1;
}
.title {
@include ms-font-xl;
@include ms-fontColor-white;
}
.subTitle {
@include ms-font-l;
@include ms-fontColor-white;
}
.description {
@include ms-font-l;
@include ms-fontColor-white;
}
.button {
// Our button
text-decoration: none;
@ -67,7 +76,7 @@
// Basic Button
outline: transparent;
position: relative;
font-family: "Segoe UI WestEuropean","Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,"Helvetica Neue",sans-serif;
font-family: "Segoe UI WestEuropean", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
-webkit-font-smoothing: antialiased;
font-size: $ms-font-size-m;
font-weight: $ms-font-weight-regular;
@ -78,13 +87,13 @@
padding: 0 16px;
}
.label {
font-weight: $ms-font-weight-semibold;
font-size: $ms-font-size-m;
height: 32px;
line-height: 32px;
margin: 0 4px;
vertical-align: top;
display: inline-block;
}
.label {
font-weight: $ms-font-weight-semibold;
font-size: $ms-font-size-m;
height: 32px;
line-height: 32px;
margin: 0 4px;
vertical-align: top;
display: inline-block;
}
}

18
samples/react-calendar/src/controls/Event/event.tsx
View File

@ -3,7 +3,6 @@ import styles from './Event.module.scss';
import * as strings from 'CalendarWebPartStrings';
import { IEventProps } from './IEventProps';
import { IEventState } from './IEventState';
import { escape } from '@microsoft/sp-lodash-subset';
import * as moment from 'moment';
import 'react-big-calendar/lib/css/react-big-calendar.css';
import { PeoplePicker, PrincipalType } from "@pnp/spfx-controls-react/lib/PeoplePicker";
@ -11,21 +10,14 @@ import {
Panel,
PanelType,
TextField,
Label,
extendComponent
Label
} from 'office-ui-fabric-react';
import { EnvironmentType } from '@microsoft/sp-core-library';
import { mergeStyleSets } from 'office-ui-fabric-react/lib/Styling';
import { IEventData } from '../../services/IEventData';
import { IUserPermissions } from '../../services/IUserPermissions';
import {
DatePicker,
DayOfWeek,
IDatePickerStrings,
Dropdown,
DropdownMenuItemType,
IDropdownStyles,
IDropdownOption,
DefaultButton,
PrimaryButton,
@ -37,13 +29,9 @@ import {
Dialog,
DialogType,
DialogFooter,
Toggle,
ActionButton,
IButtonProps
Toggle
}
from 'office-ui-fabric-react';
import { addMonths, addYears } from 'office-ui-fabric-react/lib/utilities/dateMath/DateMath';
import { IPanelModelEnum } from './IPanelModeEnum';
import { EditorState, convertToRaw, ContentState } from 'draft-js';
@ -54,10 +42,8 @@ import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css';
import spservices from '../../services/spservices';
import { Map, ICoordinates, MapType } from "@pnp/spfx-controls-react/lib/Map";
import { EventRecurrenceInfo } from '../../controls/EventRecurrenceInfo/EventRecurrenceInfo';
import { string } from 'prop-types';
import { getGUID } from '@pnp/common';
const today: Date = new Date(Date.now());
const DayPickerStrings: IDatePickerStrings = {
months: [strings.January, strings.February, strings.March, strings.April, strings.May, strings.June, strings.July, strings.August, strings.September, strings.October, strings.November, strings.December],
shortMonths: [strings.Jan, strings.Feb, strings.Mar, strings.Apr, strings.May, strings.Jun, strings.Jul, strings.Aug, strings.Sep, strings.Oct, strings.Nov, strings.Dez],

5
samples/react-calendar/src/controls/EventRecurrenceInfo/EventRecurrenceInfo.module.scss
View File

@ -1,7 +1,6 @@
.divWrraper {
border-width:1px;
border-color:#adadad;
border-width: 1px;
border-color: #adadad;
padding: 20px;
border-style: solid;
}

6
samples/react-calendar/src/controls/EventRecurrenceInfo/EventRecurrenceInfo.tsx
View File

@ -5,22 +5,16 @@ import { IEventRecurrenceInfoProps } from './IEventRecurrenceInfoProps';
import { IEventRecurrenceInfoState } from './IEventRecurrenceInfoState';
import { escape } from '@microsoft/sp-lodash-subset';
import * as moment from 'moment';
import { parseString, Builder } from "xml2js";
import {
ChoiceGroup,
IChoiceGroupOption,
} from 'office-ui-fabric-react';
import { EventRecurrenceInfoDaily } from './../EventRecurrenceInfoDaily/EventRecurrenceInfoDaily';
import { EventRecurrenceInfoWeekly } from './../EventRecurrenceInfoWeekly/EventRecurrenceInfoWeekly';
import { EventRecurrenceInfoMonthly } from './../EventRecurrenceInfoMonthly/EventRecurrenceInfoMonthly';
import { EventRecurrenceInfoYearly } from './../EventRecurrenceInfoYearly/EventRecurrenceInfoYearly';
export class EventRecurrenceInfo extends React.Component<IEventRecurrenceInfoProps, IEventRecurrenceInfoState> {
public constructor(props) {

4
samples/react-calendar/src/controls/EventRecurrenceInfoDaily/EventRecurrenceInfoDaily.module.scss
View File

@ -1,6 +1,6 @@
.divWrraper {
border-width:1px;
border-color:#adadad;
border-width: 1px;
border-color: #adadad;
padding: 20px;
border-style: solid;
}

4
samples/react-calendar/src/controls/EventRecurrenceInfoMonthly/EventRecurrenceInfoMonthly.module.scss
View File

@ -1,6 +1,6 @@
.divWrraper {
border-width:1px;
border-color:#adadad;
border-width: 1px;
border-color: #adadad;
padding: 20px;
border-style: solid;
}

16
samples/react-calendar/src/controls/EventRecurrenceInfoWeekly/EventRecurrenceInfoWeekly.module.scss
View File

@ -1,16 +1,18 @@
.divWrraper {
border-width:1px;
border-color:#adadad;
border-width: 1px;
border-color: #adadad;
padding: 20px;
border-style: solid;
}
.ckeckBoxInline {
display: inline-block;
vertical-align: top;
width: 80px;
padding-left: 10px;
display: inline-block;
vertical-align: top;
width: 80px;
padding-left: 10px;
}
.dateRange{
.dateRange {
display: inline-block;
vertical-align: top;
padding-right: 35px;

9
samples/react-calendar/src/controls/EventRecurrenceInfoWeekly/EventRecurrenceInfoWeekly.tsx
View File

@ -9,19 +9,10 @@ import { parseString, Builder } from "xml2js";
import {
ChoiceGroup,
IChoiceGroupOption,
Dropdown,
IDropdownOption,
TextField,
SpinButton,
Label,
PrimaryButton,
MaskedTextField,
CommandBarButton, IButtonProps,
DefaultButton,
Checkbox,
} from 'office-ui-fabric-react';
import { Position } from 'office-ui-fabric-react/lib/utilities/positioning';
import { Root } from '@pnp/graph';
import { DatePicker, DayOfWeek, IDatePickerStrings } from 'office-ui-fabric-react/lib/DatePicker';
import spservices from '../../services/spservices';

4
samples/react-calendar/src/controls/EventRecurrenceInfoYearly/EventRecurrenceInfoYearly.module.scss
View File

@ -1,6 +1,6 @@
.divWrraper {
border-width:1px;
border-color:#adadad;
border-width: 1px;
border-color: #adadad;
padding: 20px;
border-style: solid;
}

9
samples/react-calendar/src/controls/EventRecurrenceInfoYearly/EventRecurrenceInfoYearly.tsx
View File

@ -11,16 +11,9 @@ import {
IChoiceGroupOption,
Dropdown,
IDropdownOption,
TextField,
SpinButton,
Label,
PrimaryButton,
MaskedTextField,
CommandBarButton, IButtonProps,
DefaultButton
MaskedTextField
} from 'office-ui-fabric-react';
import { Position } from 'office-ui-fabric-react/lib/utilities/positioning';
import { Root } from '@pnp/graph';
import { DatePicker, DayOfWeek, IDatePickerStrings } from 'office-ui-fabric-react/lib/DatePicker';
import spservices from '../../services/spservices';

150
samples/react-calendar/src/services/parseRecurrentEvent.ts
View File

@ -7,7 +7,7 @@ export default class parseRecurrentEvent {
public parseEvents(events: any[], start: any, end: any) {
this.wEvents = events;
for (var i = 0; i < events.length; i++) {
for (let i = 0; i < events.length; i++) {
end = null;
if (events[i].RecurrenceData.indexOf('<windowEnd>') != -1) {
let wDtEnd = events[i].RecurrenceData.substring(events[i].RecurrenceData.indexOf("<windowEnd>") + 11);
@ -42,7 +42,7 @@ export default class parseRecurrentEvent {
//
public formatString(str: string) {
var arr = str.split("'");
let arr = str.split("'");
str = arr.join('');
arr = str.split('"');
str = arr.join('');
@ -57,7 +57,7 @@ export default class parseRecurrentEvent {
if (typeof date == 'string') {
if (allDay) {
if (date.lastIndexOf('Z') == date.length - 1) {
var dt = date.substring(0, date.length - 1);
const dt = date.substring(0, date.length - 1);
return new Date(dt);
}
}
@ -76,29 +76,29 @@ export default class parseRecurrentEvent {
else {
start = start || this.parseDate(e.EventDate, e.fAllDayEvent);
end = end || this.parseDate(e.EndDate, e.fAllDayEvent);
var er = [];
var wd = ['su', 'mo', 'tu', 'we', 'th', 'fr', 'sa'];
var wom = ['first', 'second', 'third', 'fourth'];
var rTotal: any = 0;
var total: any = 0;
const er = [];
const wd = ['su', 'mo', 'tu', 'we', 'th', 'fr', 'sa'];
const wom = ['first', 'second', 'third', 'fourth'];
let rTotal: any = 0;
let total: any = 0;
if (e.RecurrenceData.indexOf('<repeatInstances>') != -1) {
rTotal = e.RecurrenceData.substring(e.RecurrenceData.indexOf("<repeatInstances>") + 17);
rTotal = parseInt(rTotal.substring(0, rTotal.indexOf('<')));
}
if (e.RecurrenceData.indexOf("<daily ") != -1) {
var str = e.RecurrenceData.substring(e.RecurrenceData.indexOf("<daily "));
let str = e.RecurrenceData.substring(e.RecurrenceData.indexOf("<daily "));
str = str.substring(7, str.indexOf('/>') - 1);
var arr = this.formatString(str);
const arr = this.formatString(str);
if (arr.indexOf("dayFrequency") != -1) {
var frequency = parseInt(arr[arr.indexOf("dayFrequency") + 1]);
var loop = true;
var init = this.parseDate(e.EventDate, e.fAllDayEvent);
const frequency = parseInt(arr[arr.indexOf("dayFrequency") + 1]);
let loop = true;
const init = this.parseDate(e.EventDate, e.fAllDayEvent);
while (loop) {
total++;
if ((new Date(init)).getTime() >= start.getTime()) {
var ed = new Date(init);
const ed = new Date(init);
ed.setSeconds(ed.getSeconds() + e.Duration);
var ni = this.cloneObj(e);
const ni = this.cloneObj(e);
ni.EventDate = new Date(init);
if (!this.RecurrenceExceptionExists(e.Id, ni.EventDate)) {
ni.EndDate = ed;
@ -117,23 +117,23 @@ export default class parseRecurrentEvent {
}
}
if (e.RecurrenceData.indexOf("<weekly ") != -1) {
var str = e.RecurrenceData.substring(e.RecurrenceData.indexOf("<weekly "));
let str = e.RecurrenceData.substring(e.RecurrenceData.indexOf("<weekly "));
str = str.substring(8, str.indexOf('/>') - 1);
var arr = this.formatString(str);
var frequency = parseInt(arr[arr.indexOf("weekFrequency") + 1]);
var loop = true;
var init = this.parseDate(e.EventDate, e.fAllDayEvent);
var initDay = init.getDay();
const arr = this.formatString(str);
const frequency = parseInt(arr[arr.indexOf("weekFrequency") + 1]);
let loop = true;
const init = this.parseDate(e.EventDate, e.fAllDayEvent);
let initDay = init.getDay();
while (loop) {
for (var i = initDay; i < 7; i++) {
for (let i = initDay; i < 7; i++) {
if (arr.indexOf(wd[i]) != -1 && (rTotal > total || rTotal == 0)) {
total++;
if ((new Date(init)).getTime() >= start.getTime()) {
var nd: any = new Date(init);
const nd: any = new Date(init);
nd.setDate(nd.getDate() + (i - initDay));
var ed = new Date(nd);
const ed = new Date(nd);
ed.setSeconds(ed.getSeconds() + e.Duration);
var ni = this.cloneObj(e);
const ni = this.cloneObj(e);
ni.EventDate = new Date(nd);
if (!this.RecurrenceExceptionExists(e.Id, ni.EventDate)) {
ni.EndDate = ed;
@ -151,22 +151,22 @@ export default class parseRecurrentEvent {
}
}
if (e.RecurrenceData.indexOf("<monthly ") != -1) {
var str = e.RecurrenceData.substring(e.RecurrenceData.indexOf("<monthly "));
let str = e.RecurrenceData.substring(e.RecurrenceData.indexOf("<monthly "));
str = str.substring(9, str.indexOf('/>') - 1);
var arr = this.formatString(str);
var frequency = parseInt(arr[arr.indexOf("monthFrequency") + 1]);
var loop = true;
var init = this.parseDate(e.EventDate, e.fAllDayEvent);
var day = parseInt(arr[arr.indexOf("day") + 1]);
const arr = this.formatString(str);
const frequency = parseInt(arr[arr.indexOf("monthFrequency") + 1]);
let loop = true;
const init = this.parseDate(e.EventDate, e.fAllDayEvent);
const day = parseInt(arr[arr.indexOf("day") + 1]);
while (loop) {
total++;
if ((new Date(init)).getTime() >= start.getTime()) {
var nd: any = new Date(init);
const nd: any = new Date(init);
nd.setDate(day);
if (nd.getMonth() == init.getMonth()) {
var ed = new Date(nd);
const ed = new Date(nd);
ed.setSeconds(ed.getSeconds() + e.Duration);
var ni = this.cloneObj(e);
const ni = this.cloneObj(e);
ni.EventDate = new Date(nd);
if (!this.RecurrenceExceptionExists(e.Id, ni.EventDate)) {
ni.EndDate = ed;
@ -182,18 +182,18 @@ export default class parseRecurrentEvent {
}
}
if (e.RecurrenceData.indexOf("<monthlyByDay ") != -1) {
var str = e.RecurrenceData.substring(e.RecurrenceData.indexOf("<monthlyByDay "));
let str = e.RecurrenceData.substring(e.RecurrenceData.indexOf("<monthlyByDay "));
str = str.substring(14, str.indexOf('/>') - 1);
var arr = this.formatString(str);
var frequency = parseInt(arr[arr.indexOf("monthFrequency") + 1]);
var loop = true;
var init = this.parseDate(e.EventDate, e.fAllDayEvent);
var weekdayOfMonth = arr[arr.indexOf("weekdayOfMonth") + 1];
var temp: any = new Date();
const arr = this.formatString(str);
const frequency = parseInt(arr[arr.indexOf("monthFrequency") + 1]);
let loop = true;
const init = this.parseDate(e.EventDate, e.fAllDayEvent);
const weekdayOfMonth = arr[arr.indexOf("weekdayOfMonth") + 1];
let temp: any = new Date();
while (loop) {
total++;
if ((new Date(init)).getTime() >= start.getTime()) {
var nd: any = new Date(init);
let nd: any = new Date(init);
nd.setDate(1); //set to first day of month
if (arr.indexOf("weekday") != -1) { //find first weekday - if not saturday or sunday, then current date is a weekday
if (nd.getDay() == 0) nd.setDate(nd.getDate() + 1);// add one day to sunday
@ -207,7 +207,7 @@ export default class parseRecurrentEvent {
nd = new Date(temp);
}
else {
for (var i: any = 0; i < wom.indexOf(weekdayOfMonth); i++) {
for (let i: any = 0; i < wom.indexOf(weekdayOfMonth); i++) {
if (nd.getDay() == 5) nd.setDate(nd.getDate() + 3); //if the current date is friday, add three days to get to monday
else nd.setDate(nd.getDate() + 1); //otherwise, just add one day
}
@ -224,7 +224,7 @@ export default class parseRecurrentEvent {
nd = new Date(temp);
}
else {
for (var i: any = 0; i < wom.indexOf(weekdayOfMonth); i++) {
for (let i: any = 0; i < wom.indexOf(weekdayOfMonth); i++) {
if (nd.getDay() == 0) nd.setDate(nd.getDate() + 6); //if the current date is sunday, add six days to get to saturday
else nd.setDate(nd.getDate() + 1); //otherwise, just add one day
}
@ -238,7 +238,7 @@ export default class parseRecurrentEvent {
else nd.setDate(nd.getDate() + (wom.indexOf(weekdayOfMonth))); //now add days to get to the Nth instance of this day
}
else {
for (var i: any = 0; i < wd.length; i++) { //get first instance of the specified day
for (let i: any = 0; i < wd.length; i++) { //get first instance of the specified day
if (arr.indexOf(wd[i]) != -1) {
if (nd.getDay() > i) nd.setDate(nd.getDate() + (7 - (nd.getDay() - i)));
else nd.setDate(nd.getDate() + (i - nd.getDay() ));
@ -255,16 +255,16 @@ export default class parseRecurrentEvent {
}
else {
for (var i: any = 0; i < wom.indexOf(weekdayOfMonth); i++) {
for (let i: any = 0; i < wom.indexOf(weekdayOfMonth); i++) {
nd.setDate(nd.getDate() + 7); //add a week to each instance to get the Nth instance
console.log(nd);
}
}
}
if (nd.getMonth() == init.getMonth()) { //make sure the new date calculated actually falls within the current month (sometimes there may be no 4th instance of a day)
var ed = new Date(nd);
const ed = new Date(nd);
ed.setSeconds(ed.getSeconds() + e.Duration);
var ni = this.cloneObj(e);
const ni = this.cloneObj(e);
ni.EventDate = new Date(nd);
if (!this.RecurrenceExceptionExists(e.Id, ni.EventDate)) {
ni.EndDate = ed;
@ -280,24 +280,24 @@ export default class parseRecurrentEvent {
}
}
if (e.RecurrenceData.indexOf("<yearly ") != -1) {
var str = e.RecurrenceData.substring(e.RecurrenceData.indexOf("<yearly "));
let str = e.RecurrenceData.substring(e.RecurrenceData.indexOf("<yearly "));
str = str.substring(8, str.indexOf('/>') - 1);
var arr = this.formatString(str);
var frequency = parseInt(arr[arr.indexOf("yearFrequency") + 1]);
var loop = true;
var init = this.parseDate(e.EventDate, e.fAllDayEvent);
var month = (parseInt(arr[arr.indexOf("month") + 1]) - 1);
var day = parseInt(arr[arr.indexOf("day") + 1]);
const arr = this.formatString(str);
const frequency = parseInt(arr[arr.indexOf("yearFrequency") + 1]);
let loop = true;
const init = this.parseDate(e.EventDate, e.fAllDayEvent);
const month = (parseInt(arr[arr.indexOf("month") + 1]) - 1);
const day = parseInt(arr[arr.indexOf("day") + 1]);
while (loop) {
var nd: any = new Date(init);
const nd: any = new Date(init);
nd.setMonth(month);
nd.setDate(day);
if ((new Date(init)).getTime() <= nd.getTime()) {
total++;
if ((new Date(init)).getTime() >= start.getTime()) {
var ed = new Date(nd);
const ed = new Date(nd);
ed.setSeconds(ed.getSeconds() + e.Duration);
var ni = this.cloneObj(e);
const ni = this.cloneObj(e);
ni.EventDate = new Date(nd);
if (!this.RecurrenceExceptionExists(e.Id, ni.EventDate)) {
ni.EndDate = ed;
@ -313,32 +313,32 @@ export default class parseRecurrentEvent {
}
}
if (e.RecurrenceData.indexOf("<yearlyByDay ") != -1) {
var str = e.RecurrenceData.substring(e.RecurrenceData.indexOf("<yearlyByDay "));
let str = e.RecurrenceData.substring(e.RecurrenceData.indexOf("<yearlyByDay "));
str = str.substring(13, str.indexOf('/>') - 1);
var arr = this.formatString(str);
var frequency = parseInt(arr[arr.indexOf("yearFrequency") + 1]);
var loop = true;
var init = this.parseDate(e.EventDate, e.fAllDayEvent);
var month = (parseInt(arr[arr.indexOf("month") + 1]) - 1);
var weekdayOfMonth = arr[arr.indexOf("weekdayOfMonth") + 1];
var day = 0;
for (var i: any = 0; i < wd.length; i++) {
const arr = this.formatString(str);
const frequency = parseInt(arr[arr.indexOf("yearFrequency") + 1]);
let loop = true;
const init = this.parseDate(e.EventDate, e.fAllDayEvent);
const month = (parseInt(arr[arr.indexOf("month") + 1]) - 1);
const weekdayOfMonth = arr[arr.indexOf("weekdayOfMonth") + 1];
let day = 0;
for (let i: any = 0; i < wd.length; i++) {
if (arr.indexOf(wd[i]) != -1) {
if (arr[arr.indexOf(wd[i]) + 1].toLowerCase() == 'true') day = i;
}
}
while (loop) {
var nd: any = new Date(init);
let nd: any = new Date(init);
nd.setMonth(month);
if ((new Date(init)).getTime() <= nd.getTime()) {
total++;
if ((new Date(init)).getTime() >= start.getTime()) {
nd.setDate(1);
var dayOfMonth = nd.getDay();
const dayOfMonth = nd.getDay();
if (day < dayOfMonth) nd.setDate(nd.getDate() + ((7 - dayOfMonth) + day)); //first instance of this day in the selected month
else nd.setDate(nd.getDate() + (day - dayOfMonth));
if (weekdayOfMonth == 'last') {
var temp: any = new Date(nd);
const temp: any = new Date(nd);
while (temp.getMonth() == month) {
nd = new Date(temp);
temp.setDate(temp.getDate() + 7); //loop from first instance of month to last instance of month
@ -348,9 +348,9 @@ export default class parseRecurrentEvent {
nd.setDate(nd.getDate() + (7 * (wom.indexOf(weekdayOfMonth))));
}
if (nd.getMonth() == month) {
var ed = new Date(nd);
const ed = new Date(nd);
ed.setSeconds(ed.getSeconds() + e.Duration);
var ni = this.cloneObj(e);
const ni = this.cloneObj(e);
ni.EventDate = new Date(nd);
if (!this.RecurrenceExceptionExists(e.Id, ni.EventDate)) {
ni.EndDate = ed;
@ -373,7 +373,7 @@ export default class parseRecurrentEvent {
}
public cloneObj(obj: any): any {
var copy: any;
let copy: any;
if (null == obj || "object" != typeof obj) return obj;
if (obj instanceof Date) {
copy = new Date();
@ -382,14 +382,14 @@ export default class parseRecurrentEvent {
}
if (obj instanceof Array) {
copy = [];
for (var i = 0, len = obj.length; i < len; i++) {
for (let i = 0, len = obj.length; i < len; i++) {
copy[i] = this.cloneObj(obj[i]);
}
return copy;
}
if (obj instanceof Object) {
copy = {};
for (var attr in obj) {
for (const attr in obj) {
if (obj.hasOwnProperty(attr)) copy[attr] = this.cloneObj(obj[attr]);
}
return copy;

8
samples/react-calendar/src/services/spservices.ts
View File

@ -2,23 +2,18 @@
// March 2019
import { WebPartContext } from "@microsoft/sp-webpart-base";
import { sp, Fields, Web, SearchResults, Field, PermissionKind, RegionalSettings } from '@pnp/sp';
import { sp, Web, PermissionKind, RegionalSettings } from '@pnp/sp';
import { graph, } from "@pnp/graph";
import { SPHttpClient, SPHttpClientResponse, ISPHttpClientOptions, HttpClient, MSGraphClient } from '@microsoft/sp-http';
import * as $ from 'jquery';
import { IEventData } from './IEventData';
import { registerDefaultFontFaces } from "@uifabric/styling";
import * as moment from 'moment';
import { SiteUser } from "@pnp/sp/src/siteusers";
import { IUserPermissions } from './IUserPermissions';
import { dateAdd } from "@pnp/common";
import { escape, update } from '@microsoft/sp-lodash-subset';
import parseRecurrentEvent from './parseRecurrentEvent';
// Class Services
export default class spservices {
private graphClient: MSGraphClient = null;
constructor(private context: WebPartContext) {
// Setuo Context to PnPjs and MSGraph
@ -45,7 +40,6 @@ export default class spservices {
*/
public async getSiteTimeZoneHours(siteUrl: string): Promise<number> {
let numberHours: number = 0;
let siteTimeZoneHours: any;
let siteTimeZoneBias: number;
let siteTimeZoneDaylightBias: number;
let currentDateTimeOffSet: number = new Date().getTimezoneOffset() / 60;

109
samples/react-calendar/src/webparts/calendar/components/Calendar.module.scss
View File

@ -1,108 +1,101 @@
@import '~@microsoft/sp-office-ui-fabric-core/dist/sass/SPFabricCore.scss';
@import './node_modules/spfx-uifabric-themes/office.theme.vars';
@import "~@microsoft/sp-office-ui-fabric-core/dist/sass/SPFabricCore.scss";
@import "./node_modules/spfx-uifabric-themes/office.theme.vars";
:export {
themeDark: $ms-color-themePrimary;
}
.eventStyleSetter {
background-color: white;
border-radius: 0px;
color: $ms-color-themePrimary;
border-radius: 0;
color: $ms-color-themePrimary;
opacity: 1;
border-width: '1.1px';
border-style: 'solid';
border-color: $ms-color-themePrimary;
border-left-width: '6px';
display: 'block';
border-width: "1.1px";
border-style: "solid";
border-color: $ms-color-themePrimary;
border-left-width: "6px";
display: "block";
}
.Documentcard {
width: '100%';
height: '100%'
width: "100%";
height: "100%";
}
.previewEventIcon {
justify-content: 'center';
display: 'flex';
align-items: 'center';
justify-content: "center";
display: "flex";
align-items: "center";
font-size: 32px;
}
.locationIcon {
justify-content: 'center';
display: 'flex';
align-items: 'top';
justify-content: "center";
display: "flex";
align-items: "top";
font-size: 22px;
margin-top: 10px;
}
.location {
justify-content: 'center';
display: 'flex';
align-items: 'top';
justify-content: "center";
display: "flex";
align-items: "top";
}
.DocumentCardDetails{
.DocumentCardDetails {
background-color: #f2f2f2;
border-style: 'solid';
border-style: "solid";
border-width: 1.3px;
border-color: #e6e6e6;
height:auto;
justify-content: 'center';
display: 'flex';
align-items: 'top';
height: auto;
justify-content: "center";
display: "flex";
align-items: "top";
}
.eventStyle{
.eventStyle {
background-color: white;
border-radius: '0px';
opacity: 1;
color: black;
border-width: 1.4px;
border-style: 'solid';
display: 'block'
border-radius: "0px";
opacity: 1;
color: black;
border-width: 1.4px;
border-style: "solid";
display: "block";
}
.DocumentCardTitle {
font-weight: $ms-font-weight-semibold;
height: '100%';
text-overflow: ellipsis;
display: 'flex';
justify-content: 'center';
font-weight: $ms-font-weight-semibold;
height: "100%";
text-overflow: ellipsis;
display: "flex";
justify-content: "center";
}
.DocumentCardTitleTime{
.DocumentCardTitleTime {
padding-top: 10px;
justify-content: 'center';
display: 'flex';
align-items: 'top';
justify-content: "center";
display: "flex";
align-items: "top";
margin-bottom: 6px;
font-size: $ms-font-size-m;
font-weight: $ms-font-weight-semibold;
font-family: "Segoe UI WestEuropean","Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,"Helvetica Neue",sans-serif;
font-weight: $ms-font-weight-semibold;
font-family: "Segoe UI WestEuropean", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
}
.calendar {
.container {
max-width: 100%;
min-height: 400px;
height: 600px;
margin: 0px auto;
margin: 0 auto;
}
.plainCard {
width: 300;
height: 286;
}
.eventTitle {
white-space: nowrap;
overflow: hidden;
@ -112,9 +105,10 @@
.row {
@include ms-Grid-row;
@include ms-fontColor-white;
background-color: $ms-color-themeDark;
padding: 20px;
border-style: solid
border-style: solid;
}
.column {
@ -140,7 +134,6 @@
@include ms-fontColor-white;
}
.button {
// Our button
text-decoration: none;
@ -155,7 +148,7 @@
// Basic Button
outline: transparent;
position: relative;
font-family: "Segoe UI WestEuropean","Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,"Helvetica Neue",sans-serif;
font-family: "Segoe UI WestEuropean", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
-webkit-font-smoothing: antialiased;
font-size: $ms-font-size-m;
font-weight: $ms-font-weight-regular;

62
samples/react-calendar/src/webparts/calendar/components/calendar.scss
View File

@ -1,16 +1,18 @@
@import '~@microsoft/sp-office-ui-fabric-core/dist/sass/SPFabricCore.scss';
@import "~@microsoft/sp-office-ui-fabric-core/dist/sass/SPFabricCore.scss";
.rbc-selected-cell {
background-color: $ms-color-themeDark;
background-color: $ms-color-themeDark;
}
.rbc-event:hover {
border-width: 2px;
}
.rbc-today {
background-color: $ms-color-themeDark;
background-color: $ms-color-themeDark;
opacity: 0.7;
}
.rbc-off-range-bg {
background: #f4f4f4;
}
@ -24,58 +26,47 @@
background: none;
background-image: none;
border: 1px solid #ccc;
padding: .375rem 1rem;
/* border-radius: 4px; */
padding: 0.375rem 1rem;
border-radius: 0;
line-height: normal;
white-space: nowrap;
}
.rbc-toolbar button:active {
background-image: none;
/* box-shadow: inset 0 3px 5px rgba(0,0,0,.125); */
background-color: #f8f8f8;
border-color: #adadad;
}
.rbc-toolbar button {
color: #373a3c;
display: inline-block;
margin: 0;
text-align: center;
vertical-align: middle;
background: none;
background-image: none;
border: 1px solid #ccc;
padding: .375rem 1rem;
border-radius: 0px;
line-height: normal;
white-space: nowrap;
}
.rbc-toolbar button.rbc-active {
background-image: none;
background-color: $ms-color-themeDark;
/* background-color: #0075c7;*/
background-color: $ms-color-themeDark;
/* background-color: #0075c7; */
border-color: #f4f4f4;
color: white;
}
.rbc-toolbar button.rbc-active:focus, .rbc-toolbar button.rbc-active:hover, .rbc-toolbar button:active:focus, .rbc-toolbar button:active:hover {
color: #fff;
background-color: $ms-color-themeDark;
border-color: #f4f4f4;
}
.rbc-toolbar button:focus, .rbc-toolbar button:hover {
.rbc-toolbar button:focus,
.rbc-toolbar button:hover {
color: #f8f8f8;
background-color: $ms-color-themeDark;
background-color: $ms-color-themeDark;
border-color: #adadad;
}
.rbc-toolbar button.rbc-active:focus,
.rbc-toolbar button.rbc-active:hover,
.rbc-toolbar button:active:focus,
.rbc-toolbar button:active:hover {
color: #fff;
background-color: $ms-color-themeDark;
border-color: #f4f4f4;
}
.rbc-show-more {
background-color: hsla(0,0%,100%,.3);
background-color: hsla(0, 0%, 100%, 0.3);
z-index: 4;
font-weight: 700;
font-size: 85%;
@ -84,7 +75,10 @@
white-space: nowrap;
}
.rbc-ellipsis, .rbc-event-label, .rbc-row-segment .rbc-event-content, .rbc-show-more {
.rbc-ellipsis,
.rbc-event-label,
.rbc-row-segment .rbc-event-content,
.rbc-show-more {
display: block;
overflow: hidden;
text-overflow: ellipsis;