Skip to content

Instantly share code, notes, and snippets.

@domadev812
Forked from ToeJamson/1.html
Last active November 15, 2017 21:06
Show Gist options
  • Save domadev812/1d0f328d42c942b4044605023da29f45 to your computer and use it in GitHub Desktop.
Save domadev812/1d0f328d42c942b4044605023da29f45 to your computer and use it in GitHub Desktop.
encrypted AngularJS
<!doctype html>
<html>
<head>
<script src="<location-of-PubNub-SDK>/pubnub-angular-4.0.2.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<script src="//code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="http://pubnub.github.io/angular-js/scripts/pubnub-angular.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">
</head>
<body>
// Register for presence events (optional)
$rootScope.$on(Pubnub.getPresenceEventNameFor($scope.selectedChannel), function (ngEvent, pnEvent) {
// apply presence event (join|leave) on users list
handlePresenceEvent(pnEvent);
});
// Pre-Populate the user list (optional)
PubNub.hereNow(
{
channels: [$scope.channel]
},
function (status, response) {
// handle status, response
}
);
});
</script>
</body>
</html>
// we must call angular "bootstrap" since we're running two separate
// angular apps for normal/encrypted views
angular.bootstrap($('#unencrypted'),['PubNubAngularUnencryptedApp']);
<div class="container" ng-app="PubNubAngularApp" ng-controller="EncryptedChatCtrl">
<h4>Online Users</h4>
<ul>
<li ng-repeat="user in users">{{user}}</li>
</ul>
<h4>Chat History {{messages.length}}</h4>
<form ng-submit='publish()'>
<input type="text" ng-model='newMessage' />
<input type="submit" value="Send" />
</form>
<div class="well">
<ul>
<li ng-repeat="message in messages">{{message}}</li>
</ul>
</div>
angular.module('PubNubAngularApp', ["pubnub.angular.service"])
.controller('ChatCtrl', function($rootScope, $scope, $location, PubNub) {
// make up a user id (you probably already have this)
$scope.userId = "User " + Math.round(Math.random() * 1000);
// make up a channel name
$scope.channel = 'The Angular ENCRYPTED Channel';
// pre-populate any existing messages (just an AngularJS scope object)
$scope.messages = ['Welcome to ' + $scope.channel];
if (!$rootScope.initialized) {
// Initialize the PubNub service
Pubnub.init({
subscribeKey: "mySubscribeKey",
publishKey: "myPublishKey",
ssl: true
})
$rootScope.initialized = true;
}
// Subscribe to the Channel
PubNub.ngSubscribe({ channel: $scope.channel });
PubNub.subscribe({channel: $scope.channel})
// Create a publish() function in the scope
$scope.publish = function() {
PubNub.publish(
{
channel: $scope.channel,
message: "[" + $scope.userId + "] " + $scope.newMessage
},
function(status, response){
console.log(response);
}
);
$scope.newMessage = '';
};
// Register for message events
$rootScope.$on(Pubnub.getMessageEventNameFor($scope.channel), function (ngEvent, payload) {
scope.$apply(function () {
// add message to the messages list
$scope.chatMessages.unshift(payload.message);
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment