Adds WIP installer files
This commit is contained in:
Per Ploug Krogslund
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
src/Umbraco.Web.UI.Client/src/assets/img/installer.jpg
Normal file
BIN
src/Umbraco.Web.UI.Client/src/assets/img/installer.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 342 KiB |
21
src/Umbraco.Web.UI.Client/src/install.loader.js
Normal file
21
src/Umbraco.Web.UI.Client/src/install.loader.js
Normal file
@@ -0,0 +1,21 @@
|
||||
yepnope({
|
||||
|
||||
load: [
|
||||
'lib/jquery/jquery-2.0.3.min.js',
|
||||
|
||||
/* 1.1.5 */
|
||||
'lib/angular/1.1.5/angular.min.js',
|
||||
'lib/angular/1.1.5/angular-cookies.min.js',
|
||||
'lib/angular/1.1.5/angular-mobile.min.js',
|
||||
'lib/angular/1.1.5/angular-mocks.js',
|
||||
'lib/angular/1.1.5/angular-sanitize.min.js',
|
||||
'lib/underscore/underscore.js',
|
||||
'js/umbraco.installer.js'
|
||||
],
|
||||
|
||||
complete: function () {
|
||||
jQuery(document).ready(function () {
|
||||
angular.bootstrap(document, ['umbraco.install']);
|
||||
});
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,19 @@
|
||||
angular.module("umbraco.install").controller("Umbraco.InstallerController",
|
||||
function($scope, installerService){
|
||||
|
||||
$scope.stepIndex = 0;
|
||||
installerService.init();
|
||||
$scope.installer = installerService.status;
|
||||
|
||||
$scope.forward = function(){
|
||||
installerService.forward();
|
||||
};
|
||||
|
||||
$scope.backward = function(){
|
||||
installerService.backward();
|
||||
};
|
||||
|
||||
$scope.install = function(){
|
||||
installerService.install();
|
||||
};
|
||||
});
|
||||
37
src/Umbraco.Web.UI.Client/src/installer/installer.html
Normal file
37
src/Umbraco.Web.UI.Client/src/installer/installer.html
Normal file
@@ -0,0 +1,37 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<base href="/belle/" />
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<title>Install Umbraco</title>
|
||||
<link rel="stylesheet" href="assets/css/installer.css" />
|
||||
</head>
|
||||
|
||||
|
||||
<body ng-class="{touch:touchDevice}" ng-controller="Umbraco.InstallerController" id="umbracoInstallPageBody">
|
||||
|
||||
<img src="assets/img/application/logo_white.png" id="logo" />
|
||||
|
||||
<div class="umb-loader" id="loader" ng-if="installer.loading"></div>
|
||||
|
||||
<div id="installer" class="absolute-center clearfix" ng-if="installer.current">
|
||||
<div ng-include="installer.current.view"></div>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
<ul>
|
||||
<li ng-repeat="step in installer.steps"
|
||||
ng-class="{current:$index === stepIndex, completed:step.completed}">
|
||||
<h4>{{step.name}}</h4>
|
||||
<p>{{step.description}}</p>
|
||||
</li>
|
||||
</ul>
|
||||
-->
|
||||
|
||||
<script src="lib/yepnope/yepnope.min.js"></script>
|
||||
<script src="js/install.loader.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
101
src/Umbraco.Web.UI.Client/src/installer/installer.service.js
Normal file
101
src/Umbraco.Web.UI.Client/src/installer/installer.service.js
Normal file
@@ -0,0 +1,101 @@
|
||||
angular.module("umbraco.install").factory('installerService', function($q, $timeout){
|
||||
|
||||
var _status = {
|
||||
index: 0,
|
||||
current: undefined,
|
||||
steps: undefined
|
||||
};
|
||||
|
||||
var _installerModel = {};
|
||||
var service = {
|
||||
|
||||
status : _status,
|
||||
getSteps : function(){
|
||||
var deferred = $q.defer();
|
||||
|
||||
var s = [
|
||||
{
|
||||
name: "User",
|
||||
view: "user",
|
||||
description: "Configuring your user account",
|
||||
completed: false
|
||||
},
|
||||
{
|
||||
name: "Database",
|
||||
view: "database",
|
||||
description: "Setting up the system database",
|
||||
completed: false
|
||||
},
|
||||
{
|
||||
name: "Packages",
|
||||
view: "packages",
|
||||
description: "Installing a staterkit",
|
||||
completed: false
|
||||
}
|
||||
];
|
||||
|
||||
deferred.resolve(s);
|
||||
return deferred.promise;
|
||||
},
|
||||
|
||||
init : function(){
|
||||
if(!_status.all){
|
||||
service.getSteps().then(function(steps){
|
||||
service.status.steps = steps;
|
||||
service.status.index = 0;
|
||||
service.gotoStep(0);
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
gotoStep : function(index){
|
||||
var step = service.status.steps[index];
|
||||
|
||||
if(step.view.indexOf(".html") < 0){
|
||||
step.view = step.view + ".html";
|
||||
}
|
||||
|
||||
if(step.view.indexOf("/") < 0){
|
||||
step.view = "views/install/" + step.view;
|
||||
}
|
||||
|
||||
if(!step.model){
|
||||
step.model = {};
|
||||
}
|
||||
|
||||
service.status.index = index;
|
||||
service.status.current = step;
|
||||
},
|
||||
|
||||
storeCurrentStep : function(){
|
||||
_installerModel[service.status.current.name] = service.status.current.model;
|
||||
},
|
||||
|
||||
forward : function(){
|
||||
service.storeCurrentStep();
|
||||
service.status.index++;
|
||||
service.gotoStep(service.status.index);
|
||||
},
|
||||
|
||||
backwards : function(){
|
||||
service.storeCurrentStep();
|
||||
service.gotoStep(service.status.index--);
|
||||
},
|
||||
|
||||
install : function(){
|
||||
service.storeCurrentStep();
|
||||
service.status.current = undefined;
|
||||
|
||||
|
||||
_.each(service.status.steps, function(step){
|
||||
$timeout(function(){
|
||||
step.completed = true;
|
||||
}, 2000);
|
||||
});
|
||||
|
||||
//post the installer model to somewhere...
|
||||
}
|
||||
};
|
||||
|
||||
return service;
|
||||
});
|
||||
@@ -0,0 +1,3 @@
|
||||
angular.module("umbraco.install").controller("Umbraco.Installer.DataBaseController", function(){
|
||||
alert("we are in your database");
|
||||
});
|
||||
@@ -0,0 +1,5 @@
|
||||
<div ng-controller="Umbraco.Installer.DataBaseController">
|
||||
<label>Give us your DB dns</label>
|
||||
<textarea ng-model="installer.current.model.dns"></textarea>
|
||||
<button ng-click="forward()">Next</button>
|
||||
</div>
|
||||
@@ -0,0 +1 @@
|
||||
<button ng-click="install()">Do stuff with starter kits</button>
|
||||
@@ -0,0 +1,12 @@
|
||||
angular.module("umbraco.install").controller("Umbraco.Install.UserController", function($scope, installerService){
|
||||
|
||||
$scope.validateAndInstall = function(){
|
||||
installerService.install();
|
||||
};
|
||||
|
||||
|
||||
$scope.validateAndForward = function(){
|
||||
installerService.forward();
|
||||
};
|
||||
|
||||
});
|
||||
48
src/Umbraco.Web.UI.Client/src/installer/steps/user.html
Normal file
48
src/Umbraco.Web.UI.Client/src/installer/steps/user.html
Normal file
@@ -0,0 +1,48 @@
|
||||
<div ng-controller="Umbraco.Install.UserController">
|
||||
<h1>Install Umbraco 7</h1>
|
||||
|
||||
<p>Enter your name, email and password to install Umbraco 7 with its default settings, alternatively you can customize your installation</p>
|
||||
|
||||
<form name="myForm" class="form-horizontal" novalidate ng-submit="validateAndInstall();">
|
||||
|
||||
<div class="row">
|
||||
<div class="span8">
|
||||
<div class="pull-right">
|
||||
<div class="control-group">
|
||||
<label class="control-label" for="name">Name</label>
|
||||
<div class="controls">
|
||||
<input type="text" name="name" placeholder="First Last" required
|
||||
ng-model="installer.current.model.name" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="control-group">
|
||||
<label class="control-label" for="email">Email</label>
|
||||
<div class="controls">
|
||||
<input type="email" name="email" placeholder="you@example.com" required ng-model="installer.current.model.email" />
|
||||
<small class="inline-help">Your email will be used as your login</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="control-group">
|
||||
<label class="control-label" for="password">Password</label>
|
||||
<div class="controls">
|
||||
<input type="password" name="installer.current.model.password" ng-minlength="8" required ng-model="installer.current.model.password" />
|
||||
<small class="inline-help">Atleast 8 characters long</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="span2" ng-class="{disabled:myForm.$invalid}">
|
||||
<input type="submit" ng-disabled="myForm.$invalid" value="Install" class="btn btn-success" />
|
||||
<br/>
|
||||
<small><a href ng-disabled="myForm.$invalid" ng-click="validateAndInstall()">Customize</a></small>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</form>
|
||||
|
||||
</div>
|
||||
154
src/Umbraco.Web.UI.Client/src/less/installer.less
Normal file
154
src/Umbraco.Web.UI.Client/src/less/installer.less
Normal file
@@ -0,0 +1,154 @@
|
||||
// Core variables and mixins
|
||||
@import "fonts.less"; // Loading fonts
|
||||
@import "variables.less"; // Modify this for custom colors, font-sizes, etc
|
||||
@import "mixins.less";
|
||||
@import "buttons.less";
|
||||
@import "forms.less";
|
||||
|
||||
// Grid system and page structure
|
||||
@import "../../lib/bootstrap/less/scaffolding.less";
|
||||
@import "../../lib/bootstrap/less/grid.less";
|
||||
@import "../../lib/bootstrap/less/layouts.less";
|
||||
|
||||
|
||||
|
||||
html {
|
||||
background: url('../img/installer.jpg') no-repeat center center fixed;
|
||||
-webkit-background-size: cover;
|
||||
-moz-background-size: cover;
|
||||
-o-background-size: cover;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
|
||||
font-family: @baseFontFamily;
|
||||
font-size: @baseFontSize;
|
||||
line-height: @baseLineHeight;
|
||||
color: @textColor;
|
||||
|
||||
vertical-align: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#logo{
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
opacity: 0.8
|
||||
}
|
||||
|
||||
#installer{
|
||||
margin: auto;
|
||||
background: rgba(255, 255, 255, 1);
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
input.ng-dirty.ng-invalid{border-color: #b94a48; color: #b94a48;}
|
||||
|
||||
.disabled{
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.controls{
|
||||
text-align: left
|
||||
}
|
||||
|
||||
.controls small{display: block; color: @gray;}
|
||||
|
||||
.absolute-center {
|
||||
margin: auto;
|
||||
position: absolute;
|
||||
top: 0; left: 0; bottom: 0; right: 0;
|
||||
}
|
||||
|
||||
.umb-loader{
|
||||
background-color: @blue;
|
||||
margin-top:0;
|
||||
margin-left:-100%;
|
||||
-moz-animation-name:bounce_loadingProgressG;
|
||||
-moz-animation-duration:1s;
|
||||
-moz-animation-iteration-count:infinite;
|
||||
-moz-animation-timing-function:linear;
|
||||
-webkit-animation-name:bounce_loadingProgressG;
|
||||
-webkit-animation-duration:1s;
|
||||
-webkit-animation-iteration-count:infinite;
|
||||
-webkit-animation-timing-function:linear;
|
||||
-ms-animation-name:bounce_loadingProgressG;
|
||||
-ms-animation-duration:1s;
|
||||
-ms-animation-iteration-count:infinite;
|
||||
-ms-animation-timing-function:linear;
|
||||
-o-animation-name:bounce_loadingProgressG;
|
||||
-o-animation-duration:1s;
|
||||
-o-animation-iteration-count:infinite;
|
||||
-o-animationtiming-function:linear;
|
||||
animation-name:bounce_loadingProgressG;
|
||||
animation-duration:1s;
|
||||
animation-iteration-count:infinite;
|
||||
animation-timing-function:linear;
|
||||
width:100%;
|
||||
height:1px;
|
||||
}
|
||||
|
||||
|
||||
@-moz-keyframes bounce_loadingProgressG{
|
||||
0%{
|
||||
margin-left:-100%;
|
||||
}
|
||||
|
||||
100%{
|
||||
margin-left:100%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@-webkit-keyframes bounce_loadingProgressG{
|
||||
0%{
|
||||
margin-left:-100%;
|
||||
}
|
||||
|
||||
100%{
|
||||
margin-left:100%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@-ms-keyframes bounce_loadingProgressG{
|
||||
0%{
|
||||
margin-left:-100%;
|
||||
}
|
||||
|
||||
100%{
|
||||
margin-left:100%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@-o-keyframes bounce_loadingProgressG{
|
||||
0%{
|
||||
margin-left:-100%;
|
||||
}
|
||||
|
||||
100%{
|
||||
margin-left:100%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@keyframes bounce_loadingProgressG{
|
||||
0%{
|
||||
margin-left:-100%;
|
||||
}
|
||||
100%{
|
||||
margin-left:100%;
|
||||
}
|
||||
}
|
||||
|
||||
//loader defaults
|
||||
.umb-loader{
|
||||
height: 10px; margin: 10px 10px 10px 10px;
|
||||
}
|
||||
30
src/Umbraco.Web.UI/Umbraco/js/install.js
Normal file
30
src/Umbraco.Web.UI/Umbraco/js/install.js
Normal file
@@ -0,0 +1,30 @@
|
||||
yepnope({
|
||||
|
||||
load: [
|
||||
'lib/jquery/jquery-2.0.3.min.js',
|
||||
|
||||
/* 1.1.5 */
|
||||
'lib/angular/1.1.5/angular.min.js',
|
||||
'lib/angular/1.1.5/angular-cookies.min.js',
|
||||
'lib/angular/1.1.5/angular-mobile.min.js',
|
||||
'lib/angular/1.1.5/angular-mocks.js',
|
||||
'lib/angular/1.1.5/angular-sanitize.min.js',
|
||||
'lib/underscore/underscore.js',
|
||||
'js/umbraco.servervariables.js',
|
||||
'js/app.dev.js'
|
||||
],
|
||||
|
||||
complete: function () {
|
||||
jQuery(document).ready(function () {
|
||||
|
||||
angular.module('umbraco.install', [
|
||||
'umbraco.resources',
|
||||
'umbraco.services',
|
||||
'umbraco.httpbackend',
|
||||
'ngMobile'
|
||||
]);
|
||||
|
||||
angular.bootstrap(document, ['umbraco.install']);
|
||||
});
|
||||
}
|
||||
});
|
||||
21
src/Umbraco.Web.UI/Umbraco/js/install.loader.js
Normal file
21
src/Umbraco.Web.UI/Umbraco/js/install.loader.js
Normal file
@@ -0,0 +1,21 @@
|
||||
yepnope({
|
||||
|
||||
load: [
|
||||
'lib/jquery/jquery-2.0.3.min.js',
|
||||
|
||||
/* 1.1.5 */
|
||||
'lib/angular/1.1.5/angular.min.js',
|
||||
'lib/angular/1.1.5/angular-cookies.min.js',
|
||||
'lib/angular/1.1.5/angular-mobile.min.js',
|
||||
'lib/angular/1.1.5/angular-mocks.js',
|
||||
'lib/angular/1.1.5/angular-sanitize.min.js',
|
||||
'lib/underscore/underscore.js',
|
||||
'js/umbraco.installer.js'
|
||||
],
|
||||
|
||||
complete: function () {
|
||||
jQuery(document).ready(function () {
|
||||
angular.bootstrap(document, ['umbraco.install']);
|
||||
});
|
||||
}
|
||||
});
|
||||
Reference in New Issue
Block a user