rush:js;">
//Please set step content to fixed width when complex content or dynamic loading.
angular.module('com.github.greengerong.backdrop',[])
.directive('uiBackdrop',['$document',function($document) {
return {
restrict: 'EA',replace: true,templateUrl: 'modal-backdrop.html',s
cope: {
backdropClass: '=',zIndex: '='
}
/*,link: function(){
$document.bind('keydown',function(evt){
evt.preventDefault();
evt.stopPropagation();
});
s
cope.$on('$destroy',function(){
$document.unbind('keydown');
});
}*/
};
}])
.service('modalBackdropService',['$rootS
cope','$compile','$document',function($rootS
cope,$compile,$document) {
var self = this;
self.backdrop = function(backdropClass,zIndex) {
var $backdrop = angular.element('
')
.attr({
'backdrop-class': 'backdropClass','z-index': 'zIndex'
});
var backdropS
cope = $rootS
cope.$new(true);
backdropS
cope.backdropClass = backdropClass;
backdropS
cope.zIndex = zIndex;
$document.find('body').append($compile($backdrop)(backdropS
cope));
return function() {
$backdrop.remove();
backdropS
cope.$destroy();
};
};
}]);
angular.module('com.github.greengerong.trainning',['com.github.greengerong.backdrop','ui.bootstrap'])
.directive('trainningStep',['$timeout','$http','$templateCache','$position','$injector','$window','$q','$controller',function($timeout,$http,$templateCache,$position,$injector,$window,$q,$controller) {
return {
restrict: 'EA',templateUrl: 'trainning-step.html',s
cope: {
step: '=',trainnings: '=',nextStep: '&',cancel: '&'
},link: function(stepPanelS
cope,elm) {
var stepPanel = elm.find('.step-panel');
stepPanelS
cope.$watch('step',function(step) {
if (!step) {
return;
}
stepPanelS
cope.currentTrainning = stepPanelS
cope.trainnings[stepPanelS
cope.step - 1];
var contentS
cope = stepPanelS
cope.$new(false);
loadStepContent(contentS
cope,{
'currentStep': stepPanelS
cope.step,'trainnings': stepPanelS
cope.trainnings,'currentTrainning': stepPanelS
cope.currentTrainning,'trainningInstance': {
'nextStep': stepPanelS
cope.nextStep,'cancel': stepPanelS
cope.cancel
}
}).then(function(tplAndVars) {
elm.find('.popover-content').html($compile(tplAndVars[0])(contentS
cope));
}).then(function() {
var pos = stepPanelS
cope.currentTrainning.position;
adjustPosition(stepPanelS
cope,stepPanel,pos);
});
});
angular.element($window).bind('resize',function() {
adjustPosition(stepPanelS
cope,stepPanelS
cope.currentTrainning.position);
});
stepPanelS
cope.$on('$destroy',function() {
angular.element($window).unbind('resize');
});
function getPositionOnElement(stepS
cope,setpPos) {
return $position.positionElements(angular.element(setpPos),stepS
cope.currentTrainning.placement,true);
}
function positionOnElement(stepS
cope,setpPos) {
var targetPos = angular.i
sstring(setpPos) ? getPositionOnElement(stepS
cope,setpPos) : setpPos;
var positionStyle = stepS
cope.currentTrainning || {};
positionStyle.top = targetPos.top + 'px';
positionStyle.left = targetPos.left + 'px';
stepS
cope.positionStyle = positionStyle;
}
function adjustPosition(stepS
cope,pos) {
if (!pos) {
return;
}
var setpPos = angular.isFunction(pos) || angular.isArray(pos) ? $injector.invoke(pos,null,{
trainnings: stepS
cope.trainnings,step: stepS
cope.setp,currentTrainning: stepS
cope.currentTrainning,stepPanel: stepPanel
}) : pos;
//get postion should wait for content setup
$timeout(function() {
positionOnElement(stepS
cope,setpPos);
});
}
function loadStepContent(contentS
cope,ctrlLocals) {
var trainningOptions = contentS
cope.currentTrainning,getTemplatePromise = function(options) {
return options.template ? $q.when(options.template) :
$http.get(angular.isFunction(options.templateUrl) ? (options.templateUrl)() : options.templateUrl,{
cache: $templateCache
}).then(function(result) {
return result.data;
});
},getResolvePromises = function(resolves) {
var promisesArr = [];
angular.forEach(resolves,function(value) {
if (angular.isFunction(value) || angular.isArray(value)) {
promisesArr.push($q.when($injector.invoke(value)));
}
});
return promisesArr;
},controllerLoader = function(trainningOptions,trainningS
cope,ctrlLocals,tplAndVars) {
var ctrlInstance;
ctrlLocals = angular.extend({},ctrlLocals || {},trainningOptions.locals || {});
var resolveIter = 1;
if (trainningOptions.controller) {
ctrlLocals.$s
cope = trainningS
cope;
angular.forEach(trainningOptions.resolve,function(value,key) {
ctrlLocals[key] = tplAndVars[resolveIter++];
});
ctrlInstance = $controller(trainningOptions.controller,ctrlLocals);
if (trainningOptions.controllerAs) {
trainningS
cope[trainningOptions.controllerAs] = ctrlInstance;
}
}
return trainningS
cope;
};
var templateAndResolvePromise = $q.all([getTemplatePromise(trainningOptions)].concat(getResolvePromises(trainningOptions.resolve || {})));
return templateAndResolvePromise.then(function resolveSuccess(tplAndVars) {
controllerLoader(trainningOptions,contentS
cope,tplAndVars);
return tplAndVars;
});
}
}
};
}])
.service('trainningService',['$compile','$rootS
cope',function($compile,$rootS
cope,$document,$q) {
var self = this;
self.trainning = function(trainnings) {
var trainningS
cope = $rootS
cope.$new(true),defer = $q.defer(),$stepElm = angular.element('
')
.attr({
'step': 'step','trainnings': 'trainnings','next-step': 'nextStep($event,step);','cancel': 'cancel($event,step)'
}),destroyTrainningPanel = function(){
if (trainningS
cope) {
$stepElm.remove();
trainningS
cope.$destroy();
}
};
trainningS
cope.cancel = function($event,step){
defer.reject('cancel');
};
trainningS
cope.nextStep = function($event,step) {
if (trainningS
cope.step === trainnings.length) {
destroyTrainningPanel();
return defer.resolve('done');
}
trainningS
cope.step++;
};
trainningS
cope.trainnings = trainnings;
trainningS
cope.step = 1;
$document.find('body').append($compile($stepElm)(trainningS
cope));
trainningS
cope.$on('$locationChangeStart',destroyTrainningPanel);
return {
done: function(func) {
defer.promise.then(func);
return this;
},cancel: function(func) {
defer.promise.then(null,func);
return this;
}
};
};
}]);
angular.module('com.github.greengerong',['com.github.greengerong.trainning'])
.filter('range',[function () {
return function (len) {
return _.range(1,len + 1);
};
}])
.controller('StepPanelController',['currentStep','trainnings','trainningInstance',function(currentStep,trainnings,trainningInstance,trainnings) {
var vm = this;
vm.currentStep = currentStep;
vm.trainningInstance = trainningInstance;
vm.trainnings = trainnings;
vm.texts = ['Write your own sort blog.','Click button to public your blog.','View your blog info on there.','Click this button,you can restart this trainning when .','All trainnings done!'];
return vm;
}])
.constant('trainningCourses',{
title: 'Step 2:',placement: 'right',backdrop: false,position: '#submitBlog'
},{
title: 'Step 4:',placement: 'b
ottom',position: '#startAgain'
},{
stepClass: 'last-step',stepPanel) {
var win = angular.element($window);
return {
top: (win.height() - stepPanel.height()) / 2,left: (win.width() - stepPanel.width()) / 2
}
}]
}]
})
.controller('DemoController',['trainningService','trainningCourses','modalBackdropService',function(trainningService,trainningCourses,modalBackdropService) {
var vm = this;
vm.trainning = function() {
//call this service should wait your really document ready event.
trainningService.trainning(trainningCourses.courses)
.done(function() {
vm.isDone = true;
});
};
var backdropInstance = angular.noop;
vm.backdrop = function() {
modalBackdropService.backdrop();
};
vm.trainning();
return vm;
}]);
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
