AngularJS 1.4
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.6/angular.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://cdn.rawgit.com/angular-ui/bootstrap-bower/0.13.4/ui-bootstrap-tpls.js"></script>
<script src="https://cdn.firebase.com/js/client/2.2.4/firebase.js"></script>
<script src="https://cdn.firebase.com/libs/angularfire/1.1.3/angularfire.min.js"></script>
<body ng-app="myApp" ng-controller="chatCtrl">
<input type="text" ng-model="usuarioLogado.login" placeholder="Usuario"></input>
<button type="button" ng-click="logar(usuarioLogado)">LOGAR</button>
<button type="button" ng-click="limparUsuariosLogados()">Limpar Usuarios</button>
</br>
</br>
<div class="col-md-8" ng-if="logado">
<div class="panel panel-info">
<div class="panel-heading">
Mensagens Recentes
</div>
<div class="panel-body" style="max-height: 450;overflow-y: scroll;">
<ul class="media-list" ng-repeat="message in messages track by $index">
<li class="media" >
<div class="media-body">
<div class="media">
<a class="pull-left" href="#">
<img class="img-arredondadaChat"/>
</a>
<div class="media-body" >
{{message.text}}
<br />
<small class="text-muted">{{message.user}}</small>
<hr />
</div>
</div>
</div>
</li>
</ul>
</div>
<div class="panel-footer" >
<div class="input-group">
<input type="text" class="form-control" placeholder="Enter Message" ng-model="newmessage.text" />
<span class="input-group-btn">
<button class="btn btn-info" type="button" ng-click="novaMensagem(newmessage); mensagemPara(target)">SEND</button>
</span>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="panel...
JavaScript
var app = angular.module('myApp', ['ui.bootstrap', 'firebase']);
app.factory('Message', function($firebaseArray, $firebaseObject) {
var ref = new Firebase('https://chatexample0.firebaseio.com');
var messages = $firebaseArray(ref.child('messages'));
var Message = {
all: messages,
create: function(message) {
return messages.$add(message);
},
get: function(messageId) {
return $firebaseObject(ref.child('messages').child(messageId));
},
delete: function(message) {
return messages.$remove(message);
}
};
return Message;
});
app.factory('User', function($firebaseArray, $firebaseObject) {
var ref = new Firebase('https://chatexample0.firebaseio.com');
var users = $firebaseArray(ref.child('users'));
var User = {
//Lista todos os usuários
all: users,
create: function(user) {
return users.$add(user).then(function(ref) {});
},
get: function(userId) {
return $firebaseObject(ref.child('users').child(userId));
},
delete: function(user) {
users.$remove(user).then(function(ref) {
ref.key() === user.$id; // true
});
}
};
return User;
});
app.controller('chatCtrl', function($scope, Message, User, $firebaseObject) {
//Carrega as mensanges em tempo real do banco
$scope.message = Message.all;
$scope.users = User.all;
$scope.usuarioLogado = "";
$scope.$remove
$scope.newmessage= "";
$scope.limparUsuariosLogados = function() {
var ref = new Firebase('https://chatexample0.firebaseio.com/users');
var obj = $firebaseObject(ref);
obj.$remove().then(function(ref) {
$scope.logado = false;
}, function(error) {
console.log("Error:", error);
});
}
//Envia uma nova mensagem
$scope.novaMensagem = function(message) {
...