Dremo

• 

  dremo app

Inspiration

A picture is worth a thousand words, and in our current position as web developers, our clients and colleagues often email us images or screenshots of their expectations or of our tasks. Keeping track of these images is difficult, as Outlook has no built in search functionality to retrieve embedded images, and we often need to resort to manually clicking through a number of emails to find the file we need.

Enter Dremo. Dremo provides the capability to quickly find the particular image or images you need at any given moment, saving you from the click-through time and time again. Less time scouring = more time productive. Search down, productivity up.

What it does

Dremo was specifically designed as an Outlook 2016 command add-in. The add-in scans your Outlook inbox for all embedded images in your emails, and displays them accessibly within our task pane. These images can then be saved, favorited, filtered, and sorted to make finding the right one a cinch. Each image can also open the associated email within Outlook. Images can also easily be saved to the cloud. Your image data is never stored outside of the Microsoft ecosystem, we find 'em , resize 'em, and stream 'em directly to your screen.

How we built it

Step 1: Start with an idea

Step 2: Keep hacking away at it

Step 3: Repeat step 2 until it works

Challenges we ran into

Most online resources are specific to either the API, add-ins, or Azure but not for synchronizing all together into one app. There was a lot of trial and error with documentation across the board, until we painstakingly discovered solutions that worked for all-in-one.

Initial authentication was fairly straightforward when utilized via the web browser. However, in order to also enable authentication in Outlook, we then needed to rework sizeable functionality to follow the popup standard.

Keeping user preferences and settings synced between our database and the results of the 0365 API.

Throttling our data calls to prevent endpoint errors, while simultaneously minimizing our app load time.

Swapping out callback hell for promises as we process the returning images.

The 0365 message id didn't sync with the EWS mail item id because of minute encoding differences, until our regex mapped the two. -- hopefully, it works!

hasAttachment = false for messages that contain in-line images, yet these images are still being returned by the attachment endpoint, without a direct reference to the containing message.

Browser compatibility issues. We found no documentation specifying the browser environments for add-ins within Outlook 2016, requiring us to jump through multiple hoops to cover all possibilities.

Accomplishments that we're proud of

Response Time: We handle numerous large image files, but our load time is trivial.

Filtering: We've extended the Outlook search and filtering features to the next level.

Security: No hackable image data is ever stored on our servers.

Backend: As mostly frontend devs in our day jobs, we were enthusiastic about building a primarily server side JavaScript project, without another team demanding callbacks of nested objects just because. --it was fun!

Database: We architected our own normalized database schema to handle queries with multiple references.

Process: We weren't even sure our initial idea was actually possible, but we built out our achievement well beyond our original vision. --dream big!

Our first commit was only 6 weeks ago!

What we learned

As in life, promises are the answer to some things, but not everything.

Socket streaming > Ajax calls

Mongo > SQL

Time is a finite beast

What's next for Dremo

Adding an ignore option for images embedded within footers or signatures.

Removing corporate-generated images, i.e. avatar images, social media links, etc.

Implementing a feature that will allow users to remove images from the add-in and prevent these from reloading.

Handle duplicate images within replies or forwards, or even separate emails.

Utilize Microsoft WebHooks to provide live inbox updates to the task pane.

Adding web workers so processing can be handled on a separate background thread.

Refactor everything: make Dremo even faster.

Built With

• javascript
• mongodb
• node.js
• scalejs