Office 365 OneDrive Offline Cache Size Problem

/33 Comments/in /by

Office 365 offers 1TB of OneDrive storage to their subscribers for a fairly small fee and according to the rumors soon to be unlimited space. Excellent for backing up your family photos and videos, right? No!

So what’s the problem?

Even if we overlook the fact that the business version of OneDrive actually is a SharePoint site in disguise we have massive issues with uploading a couple of hundred gigs of content. That goes for the home version of OneDrive as well. My setup is pretty common, I run windows on a 512GB SSD and I have another disk on 2TB for storing photos & videos. I installed the application and started uploading ~300 GB photos and videos.

After a couple of hours the sync had failed miserably, the computer was barely workable due to the lack of space on the system disk. Turns out that Office 365 thinks it’s a good idea to create an offline cache in the user AppData-folder (located on the system drive) for every file.

The accepted solution according to the community is to delete the files manually or setting “Days to keep files in the office document cache” to 1. But I couldn’t even do the initial sync!?

My solution

As the files were uploaded we needed to make room on the system drive for new uploads. The cache is located under C:\Users\<user>\AppData\Local\Microsoft\Office\15.0\OfficeFileCache. I threw together a simple console program in 10 minutes that deletes cache files older than 5 minutes. I’ve made the source code and a compiled dist version available on github here. It could be a good idea to always run it as a service, but I’ll leave that for a later exercise. It’s very straightforward and not complicated at all, more importantly it does the job.

UPDATE

I changed the implementation so it runs as a windows service and it’s installed with a msi.

Hope it helps.

By the way…

I switched to google drive instead since the business version of onedrive just lists the files in a list á la sharepoint style. No thumbnails, no viewing images or playing videos in the browser, can’t even download an entire folder as a zip file. Pretty useless, just like sharepoint.

TVMS Feature Demo – Turn your mobile device into an IP-camera

/0 Comments/in , /by

We’ve just added a new feature to TVMS (Towfeek Video Management System) where we enable you to turn your mobile device into an IP-camera. All video sessions can be stored and retrieved for playback with our TVMS API. We support streaming from Android and iOS devices but the feed can be consumed by almost any client.

 

 

Check out the demo and let us know what you think!

 

Keywords : TVMS, RTSP, IP-Camera, Security, CCTV

SignalR Scaleout with SQL Server in Azure

/0 Comments/in , /by

A project for one of our customers recently had this scenario where mobile clients posted updates to a REST-backend running on one site and we needed to notify all clients browsing a different site. The first technique that came into mind was SignalR but we had only used it within the same app before. Now we’d like to share a hub across apps.

Fortunately, the solution was very simple, SignalR supports CORS and scaling out with SQL server out of the box. All you need to install is the following two nuget packages.

PM> Install-Package Microsoft.AspNet.SignalR
PM> Install-Package Microsoft.AspNet.SignalR.SqlServer

This is truly powerful and the SignalR-team has done a great job making it easy to use. There’s an excellent official guide here. Here’s a screencast to show how quickly and easy you can get it up and running in Azure from scratch.

 

Source code @ https://github.com/ajtowf/signalrlab/

 

Hope you find it useful!

 

Keywords : VS2013, Azure, SignalR, WebApi, MVC, OWIN, SQL Server

socialtime.se lab days project

/0 Comments/in , , /by

Lab days

I’ve been super busy at work but finally I’ve come around for some fun lab days coding.

The objective

I’ve often wondered how much time we spend on social media apps on our phones. The idea came pretty naturally – create an app that accurately measures the time for us.

Coding sessions

The 1.0 version of socialtime.se was coded in 4 sessions and this is how I disposed the time. The sessions are 1 or 2 days apart since I rarely have the time to sit and code for 8h straight nowadays, unless it’s for a paying customer of course.

  1. 2h developing the android app for monitoring running processes.
  2. 1h studying the android facebook SDK and implementing auth from the app.
  3. 4h developing REST backend with facebook auth and a super simple frontend.
  4. 1h publishing the app to play store and minor refactorings.
  5. 1.5h writing this blog post, 45 minutes on creating the graphics ;-)

Android App

The app is really basic, it has a background service running which monitors the running processes on a separate thread and just one activity to display the social time.

socialtime_app_v1.0

My first approach was to read the log and filter for ActivityManager since that seemed to work with the adb. But when running logcat from within the app I didn’t get the same information, which I guess is a good thing looking at it from a security standing point.

REST API and Authentication

Since we initially only measure facebook time it’s safe to assume that the users could use facebook to authenticate themselves. One other upside is that we can retrieve their identity by requesting their public information, meaning they won’t need to create a local account for providing a username.

This is where it became interesting, we’ve built a backend using asp.net webapi which allows authorized calls if the user’s authenticated via facebook. The user is authenticated via facebook but via the app, we can’t use the access token issued for the app to communicate securely with our backend. So this is my solution.

android facebook webapi authentication

In a sentence – We issue a new custom token by validating the facebook access token that is passed to us which can be used for secure communication. Pretty neat!

Frontend

I think it was about 2:55am when I finished the app and the API and everything was in place and working. My deadline was 3pm and not a minute more, I needed to be at work 9am and since I’m not in my twenties anymore I need the sleep to function properly.

I hosted the backend in an azure website and I had bought the domain socialtime.se via surftown and once I uploaded the page to surftown I noticed it couldn’t fetch the data. Why? You guessed it, I hadn’t enabled cross-origin resource sharing. So I quickly just installed the nuget package for cors, enabled it, decorated the controller with a EnableCors-attribute, re-deployed the API and voilá, beautiful fully working stack in place. And all this exactly as the clock turned 3am!

 

socialtime_v1.0

It isn’t pretty but hey, it worked!

Future

The infrastructure is in place so adding functionality will go fast. My unprioritized backlog looks something like this.

  • Measure time for Twitter, Instagram and G+, separately.
  • Measure time spent per app and per day. (now it’s just milliseconds since forever)
  • Proper frontend and move it to azure.
  • Remove the public list, you’ll need to login to see only your social time. Several requests for this actually :-)
  • Use some cool HTML5 charting lib to display your social time.

Until then, get the app and have a nice day!

 

googleplay

 

Live coding 5th session – Authentication with ASP.NET Identity, OWIN, WebApi2 and AngularJS

/2 Comments/in /by

In this session we extended the api to only accept authorized requests and implemented authentication logic from the client. We used ASP.NET Identity for user account management and OWIN middleware for token authentication. The application now supports multiple users and in the next session we’ll implement support for 3rd party login providers such as facebook. Enjoy the video!

Live demo @ http://meetometer.azurewebsites.net/

Source code @ https://github.com/ajtowf/meetometer/

 

Until next time, have a nice day!

 

Keywords : VS2013, Azure, HTML5, JavaScript, AngularJS, jQuery Mobile, WebApi, EntityFramework, Authorization, Authentication, OWIN, Request Interceptor

Customize your TFS build process to run StyleCop

/2 Comments/in /by

This will be a short guide on how to get StyleCop to run for every check-in as a part of your build process in TFS or VisualStudio Online. You may also integrate stylecop with the project’s MSBuild file, see StyleCop docs for how to do so.

 
Start off by downloading and installing StyleCop and TFS build extensions.

Build controller changes

First you’ll need to set the custom assemblies path for your build controller. I created a new folder Custom Assemblies in the BuildProcessTemplate folder directly under the team project root folder. Also download a copy of the default template.
 

build_process_templates

Add the following assemblies to Custom Assemblies:
  • StyleCop.dll
  • StyleCop.CSharp.dll
  • StyleCop.CSharp.Rules.dll
  • TFSBuildExtensions.Activites.dll
  • TFSBuildExtensions.Activites.StyleCop.dll
Next Manage Build Controllers and set Version control path to custom assemblies to your Custom Assemblies folder from Build Controller Properties.

build_controller_custom_assemblies

 

 

Custom Build Templates

Create a custom build process solution with a Workflow Activity Library project. I created a BuildProcess solution in the BuildProcessTemplates folder and named the workflow project Templates.

build_process_solution

Next rename the DefaultTemplate.11.1.xaml template you downloaded earlier to CustomTemplate.xaml and add it to the project. Make sure you set the Build Action to Content.

build_action_content

Now let’s add the StyleCop activity to the Toolbox window. Add a new tab TFS Build Extensions, right-click and select Choose items. Browse to the assembly TfsBuildExtensions.Activites.Stylecop.dll and click OK.
We want to run StyleCop early in the build process for the build to fail quickly if there are any violations, the first place where StyleCop can be executed is after the Initialize Workspace sequence within the Run on Agent sequence.

build_sequence

Add a new sequence activity right after Initialize Workspace and name it Run StyleCop. Add the following variables with a scope of the Run StyleCop sequence.
  • StyleCopFiles – IEnumerable<string>
  • StyleCopSettingsFile – string
  • StyleCopResults – bool
  • StyleCopViolations – Int32
Now add the following activities:
  1. FindMatchingFiles – Set the result to StyleCopFiles and the MatchPattern to String.Format(“{0}\**\*.cs”, BuildDirectory)
  2. Assign – Set the StyleCopSettingsFile variable to String.Format(“{0}\Settings.StyleCop”, SourcesDirectory)
  3. StyleCop – Set the following properties
    • SettingsFile to StyleCopSettingsFile
    • SourceFiles to SyleCopFiles.ToArray()
    • Succeeded to StyleCopResults
    • ViolationCount to StyleCopViolations.
  4. WriteBuildMessage – Change the Importance level to High and format the message to something like String.Format(“StyleCop was completed with {0} violations”, StyleCopViolations)
My final sequence activity looks like this:

build_sequence_details

Commit the solution if you haven’t done so already.
commit_custom_template

Running the Build

Now edit the build definition you want to run StyleCop for and use the custom template.

use_custom_template

Trigger a new build and violá, you’ll probably have an unsuccessful build.

stylecop_result

Personally I prefer using TeamCity with NAnt for the build process and JIRA for issue tracking, TFS is way behind imho, but the choice isn’t always up to me. ;-)
Cheers!

AngularJS Loading Indicator / Splash screen

/2 Comments/in /by

How do we prevent the flash of unrendered content (FOUC)? We don’t want to simply hide the unrendered content from the user since the user may think that the app is broken, especially if they’re on a slow connection. The browser will start to render elements as soon as it encounters them, we can use this to our advantage to display a full-screen block of HTML while the page is loading, i.e. a splash screen.

Full working sample can be found at http://jsfiddle.net/45EfF/.
Let’s start with the markup, I’ve added a splash div at the top of the body-tag and the css is loaded inline in the head-tag. This way, when the browser starts parsing the body-tag it will lay out the splash screen elements and style them before it starts to load any other files.

  
Loading


	




  Name 
  


  {{greeting}} {{name}}

We want to make sure that the splash screen goes away after the page is loaded, we can do this using the ngCloak directive. The ngCloak directive will add a CSS class that sets a display: none !important on the element and then remove the display: none once the page has been loaded. We can hijack this ngCloak directive for the splash screen and invert the style for the splash element only.


.splash {
	display: none;
}

[ng-cloak].splash {
	display: block !important;
}
		
.splash {
  position: absolute;
	top: 0;
	left: 0;
	height:100%;
	width:100%;	
	filter: alpha(opacity=60);
	opacity: 0.6;
	background: #000;
}

.splash h2 {
	text-align: center;
	font-size: 4em;
	color:white;			
}
Finally, I’ve manually bootstrapped angular to simulate slow loading.

 

It’s as simple as that, hope it helped, cheers!

Mobile Angular UI with Bootstrap 3

/4 Comments/in /by

I’ve been looking for a nice mobile UI framework that plays well together with angular for quite some time now. When I started developing golf-caddie.se jQuery Mobile was pretty much the only competent framework out there and it was quite cumbersome to get it to play nice with angular. So every now and then I try out new UI frameworks, hoping to find a replacement for jqm. By the way, did I mention that I want it to work well on WP8? Yup, proud owner of a lumia 920.

A couple of months ago I gave ionicframework a go, don’t remember the details but it was awful on WP8. Yesterday I came across an open source project, mobile-angular-ui, seemed to be exactly what I’ve been looking for.
You may wonder, why not just use bootstrap? Simple answer – because it doesn’t give the same look and feel as a native app, my web app is intended to be used on the golf course and on mobile devices only, plain bootstrap just doesn’t cut it. The user controls isn’t designed with mobile first in mind even if the layouting mechanism is.
Anyways, before I started a massive refactoring to replace jqm I put together a little “hello world”-app with a simple slide in menu and some page navigations. I’ve hosted it on http://mobile-angular-ui-test.towfeek.se/.
Really simple stuff, a sidebar and two partials. Seemed to work fine until I added an animation when navigating between pages. Boom, page doesn’t render! Ok that’s fine, not a deal breaker, who needs animations anyways? I just reported a bug and went on with it.
The ultimate test – how does it look on my WP8?
  • Page renders a bit slow, I can see the default title before the partial updates it.
  • Slide menu actually slides in, sweet!
  • Navigation works fine without animations.
  • Page only renders the content that fits the screen initially, scrolling doesn’t work. Deal breaker!

angular_mobile_ui

The project is still in an early stage, and it definitely gots potential. I’ll try to contribute to the project if time allows but I wont refactor golf-caddie to use it just yet.
 
Cheers!

Live coding 4th session – Implementing backend with WebApi2 and EF Code First

/0 Comments/in /by

Implemented the backend as a RESTful service using WebApi2 and persistent storage to a SQL database with Entity Framework Code First. In the next session I’ll implement support for multiple users and authentication with facebook.

Live demo @ http://meetometer.azurewebsites.net/

Source code @ https://github.com/ajtowf/meetometer/

 

POST SCREENCAST EDIT

Forgot to setup automatic upgrading on application startup since I was using the package manager console in the screencast to setup the database. I added the following piece of code in commit 8be3b31:

Database.SetInitializer(new MigrateDatabaseToLatestVersion<AppDbContext, Configuration>());

 

Until next time, have a nice day!

 

Keywords : VS2013, Azure, HTML5, JavaScript, AngularJS, jQuery Mobile, AmplifyJS, WebApi, EntityFramework

Entity Framework 6 Code First unreported breaking change/bug when migrating from version 5

/0 Comments/in /by

Came a cross a nice bug in my golf score app on my season premiere round yesterday. I suddenly had a couple more strokes than I should with my HCP, although it seemed fair since it was the first round and all it didn’t make sense. I hadn’t made any (programmatic) changes to the code since the last time I played.

It took me a while to figure it out but my strokes were based on the female slope. All the custom male and female slopes were suddenly flipped, how come? I had moved the site from surftown to windows azure and with that also upgraded EF from 5 to 6 and compiled the back-end for .NET 4.5 instead of 4.0.
Without diving into golf details a golf club has one to many courses and a course has one to many tees. How many strokes a player gets from a given tee is based his HCP and is usually calculated with a formula. Unless the course has a custom slope table, then you’ll need to specify explicitly how many strokes you’ll get for a given HCP. The latter is the case on my home course, which also is the reason for me creating the app, since there is no other app that handles this well.
So my entities looked something like this (yup, I’m serializing my EF POCOs directly in my WebApi service, get over it :D)
public class Tee
{
    [Key]
    [DatabaseGenerated(DatabaseGeneratedOption.Identity)]
    public int Id { get; set; }

    ...
    
    [InverseProperty("TeeAsMale")]
    public virtual ICollection CustomHcpAsMale { get; set; }
    [InverseProperty("TeeAsFemale")]
    public virtual ICollection CustomHcpAsFemale { get; set; }
}

public class TeeHcp
{
    [Key]
    [DatabaseGenerated(DatabaseGeneratedOption.Identity)]
    [JsonIgnore, IgnoreDataMember]
    public int Id { get; set; }

    public double From { get; set; }
    public double To { get; set; }
    public int Strokes { get; set; }
}
And since I haven’t mapped up the inverse property EF won’t be able to give the foreign keys good names, so the table will look like this:

ef_breaking_change_no_inverse_prop

which isn’t neat but it’s fine imho, it works, or at least it did work! Now all of the sudden CustomHcpAsMale and CustomHcpAsFemale switched places when getting the data. Since EF seemed to be confused I went ahead and explictly mapped the inverse properties, changing the code to something like this:
public class Tee
{
    [Key]
    [DatabaseGenerated(DatabaseGeneratedOption.Identity)]
    public int Id { get; set; }

    ...

    [InverseProperty("TeeAsMale")]
    public virtual ICollection CustomHcpAsMale { get; set; }
    [InverseProperty("TeeAsFemale")]
    public virtual ICollection CustomHcpAsFemale { get; set; }
}

public class TeeHcp
{
    [Key]
    [DatabaseGenerated(DatabaseGeneratedOption.Identity)]
    [JsonIgnore, IgnoreDataMember]
    public int Id { get; set; }

    public double From { get; set; }
    public double To { get; set; }
    public int Strokes { get; set; }

    [JsonIgnore, IgnoreDataMember]
    public Tee TeeAsMale { get; set; }
    [JsonIgnore, IgnoreDataMember]
    public Tee TeeAsFemale { get; set; }
}
which after applying the migration changed the tables to look like this:

ef_breaking_change_with_inverse_prop

and voilá, problem solved! Once again upgrading libraries to run the latest and greatest versions for no reason bites me in the ass. I’ll try to report this to Microsoft as a breaking change, at least it was an easy fix and I figured it out quickly!
Lessons learned – don’t be lazy like me when mapping navigation properties!
Hope it helps somebody out. Peace!