Giter Club home page Giter Club logo

angular2-o365-desktop-app's Introduction

angular2-O365-desktop-app

Desktop application using Electron, Angular 2, Material Design Lite and Office 365 (Microsoft Graph API).

Application Demo

Getting started

Install dependencies

npm install

To build and watch for changes

npm run watch

Run application

npm start

Debug Electron using Devtron

`

// Run the following from the Console tab of your app's DevTools

require('devtron').install()

// You should now see a Devtron tab added to the DevTools `

Azure AD application Registration

Register this application in the Azure Active Directory service for your Office 365 tenant. Easy to use online tool: Office 365 App Registration Tool

  • App Registration Type: Native Application
  • Redirect URI: http://localhost/callback
  • Select all read items for Users, Groups, Mail, Calendar, Contacts and Files.
  • Register the app and remember to copy your client ID provided to you.
  • Update the azure-config.ts file with your values.

Application Registration

Once your app is registered you need to download the app manifest file from Azure Portal Set "oauth2AllowImplicitFlow": true in application manifest file and upload the manifest file again.

Azure AD Application Permission requirements

You need to make sure the application permission is set correctly to have access to the Microsoft Graph resource. This can be done in the Azure Portal.

Required Permissions

  • Read all notebooks that the user can access
  • Access user's data anytime
  • Read items in all site collections
  • Read files that the user selects
  • Read user files and files shared with user
  • Read user contacts
  • Read user calendars
  • Read user mail
  • Read directory data
  • Read all groups
  • Read all users' full profiles
  • Read all users' basic profiles
  • Sign in and read user profile
  • Read user notebooks
  • Read users' relevant people list

Go to Microsoft Graph API if you want to know more.

Application Build & Deployment

Follow Electron documentation for build for Windows, Linux and OSX.

To package files for deployment:

  • npm install -g asar
  • asar pack angular2-O365-desktop-app app.asar

TODO Packaging: https://www.xplatform.rocks/2016/02/14/angular2-and-electron-the-definitive-guide/

** More details to follow **

Resources

If you have any issues or suggestion please submit on GitHub Issues.

angular2-o365-desktop-app's People

Contributors

cecildt avatar greenkeeperio-bot avatar

Stargazers

avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar

Watchers

avatar avatar avatar avatar avatar avatar avatar

Forkers

mrwinston vevedh gabriel0402 jonathanmkaplan digideskio r4hulp mike-morr thomasderzweifler intellibrain tdangschulz yusonkong narunbabu musantana1 ultimatezen duyquoc sudhirnakka xiniware guojingsong malotur

angular2-o365-desktop-app's Issues

Steps not working

I downloaded the app, did npm install, modified my app ID in azure-config.ts and my tenant name, when i run npm start, i get only this:

image

and terminal looks like this:

image

My azure-config.ts looks like this:

image

Can you also mention the details for downloading the app manifest and setting the oauth2AllowImplicitFlow as well as the permissions step probably the UI has changed so that's why it's hard to follow, but the steps you provided are high level and not detailed/hard to follow, can you provide us with more details please?

Problems building latest master 062cc56

on running "npm run watch":

ERROR in ./src/authHelper/authHelper.ts
(3,29): error TS2307: Cannot find module '../adal/adal-config'.

on running "npm run tsc":

[email protected] tsc D:\Demos\e\o365
tsc

src/authHelper/authHelper.ts(3,29): error TS2307: Cannot find module '../adal/adal-config'.

So the same error - however, a .js file is available in /src/adal/. Typo in authHelper.ts?

Not loading at all

I followed the steps outlined in the readme - on "npm run electron" the frame loads, but nothing else.

I got the following warnings on npm install:

λ npm install
npm WARN [email protected] requires a peer of [email protected] but none was installed.
npm WARN [email protected] requires a peer of [email protected] but none was installed.

But also on the TypeScript pass:

λ npm install -g typescript
`-- [email protected]

D:\Demos\e\o365 ([email protected])
λ npm run tsc

[email protected] tsc D:\Demos\e\o365
tsc -w

app/authHelper/authHelper.ts(1,16): error TS2304: Cannot find name 'require'.
app/authHelper/authHelper.ts(30,50): error TS2304: Cannot find name 'Promise'.
app/authHelper/authHelper.ts(31,21): error TS2304: Cannot find name 'Promise'.
app/authHelper/authHelper.ts(49,55): error TS2304: Cannot find name 'Promise'.
app/authHelper/authHelper.ts(50,21): error TS2304: Cannot find name 'Promise'.
app/authHelper/authHelper.ts(116,48): error TS2304: Cannot find name 'Promise'.
app/authHelper/authHelper.ts(117,21): error TS2304: Cannot find name 'Promise'.
app/authHelper/authHelper.ts(142,33): error TS2351: Cannot use 'new' with an expression whose type lacks a call or construct signature.
app/authHelper/authHelper.ts(189,33): error TS2351: Cannot use 'new' with an expression whose type lacks a call or construct signature.
app/login/login.ts(1,21): error TS2305: Module '"D:/Demos/e/o365/node_modules/angular2/core"' has no exported member 'View'.
node_modules/angular2/platform/browser.d.ts(78,90): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/core/application_ref.d.ts(38,88): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/core/application_ref.d.ts(92,42): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/core/application_ref.d.ts(151,33): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/core/change_detection/differs/default_keyvalue_differ.d.ts(23,15): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/core/change_detection/differs/default_keyvalue_differ.d.ts(25,16): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/core/di/reflective_provider.d.ts(103,123): error TS2304: Cannot find name 'Map'.

node_modules/angular2/src/core/di/reflective_provider.d.ts(103,165): error TS2304: Cannot find name 'Map'.

node_modules/angular2/src/core/linker/component_resolver.d.ts(8,53): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/core/linker/component_resolver.d.ts(12,44): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/core/linker/dynamic_component_loader.d.ts(59,148): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/core/linker/dynamic_component_loader.d.ts(100,144): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/core/linker/dynamic_component_loader.d.ts(105,139): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/core/linker/dynamic_component_loader.d.ts(106,135): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/facade/async.d.ts(27,33): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/facade/async.d.ts(28,45): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/facade/collection.d.ts(1,25): error TS2304: Cannot find name 'MapConstructor'.
node_modules/angular2/src/facade/collection.d.ts(2,25): error TS2304: Cannot find name 'SetConstructor'.
node_modules/angular2/src/facade/collection.d.ts(4,27): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/facade/collection.d.ts(4,39): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/facade/collection.d.ts(7,9): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/facade/collection.d.ts(8,30): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/facade/collection.d.ts(11,43): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/facade/collection.d.ts(12,27): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/facade/collection.d.ts(14,23): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/facade/collection.d.ts(15,25): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/facade/collection.d.ts(100,41): error TS2304: Cannot find name 'Set'.
node_modules/angular2/src/facade/collection.d.ts(101,22): error TS2304: Cannot find name 'Set'.
node_modules/angular2/src/facade/collection.d.ts(102,25): error TS2304: Cannot find name 'Set'.
node_modules/angular2/src/facade/lang.d.ts(4,17): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/facade/lang.d.ts(5,17): error TS2304: Cannot find name 'Set'.
node_modules/angular2/src/facade/lang.d.ts(71,59): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/facade/promise.d.ts(2,14): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/facade/promise.d.ts(8,32): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/facade/promise.d.ts(9,38): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/facade/promise.d.ts(10,35): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/facade/promise.d.ts(10,93): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/facade/promise.d.ts(11,34): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/facade/promise.d.ts(11,50): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/facade/promise.d.ts(12,32): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/facade/promise.d.ts(12,149): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/facade/promise.d.ts(13,43): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/http/headers.d.ts(43,59): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/http/url_search_params.d.ts(11,16): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/platform/browser/browser_adapter.d.ts(75,33): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/platform/dom/dom_adapter.d.ts(85,42): error TS2304: Cannot find name 'Map'.
node_modules/angular2/src/router/directives/router_outlet.d.ts(27,54): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/directives/router_outlet.d.ts(33,51): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/directives/router_outlet.d.ts(38,56): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/directives/router_outlet.d.ts(47,65): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/directives/router_outlet.d.ts(58,60): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/instruction.d.ts(124,34): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/instruction.d.ts(148,25): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/instruction.d.ts(164,34): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/instruction.d.ts(167,25): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/interfaces.d.ts(21,107): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/interfaces.d.ts(39,104): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/interfaces.d.ts(57,109): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/interfaces.d.ts(80,109): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/interfaces.d.ts(102,114): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/lifecycle/lifecycle_annotations.d.ts(29,100): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/route_config/route_config_impl.d.ts(101,19): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/route_definition.d.ts(20,20): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/route_definition.d.ts(35,20): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/route_registry.d.ts(52,66): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/router.d.ts(56,50): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/router.d.ts(68,46): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/router.d.ts(86,45): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/router.d.ts(99,34): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/router.d.ts(107,64): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/router.d.ts(112,85): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/router.d.ts(120,70): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/router.d.ts(128,43): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/router.d.ts(132,29): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/router.d.ts(138,19): error TS2304: Cannot find name 'Promise'.
node_modules/angular2/src/router/router.d.ts(146,70): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/Observable.d.ts(10,66): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/Observable.d.ts(66,60): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/Observable.d.ts(66,70): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/observable/PromiseObservable.d.ts(40,31): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/observable/PromiseObservable.d.ts(41,26): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/operator/toPromise.d.ts(7,59): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/operator/toPromise.d.ts(7,69): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/operator/toPromise.d.ts(9,9): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/operator/toPromise.d.ts(10,26): error TS2304: Cannot find name 'Promise'.
node_modules/rxjs/operator/toPromise.d.ts(10,36): error TS2304: Cannot find name 'Promise'.
app/assets/github-electron.d.ts(23,35): error TS2304: Cannot find name 'Buffer'.
app/assets/github-electron.d.ts(31,12): error TS2304: Cannot find name 'Buffer'.
app/assets/github-electron.d.ts(35,28): error TS2304: Cannot find name 'Buffer'.
app/assets/github-electron.d.ts(65,26): error TS2503: Cannot find namespace 'NodeJS'.
app/assets/github-electron.d.ts(103,33): error TS2503: Cannot find namespace 'NodeJS'.
app/assets/github-electron.d.ts(376,37): error TS2304: Cannot find name 'Buffer'.
app/assets/github-electron.d.ts(517,31): error TS2503: Cannot find namespace 'NodeJS'.
app/assets/github-electron.d.ts(719,34): error TS2304: Cannot find name 'Buffer'.
app/assets/github-electron.d.ts(925,23): error TS2503: Cannot find namespace 'NodeJS'.
app/assets/github-electron.d.ts(1117,31): error TS2503: Cannot find namespace 'NodeJS'.
app/assets/github-electron.d.ts(1227,24): error TS2503: Cannot find namespace 'NodeJS'.
app/assets/github-electron.d.ts(1421,38): error TS2503: Cannot find namespace 'NodeJS'.
app/assets/github-electron.d.ts(1682,11): error TS2304: Cannot find name 'Buffer'.
app/assets/github-electron.d.ts(1713,12): error TS2503: Cannot find namespace 'NodeJS'.
app/assets/github-electron.d.ts(1716,17): error TS2503: Cannot find namespace 'NodeJS'.
app/assets/github-electron.d.ts(1743,2): error TS2382: Specialized overload signature is not assignable to any non-specialized signature.
app/boot/boot.ts(3,28): error TS2305: Module '"D:/Demos/e/o365/node_modules/angular2/router"' has no exported member 'APP_BASE_HREF'.
10:47:45 AM - Compilation complete. Watching for file changes.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.