refactor(preload): user service for prelaod

pull/3/head
alex 2016-03-01 12:21:05 +03:00
parent 346a500765
commit 4ae5db4152
4 changed files with 47 additions and 18 deletions

View File

@ -0,0 +1,24 @@
/**
* @author a.demeshko
* created on 3/1/16
*/
(function () {
'use strict';
angular.module('BlurAdmin.theme')
.service('preloader', preloader);
/** @ngInject */
function preloader($q) {
return {
load: function (src) {
var d = $q.defer();
var img = new Image();
img.src = src;
img.onload = d.resolve;
return d.promise;
}
}
}
})();

View File

@ -9,13 +9,30 @@
.run(themeRun);
/** @ngInject */
function themeRun($timeout, $rootScope, layoutSizes) {
$timeout(function () {
function themeRun($timeout, $rootScope, layoutSizes, layoutPaths, preloader, $q) {
$q.all([
preloader.load(layoutPaths.images.root + 'blur-bg.jpg'),
preloader.load(layoutPaths.images.root + 'blur-bg-blurred.jpg')
]).then(function(){
if(!$rootScope.$pageFinishedLoading){
$rootScope.$pageFinishedLoading = true;
}, 1000);
}
if(!$rootScope.$pageLoaded){
$rootScope.$pageLoaded = true;
}
});
$timeout(function () {
if(!$rootScope.$pageFinishedLoading){
$rootScope.$pageFinishedLoading = true;
}
}, 2000);
$timeout(function () {
if(!$rootScope.$pageLoaded){
$rootScope.$pageLoaded = true;
}
}, 4000);
$rootScope.$isMenuCollapsed = window.innerWidth <= layoutSizes.resWidthCollapseSidebar;

View File

@ -25,10 +25,6 @@
<!-- endbuild -->
</head>
<body>
<div class="preload-images">
<img class="preload-bg" width="1" height="1">
<img class="preload-blurred-bg" width="1" height="1">
</div>
<main ng-if="$pageFinishedLoading" ng-class="{ 'menu-collapsed': $isMenuCollapsed }">
<sidebar></sidebar>

View File

@ -79,6 +79,7 @@ $panel-heading-font-size: 16px;
.panel-blur {
$blurredBgUrl: $images-root + 'blur-bg-blurred.jpg';
background: url($blurredBgUrl);
transition: none;
}
.panel-primary {
@ -177,15 +178,6 @@ $panel-heading-font-size: 16px;
font-weight: $font-light;
}
div.preload-images {
height: 0;
.preload-bg{
background: url($images-root + 'blur-bg.jpg') no-repeat;
}
.preload-blurred-bg{
background: url($images-root + 'blur-bg-blurred.jpg') no-repeat;
}
}
/*
.panel-group .panel {