Skip to content

Commit 8edeeb6

Browse files
author
Joshua Marcus
committedFeb 8, 2021
initial commit
0 parents  commit 8edeeb6

22 files changed

+11324
-0
lines changed
 

‎.eslintrc.json

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"parser": "@typescript-eslint/parser",
3+
"plugins": [
4+
"@typescript-eslint"
5+
],
6+
"parserOptions": {
7+
"ecmaVersion": 6,
8+
"sourceType": "module",
9+
"ecmaFeatures": {
10+
"jsx": true
11+
},
12+
"project": "./tsconfig.json"
13+
},
14+
"extends": [
15+
"eslint-config-office-addins"
16+
]
17+
}

‎.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
node_modules
2+
.vscode

‎CONTRIBUTING.md

+83
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
# Contribute to this code sample
2+
3+
Thank you for your interest in this sample! Your contributions and improvements will help the developer community.
4+
5+
## Ways to contribute
6+
7+
There are several ways you can contribute to this sample: providing better code comments, fixing open issues, and adding new features.
8+
9+
### Provide better code comments
10+
11+
Code comments make code samples even better by helping developers learn to use the code correctly in their own applications. If you spot a class, method, or section of code that you think could use better descriptions, then create a pull request with your code comments.
12+
13+
14+
In general we want our code comments to follow these guidelines:
15+
16+
- Any code that has associated documentation displayed in an IDE (such as IntelliSense, or JavaDocs) has code comments.
17+
- Classes, methods, parameters, and return values have clear descriptions.
18+
- Exceptions and errors are documented.
19+
- Remarks exist for anything special or notable about the code.
20+
- Sections of code that have complex algorithms have appropriate comments describing what they do.
21+
- Code added from Stack Overflow, or any other source, is clearly attributed.
22+
23+
### Fix open issues
24+
25+
Sometimes we get a lot of issues, and it can be hard to keep up. If you have a solution to an open issue that hasn't been addressed, fix the issue and then submit a pull request.
26+
27+
### Add a new feature
28+
29+
New features are great! Be sure to check with the repository admin first to be sure the feature will fit the intent of the sample. Start by opening an issue in the repository that proposes and describes the feature. The repository admin will respond and may ask for more information. If the admin agrees to the new feature, create the feature and submit a pull request.
30+
31+
## Contribution guidelines
32+
33+
We have some guidelines to help maintain a healthy repo and code for everyone.
34+
35+
### The Contribution License Agreement
36+
37+
For most contributions, you'll be asked to sign a Contribution License Agreement (CLA). This will happen when you submit a pull request. Microsoft will send a link to the CLA to sign via email. Once you sign the CLA, your pull request can proceed. Read the CLA carefully, because you may need to have your employer sign it.
38+
39+
### Code contribution checklist
40+
41+
Be sure to satisfy all of the requirements in the following list before submitting a pull request:
42+
43+
- Follow the code style that is appropriate for the platform and language in this repo. For example, Android code follows the style conventions found in the [Code Style for Contributors guide](https://source.android.com/source/code-style.html).
44+
- Test your code.
45+
- Test the UI thoroughly to be sure nothing has been broken by your change.
46+
- Keep the size of your code change reasonable. if the repository owner cannot review your code change in 4 hours or less, your pull request may not be reviewed and approved quickly.
47+
- Avoid unnecessary changes. The reviewer will check differences between your code and the original code. Whitespace changes are called out along with your code. Be sure your changes will help improve the content.
48+
49+
### Submit a pull request to the master branch
50+
51+
When you're finished with your work and are ready to have it merged into the master repository, follow these steps. Note: pull requests are typically reviewed within 10 business days. If your pull request is accepted you will be credited for your submission.
52+
53+
1. Submit your pull request against the master branch.
54+
2. Sign the CLA, if you haven't already done so.
55+
3. One of the repo admins will process your pull request, including performing a code review. If there are questions, discussions, or change requests in the pull request, be sure to respond.
56+
4. When the repo admins are satisfied, they will accept and merge the pull request.
57+
58+
Congratulations, you have successfully contributed to the sample!
59+
60+
## FAQ
61+
62+
### Where do I get a Contributor's License Agreement?
63+
64+
You will automatically be sent a notice that you need to sign the Contributor's License Agreement (CLA) if your pull request requires one.
65+
66+
As a community member, you must sign the CLA before you can contribute large submissions to this project. You only need complete and submit the CLA document once. Carefully review the document. You may be required to have your employer sign the document.
67+
68+
### What happens with my contributions?
69+
70+
When you submit your changes, via a pull request, our team will be notified and will review your pull request. You will receive notifications about your pull request from GitHub; you may also be notified by someone from our team if we need more information. We reserve the right to edit your submission for legal, style, clarity, or other issues.
71+
72+
### Who approves pull requests?
73+
74+
The admin of the repository approves pull requests.
75+
76+
### How soon will I get a response about my change request or issue?
77+
78+
We typically review pull requests and respond to issues within 10 business days.
79+
80+
## More resources
81+
82+
- To learn more about Markdown, see [Daring Fireball](http://daringfireball.net/).
83+
- To learn more about using Git and GitHub, check out the [GitHub Help section](http://help.github.com/).

‎LICENSE

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
Office Add-in TaskPane
2+
3+
MIT License
4+
5+
Copyright (c) Microsoft Corporation. All rights reserved.
6+
7+
Permission is hereby granted, free of charge, to any person obtaining a copy
8+
of this software and associated documentation files (the "Software"), to deal
9+
in the Software without restriction, including without limitation the rights
10+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
11+
copies of the Software, and to permit persons to whom the Software is
12+
furnished to do so, subject to the following conditions:
13+
14+
The above copyright notice and this permission notice shall be included in all
15+
copies or substantial portions of the Software.
16+
17+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
18+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
19+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
20+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
21+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
22+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
23+
SOFTWARE

‎README.md

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# Outlook Add-In Firestore Sync
2+
3+

‎assets/icon-128.png

7.59 KB
Loading

‎assets/icon-16.png

2.43 KB
Loading

‎assets/icon-32.png

3.16 KB
Loading

‎assets/icon-64.png

4.52 KB
Loading

‎assets/icon-80.png

5.5 KB
Loading

‎assets/logo-filled.png

15.9 KB
Loading

‎manifest.xml

+109
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
2+
<OfficeApp xmlns="http://schemas.microsoft.com/office/appforoffice/1.1" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:bt="http://schemas.microsoft.com/office/officeappbasictypes/1.0" xmlns:mailappor="http://schemas.microsoft.com/office/mailappversionoverrides/1.0" xsi:type="MailApp">
3+
<Id>38c1b536-d0e7-4acf-b97a-3f6b7cd1288d</Id>
4+
<Version>1.0.0.0</Version>
5+
<ProviderName>ResVu</ProviderName>
6+
<DefaultLocale>en-US</DefaultLocale>
7+
<DisplayName DefaultValue="ResVu sync"/>
8+
<Description DefaultValue="Sync mail to ResVu"/>
9+
<IconUrl DefaultValue="https://localhost:3000/assets/icon-64.png"/>
10+
<HighResolutionIconUrl DefaultValue="https://localhost:3000/assets/icon-128.png"/>
11+
<SupportUrl DefaultValue="https://www.contoso.com/help"/>
12+
<AppDomains>
13+
<AppDomain>https://www.resvu.com.au</AppDomain>
14+
<AppDomain>http://localhost:5001</AppDomain>
15+
16+
</AppDomains>
17+
<Hosts>
18+
<Host Name="Mailbox"/>
19+
</Hosts>
20+
<Requirements>
21+
<Sets>
22+
<Set Name="Mailbox" MinVersion="1.1"/>
23+
</Sets>
24+
</Requirements>
25+
<FormSettings>
26+
<Form xsi:type="ItemRead">
27+
<DesktopSettings>
28+
<SourceLocation DefaultValue="https://localhost:3000/taskpane.html"/>
29+
<RequestedHeight>250</RequestedHeight>
30+
</DesktopSettings>
31+
</Form>
32+
</FormSettings>
33+
<Permissions>ReadWriteItem</Permissions>
34+
<Rule xsi:type="RuleCollection" Mode="Or">
35+
<Rule xsi:type="ItemIs" ItemType="Message" FormType="Read"/>
36+
</Rule>
37+
<DisableEntityHighlighting>false</DisableEntityHighlighting>
38+
<VersionOverrides xmlns="http://schemas.microsoft.com/office/mailappversionoverrides" xsi:type="VersionOverridesV1_0">
39+
<Requirements>
40+
<bt:Sets DefaultMinVersion="1.3">
41+
<bt:Set Name="Mailbox"/>
42+
</bt:Sets>
43+
</Requirements>
44+
<Hosts>
45+
<Host xsi:type="MailHost">
46+
<DesktopFormFactor>
47+
<FunctionFile resid="Commands.Url"/>
48+
<ExtensionPoint xsi:type="MessageReadCommandSurface">
49+
<OfficeTab id="TabDefault">
50+
<Group id="msgReadGroup">
51+
<Label resid="GroupLabel"/>
52+
<Control xsi:type="Button" id="msgReadOpenPaneButton">
53+
<Label resid="TaskpaneButton.Label"/>
54+
<Supertip>
55+
<Title resid="TaskpaneButton.Label"/>
56+
<Description resid="TaskpaneButton.Tooltip"/>
57+
</Supertip>
58+
<Icon>
59+
<bt:Image size="16" resid="Icon.16x16"/>
60+
<bt:Image size="32" resid="Icon.32x32"/>
61+
<bt:Image size="80" resid="Icon.80x80"/>
62+
</Icon>
63+
<Action xsi:type="ShowTaskpane">
64+
<SourceLocation resid="Taskpane.Url"/>
65+
</Action>
66+
</Control>
67+
<Control xsi:type="Button" id="ActionButton">
68+
<Label resid="ActionButton.Label"/>
69+
<Supertip>
70+
<Title resid="ActionButton.Label"/>
71+
<Description resid="ActionButton.Tooltip"/>
72+
</Supertip>
73+
<Icon>
74+
<bt:Image size="16" resid="Icon.16x16"/>
75+
<bt:Image size="32" resid="Icon.32x32"/>
76+
<bt:Image size="80" resid="Icon.80x80"/>
77+
</Icon>
78+
<Action xsi:type="ExecuteFunction">
79+
<FunctionName>action</FunctionName>
80+
</Action>
81+
</Control>
82+
</Group>
83+
</OfficeTab>
84+
</ExtensionPoint>
85+
</DesktopFormFactor>
86+
</Host>
87+
</Hosts>
88+
<Resources>
89+
<bt:Images>
90+
<bt:Image id="Icon.16x16" DefaultValue="https://localhost:3000/assets/icon-16.png"/>
91+
<bt:Image id="Icon.32x32" DefaultValue="https://localhost:3000/assets/icon-32.png"/>
92+
<bt:Image id="Icon.80x80" DefaultValue="https://localhost:3000/assets/icon-80.png"/>
93+
</bt:Images>
94+
<bt:Urls>
95+
<bt:Url id="Commands.Url" DefaultValue="https://localhost:3000/commands.html"/>
96+
<bt:Url id="Taskpane.Url" DefaultValue="https://localhost:3000/taskpane.html"/>
97+
</bt:Urls>
98+
<bt:ShortStrings>
99+
<bt:String id="GroupLabel" DefaultValue="Contoso Add-in"/>
100+
<bt:String id="TaskpaneButton.Label" DefaultValue="Open ResVu Sync"/>
101+
<bt:String id="ActionButton.Label" DefaultValue="Sync Email"/>
102+
</bt:ShortStrings>
103+
<bt:LongStrings>
104+
<bt:String id="TaskpaneButton.Tooltip" DefaultValue="Opens ResVu Sync Menu"/>
105+
<bt:String id="ActionButton.Tooltip" DefaultValue="Sync selected email to ResVu"/>
106+
</bt:LongStrings>
107+
</Resources>
108+
</VersionOverrides>
109+
</OfficeApp>

‎package-lock.json

+10,535
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

+61
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
{
2+
"name": "office-addin-taskpane",
3+
"version": "0.0.1",
4+
"repository": {
5+
"type": "git",
6+
"url": "https://github.com/OfficeDev/Office-Addin-TaskPane.git"
7+
},
8+
"license": "MIT",
9+
"config": {
10+
"app-to-debug": "outlook",
11+
"app-type-to-debug": "desktop",
12+
"dev-server-port": 3000
13+
},
14+
"scripts": {
15+
"build": "webpack -p --mode production --https false",
16+
"build:dev": "webpack --mode development --https false",
17+
"build-dev": "webpack --mode development --https false && echo . && echo . && echo . && echo Please use 'build:dev' instead of 'build-dev'.",
18+
"dev-server": "webpack-dev-server --mode development",
19+
"lint": "office-addin-lint check",
20+
"lint:fix": "office-addin-lint fix",
21+
"prettier": "office-addin-lint prettier",
22+
"start": "office-addin-debugging start manifest.xml",
23+
"start:desktop": "office-addin-debugging start manifest.xml desktop",
24+
"start:web": "office-addin-debugging start manifest.xml web",
25+
"stop": "office-addin-debugging stop manifest.xml",
26+
"validate": "office-addin-manifest validate manifest.xml",
27+
"watch": "webpack --mode development --watch"
28+
},
29+
"dependencies": {
30+
"firebase": "^8.2.5"
31+
},
32+
"devDependencies": {
33+
"@babel/core": "^7.11.6",
34+
"@babel/polyfill": "^7.11.5",
35+
"@babel/preset-env": "^7.11.5",
36+
"@types/find-process": "1.2.0",
37+
"@types/office-js": "^1.0.108",
38+
"@types/office-runtime": "^1.0.14",
39+
"babel-loader": "^8.1.0",
40+
"clean-webpack-plugin": "^3.0.0",
41+
"copy-webpack-plugin": "^6.1.1",
42+
"eslint-config-office-addins": "^1.0.19",
43+
"find-process": "^1.4.3",
44+
"file-loader": "^4.2.0",
45+
"html-loader": "^0.5.5",
46+
"html-webpack-plugin": "^4.5.0",
47+
"office-addin-cli": "^1.0.13",
48+
"office-addin-debugging": "^3.0.34",
49+
"office-addin-dev-certs": "^1.5.5",
50+
"office-addin-lint": "^1.0.26",
51+
"office-addin-manifest": "1.5.7",
52+
"office-addin-prettier-config": "^1.0.12",
53+
"source-map-loader": "^0.2.4",
54+
"ts-loader": "^6.2.2",
55+
"typescript": "^4.0.3",
56+
"webpack": "^4.43.0",
57+
"webpack-cli": "^3.3.12",
58+
"webpack-dev-server": "^3.11.0"
59+
},
60+
"prettier": "office-addin-prettier-config"
61+
}

‎src/commands/commands.html

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<!-- Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT License. -->
2+
3+
<!DOCTYPE html>
4+
<html>
5+
6+
<head>
7+
<meta charset="UTF-8" />
8+
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
9+
10+
<!-- Office JavaScript API -->
11+
<script type="text/javascript" src="https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js"></script>
12+
</head>
13+
14+
<body>
15+
16+
</body>
17+
18+
</html>

‎src/commands/commands.ts

+101
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,101 @@
1+
import firebase from "firebase/app";
2+
import "firebase/firestore";
3+
import { firebaseConfig } from "../env/config";
4+
import "firebase/auth";
5+
6+
var authRecord: firebase.auth.UserCredential;
7+
function checkAuth(): boolean {
8+
if(localStorage.getItem('authResult')) {
9+
authRecord = JSON.parse(localStorage.getItem('authResult'));
10+
return true;
11+
} else {
12+
localStorage.clear();
13+
return false;
14+
}
15+
16+
}
17+
18+
/* global global, Office, self, window */
19+
20+
Office.onReady(() => {
21+
// If needed, Office.js is ready to be called
22+
firebase.initializeApp(firebaseConfig);
23+
});
24+
25+
/**
26+
* Shows a notification when the add-in command is executed.
27+
* @param event
28+
*/
29+
async function action(event: Office.AddinCommands.Event) {
30+
try {
31+
console.log('Running actions')
32+
const userID = firebase.auth().currentUser ? 'yes' : 'no';
33+
console.log(userID)
34+
const noAuthMessage: Office.NotificationMessageDetails = {
35+
type: Office.MailboxEnums.ItemNotificationMessageType.InformationalMessage,
36+
message: `${userID}`,
37+
icon: "Icon.80x80",
38+
persistent: true
39+
};
40+
Office.context.mailbox.item.notificationMessages.replaceAsync("action", noAuthMessage);
41+
// console.log('isUserLoggedIn', isLoggedIn);
42+
// if(!isLoggedIn) {
43+
// const noAuthMessage: Office.NotificationMessageDetails = {
44+
// type: Office.MailboxEnums.ItemNotificationMessageType.InformationalMessage,
45+
// message: "Please login to use this function.",
46+
// icon: "Icon.80x80",
47+
// persistent: false
48+
// };
49+
// Office.context.mailbox.item.notificationMessages.replaceAsync("action", noAuthMessage);
50+
// }
51+
// var bodyResult;
52+
53+
// const mailRecord = Office.context.mailbox.item;
54+
55+
// var body = Office.context.mailbox.item.body;
56+
// body.getAsync(Office.CoercionType.Html, async function (asyncResult) {
57+
// if (asyncResult.status !== Office.AsyncResultStatus.Succeeded) {
58+
// bodyResult = "";
59+
// } else {
60+
// bodyResult = `${asyncResult.value}`;
61+
// await firebase.firestore().collection('users').doc(authRecord.user.uid).collection('synced-emails').add({
62+
// from: {name: mailRecord.from.displayName, email: mailRecord.from.emailAddress},
63+
// userId: authRecord.user.uid,
64+
// subject: mailRecord.subject,
65+
// body: bodyResult
66+
// });
67+
// const completed: Office.NotificationMessageDetails = {
68+
// type: Office.MailboxEnums.ItemNotificationMessageType.InformationalMessage,
69+
// message: "You email has been synced!",
70+
// icon: "Icon.80x80",
71+
// persistent: false
72+
// };
73+
// Office.context.mailbox.item.notificationMessages.replaceAsync("action", completed);
74+
75+
// }
76+
// });
77+
78+
event.completed();
79+
} catch (e) {
80+
console.log(e);
81+
event.completed();
82+
83+
}
84+
85+
}
86+
87+
function getGlobal() {
88+
return typeof self !== "undefined"
89+
? self
90+
: typeof window !== "undefined"
91+
? window
92+
: typeof global !== "undefined"
93+
? global
94+
: undefined;
95+
}
96+
97+
const g = getGlobal() as any;
98+
99+
// the add-in command functions need to be available in global scope
100+
g.action = action;
101+

‎src/env/config.ts

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export const firebaseConfig = {
2+
apiKey: "AIzaSyBaaNXOsruNPyDrQpKEnw-S-BnvwKlTfR4",
3+
authDomain: "comm-unstable.firebaseapp.com",
4+
databaseURL: "https://comm-unstable.firebaseio.com",
5+
projectId: "comm-unstable",
6+
storageBucket: "comm-unstable.appspot.com",
7+
messagingSenderId: "1061697142615",
8+
appId: "1:1061697142615:web:23f9c7b10d97acfe"
9+
};

‎src/taskpane/taskpane.css

+115
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
html,
2+
body {
3+
width: 100%;
4+
height: 100%;
5+
margin: 0;
6+
padding: 0;
7+
}
8+
9+
ul {
10+
margin: 0;
11+
padding: 0;
12+
}
13+
14+
.ms-welcome__header {
15+
padding: 20px;
16+
padding-bottom: 30px;
17+
padding-top: 100px;
18+
display: -webkit-flex;
19+
display: flex;
20+
-webkit-flex-direction: column;
21+
flex-direction: column;
22+
align-items: center;
23+
}
24+
25+
.ms-welcome__main {
26+
display: -webkit-flex;
27+
display: flex;
28+
-webkit-flex-direction: column;
29+
flex-direction: column;
30+
-webkit-flex-wrap: nowrap;
31+
flex-wrap: nowrap;
32+
-webkit-align-items: center;
33+
align-items: center;
34+
-webkit-flex: 1 0 0;
35+
flex: 1 0 0;
36+
padding: 10px 20px;
37+
}
38+
39+
.ms-welcome__main > h2 {
40+
width: 100%;
41+
text-align: center;
42+
}
43+
44+
.ms-welcome__features {
45+
list-style-type: none;
46+
margin-top: 20px;
47+
}
48+
49+
.ms-welcome__features.ms-List .ms-ListItem {
50+
padding-bottom: 20px;
51+
display: -webkit-flex;
52+
display: flex;
53+
}
54+
55+
.ms-welcome__features.ms-List .ms-ListItem > .ms-Icon {
56+
margin-right: 10px;
57+
}
58+
59+
.ms-welcome__action.ms-Button--hero {
60+
margin-top: 30px;
61+
margin-top: 30px;
62+
background: #2b91c1;
63+
width: 100%;
64+
text-align: center;
65+
height: 35px;
66+
line-height: 30px;
67+
font-weight: 500;
68+
border-radius: 5px;
69+
}
70+
71+
.ms-Button.ms-Button--hero .ms-Button-label {
72+
color: #ffffff;
73+
}
74+
75+
.ms-Button.ms-Button--hero:hover .ms-Button-label,
76+
.ms-Button.ms-Button--hero:focus .ms-Button-label{
77+
color: #ffffff;
78+
cursor: pointer;
79+
}
80+
81+
.ms-Button.ms-Button--hero:hover,
82+
.ms-Button.ms-Button--hero:focus{
83+
background: #217399;
84+
cursor: pointer;
85+
}
86+
87+
b {
88+
font-weight: bold;
89+
}
90+
91+
/* Full-width inputs */
92+
input[type=email], input[type=password] {
93+
width: 100%;
94+
padding: 12px 20px;
95+
margin: 8px 0;
96+
display: inline-block;
97+
border: 1px solid #ccc;
98+
box-sizing: border-box;
99+
font-size: 16px;
100+
}
101+
102+
#login-result {
103+
font-weight: 600;
104+
}
105+
106+
107+
.ms-welcome__action.ms-Button--hero-logout {
108+
margin-top: 30px;
109+
110+
}
111+
112+
.ms-Button.ms-Button--hero-logout .ms-Button-label-logout {
113+
color: #2b91c1;
114+
cursor: pointer;
115+
}

‎src/taskpane/taskpane.html

+60
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
<!-- Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT License. -->
2+
<!-- This file shows how to design a first-run page that provides a welcome screen to the user about the features of the add-in. -->
3+
4+
<!DOCTYPE html>
5+
<html>
6+
7+
<head>
8+
<meta charset="UTF-8" />
9+
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
10+
<meta name="viewport" content="width=device-width, initial-scale=1">
11+
<title>ResVu Sync</title>
12+
13+
<!-- Office JavaScript API -->
14+
<script type="text/javascript" src="https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js"></script>
15+
16+
<!-- For more information on Office UI Fabric, visit https://developer.microsoft.com/fabric. -->
17+
<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/9.6.1/css/fabric.min.css"/>
18+
19+
<!-- Template styles -->
20+
<link href="taskpane.css" rel="stylesheet" type="text/css" />
21+
</head>
22+
23+
<body class="ms-font-m ms-welcome ms-Fabric">
24+
<div id="no-auth" style="display: none;">
25+
<header class="ms-welcome__header ms-bgColor-neutralLighter">
26+
<img width="90" height="90" src="../../assets/logo-filled.png" alt="ResVu" title="ResVu" />
27+
<h1 class="ms-font-su">ResVu sync</h1>
28+
<p class="ms-font-l">Please login to continue.</p>
29+
30+
</header>
31+
<main id="app-body" class="ms-welcome__main">
32+
<input type="email" placeholder="Email" id="email" name="email" required>
33+
<input type="password" placeholder="Password" id="password" name="password" required>
34+
<div role="button" id="login-btn" class="ms-welcome__action ms-Button ms-Button--hero ms-font-xl">
35+
<span class="ms-Button-label">Login</span>
36+
</div>
37+
<p id="login-result"></p>
38+
</main>
39+
</div>
40+
41+
<div id="auth" style="display: none;">
42+
<header class="ms-welcome__header ms-bgColor-neutralLighter">
43+
<img width="90" height="90" src="../../assets/logo-filled.png" alt="ResVu" title="ResVu" />
44+
<h1 class="ms-font-su">ResVu sync</h1>
45+
<p class="ms-font-l">You are currently logged in as: <span id="authEmail"></span></p>
46+
47+
</header>
48+
<main id="app-body" class="ms-welcome__main">
49+
<p class="ms-font-l">You have succesfully set up ResVu sync.</p>
50+
<p class="ms-font-l">You can sync an email to the system by clicking the "Sync Email" button in your outlook toolbar.</p>
51+
<div role="button" id="logout-btn" class="ms-welcome__action ms-Button ms-Button--hero-logout ms-font-xl">
52+
<span class="ms-Button-label-logout">Logout</span>
53+
</div>
54+
</main>
55+
</div>
56+
57+
58+
</body>
59+
60+
</html>

‎src/taskpane/taskpane.ts

+75
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
/*
2+
* Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
3+
* See LICENSE in the project root for license information.
4+
*/
5+
6+
// images references in the manifest
7+
import "../../assets/icon-16.png";
8+
import "../../assets/icon-32.png";
9+
import "../../assets/icon-80.png";
10+
import firebase from "firebase/app";
11+
import "firebase/auth";
12+
import { firebaseConfig } from "../env/config";
13+
14+
/* global document, Office */
15+
16+
var authRecord: firebase.auth.UserCredential;
17+
18+
Office.onReady(info => {
19+
if (info.host === Office.HostType.Outlook) {
20+
firebase.initializeApp(firebaseConfig);
21+
document.getElementById("login-btn").onclick = login;
22+
document.getElementById("logout-btn").onclick = logout;
23+
initAddInAuth();
24+
25+
}
26+
});
27+
28+
function initAddInAuth() {
29+
30+
const isLoggedIn = checkAuth();
31+
if(isLoggedIn) {
32+
document.getElementById("auth").style.display = "unset";
33+
document.getElementById("no-auth").style.display = "none";
34+
document.getElementById("authEmail").innerHTML = authRecord.user.email;
35+
} else {
36+
document.getElementById("no-auth").style.display = "unset";
37+
}
38+
}
39+
40+
41+
async function login() {
42+
try {
43+
await firebase.auth().setPersistence(firebase.auth.Auth.Persistence.LOCAL);
44+
var formEmail = (<HTMLInputElement>document.getElementById("email")).value;
45+
var formPassword = (<HTMLInputElement>document.getElementById("password")).value;
46+
const result = await firebase.auth().signInWithEmailAndPassword(formEmail, formPassword);
47+
localStorage.setItem('authResult', JSON.stringify(result));
48+
initAddInAuth();
49+
} catch (e) {
50+
document.getElementById("login-result").innerHTML = e.message;
51+
document.getElementById("login-result").style.color = "#f44336";
52+
console.log(e);
53+
54+
}
55+
56+
}
57+
58+
async function logout() {
59+
await firebase.auth().signOut();
60+
localStorage.clear();
61+
document.getElementById("auth").style.display = "none";
62+
document.getElementById("no-auth").style.display = "unset";
63+
}
64+
65+
66+
function checkAuth(): boolean {
67+
if(localStorage.getItem('authResult')) {
68+
authRecord = JSON.parse(localStorage.getItem('authResult'));
69+
return true;
70+
} else {
71+
localStorage.clear();
72+
return false;
73+
}
74+
75+
}

‎tsconfig.json

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
{
2+
"compilerOptions": {
3+
"allowJs": true,
4+
"baseUrl": ".",
5+
"experimentalDecorators": true,
6+
"jsx": "react",
7+
"noEmitOnError": true,
8+
"outDir": "lib",
9+
"sourceMap": true,
10+
"target": "es5",
11+
"lib": [
12+
"es2015",
13+
"dom"
14+
]
15+
},
16+
"exclude": [
17+
"node_modules",
18+
"dist",
19+
"lib",
20+
"lib-amd"
21+
]
22+
}

‎webpack.config.js

+91
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
const devCerts = require("office-addin-dev-certs");
2+
const { CleanWebpackPlugin } = require("clean-webpack-plugin");
3+
const CopyWebpackPlugin = require("copy-webpack-plugin");
4+
const HtmlWebpackPlugin = require("html-webpack-plugin");
5+
const fs = require("fs");
6+
const webpack = require("webpack");
7+
8+
const urlDev="https://localhost:3000/";
9+
const urlProd="https://www.contoso.com/"; // CHANGE THIS TO YOUR PRODUCTION DEPLOYMENT LOCATION
10+
11+
module.exports = async (env, options) => {
12+
const dev = options.mode === "development";
13+
const buildType = dev ? "dev" : "prod";
14+
const config = {
15+
devtool: "source-map",
16+
entry: {
17+
polyfill: "@babel/polyfill",
18+
taskpane: "./src/taskpane/taskpane.ts",
19+
commands: "./src/commands/commands.ts"
20+
},
21+
resolve: {
22+
extensions: [".ts", ".tsx", ".html", ".js"]
23+
},
24+
module: {
25+
rules: [
26+
{
27+
test: /\.ts$/,
28+
exclude: /node_modules/,
29+
use: "babel-loader"
30+
},
31+
{
32+
test: /\.tsx?$/,
33+
exclude: /node_modules/,
34+
use: "ts-loader"
35+
},
36+
{
37+
test: /\.html$/,
38+
exclude: /node_modules/,
39+
use: "html-loader"
40+
},
41+
{
42+
test: /\.(png|jpg|jpeg|gif)$/,
43+
loader: "file-loader",
44+
options: {
45+
name: '[path][name].[ext]',
46+
}
47+
}
48+
]
49+
},
50+
plugins: [
51+
new CleanWebpackPlugin(),
52+
new HtmlWebpackPlugin({
53+
filename: "taskpane.html",
54+
template: "./src/taskpane/taskpane.html",
55+
chunks: ["polyfill", "taskpane"]
56+
}),
57+
new CopyWebpackPlugin({
58+
patterns: [
59+
{
60+
to: "taskpane.css",
61+
from: "./src/taskpane/taskpane.css"
62+
},
63+
{
64+
to: "[name]." + buildType + ".[ext]",
65+
from: "manifest*.xml",
66+
transform(content) {
67+
if (dev) {
68+
return content;
69+
} else {
70+
return content.toString().replace(new RegExp(urlDev, "g"), urlProd);
71+
}
72+
}
73+
}
74+
]}),
75+
new HtmlWebpackPlugin({
76+
filename: "commands.html",
77+
template: "./src/commands/commands.html",
78+
chunks: ["polyfill", "commands"]
79+
})
80+
],
81+
devServer: {
82+
headers: {
83+
"Access-Control-Allow-Origin": "*"
84+
},
85+
https: (options.https !== undefined) ? options.https : await devCerts.getHttpsServerOptions(),
86+
port: process.env.npm_package_config_dev_server_port || 3000
87+
}
88+
};
89+
90+
return config;
91+
};

0 commit comments

Comments
 (0)
Please sign in to comment.