diff --git a/js/controller/AppController.js b/js/controller/AppController.js
index 742e40f15..62f4e088a 100644
--- a/js/controller/AppController.js
+++ b/js/controller/AppController.js
@@ -23,10 +23,11 @@
 import app from '../app/App.js';
 
 /** global: OC */
-app.controller('AppController', function ($scope, $location, $http, $log, $rootScope) {
+app.controller('AppController', function ($scope, $location, $http, $log, $rootScope, $attrs) {
 	$rootScope.sidebar = {
 		show: false
 	};
 	$scope.sidebar = $rootScope.sidebar;
 	$scope.user = oc_current_user;
+	$rootScope.config = JSON.parse($attrs.config);
 });
diff --git a/js/service/FileService.js b/js/service/FileService.js
index 1db2617ba..8248debd0 100644
--- a/js/service/FileService.js
+++ b/js/service/FileService.js
@@ -25,17 +25,18 @@ import app from '../app/App.js';
 /* global OC oc_requesttoken */
 export default class FileService {
 
-	constructor ($http, FileUploader, CardService) {
+	constructor (FileUploader, CardService, $rootScope, $filter) {
+		this.$filter = $filter;
 		this.uploader = new FileUploader();
 		this.cardservice = CardService;
 		this.uploader.onAfterAddingFile = this.onAfterAddingFile.bind(this);
 		this.uploader.onSuccessItem = this.onSuccessItem.bind(this);
 		this.uploader.onErrorItem = this.onErrorItem.bind(this);
-
+		
+		this.maxUploadSize = $rootScope.config.maxUploadSize;
 		this.status = null;
 	}
 
-
 	runUpload (fileItem, attachmentId) {
 		this.status = null;
 		fileItem.url = OC.generateUrl('/apps/deck/cards/' + fileItem.cardId + '/attachment?type=deck_file');
@@ -55,6 +56,14 @@ export default class FileService {
 	}
 
 	onAfterAddingFile (fileItem) {
+		if (this.maxUploadSize > 0 && fileItem.file.size > this.maxUploadSize) {
+			this.status = {
+				error: t('deck', `Failed to upload {name}`, {name: fileItem.file.name}),
+				message: t('deck', 'Maximum file size of {size} exceeded', {size: this.$filter('bytes')(this.maxUploadSize)})
+			};
+			return;
+		}
+
 		// Fetch card details before trying to upload so we can detect filename collisions properly
 		let self = this;
 		this.cardservice.fetchOne(fileItem.cardId).then(function (data) {
diff --git a/lib/Controller/PageController.php b/lib/Controller/PageController.php
index cf634006f..6e06db25d 100644
--- a/lib/Controller/PageController.php
+++ b/lib/Controller/PageController.php
@@ -46,6 +46,7 @@ class PageController extends Controller {
 	public function index() {
 		$params = [
 			'user' => $this->userId,
+			'maxUploadSize' => \OCP\Util::uploadLimit(),
 		];
 		return new TemplateResponse('deck', 'main', $params);
 	}
diff --git a/templates/main.php b/templates/main.php
index 51567e289..0dc3b7fb8 100644
--- a/templates/main.php
+++ b/templates/main.php
@@ -30,7 +30,7 @@ Util::addStyle('deck', 'style');
 Util::addScript('deck', 'build/deck');
 ?>
 
-<div id="app" class="app-deck" data-ng-app="Deck" ng-controller="AppController" ng-cloak>
+<div id="app" class="app-deck" data-ng-app="Deck" ng-controller="AppController" ng-cloak config="<?php p(json_encode($_)); ?>">
 
 	<div id="app-navigation" data-ng-controller="ListController" ng-init="initSidebar()">
 		<?php print_unescaped($this->inc('part.navigation')); ?>