Skip to content

Instantly share code, notes, and snippets.

@lricoy

lricoy/new_team.html

Last active October 14, 2015 13:54
Show Gist options
  • Save lricoy/6f898503835e60a8aef9 to your computer and use it in GitHub Desktop.
Save lricoy/6f898503835e60a8aef9 to your computer and use it in GitHub Desktop.
Download ZIP
New Team Page Foxus
Raw
new_team.html
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<base href="/">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="theme-color" content="#F44336">
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.11.2/angular-material.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=RobotoDraft:300,400,500,700,400italic">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<style>
html {
overflow: hidden;
}
body {
background: url('http://www.theworkher.com/wp-content/uploads/2014/11/Desktop.jpg') no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: 100%;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
transition: background-color 5000s ease-in-out 0s;
}
</style>
</head>
<body ng-app="newFoxusTeamApp"
ng-controller="SignupCtrl"
style="background-color:#F2F2F2;";
layout="row"
layout-wrap
flex>
<div layout="column" style="width: 100%; overflow: hidden;" layout-align="start center">
<div layout-fill layout="row" layout-align="center center">
<md-content class="md-whiteframe-23dp"
style="max-width: 400px;"
layout-margin
layout-padding
flex
layout="column">
<div layout="column" layout-align="center center">
<img src="https://s3-sa-east-1.amazonaws.com/foxus-cdn/logo_fox.png" style="width: 120px;">
<!-- <h1 class="md-title">O seu gerenciador de atividades</h1> -->
</div>
<div layout="column">
<h2 class="md-title">Cadastro</h2>
<!-- <p class="md-body-1">
Digite seu email e sua senha para fazer login no foxus.
</p> -->
</div>
<form name="form" ng-submit="register(form)" novalidate ng-if="!created">
<md-input-container>
<label>Nome</label>
<input type="name" id="inputEmail" name="name" ng-model="user.name" required mongoose-error>
<div ng-messages="form.name.$error" ng-if='form.name.$dirty'>
<div ng-message="required">Favor informar um nome</div>
</div>
</md-input-container>
<md-input-container>
<label>Email</label>
<input type="email" id="inputEmail" name="email" ng-model="user.email" required mongoose-error>
<div ng-messages="form.email.$error" ng-if='form.email.$dirty'>
<div ng-message="email">Esse e-mail não parece ser válido :(</div>
<div ng-message="required">Qual seu e-mail?</div>
<div ng-message="mongoose">{{ errors.email }}</div>
</div>
</md-input-container>
<div layout="row">
<md-button type="submit" class="md-raised md-primary" flex ng-disabled="submitted">
Criar meu foxus
</md-button>
</div>
<div layout="row">
<p ng-if="submitted">
Aguarde, estamos criando sua solução de produtividade pessoal...
</p>
</div>
</form>
<div ng-if="created">
<h4 class="md-title">Equipe criada com sucesso! Você receberá um e-mail com as instruções para finalizar seu cadastro.</h4>
</div>
</md-content>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-resource.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-cookies.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.18/angular-messages.min.js"></script>
<!-- Angular Material Dependencies -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.11.2/angular-material.min.js"></script>
<script type="text/javascript">
angular.module('newFoxusTeamApp', [
'ngCookies',
'ngResource',
'ngMessages',
'ngMaterial'
])
.controller('SignupCtrl', function ($scope, $window, $log, $q, $http, $location) {
$scope.user = {};
$scope.errors = {};
$scope.user.email = $location.search().email || undefined;
$scope.user.name = $location.search().name || undefined;
$location.url($location.path()); // Clear the query string
$scope.register = function(form) {
$scope.submitted = true;
if(form.$valid) {
postSignup({
name: $scope.user.name,
email: $scope.user.email
})
.then( function() {
// Account created
$scope.created = true;
},
function(err) {
$scope.errors = {};
$log.error(err);
// Update validity of form fields that match the mongoose errors
angular.forEach(err.errors, function(error, field) {
form[field].$setValidity('mongoose', false);
$scope.errors[field] = error.message;
});
});
}
};
var postSignup = function(user, callback) {
var cb = callback || angular.noop;
var deferred = $q.defer();
$http.post(
'http://admin.foxus.me/api/clients/invite_new', user
).
success(function(data) {
deferred.resolve(data);
return cb();
}).
error(function(err) {
deferred.reject(err);
return cb(err);
});
return deferred.promise;
};
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment