Skip to content

Commit d744e71

Browse files
samantharamonsamantharamon
authored
[Admin] main -> prod
[Admin] main -> prod
2 parents be7c5b4 + 88b7fe2 commit d744e71

File tree

7 files changed

+231
-0
lines changed

7 files changed

+231
-0
lines changed

‎playlists-prod/outlook.yaml‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -455,6 +455,17 @@
455455
group: Regex Matches
456456
api_set:
457457
Mailbox: '1.6'
458+
- id: outlook-events-drag-drop-item
459+
name: Drag and drop an item into the task pane
460+
fileName: drag-drop-item.yaml
461+
description: >-
462+
Handles the drag-and-drop event when a user drags and drops messages and
463+
file attachments into the add-in task pane.
464+
rawUrl: >-
465+
https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/outlook/80-events/drag-drop-item.yaml
466+
group: Events
467+
api_set:
468+
Mailbox: '1.5'
458469
- id: outlook-tokens-and-service-calls-ids-and-urls
459470
name: Endpoint URLs and item IDs
460471
fileName: ids-and-urls.yaml

‎playlists/outlook.yaml‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -455,6 +455,17 @@
455455
group: Regex Matches
456456
api_set:
457457
Mailbox: '1.6'
458+
- id: outlook-events-drag-drop-item
459+
name: Drag and drop an item into the task pane
460+
fileName: drag-drop-item.yaml
461+
description: >-
462+
Handles the drag-and-drop event when a user drags and drops messages and
463+
file attachments into the add-in task pane.
464+
rawUrl: >-
465+
https://raw.githubusercontent.com/OfficeDev/office-js-snippets/main/samples/outlook/80-events/drag-drop-item.yaml
466+
group: Events
467+
api_set:
468+
Mailbox: '1.5'
458469
- id: outlook-tokens-and-service-calls-ids-and-urls
459470
name: Endpoint URLs and item IDs
460471
fileName: ids-and-urls.yaml

‎samples/outlook/80-events/drag-drop-item.yaml‎

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
id: outlook-events-drag-drop-item
2+
name: Drag and drop an item into the task pane
3+
description: Handles the drag-and-drop event when a user drags and drops messages and file attachments into the add-in task pane.
4+
host: OUTLOOK
5+
api_set:
6+
Mailbox: '1.5'
7+
script:
8+
content: |
9+
Office.onReady(() => {
10+
dragAndDropEventHandler(event);
11+
});
12+
13+
function dragAndDropEventHandler(event) {
14+
Office.context.mailbox.addHandlerAsync(Office.EventType.DragAndDropEvent, (event) => {
15+
console.log(`Event type: ${event.type}`);
16+
17+
const eventData = event.dragAndDropEventData;
18+
console.log(`x-coordinate: ${eventData.pageX}, y-coordinate: ${eventData.pageY}`);
19+
20+
if (eventData.type == "drop") {
21+
console.log("Items dropped into task pane.");
22+
const files = eventData.dataTransfer.files;
23+
files.forEach((file) => {
24+
const content = file.fileContent;
25+
const name = file.name;
26+
const fileType = file.type;
27+
console.log(`File name: ${name}`);
28+
console.log(`File type: ${fileType}`);
29+
console.log(`Contents: ${content.text().then((text) => { console.log(text); })}`);
30+
});
31+
}
32+
});
33+
}
34+
language: typescript
35+
template:
36+
content: |-
37+
<section class="ms-Fabric ms-font-m">
38+
<p class="ms-font-m">Drag and drop messages and file attachments into the add-in task pane.</p>
39+
<p>To learn more about the drag-and-drop feature, see <a
40+
href="https://learn.microsoft.com/office/dev/add-ins/outlook/drag-drop-items">Drag and drop messages and
41+
attachments into the task pane of an Outlook add-in</a>.</p>
42+
<p><b>Required mode</b>: Compose or Read</p>
43+
<p><b>Supported Outlook clients</b>: Outlook on the web and the new Outlook on Windows</p>
44+
</section>
45+
<section class="ms-Fabric samples ms-font-m">
46+
<h3>Try it out</h3>
47+
<ol>
48+
<li>Drag a message or file attachment from your mailbox to the task pane. As you drag the item across the task pane, the event name and the coordinates of your mouse pointer are displayed in the console.</li>
49+
<li>Drop the message or file attachment into the task pane. The properties
50+
of the dropped item are displayed in the console.</li>
51+
</ol>
52+
</section>
53+
language: html
54+
style:
55+
content: |-
56+
section.samples {
57+
margin-top: 20px;
58+
}
59+
60+
section.samples .ms-Button, section.setup .ms-Button {
61+
display: block;
62+
margin-bottom: 5px;
63+
margin-left: 20px;
64+
min-width: 80px;
65+
}
66+
language: css
67+
libraries: |-
68+
https://appsforoffice.microsoft.com/lib/1/hosted/office.js
69+
https://appsforoffice.microsoft.com/lib/1/hosted/office.d.ts
70+
71+
https://unpkg.com/[email protected]/dist/css/fabric.min.css
72+
https://unpkg.com/[email protected]/dist/css/fabric.components.min.css

‎snippet-extractor-metadata/outlook.xlsx‎

369 Bytes
Binary file not shown.

‎snippet-extractor-output/snippets.yaml‎

Lines changed: 135 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11153,6 +11153,141 @@ Office.DisplayedSubject#setAsync:member(2):
1115311153

1115411154
console.log("Temporarily set the content displayed in the subject field.");
1115511155
});
11156+
Office.DragAndDropEventArgs:interface:
11157+
- >-
11158+
// Link to full sample:
11159+
https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/outlook/80-events/drag-drop-item.yaml
11160+
11161+
11162+
function dragAndDropEventHandler(event) {
11163+
Office.context.mailbox.addHandlerAsync(Office.EventType.DragAndDropEvent, (event) => {
11164+
console.log(`Event type: ${event.type}`);
11165+
11166+
const eventData = event.dragAndDropEventData;
11167+
console.log(`x-coordinate: ${eventData.pageX}, y-coordinate: ${eventData.pageY}`);
11168+
11169+
if (eventData.type == "drop") {
11170+
console.log("Items dropped into task pane.");
11171+
const files = eventData.dataTransfer.files;
11172+
files.forEach((file) => {
11173+
const content = file.fileContent;
11174+
const name = file.name;
11175+
const fileType = file.type;
11176+
console.log(`File name: ${name}`);
11177+
console.log(`File type: ${fileType}`);
11178+
console.log(`Contents: ${content.text().then((text) => { console.log(text); })}`);
11179+
});
11180+
}
11181+
});
11182+
}
11183+
Office.DragoverEventData:interface:
11184+
- >-
11185+
// Link to full sample:
11186+
https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/outlook/80-events/drag-drop-item.yaml
11187+
11188+
11189+
function dragAndDropEventHandler(event) {
11190+
Office.context.mailbox.addHandlerAsync(Office.EventType.DragAndDropEvent, (event) => {
11191+
console.log(`Event type: ${event.type}`);
11192+
11193+
const eventData = event.dragAndDropEventData;
11194+
console.log(`x-coordinate: ${eventData.pageX}, y-coordinate: ${eventData.pageY}`);
11195+
11196+
if (eventData.type == "drop") {
11197+
console.log("Items dropped into task pane.");
11198+
const files = eventData.dataTransfer.files;
11199+
files.forEach((file) => {
11200+
const content = file.fileContent;
11201+
const name = file.name;
11202+
const fileType = file.type;
11203+
console.log(`File name: ${name}`);
11204+
console.log(`File type: ${fileType}`);
11205+
console.log(`Contents: ${content.text().then((text) => { console.log(text); })}`);
11206+
});
11207+
}
11208+
});
11209+
}
11210+
Office.DropEventData:interface:
11211+
- >-
11212+
// Link to full sample:
11213+
https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/outlook/80-events/drag-drop-item.yaml
11214+
11215+
11216+
function dragAndDropEventHandler(event) {
11217+
Office.context.mailbox.addHandlerAsync(Office.EventType.DragAndDropEvent, (event) => {
11218+
console.log(`Event type: ${event.type}`);
11219+
11220+
const eventData = event.dragAndDropEventData;
11221+
console.log(`x-coordinate: ${eventData.pageX}, y-coordinate: ${eventData.pageY}`);
11222+
11223+
if (eventData.type == "drop") {
11224+
console.log("Items dropped into task pane.");
11225+
const files = eventData.dataTransfer.files;
11226+
files.forEach((file) => {
11227+
const content = file.fileContent;
11228+
const name = file.name;
11229+
const fileType = file.type;
11230+
console.log(`File name: ${name}`);
11231+
console.log(`File type: ${fileType}`);
11232+
console.log(`Contents: ${content.text().then((text) => { console.log(text); })}`);
11233+
});
11234+
}
11235+
});
11236+
}
11237+
Office.DroppedItems:interface:
11238+
- >-
11239+
// Link to full sample:
11240+
https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/outlook/80-events/drag-drop-item.yaml
11241+
11242+
11243+
function dragAndDropEventHandler(event) {
11244+
Office.context.mailbox.addHandlerAsync(Office.EventType.DragAndDropEvent, (event) => {
11245+
console.log(`Event type: ${event.type}`);
11246+
11247+
const eventData = event.dragAndDropEventData;
11248+
console.log(`x-coordinate: ${eventData.pageX}, y-coordinate: ${eventData.pageY}`);
11249+
11250+
if (eventData.type == "drop") {
11251+
console.log("Items dropped into task pane.");
11252+
const files = eventData.dataTransfer.files;
11253+
files.forEach((file) => {
11254+
const content = file.fileContent;
11255+
const name = file.name;
11256+
const fileType = file.type;
11257+
console.log(`File name: ${name}`);
11258+
console.log(`File type: ${fileType}`);
11259+
console.log(`Contents: ${content.text().then((text) => { console.log(text); })}`);
11260+
});
11261+
}
11262+
});
11263+
}
11264+
Office.DroppedItemDetails:interface:
11265+
- >-
11266+
// Link to full sample:
11267+
https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/outlook/80-events/drag-drop-item.yaml
11268+
11269+
11270+
function dragAndDropEventHandler(event) {
11271+
Office.context.mailbox.addHandlerAsync(Office.EventType.DragAndDropEvent, (event) => {
11272+
console.log(`Event type: ${event.type}`);
11273+
11274+
const eventData = event.dragAndDropEventData;
11275+
console.log(`x-coordinate: ${eventData.pageX}, y-coordinate: ${eventData.pageY}`);
11276+
11277+
if (eventData.type == "drop") {
11278+
console.log("Items dropped into task pane.");
11279+
const files = eventData.dataTransfer.files;
11280+
files.forEach((file) => {
11281+
const content = file.fileContent;
11282+
const name = file.name;
11283+
const fileType = file.type;
11284+
console.log(`File name: ${name}`);
11285+
console.log(`File type: ${fileType}`);
11286+
console.log(`Contents: ${content.text().then((text) => { console.log(text); })}`);
11287+
});
11288+
}
11289+
});
11290+
}
1115611291
Office.EnhancedLocation#addAsync:member(1):
1115711292
- >-
1115811293
// Link to full sample:

‎view-prod/outlook.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@
4747
"outlook-mime-headers-get-internet-headers-message-read": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/outlook/70-mime-headers/get-internet-headers-message-read.yaml",
4848
"outlook-mime-headers-manage-custom-internet-headers-message-compose": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/outlook/70-mime-headers/manage-custom-internet-headers-message-compose.yaml",
4949
"outlook-regex-matches-contextual": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/outlook/75-regex-matches/contextual.yaml",
50+
"outlook-events-drag-drop-item": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/outlook/80-events/drag-drop-item.yaml",
5051
"outlook-tokens-and-service-calls-ids-and-urls": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/outlook/85-tokens-and-service-calls/ids-and-urls.yaml",
5152
"outlook-tokens-and-service-calls-user-identity-token": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/outlook/85-tokens-and-service-calls/user-identity-token.yaml",
5253
"outlook-tokens-and-service-calls-user-callback-token": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/prod/samples/outlook/85-tokens-and-service-calls/user-callback-token.yaml",

‎view/outlook.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@
4747
"outlook-mime-headers-get-internet-headers-message-read": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/main/samples/outlook/70-mime-headers/get-internet-headers-message-read.yaml",
4848
"outlook-mime-headers-manage-custom-internet-headers-message-compose": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/main/samples/outlook/70-mime-headers/manage-custom-internet-headers-message-compose.yaml",
4949
"outlook-regex-matches-contextual": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/main/samples/outlook/75-regex-matches/contextual.yaml",
50+
"outlook-events-drag-drop-item": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/main/samples/outlook/80-events/drag-drop-item.yaml",
5051
"outlook-tokens-and-service-calls-ids-and-urls": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/main/samples/outlook/85-tokens-and-service-calls/ids-and-urls.yaml",
5152
"outlook-tokens-and-service-calls-user-identity-token": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/main/samples/outlook/85-tokens-and-service-calls/user-identity-token.yaml",
5253
"outlook-tokens-and-service-calls-user-callback-token": "https://raw.githubusercontent.com/OfficeDev/office-js-snippets/main/samples/outlook/85-tokens-and-service-calls/user-callback-token.yaml",

0 commit comments

Comments
 (0)