app.portBindings and newManifest.tcpPorts may be null

webadmin/src/views/setup/step1.html

@@ -0,0 +1,8 @@
+<center>
+    <h1>Welcome to your Cloudron</h1>
+    <br/>
+    <h3 class="">This is your <b>{{ wizard.hostname }}</b> and all your apps will be installed under this domain.</h3>
+    <br/>
+    <br/>
+    <a class="btn btn-primary" href="#/step2" autofocus>Forward</a>
+</center>

webadmin/src/views/setup/step2.html

@@ -0,0 +1,43 @@
+<div class="row">
+    <div class="col-md-12 text-center">
+        <h1>Personalize your Cloudron</h1>
+        <h4 class="">
+            Make it truly yours, by giving your Cloudron an avatar and name.
+        </h4>
+    </div>
+</div>
+
+<br/>
+
+<div class="row">
+    <div class="col-md-12 settings-avatar-selector">
+        <img id="previewAvatar" width="128" height="128" ng-src="{{wizard.avatar.data || wizard.avatar.url}}"/>
+        <input type="file" id="avatarFileInput" style="display: none" accept="image/png"/>
+
+        <br/>
+        <br/>
+
+        <div class="grid">
+            <div class="item" ng-repeat="avatar in wizard.availableAvatars" style="background-image: url('{{avatar.data || avatar.url}}');" ng-click="wizard.setPreviewAvatar(avatar)"></div>
+            <div class="item add" ng-click="showCustomAvatarSelector()"></div>
+        </div>
+    </div>
+</div>
+
+<br/>
+
+<div class="row">
+    <div class="col-md-4 col-md-offset-4 text-center">
+        <div class="form-group" ng-class="{ 'has-error': setup_form.name.$dirty && setup_form.name.$invalid }">
+            <!-- <label class="control-label" for="inputName">Name</label> -->
+            <input type="text" class="form-control" ng-model="wizard.name" id="inputName" name="name" placeholder="Name" ng-enter="next('/step3', setup_form.name.$invalid)" ng-maxlength="512" ng-minlength="1" autofocus required autocomplete="off">
+        </div>
+    </div>
+</div>
+
+
+<div class="row">
+    <div class="col-md-12 text-center">
+        <a class="btn btn-primary" href="#/step3" ng-disabled="setup_form.name.$invalid">Next</a>
+    </div>
+</div>

webadmin/src/views/setup/step3.html

@@ -0,0 +1,26 @@
+<div class="row">
+    <div class="col-md-12 text-center">
+        <h1>Create an Administrator for <b>{{ wizard.name }}</b>, your Cloudron</h1>
+        <h4 class="">
+            You can create more users once we are done here.
+        </h4>
+    </div>
+</div>
+<br/>
+<div class="row">
+    <div class="col-md-4 col-md-offset-4 text-center">
+        <div class="form-group" ng-class="{ 'has-error': setup_form.username.$dirty && setup_form.username.$invalid }">
+            <!-- <label class="control-label" for="inputUsername">Username</label> -->
+            <input type="text" class="form-control" ng-model="wizard.username" id="inputUsername" name="username" placeholder="Username" ng-enter="focusNext('inputPassword', setup_form.username.$invalid)" ng-maxlength="512" ng-minlength="3" autofocus required autocomplete="off">
+        </div>
+        <div class="form-group" ng-class="{ 'has-error': setup_form.password.$dirty && setup_form.password.$invalid }">
+            <!-- <label class="control-label" for="inputPassword">Password</label> -->
+            <input type="password" class="form-control" ng-model="wizard.password" id="inputPassword" name="password" placeholder="Password" ng-enter="next('/step4', setup_form.password.$invalid)" ng-maxlength="512" ng-minlength="5" required autocomplete="off">
+        </div>
+    </div>
+</div>
+<div class="row">
+    <div class="col-md-12 text-center">
+        <a class="btn btn-primary" href="#/step4" ng-disabled="setup_form.username.$invalid">Done</a>
+    </div>
+</div>

webadmin/src/views/setup/step4.html

@@ -0,0 +1,8 @@
+<center>
+    <h1>All done!</h1>
+    <br/>
+    <br/>
+    <i class="fa fa-spinner fa-pulse fa-5x"></i>
+    <br/>
+    <br/>
+</center>