Initial commit voor Outlook plugin
8
.eslintrc.json
Normal file
@@ -0,0 +1,8 @@
|
||||
{
|
||||
"plugins": [
|
||||
"office-addins"
|
||||
],
|
||||
"extends": [
|
||||
"plugin:office-addins/recommended"
|
||||
]
|
||||
}
|
||||
2
.gitignore
vendored
Normal file
@@ -0,0 +1,2 @@
|
||||
node_modules
|
||||
.vscode
|
||||
BIN
assets/icon-128.png
Normal file
|
After Width: | Height: | Size: 4.6 KiB |
BIN
assets/icon-16.png
Normal file
|
After Width: | Height: | Size: 1.6 KiB |
BIN
assets/icon-32.png
Normal file
|
After Width: | Height: | Size: 2.3 KiB |
BIN
assets/icon-64.png
Normal file
|
After Width: | Height: | Size: 2.1 KiB |
BIN
assets/icon-80.png
Normal file
|
After Width: | Height: | Size: 4.7 KiB |
BIN
assets/logo-filled.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
3
babel.config.json
Normal file
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"presets": ["@babel/preset-env"]
|
||||
}
|
||||
BIN
dist/assets/icon-128.png
vendored
Normal file
|
After Width: | Height: | Size: 4.6 KiB |
BIN
dist/assets/icon-16.png
vendored
Normal file
|
After Width: | Height: | Size: 1.6 KiB |
BIN
dist/assets/icon-32.png
vendored
Normal file
|
After Width: | Height: | Size: 2.3 KiB |
BIN
dist/assets/icon-64.png
vendored
Normal file
|
After Width: | Height: | Size: 2.1 KiB |
BIN
dist/assets/icon-80.png
vendored
Normal file
|
After Width: | Height: | Size: 4.7 KiB |
BIN
dist/assets/logo-filled.png
vendored
Normal file
|
After Width: | Height: | Size: 12 KiB |
1
dist/commands.html
vendored
Normal file
@@ -0,0 +1 @@
|
||||
<!doctype html><html><head><meta charset="UTF-8"/><meta http-equiv="X-UA-Compatible" content="IE=Edge"/><script src="https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js"></script><script defer="defer" src="polyfill.js"></script><script defer="defer" src="commands.js"></script></head><body></body></html>
|
||||
2
dist/commands.js
vendored
Normal file
@@ -0,0 +1,2 @@
|
||||
Office.onReady((function(){})),Office.actions.associate("action",(function(e){var i={type:Office.MailboxEnums.ItemNotificationMessageType.InformationalMessage,message:"Performed action.",icon:"Icon.80x80",persistent:!0};Office.context.mailbox.item.notificationMessages.replaceAsync("action",i),e.completed()}));
|
||||
//# sourceMappingURL=commands.js.map
|
||||
1
dist/commands.js.map
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"commands.js","mappings":"AAOAA,OAAOC,SAAQ,WACb,IAuBFD,OAAOE,QAAQC,UAAU,UAhBzB,SAAgBC,GACd,IAAMC,EAAU,CACdC,KAAMN,OAAOO,aAAaC,4BAA4BC,qBACtDJ,QAAS,oBACTK,KAAM,aACNC,YAAY,GAIdX,OAAOY,QAAQC,QAAQC,KAAKC,qBAAqBC,aAAa,SAAUX,GAGxED,EAAMa,WACR","sources":["webpack://office-addin-taskpane-js/./src/commands/commands.js"],"sourcesContent":["/*\n * Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.\n * See LICENSE in the project root for license information.\n */\n\n/* global Office */\n\nOffice.onReady(() => {\n // If needed, Office.js is ready to be called.\n});\n\n/**\n * Shows a notification when the add-in command is executed.\n * @param event {Office.AddinCommands.Event}\n */\nfunction action(event) {\n const message = {\n type: Office.MailboxEnums.ItemNotificationMessageType.InformationalMessage,\n message: \"Performed action.\",\n icon: \"Icon.80x80\",\n persistent: true,\n };\n\n // Show a notification message.\n Office.context.mailbox.item.notificationMessages.replaceAsync(\"action\", message);\n\n // Be sure to indicate when the add-in command function is complete.\n event.completed();\n}\n\n// Register the function with Office.\nOffice.actions.associate(\"action\", action);\n"],"names":["Office","onReady","actions","associate","event","message","type","MailboxEnums","ItemNotificationMessageType","InformationalMessage","icon","persistent","context","mailbox","item","notificationMessages","replaceAsync","completed"],"sourceRoot":""}
|
||||
224
dist/fc95fa02fd204a05f6f4.css
vendored
Normal file
@@ -0,0 +1,224 @@
|
||||
*
|
||||
* Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
|
||||
* See LICENSE in the project root for license information.
|
||||
*/
|
||||
|
||||
html, body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
ul {
|
||||
margin: 0;
|
||||
padding: 0; }
|
||||
|
||||
.ms-welcome__header {
|
||||
padding: 20px;
|
||||
padding-bottom: 20px;
|
||||
padding-top: 20px;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.ms-welcome__main {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-webkit-flex-wrap: nowrap;
|
||||
flex-wrap: nowrap;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-flex: 1 0 0;
|
||||
flex: 1 0 0;
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
||||
.ms-welcome__main > h2 {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ms-welcome__features {
|
||||
list-style-type: none;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.ms-welcome__features.ms-List .ms-ListItem {
|
||||
padding-bottom: 20px;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.ms-welcome__features.ms-List .ms-ListItem > .ms-Icon {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.ms-welcome__action.ms-Button--hero {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.ms-Button.ms-Button--hero .ms-Button-label {
|
||||
color: #0078d7;
|
||||
}
|
||||
|
||||
.ms-Button.ms-Button--hero:hover .ms-Button-label,
|
||||
.ms-Button.ms-Button--hero:focus .ms-Button-label{
|
||||
color: #005a9e;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
b {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* CSS */
|
||||
.run-button {
|
||||
appearance: button;
|
||||
backface-visibility: hidden;
|
||||
background-color: #405cf5;
|
||||
border-radius: 6px;
|
||||
border-width: 0;
|
||||
box-shadow: rgba(50, 50, 93, .1) 0 0 0 1px inset,rgba(50, 50, 93, .1) 0 2px 5px 0,rgba(0, 0, 0, .07) 0 1px 1px 0;
|
||||
box-sizing: border-box;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
font-family: -apple-system,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif;
|
||||
font-size: 100%;
|
||||
height: 44px;
|
||||
line-height: 1.15;
|
||||
margin: 12px 0 0;
|
||||
outline: none;
|
||||
overflow: hidden;
|
||||
padding: 0 25px;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
text-transform: none;
|
||||
transform: translateZ(0);
|
||||
transition: all .2s,box-shadow .08s ease-in;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
touch-action: manipulation;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.run-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.run-button:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.run-button {
|
||||
box-shadow: rgba(50, 50, 93, .1) 0 0 0 1px inset, rgba(50, 50, 93, .2) 0 6px 15px 0, rgba(0, 0, 0, .1) 0 2px 2px 0, rgba(50, 151, 211, .3) 0 0 0 4px;
|
||||
}
|
||||
|
||||
/* Loading CSS for button */
|
||||
.loader {
|
||||
display: none;
|
||||
border: 4px solid rgba(255, 255, 255, 0.3);
|
||||
border-top: 4px solid blue;
|
||||
border-radius: 50%;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
animation: spin 1s linear infinite;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.loading {
|
||||
background-color: #ccc;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/* CSS */
|
||||
.result-button {
|
||||
appearance: button;
|
||||
backface-visibility: hidden;
|
||||
background-color: #47bf67;
|
||||
border-radius: 6px;
|
||||
border-width: 0;
|
||||
box-shadow: rgba(50, 50, 93, .1) 0 0 0 1px inset,rgba(50, 50, 93, .1) 0 2px 5px 0,rgba(0, 0, 0, .07) 0 1px 1px 0;
|
||||
box-sizing: border-box;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
font-family: -apple-system,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif;
|
||||
font-size: 100%;
|
||||
height: 44px;
|
||||
line-height: 1.15;
|
||||
margin: 12px 0 0;
|
||||
outline: none;
|
||||
overflow: hidden;
|
||||
padding: 0 25px;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
text-transform: none;
|
||||
transform: translateZ(0);
|
||||
transition: all .2s,box-shadow .08s ease-in;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
touch-action: manipulation;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.result-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.result-button:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.result-button {
|
||||
box-shadow: rgba(50, 50, 93, .1) 0 0 0 1px inset, rgba(50, 50, 93, .2) 0 6px 15px 0, rgba(0, 0, 0, .1) 0 2px 2px 0, rgba(50, 151, 211, .3) 0 0 0 4px;
|
||||
}
|
||||
|
||||
/* CSS */
|
||||
.no-result-button {
|
||||
appearance: button;
|
||||
backface-visibility: hidden;
|
||||
background-color: #bf4747;
|
||||
border-radius: 6px;
|
||||
border-width: 0;
|
||||
box-shadow: rgba(50, 50, 93, .1) 0 0 0 1px inset,rgba(50, 50, 93, .1) 0 2px 5px 0,rgba(0, 0, 0, .07) 0 1px 1px 0;
|
||||
box-sizing: border-box;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
font-family: -apple-system,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif;
|
||||
font-size: 100%;
|
||||
height: 44px;
|
||||
line-height: 1.15;
|
||||
margin: 12px 0 0;
|
||||
outline: none;
|
||||
overflow: hidden;
|
||||
padding: 0 25px;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
text-transform: none;
|
||||
transform: translateZ(0);
|
||||
transition: all .2s,box-shadow .08s ease-in;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
touch-action: manipulation;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.no-result-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
107
dist/manifest.xml
vendored
Normal file
@@ -0,0 +1,107 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
|
||||
<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">
|
||||
<Id>6aefdc1b-c9c2-4f92-95c7-af96bd9ced13</Id>
|
||||
<Version>1.0.0.0</Version>
|
||||
<ProviderName>Contoso</ProviderName>
|
||||
<DefaultLocale>en-US</DefaultLocale>
|
||||
<DisplayName DefaultValue="order-finder"/>
|
||||
<Description DefaultValue="A template to get started."/>
|
||||
<IconUrl DefaultValue="https://www.contoso.com/assets/icon-64.png"/>
|
||||
<HighResolutionIconUrl DefaultValue="https://www.contoso.com/assets/icon-128.png"/>
|
||||
<SupportUrl DefaultValue="https://www.contoso.com/help"/>
|
||||
<AppDomains>
|
||||
<AppDomain>https://www.contoso.com</AppDomain>
|
||||
</AppDomains>
|
||||
<Hosts>
|
||||
<Host Name="Mailbox"/>
|
||||
</Hosts>
|
||||
<Requirements>
|
||||
<Sets>
|
||||
<Set Name="Mailbox" MinVersion="1.1"/>
|
||||
</Sets>
|
||||
</Requirements>
|
||||
<FormSettings>
|
||||
<Form xsi:type="ItemRead">
|
||||
<DesktopSettings>
|
||||
<SourceLocation DefaultValue="https://www.contoso.com/taskpane.html"/>
|
||||
<RequestedHeight>250</RequestedHeight>
|
||||
</DesktopSettings>
|
||||
</Form>
|
||||
</FormSettings>
|
||||
<Permissions>ReadWriteItem</Permissions>
|
||||
<Rule xsi:type="RuleCollection" Mode="Or">
|
||||
<Rule xsi:type="ItemIs" ItemType="Message" FormType="Read"/>
|
||||
</Rule>
|
||||
<DisableEntityHighlighting>false</DisableEntityHighlighting>
|
||||
<VersionOverrides xmlns="http://schemas.microsoft.com/office/mailappversionoverrides" xsi:type="VersionOverridesV1_0">
|
||||
<Requirements>
|
||||
<bt:Sets DefaultMinVersion="1.3">
|
||||
<bt:Set Name="Mailbox"/>
|
||||
</bt:Sets>
|
||||
</Requirements>
|
||||
<Hosts>
|
||||
<Host xsi:type="MailHost">
|
||||
<DesktopFormFactor>
|
||||
<FunctionFile resid="Commands.Url"/>
|
||||
<ExtensionPoint xsi:type="MessageReadCommandSurface">
|
||||
<OfficeTab id="TabDefault">
|
||||
<Group id="msgReadGroup">
|
||||
<Label resid="GroupLabel"/>
|
||||
<Control xsi:type="Button" id="msgReadOpenPaneButton">
|
||||
<Label resid="TaskpaneButton.Label"/>
|
||||
<Supertip>
|
||||
<Title resid="TaskpaneButton.Label"/>
|
||||
<Description resid="TaskpaneButton.Tooltip"/>
|
||||
</Supertip>
|
||||
<Icon>
|
||||
<bt:Image size="16" resid="Icon.16x16"/>
|
||||
<bt:Image size="32" resid="Icon.32x32"/>
|
||||
<bt:Image size="80" resid="Icon.80x80"/>
|
||||
</Icon>
|
||||
<Action xsi:type="ShowTaskpane">
|
||||
<SourceLocation resid="Taskpane.Url"/>
|
||||
</Action>
|
||||
</Control>
|
||||
<Control xsi:type="Button" id="ActionButton">
|
||||
<Label resid="ActionButton.Label"/>
|
||||
<Supertip>
|
||||
<Title resid="ActionButton.Label"/>
|
||||
<Description resid="ActionButton.Tooltip"/>
|
||||
</Supertip>
|
||||
<Icon>
|
||||
<bt:Image size="16" resid="Icon.16x16"/>
|
||||
<bt:Image size="32" resid="Icon.32x32"/>
|
||||
<bt:Image size="80" resid="Icon.80x80"/>
|
||||
</Icon>
|
||||
<Action xsi:type="ExecuteFunction">
|
||||
<FunctionName>action</FunctionName>
|
||||
</Action>
|
||||
</Control>
|
||||
</Group>
|
||||
</OfficeTab>
|
||||
</ExtensionPoint>
|
||||
</DesktopFormFactor>
|
||||
</Host>
|
||||
</Hosts>
|
||||
<Resources>
|
||||
<bt:Images>
|
||||
<bt:Image id="Icon.16x16" DefaultValue="https://www.contoso.com/assets/icon-16.png"/>
|
||||
<bt:Image id="Icon.32x32" DefaultValue="https://www.contoso.com/assets/icon-32.png"/>
|
||||
<bt:Image id="Icon.80x80" DefaultValue="https://www.contoso.com/assets/icon-80.png"/>
|
||||
</bt:Images>
|
||||
<bt:Urls>
|
||||
<bt:Url id="Commands.Url" DefaultValue="https://www.contoso.com/commands.html"/>
|
||||
<bt:Url id="Taskpane.Url" DefaultValue="https://www.contoso.com/taskpane.html"/>
|
||||
</bt:Urls>
|
||||
<bt:ShortStrings>
|
||||
<bt:String id="GroupLabel" DefaultValue="Contoso Add-in"/>
|
||||
<bt:String id="TaskpaneButton.Label" DefaultValue="Show Taskpane"/>
|
||||
<bt:String id="ActionButton.Label" DefaultValue="Perform an action"/>
|
||||
</bt:ShortStrings>
|
||||
<bt:LongStrings>
|
||||
<bt:String id="TaskpaneButton.Tooltip" DefaultValue="Opens a pane displaying all available properties."/>
|
||||
<bt:String id="ActionButton.Tooltip" DefaultValue="Perform an action when clicked."/>
|
||||
</bt:LongStrings>
|
||||
</Resources>
|
||||
</VersionOverrides>
|
||||
</OfficeApp>
|
||||
2
dist/polyfill.js
vendored
Normal file
1
dist/polyfill.js.map
vendored
Normal file
1
dist/taskpane.html
vendored
Normal file
@@ -0,0 +1 @@
|
||||
<!doctype html><html><head><meta charset="UTF-8"/><meta http-equiv="X-UA-Compatible" content="IE=Edge"/><meta name="viewport" content="width=device-width,initial-scale=1"><title>Contoso Task Pane Add-in</title><script src="https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js"></script><link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/11.0.0/css/fabric.min.css"/><link href="fc95fa02fd204a05f6f4.css" rel="stylesheet"/><script defer="defer" src="polyfill.js"></script><script defer="defer" src="taskpane.js"></script></head><body class="ms-font-m ms-welcome ms-Fabric"><header class="ms-welcome__header"><h1 class="ms-font-su" style="color:#fff">OVAS</h1></header><main style="color:#fff" id="app-body" class="ms-welcome__main" style="display:none"><ul class="ms-List ms-welcome__features"><li class="ms-ListItem"><i class="ms-Icon ms-Icon--Ribbon ms-font-xl"></i> <span class="ms-font-m">Zoek bijbehorende bestellingen efficient vanuit Outlook</span></li></ul><button class="run-button" id="run"><span id="btn-text">Zoek naar bestellingen</span><div class="loader" id="loader"></div></button><p><label id="item-subject"></label></p><div id="results"></div></main></body></html>
|
||||
3
dist/taskpane.js
vendored
Normal file
1
dist/taskpane.js.LICENSE.txt
vendored
Normal file
@@ -0,0 +1 @@
|
||||
/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
|
||||
1
dist/taskpane.js.map
vendored
Normal file
107
manifest.xml
Normal file
@@ -0,0 +1,107 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
|
||||
<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">
|
||||
<Id>6aefdc1b-c9c2-4f92-95c7-af96bd9ced13</Id>
|
||||
<Version>1.0.0.0</Version>
|
||||
<ProviderName>OVAS</ProviderName>
|
||||
<DefaultLocale>en-US</DefaultLocale>
|
||||
<DisplayName DefaultValue="Order finder OVAS"/>
|
||||
<Description DefaultValue="Vind bestellingen die eventueel bij de e-mail horen"/>
|
||||
<IconUrl DefaultValue="https://localhost:3000/assets/icon-64.png"/>
|
||||
<HighResolutionIconUrl DefaultValue="https://localhost:3000/assets/icon-128.png"/>
|
||||
<SupportUrl DefaultValue="https://ovas.nl"/>
|
||||
<AppDomains>
|
||||
<AppDomain>https://localhost:3000</AppDomain>
|
||||
</AppDomains>
|
||||
<Hosts>
|
||||
<Host Name="Mailbox"/>
|
||||
</Hosts>
|
||||
<Requirements>
|
||||
<Sets>
|
||||
<Set Name="Mailbox" MinVersion="1.1"/>
|
||||
</Sets>
|
||||
</Requirements>
|
||||
<FormSettings>
|
||||
<Form xsi:type="ItemRead">
|
||||
<DesktopSettings>
|
||||
<SourceLocation DefaultValue="https://localhost:3000/taskpane.html"/>
|
||||
<RequestedHeight>250</RequestedHeight>
|
||||
</DesktopSettings>
|
||||
</Form>
|
||||
</FormSettings>
|
||||
<Permissions>ReadWriteItem</Permissions>
|
||||
<Rule xsi:type="RuleCollection" Mode="Or">
|
||||
<Rule xsi:type="ItemIs" ItemType="Message" FormType="Read"/>
|
||||
</Rule>
|
||||
<DisableEntityHighlighting>false</DisableEntityHighlighting>
|
||||
<VersionOverrides xmlns="http://schemas.microsoft.com/office/mailappversionoverrides" xsi:type="VersionOverridesV1_0">
|
||||
<Requirements>
|
||||
<bt:Sets DefaultMinVersion="1.3">
|
||||
<bt:Set Name="Mailbox"/>
|
||||
</bt:Sets>
|
||||
</Requirements>
|
||||
<Hosts>
|
||||
<Host xsi:type="MailHost">
|
||||
<DesktopFormFactor>
|
||||
<FunctionFile resid="Commands.Url"/>
|
||||
<ExtensionPoint xsi:type="MessageReadCommandSurface">
|
||||
<OfficeTab id="TabDefault">
|
||||
<Group id="msgReadGroup">
|
||||
<Label resid="GroupLabel"/>
|
||||
<Control xsi:type="Button" id="msgReadOpenPaneButton">
|
||||
<Label resid="TaskpaneButton.Label"/>
|
||||
<Supertip>
|
||||
<Title resid="TaskpaneButton.Label"/>
|
||||
<Description resid="TaskpaneButton.Tooltip"/>
|
||||
</Supertip>
|
||||
<Icon>
|
||||
<bt:Image size="16" resid="Icon.16x16"/>
|
||||
<bt:Image size="32" resid="Icon.32x32"/>
|
||||
<bt:Image size="80" resid="Icon.80x80"/>
|
||||
</Icon>
|
||||
<Action xsi:type="ShowTaskpane">
|
||||
<SourceLocation resid="Taskpane.Url"/>
|
||||
</Action>
|
||||
</Control>
|
||||
<Control xsi:type="Button" id="ActionButton">
|
||||
<Label resid="ActionButton.Label"/>
|
||||
<Supertip>
|
||||
<Title resid="ActionButton.Label"/>
|
||||
<Description resid="ActionButton.Tooltip"/>
|
||||
</Supertip>
|
||||
<Icon>
|
||||
<bt:Image size="16" resid="Icon.16x16"/>
|
||||
<bt:Image size="32" resid="Icon.32x32"/>
|
||||
<bt:Image size="80" resid="Icon.80x80"/>
|
||||
</Icon>
|
||||
<Action xsi:type="ExecuteFunction">
|
||||
<FunctionName>action</FunctionName>
|
||||
</Action>
|
||||
</Control>
|
||||
</Group>
|
||||
</OfficeTab>
|
||||
</ExtensionPoint>
|
||||
</DesktopFormFactor>
|
||||
</Host>
|
||||
</Hosts>
|
||||
<Resources>
|
||||
<bt:Images>
|
||||
<bt:Image id="Icon.16x16" DefaultValue="https://localhost:3000/assets/icon-16.png"/>
|
||||
<bt:Image id="Icon.32x32" DefaultValue="https://localhost:3000/assets/icon-32.png"/>
|
||||
<bt:Image id="Icon.80x80" DefaultValue="https://localhost:3000/assets/icon-80.png"/>
|
||||
</bt:Images>
|
||||
<bt:Urls>
|
||||
<bt:Url id="Commands.Url" DefaultValue="https://localhost:3000/commands.html"/>
|
||||
<bt:Url id="Taskpane.Url" DefaultValue="https://localhost:3000/taskpane.html"/>
|
||||
</bt:Urls>
|
||||
<bt:ShortStrings>
|
||||
<bt:String id="GroupLabel" DefaultValue="OVAS (Zoek bestellingen)"/>
|
||||
<bt:String id="TaskpaneButton.Label" DefaultValue="Bestellingen zoeken"/>
|
||||
<bt:String id="ActionButton.Label" DefaultValue="Perform an action"/>
|
||||
</bt:ShortStrings>
|
||||
<bt:LongStrings>
|
||||
<bt:String id="TaskpaneButton.Tooltip" DefaultValue="Opent een paneel waar je bestellingen kan zoeken voor de des betreffende e-mail"/>
|
||||
<bt:String id="ActionButton.Tooltip" DefaultValue="Perform an action when clicked."/>
|
||||
</bt:LongStrings>
|
||||
</Resources>
|
||||
</VersionOverrides>
|
||||
</OfficeApp>
|
||||
14997
package-lock.json
generated
Normal file
64
package.json
Normal file
@@ -0,0 +1,64 @@
|
||||
{
|
||||
"name": "office-addin-taskpane-js",
|
||||
"version": "0.0.1",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/OfficeDev/Office-Addin-TaskPane-JS.git"
|
||||
},
|
||||
"license": "MIT",
|
||||
"config": {
|
||||
"app_to_debug": "outlook",
|
||||
"app_type_to_debug": "desktop",
|
||||
"dev_server_port": 3000
|
||||
},
|
||||
"scripts": {
|
||||
"build": "webpack --mode production",
|
||||
"build:dev": "webpack --mode development",
|
||||
"dev-server": "webpack serve --mode development",
|
||||
"lint": "office-addin-lint check",
|
||||
"lint:fix": "office-addin-lint fix",
|
||||
"prettier": "office-addin-lint prettier",
|
||||
"signin": "office-addin-dev-settings m365-account login",
|
||||
"signout": "office-addin-dev-settings m365-account logout",
|
||||
"start": "office-addin-debugging start manifest.xml",
|
||||
"start:desktop": "office-addin-debugging start manifest.xml desktop",
|
||||
"start:web": "office-addin-debugging start manifest.xml web",
|
||||
"stop": "office-addin-debugging stop manifest.xml",
|
||||
"validate": "office-addin-manifest validate manifest.xml",
|
||||
"watch": "webpack --mode development --watch"
|
||||
},
|
||||
"dependencies": {
|
||||
"core-js": "^3.36.0",
|
||||
"regenerator-runtime": "^0.14.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.24.0",
|
||||
"@babel/preset-env": "^7.12.11",
|
||||
"@types/office-js": "^1.0.377",
|
||||
"@types/office-runtime": "^1.0.35",
|
||||
"acorn": "^8.11.3",
|
||||
"babel-loader": "^9.1.3",
|
||||
"copy-webpack-plugin": "^12.0.2",
|
||||
"eslint-plugin-office-addins": "^3.0.2",
|
||||
"file-loader": "^6.2.0",
|
||||
"html-loader": "^5.0.0",
|
||||
"html-webpack-plugin": "^5.6.0",
|
||||
"office-addin-cli": "^1.6.3",
|
||||
"office-addin-debugging": "^5.1.4",
|
||||
"office-addin-dev-certs": "^1.13.3",
|
||||
"office-addin-lint": "^2.3.3",
|
||||
"office-addin-manifest": "^1.13.4",
|
||||
"office-addin-prettier-config": "^1.2.1",
|
||||
"os-browserify": "^0.3.0",
|
||||
"process": "^0.11.10",
|
||||
"source-map-loader": "^5.0.0",
|
||||
"webpack": "^5.90.3",
|
||||
"webpack-cli": "^5.1.4",
|
||||
"webpack-dev-server": "5.0.3"
|
||||
},
|
||||
"prettier": "office-addin-prettier-config",
|
||||
"browserslist": [
|
||||
"last 2 versions",
|
||||
"ie 11"
|
||||
]
|
||||
}
|
||||
18
src/commands/commands.html
Normal file
@@ -0,0 +1,18 @@
|
||||
<!-- Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT License. -->
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
|
||||
|
||||
<!-- Office JavaScript API -->
|
||||
<script type="text/javascript" src="https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
32
src/commands/commands.js
Normal file
@@ -0,0 +1,32 @@
|
||||
/*
|
||||
* Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
|
||||
* See LICENSE in the project root for license information.
|
||||
*/
|
||||
|
||||
/* global Office */
|
||||
|
||||
Office.onReady(() => {
|
||||
// If needed, Office.js is ready to be called.
|
||||
});
|
||||
|
||||
/**
|
||||
* Shows a notification when the add-in command is executed.
|
||||
* @param event {Office.AddinCommands.Event}
|
||||
*/
|
||||
function action(event) {
|
||||
const message = {
|
||||
type: Office.MailboxEnums.ItemNotificationMessageType.InformationalMessage,
|
||||
message: "Performed action.",
|
||||
icon: "Icon.80x80",
|
||||
persistent: true,
|
||||
};
|
||||
|
||||
// Show a notification message.
|
||||
Office.context.mailbox.item.notificationMessages.replaceAsync("action", message);
|
||||
|
||||
// Be sure to indicate when the add-in command function is complete.
|
||||
event.completed();
|
||||
}
|
||||
|
||||
// Register the function with Office.
|
||||
Office.actions.associate("action", action);
|
||||
225
src/taskpane/taskpane.css
Normal file
@@ -0,0 +1,225 @@
|
||||
*
|
||||
* Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
|
||||
* See LICENSE in the project root for license information.
|
||||
*/
|
||||
|
||||
html, body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.ms-welcome__header {
|
||||
padding: 20px;
|
||||
padding-bottom: 20px;
|
||||
padding-top: 20px;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.ms-welcome__main {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-webkit-flex-wrap: nowrap;
|
||||
flex-wrap: nowrap;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-flex: 1 0 0;
|
||||
flex: 1 0 0;
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
||||
.ms-welcome__main > h2 {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ms-welcome__features {
|
||||
list-style-type: none;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.ms-welcome__features.ms-List .ms-ListItem {
|
||||
padding-bottom: 20px;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.ms-welcome__features.ms-List .ms-ListItem > .ms-Icon {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.ms-welcome__action.ms-Button--hero {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.ms-Button.ms-Button--hero .ms-Button-label {
|
||||
color: #0078d7;
|
||||
}
|
||||
|
||||
.ms-Button.ms-Button--hero:hover .ms-Button-label,
|
||||
.ms-Button.ms-Button--hero:focus .ms-Button-label{
|
||||
color: #005a9e;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
b {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* CSS */
|
||||
.run-button {
|
||||
appearance: button;
|
||||
backface-visibility: hidden;
|
||||
background-color: #405cf5;
|
||||
border-radius: 6px;
|
||||
border-width: 0;
|
||||
box-shadow: rgba(50, 50, 93, .1) 0 0 0 1px inset,rgba(50, 50, 93, .1) 0 2px 5px 0,rgba(0, 0, 0, .07) 0 1px 1px 0;
|
||||
box-sizing: border-box;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
font-family: -apple-system,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif;
|
||||
font-size: 100%;
|
||||
height: 44px;
|
||||
line-height: 1.15;
|
||||
margin: 12px 0 0;
|
||||
outline: none;
|
||||
overflow: hidden;
|
||||
padding: 0 25px;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
text-transform: none;
|
||||
transform: translateZ(0);
|
||||
transition: all .2s,box-shadow .08s ease-in;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
touch-action: manipulation;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.run-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.run-button:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.run-button {
|
||||
box-shadow: rgba(50, 50, 93, .1) 0 0 0 1px inset, rgba(50, 50, 93, .2) 0 6px 15px 0, rgba(0, 0, 0, .1) 0 2px 2px 0, rgba(50, 151, 211, .3) 0 0 0 4px;
|
||||
}
|
||||
|
||||
/* Loading CSS for button */
|
||||
.loader {
|
||||
display: none;
|
||||
border: 4px solid rgba(255, 255, 255, 0.3);
|
||||
border-top: 4px solid blue;
|
||||
border-radius: 50%;
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
animation: spin 1s linear infinite;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.loading {
|
||||
background-color: #ccc;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/* CSS */
|
||||
.result-button {
|
||||
appearance: button;
|
||||
backface-visibility: hidden;
|
||||
background-color: #47bf67;
|
||||
border-radius: 6px;
|
||||
border-width: 0;
|
||||
box-shadow: rgba(50, 50, 93, .1) 0 0 0 1px inset,rgba(50, 50, 93, .1) 0 2px 5px 0,rgba(0, 0, 0, .07) 0 1px 1px 0;
|
||||
box-sizing: border-box;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
font-family: -apple-system,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif;
|
||||
font-size: 100%;
|
||||
height: 44px;
|
||||
line-height: 1.15;
|
||||
margin: 12px 0 0;
|
||||
outline: none;
|
||||
overflow: hidden;
|
||||
padding: 0 25px;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
text-transform: none;
|
||||
transform: translateZ(0);
|
||||
transition: all .2s,box-shadow .08s ease-in;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
touch-action: manipulation;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.result-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.result-button:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.result-button {
|
||||
box-shadow: rgba(50, 50, 93, .1) 0 0 0 1px inset, rgba(50, 50, 93, .2) 0 6px 15px 0, rgba(0, 0, 0, .1) 0 2px 2px 0, rgba(50, 151, 211, .3) 0 0 0 4px;
|
||||
}
|
||||
|
||||
/* CSS */
|
||||
.no-result-button {
|
||||
appearance: button;
|
||||
backface-visibility: hidden;
|
||||
background-color: #bf4747;
|
||||
border-radius: 6px;
|
||||
border-width: 0;
|
||||
box-shadow: rgba(50, 50, 93, .1) 0 0 0 1px inset,rgba(50, 50, 93, .1) 0 2px 5px 0,rgba(0, 0, 0, .07) 0 1px 1px 0;
|
||||
box-sizing: border-box;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
font-family: -apple-system,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Ubuntu,sans-serif;
|
||||
font-size: 100%;
|
||||
height: 44px;
|
||||
line-height: 1.15;
|
||||
margin: 12px 0 0;
|
||||
outline: none;
|
||||
overflow: hidden;
|
||||
padding: 0 25px;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
text-transform: none;
|
||||
transform: translateZ(0);
|
||||
transition: all .2s,box-shadow .08s ease-in;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
touch-action: manipulation;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.no-result-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
43
src/taskpane/taskpane.html
Normal file
@@ -0,0 +1,43 @@
|
||||
<!-- Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT License. -->
|
||||
<!-- 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. -->
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Contoso Task Pane Add-in</title>
|
||||
|
||||
<!-- Office JavaScript API -->
|
||||
<script type="text/javascript" src="https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js"></script>
|
||||
|
||||
<!-- For more information on Fluent UI, visit https://developer.microsoft.com/fluentui#/. -->
|
||||
<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/11.0.0/css/fabric.min.css"/>
|
||||
|
||||
<!-- Template styles -->
|
||||
<link href="taskpane.css" rel="stylesheet" type="text/css" />
|
||||
</head>
|
||||
|
||||
<body class="ms-font-m ms-welcome ms-Fabric">
|
||||
<header class="ms-welcome__header">
|
||||
<h1 class="ms-font-su" style="color: white;">OVAS</h1>
|
||||
</header>
|
||||
<main style="color: white;" id="app-body" class="ms-welcome__main" style="display: none;">
|
||||
<ul class="ms-List ms-welcome__features">
|
||||
<li class="ms-ListItem">
|
||||
<i class="ms-Icon ms-Icon--Ribbon ms-font-xl"></i>
|
||||
<span class="ms-font-m">Zoek bijbehorende bestellingen efficient vanuit Outlook</span>
|
||||
</li>
|
||||
</ul>
|
||||
<button class="run-button" id="run">
|
||||
<span id="btn-text">Zoek naar bestellingen</span>
|
||||
<div class="loader" id="loader"></div>
|
||||
</button>
|
||||
<p><label id="item-subject"></label></p>
|
||||
<div id="results"></div>
|
||||
</main>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
139
src/taskpane/taskpane.js
Normal file
@@ -0,0 +1,139 @@
|
||||
/*
|
||||
* Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT license.
|
||||
* See LICENSE in the project root for license information.
|
||||
*/
|
||||
|
||||
/* global document, Office */
|
||||
import axios from "axios";
|
||||
|
||||
const api_tokens = {
|
||||
dev: "kstlkkRb85jWbS424SXs6bw0rMmJDAcLrUJD05sL",
|
||||
test: "fEKxynKZrM14BqMY1c14vxUqoEdocpMol3woH6Lv",
|
||||
prod: "Uvk3eiHf2NB8ahRC1ijXp0N1YrrhZ1eakIG9gTA0",
|
||||
};
|
||||
|
||||
// axios conf
|
||||
axios.defaults.headers.common["api-key"] = api_tokens.dev;
|
||||
axios.defaults.headers.common["api-language"] = "nl";
|
||||
|
||||
const localApiUrl = "https://ozrp7bzqco.sharedwithexpose.com/api/zoek_bestelling";
|
||||
const orderUrlEdit = "http://localhost:8080/bestellingen/edit/";
|
||||
const orderUrlIndex = "http://localhost:8080/bestellingen";
|
||||
|
||||
Office.onReady((info) => {
|
||||
if (info.host === Office.HostType.Outlook) {
|
||||
document.getElementById("app-body").style.display = "flex";
|
||||
document.getElementById("run").onclick = run;
|
||||
}
|
||||
});
|
||||
|
||||
export async function run() {
|
||||
// Set load animation in button
|
||||
loadAnimation(true);
|
||||
|
||||
let searchInfo = {
|
||||
senderLastName: btoa(getLastName(Office.context.mailbox.item.sender.displayName)),
|
||||
senderInitials: btoa(getInitials(Office.context.mailbox.item.sender.displayName)),
|
||||
senderName: btoa(Office.context.mailbox.item.sender.displayName),
|
||||
senderEmail: btoa(Office.context.mailbox.item.sender.emailAddress),
|
||||
senderSubject: btoa(Office.context.mailbox.item.subject),
|
||||
postalCodes: {},
|
||||
};
|
||||
|
||||
searchInfo.postalCodes = await new Promise((resolve) => {
|
||||
Office.context.mailbox.item.body.getAsync("text", function (async) {
|
||||
resolve(getPostalCodesFromText(async.value));
|
||||
});
|
||||
});
|
||||
|
||||
// Make API call to see if we can find an order for the e-mail.
|
||||
let results;
|
||||
await search(searchInfo).then((res) => (results = res));
|
||||
|
||||
// Disable load animation in button
|
||||
loadAnimation(false);
|
||||
|
||||
// Load results via buttons
|
||||
showResults(results);
|
||||
}
|
||||
|
||||
// Animation function for loader on button
|
||||
function loadAnimation(animate) {
|
||||
const loadButton = document.getElementById("run");
|
||||
const loader = document.getElementById("loader");
|
||||
const btnText = document.getElementById("btn-text");
|
||||
|
||||
if (animate) {
|
||||
loadButton.disabled = true;
|
||||
btnText.style.display = "none";
|
||||
loader.style.display = "inline-block";
|
||||
}
|
||||
|
||||
if (!animate) {
|
||||
loadButton.disabled = false;
|
||||
loader.style.display = "none";
|
||||
btnText.style.display = "block";
|
||||
}
|
||||
}
|
||||
|
||||
// OVAS API call
|
||||
async function search(searchInfo) {
|
||||
let results = [];
|
||||
|
||||
await axios
|
||||
.get(localApiUrl, {
|
||||
params: searchInfo,
|
||||
})
|
||||
.then(function (res) {
|
||||
results = res.data.results ?? [];
|
||||
})
|
||||
.catch((err) => err);
|
||||
|
||||
return results;
|
||||
}
|
||||
|
||||
function getLastName(name) {
|
||||
const nameParts = name.trim().split(" ");
|
||||
const lastName = nameParts.slice(-1)[0]; // Pak het laatste deel als achternaam
|
||||
|
||||
return lastName;
|
||||
}
|
||||
|
||||
function getInitials(name) {
|
||||
const nameParts = name.trim().split(" ");
|
||||
const firstName = nameParts[0];
|
||||
const initials = firstName.charAt(0).toUpperCase() + ".";
|
||||
|
||||
return initials;
|
||||
}
|
||||
|
||||
function getPostalCodesFromText(emailBody) {
|
||||
const regex = /\b\d{4}\s?[A-Z]{2}\b/g;
|
||||
|
||||
return btoa(emailBody.match(regex));
|
||||
}
|
||||
|
||||
function showResults(results) {
|
||||
let resultDiv = document.getElementById("results");
|
||||
resultDiv.innerHTML = "";
|
||||
|
||||
if (results.length > 0) {
|
||||
results.forEach((result) => {
|
||||
resultDiv.innerHTML += resultsFoundButton(result.id, result.lastname);
|
||||
});
|
||||
} else {
|
||||
resultDiv.innerHTML = noResultsFoundButton();
|
||||
}
|
||||
}
|
||||
|
||||
function resultsFoundButton(id, customer) {
|
||||
return `<button type="button" target="_blank" onclick="location.href='${orderUrlEdit}${id}'" class="result-button" style="text-decoration: none;">
|
||||
<span class="btn-text" style="display: block;">Order ID: ${id} - ${customer}</span>
|
||||
</button>`;
|
||||
}
|
||||
|
||||
function noResultsFoundButton() {
|
||||
return `<button type="button" onclick="location.href='${orderUrlIndex}'" class="no-result-button" style="text-decoration: none;">
|
||||
<span class="btn-text" style="display: block;">Geen bestellingen gevonden...</span>
|
||||
</button>`;
|
||||
}
|
||||
100
webpack.config.js
Normal file
@@ -0,0 +1,100 @@
|
||||
/* eslint-disable no-undef */
|
||||
|
||||
const devCerts = require("office-addin-dev-certs");
|
||||
const CopyWebpackPlugin = require("copy-webpack-plugin");
|
||||
const HtmlWebpackPlugin = require("html-webpack-plugin");
|
||||
|
||||
const urlDev = "https://localhost:3000/";
|
||||
const urlProd = "https://www.contoso.com/"; // CHANGE THIS TO YOUR PRODUCTION DEPLOYMENT LOCATION
|
||||
|
||||
async function getHttpsOptions() {
|
||||
const httpsOptions = await devCerts.getHttpsServerOptions();
|
||||
return { ca: httpsOptions.ca, key: httpsOptions.key, cert: httpsOptions.cert };
|
||||
}
|
||||
|
||||
module.exports = async (env, options) => {
|
||||
const dev = options.mode === "development";
|
||||
const config = {
|
||||
devtool: "source-map",
|
||||
entry: {
|
||||
polyfill: ["core-js/stable", "regenerator-runtime/runtime"],
|
||||
taskpane: ["./src/taskpane/taskpane.js", "./src/taskpane/taskpane.html"],
|
||||
commands: "./src/commands/commands.js",
|
||||
},
|
||||
output: {
|
||||
clean: true,
|
||||
},
|
||||
resolve: {
|
||||
extensions: [".html", ".js"],
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.js$/,
|
||||
exclude: /node_modules/,
|
||||
use: {
|
||||
loader: "babel-loader",
|
||||
options: {
|
||||
presets: ["@babel/preset-env"],
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
test: /\.html$/,
|
||||
exclude: /node_modules/,
|
||||
use: "html-loader",
|
||||
},
|
||||
{
|
||||
test: /\.(png|jpg|jpeg|gif|ico)$/,
|
||||
type: "asset/resource",
|
||||
generator: {
|
||||
filename: "assets/[name][ext][query]",
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
plugins: [
|
||||
new HtmlWebpackPlugin({
|
||||
filename: "taskpane.html",
|
||||
template: "./src/taskpane/taskpane.html",
|
||||
chunks: ["polyfill", "taskpane"],
|
||||
}),
|
||||
new CopyWebpackPlugin({
|
||||
patterns: [
|
||||
{
|
||||
from: "assets/*",
|
||||
to: "assets/[name][ext][query]",
|
||||
},
|
||||
{
|
||||
from: "manifest*.xml",
|
||||
to: "[name]" + "[ext]",
|
||||
transform(content) {
|
||||
if (dev) {
|
||||
return content;
|
||||
} else {
|
||||
return content.toString().replace(new RegExp(urlDev, "g"), urlProd);
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
}),
|
||||
new HtmlWebpackPlugin({
|
||||
filename: "commands.html",
|
||||
template: "./src/commands/commands.html",
|
||||
chunks: ["polyfill", "commands"],
|
||||
}),
|
||||
],
|
||||
devServer: {
|
||||
headers: {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
},
|
||||
server: {
|
||||
type: "https",
|
||||
options: env.WEBPACK_BUILD || options.https !== undefined ? options.https : await getHttpsOptions(),
|
||||
},
|
||||
port: process.env.npm_package_config_dev_server_port || 3000,
|
||||
},
|
||||
};
|
||||
|
||||
return config;
|
||||
};
|
||||