Category: office.js

Determine MIME type from base64

David E. Craig1 Comment

In writing my new Outlook Add-in (Send to Trello), I got stuck on attachments. The first version did not include an attachments option because of two unique problems that compounded each other:

  1. The Office Add-in API no longer provides a Media Type/MIME Type with an attachment request. I am able to get the “blob()” from Office, but other than the file extension there is not a way to determine the type. But sometimes a file does not have an extension, or the extension is wrong, etc.
  2. The Trello API will not let you upload without supplying a MIME type, you cannot just give it a Base64 string as an attachment and let them figure it out.

So, I found out something interesting while researching a workaround. Most every base64 string of a specific file type starts with the same “prolog” of text. Using this, combined with the fallback of the file extensions, I was able to get attachments to work (for the attachment types supported by Trello). So, v1.02 will now include attachments.

Anway, as for the workaround I found, this might be ugly, but wanted to share it anyway:

/**
* Returns the data type based on the base64 string
* @param {String} base64String
* @param {String} fileName
* @returns {String}
*/
detectMimeType(base64String, fileName) {
var ext = fileName.substring(fileName.lastIndexOf(".") + 1);
if (ext === undefined || ext === null || ext === "") ext = "bin";
ext = ext.toLowerCase();
const signatures = {
JVBERi0: "application/pdf",
R0lGODdh: "image/gif",
R0lGODlh: "image/gif",
iVBORw0KGgo: "image/png",
TU0AK: "image/tiff",
"/9j/": "image/jpg",
UEs: "application/vnd.openxmlformats-officedocument.",
PK: "application/zip",
};
for (var s in signatures) {
if (base64String.indexOf(s) === 0) {
var x = signatures[s];
// if an office file format
if (ext.length > 3 && ext.substring(0, 3) === "ppt") {
x += "presentationml.presentation";
} else if (ext.length > 3 && ext.substring(0, 3) === "xls") {
x += "spreadsheetml.sheet";
} else if (ext.length > 3 && ext.substring(0, 3) === "doc") {
x += "wordprocessingml.document";
}
// return
return x;
}
}
// if we are here we can only go off the extensions
const extensions = {
xls: "application/vnd.ms-excel",
ppt: "application/vnd.ms-powerpoint",
doc: "application/msword",
xml: "text/xml",
mpeg: "audio/mpeg",
mpg: "audio/mpeg",
txt: "text/plain",
};
for (var e in extensions) {
if (ext.indexOf(e) === 0) {
var xx = extensions[e];
return xx;
}
}
// if we are here – not sure what type this is
return "unknown";
}
view raw detectMimeType.js hosted with ❤ by GitHub

New Outlook Add-in: Send to Trello

David E. CraigLeave a comment

I have been using Trello for a while now and one of the features I have found most useful is to take an email I received and turn it into a Kanban item on my backlog to address later. This allows me to archive the email but keeps it on my “Trello radar” as I work at my own pace through my personal backlog.

Recently, Trello removed their add-in from the Microsoft Office store. If you have the add-in installed, you will see this error:

Well, since they say necessity is the mother of all invention and I really had to fill the gap as it is part of my routine, I rolled my own. 🤓 To add a degree of difficulty, I wrote this in VS Code in Linux running in Windows Subsystem for Linux (WSL). See my previous post. It was a fun exercise as I am on vacation and using the time tom learn new things, engage in self-improvement and relax (coding is relaxing to me 🤓🤓🤓). In the end, I learned something and created something for everyone to enjoy.

Say hello to the recently published: Send to Trello Outlook Add-in.

Give it a try and let me know what you think.

Developing in Linux on Windows

David E. Craig1 Comment

I have been working more and more with Linux lately. The job as a Program Manager has put some of my skills to the test. Oddly, I actually taught a semester of Linux back in my “college professor days.” And despite the kicking and screaming, funny enough, I am close to becoming a novice beginner at it.

Last year, I took the deep dive, spending nearly 100% of my personal time in Linux – command line and UI wise. I had an Ubuntu VM in the cloud that I worked with and repurposed on one of my old laptops with a distro of Elementary OS (essentially a MacOS like shell on top of Ubuntu).

Well, recently, I have been playing about with the Windows Subsystem for Linux. In the early days this was what I called a novelty. You could open a command prompt and start bashing out Linux commands and feeling totally geeky 🤓. However, recently, I found that you can now run Linux Applications in a window from Windows 11. This was a bit of a game changer, as now I can run Linux and Windows (side-by-side).

So, I just got through developing and testing an Office JS add-in (which I just published to the store) from Linux using VS Code and Microsoft Edge. It will hopefully be released soon, and I will blog it here (Send to Trello for Outlook Add-in).

Here is how I did it:

  1. First, I would suggest installing Windows Terminal. I can spend a whole blog post on this and might, but it allows you to run CMD, PowerShell and BASH all side by side in tabs. It is awesome.
  2. Open Terminal and install WSL. From a PowerShell tab type “wsl –install”. By default, this will put Ubuntu 20 (behind the scenes) on your system.
  3. Once installed and you restart the Windows Terminal App, you should see Ubuntu as an option for opening a new Tab.
  4. Select that. If it is your first time, you will need to supply it with a username and password.
  5. Once setup, you simply need to start installing apps:
    • Type: “sudo apt update” to start updating the apps, this is like “Windows Update” for Linux.
    • Next, type: “sudo apt install x11-apps -y” to get the basic software installed.
    • Next, you will want to install Microsoft Edge:
      • To install Edge use the code from this page: https://www.microsoftedgeinsider.com/en-us/download?platform=linux-deb (scroll down past the ‘download’ links).
      • Before you run it, you will want to type: “sudo su” and sign in. This signs you in as SUPER USER so that you can do things as an administrator.
      • After it is installed type “exit” to return to normal user mode.
    • Finally, install VS Code, like this: in the Terminal Window, type: “microsoft-edge” which will open Edge. From there go to Bing, search for “install VSCode on Linux” and it should not be too difficult to follow the steps you find. But to help out a bit… 😊 Follow the steps for Ubuntu, here: https://code.visualstudio.com/docs/setup/linux.
  6. Now you can type “code” in the Linux command prompt and VSCode for Linux will open in a separate window. From there you can build your application and test it in Edge for Linux as well. That is what I did.

The coup-de-grace, it places these applications right on your START menu:

So, a friend asked me…”Uh, so.. like.. why?” I answered, “Uh… Because, I can!” 🤓

It has been a fun journey, learning something new and as it turns out, it has come in handy quite a few times in the new role as different aspects of the system we are developing cross paths with Linux. I also have a sneaky suspicion that this Windows/Linux integration lines are going to get a bit more “blurred” in the coming years (100% personal opinion).

Published: Trello Taskpane for Word

David E. CraigLeave a comment

I have done it! I have published my very first Office Web Add-in to the Microsoft Store. After years and years of blogging about it, I wrote an add-in for something I needed. It is true that necessity is the mother of all invention.

The add-in is called the Trello Taskpane for Word. It is a simple add-in that connects Word to your Trello boards, so that you can insert information you have collected in Trello into your documents. I do research on the web for various topics and send snippets and pages to Trello cards where I organize and refine them. Then I found myself copy/pasting the information from Trello into Word getting lost on the task switching. Now, I can remain in Word, select the cards I want, and insert them without ever leaving Word. How’s that!

It was also a fun exercise for me to combine the two types of extensions I have found to enjoy writing (Office and Trello). More importantly, it is a useful tool that I think might benefit other writers that use Trello, or writers looking for a new way to keep their notecards and thoughts in a more digital, accessible from anywhere type of format.

Have fun and let me know what you think!

5entences Add-in Released

David E. CraigLeave a comment

I have been spending some of my free time writing add-ins for Office and Power-Ups for Trello. I just completed two add-ins for Office. One is going through the process with AppSource and I will blog about it soon enough. The other cannot go though AppSource because it uses the Block On Send interface for Outlook. The add-in I just release is the 5entences Add-in for Outlook.

I have been inspired by various books I have read that all cross-pollinate the idea that we use e-mail all wrong or too much. Cal Newport’s “A World without Email” and Tim Ferris’ “4 Hour Workweek” are just two examples. And I believe it was Tim’s book that first touched on brevity in email. And thus, this website was born: five.sentenc.es.

From those books, and website, I had an idea. Why not add “training wheels” to the idea of email brevity? So, I wrote the 5entences Add-in for Outlook as a simple to use add-in that tries to help you keep your email responses brief and to the point.

It has been a fun side project as I was delving deeper into writing React code and using prebuilt React controls, so I wanted to share it with everyone. Maybe we can make email fun again.

Disabling your Web Add-in if you have an Equivalent COM/VSTO Add-in

David E. Craig3 Comments

In previous post, I described how you can add code to your VSTO/COM add-in to disable your Web Add-in loaded from maniferst via the Office Portal:
Removing Web Add-in Ribbon Customization in Outlook for Windows (theofficecontext.com)

Well with Outlook for Windows, Office 365, version 16.0.13728.36136, you can now disable your Web Add-in via Policy settings.

Download Administrative Template files (ADMX/ADML) and Office Customization Tool for Microsoft 365 Apps for enterprise, Office 2019, and Office 2016 from Official Microsoft Download Center

Here is the path in the policy editor for this setting:

Once in the policy editor, you would set the value. If your OfficeJS Web Add-in has a GUID of {c5bc7737-0d79-4302-9e73-2a614941e914} and the COM add-in is called “My Full Featured Outlook Add-in“, you would set the values like this:

Specifically, the registry key it puts in place is this:

PATH: HKCU\SOFTWARE\Policies\Microsoft\Office\16.0\Outlook\addins\equivalentcomaddin
KEY (string/REG_SZ): {OfficeJS GUID}
VALUE: Prog.ID

For example, if I have an Outlook Web Add-in called “My Outlook Add-in” and it has the following manifest entry:

<?xml version="1.0" encoding="UTF-8"?>
<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>c5bc7737-0d79-4302-9e73-2a614941e914</Id>

Let’s say I have a full VSTO add-in called “My Full Featured Outlook Add-in” and it is registered as the following:

If you were to look at the Policy key after it is set you would have an entry like this:

KEY: {c5bc7737-0d79-4302-9e73-2a614941e914}
VALUE: My Full Featured Outlook Add-in

If it were an older traditional COM Add-in, like the top item: AccessAddin.DC, then it would look like this:

KEY: {c5bc7737-0d79-4302-9e73-2a614941e914}
VALUE: AccessAddin.DC

That is all you have to do if you have the newest builds of Outlook for Windows. 

NOTE: Coming later in the year, will be an option to add this entry to your Web Add-in Manifest file the way you can with Excel and Word. 
NOTE: This is all covered in the latest Office add-ins community call.

easyEws Updated to 1.0.20

David E. Craig2 Comments

This was more than a patch this time. It was a minor update to two functions:

  • sendMailItem
  • sendPlainTextEmailWithAttachment

There was an issue reported (#12) where the sendMailItem function was not working in IE11. This was because it was created to take an inline object (ES6). Well on IE11 (which only supports ES5), it broke.

So, I fixed sendMailItem to support ES5 and also took the opportunity to add two often requested features of this function:

  • It will now allow you to submit HTML body content or Text. It will also parse the HTML for you if you submit it as is.
  • It will also now allow you to send both file attachment (new), and mail item attachments (original).

Please see the documentation for more information on the updates to this function: https://github.com/davecra/easyEWS#sendMailItem

Also I updated the sendPlainTextEmailWithAttachment function. Under the covers this uses the sendMailItem function. So I had to update it to use the new format so it would work as well. There was no change to it’s features/functionality however.

I did not get to the last item I have had requests for:

  • ability to specify recipients as To/CC/BCC. I will update this at some future date. Also, please let me know if you would like to see this.

Overall, the goal is to have the sendMailItem() function be a full multi-purpose function at some point. It is almost there, but please keep the suggestions coming.

easyEws v1.0.19 Released

David E. CraigLeave a comment

There were a couple small bug fixes in the splitGroupsRecursivelyAsync() function. Thank you to Jack for making me aware of the issue as it has now been corrected.

The CDN to the latest versioned instance of the library:

https://cdn.jsdelivr.net/npm/easyews/easyEws1.0.19.js

Here is a link to my GitHub:

https://github.com/davecra/easyEWS

And it is also able to be installed from NPM with the command:

npm install easyews

OfficeJS: Get the current user’s Username

David E. CraigLeave a comment

While working on a customers proof of concept, we determined that we needed to know who the current user opening the add-in is. In most scenarios where there is a Store Add-in, you have the user log in. But we are in a enterprise environment, have an embedded taskpane and did not want to nag the user every single time they opened the document.

Outside of the BETA API set, there actually is not a way to do this in Word, Excel and PowerPoint. In the current BETA API (soon to be released), is the new Single sign-on (SSO) API. Detailed here:

https://docs.microsoft.com/en-us/office/dev/add-ins/develop/sso-in-office-add-ins

I know, I know… you do not want to have to have the user sign-on and neither did we. But actually you do not need to. You make a call to getAccessToken() – after you have gone through the rather complex process of setting up your application in Azure AD – and in the returned token is the user information. Here is all you need for code to get to the username:

export async function getUserName() {
try {
let tokenData = await OfficeRuntime.auth.getAccessToken({ allowSignInPrompt: false, forMSGraphAccess: true });
var parts = tokenData.split(".");
var token = JSON.parse(atob(parts[1]));
return token.preferred_username;
}
catch (exception) {
console.log(exception.message);
}
}
view raw getUsername.js hosted with ❤ by GitHub