Angular UI for Simple Go Chat

After reading Allan’s article, I just wanted to put a simple UI on that so that iI could test using it as multiple users. So I created a simple AngularJS app that uses Allan’s very efficient long polling chat application.

The code can be used/forked or whatever from github - If you want to try it, clone the repo and start chit-chat.go with the command go run chit-chat.go. After that you can simply navigate to http://localhost:9000/ to be presented with the web front end. Enter your name and start chatting.

Test Server

You can try the chat at:

Here is the code for the simple go chat AngularUI

The Code

    <title>Chat App</title>
    <link href="//" rel="stylesheet">
    <script src=""></script>
    <script src=""></script>
    <script src="app.js"></script>

<body ng-app="GoChatApp" ng-controller="MainController as main" ng-load="">
<div class="container">
    <div class = "page-header">

            <small>Go Chat</small>


    <div class="message-history">
        <div class="form-group">
            <div id="chat" ng-model="chatLines" style="height: 60%;overflow:auto;"></div>

        <form role="form" ng-submit="sendMsg()">
            <div class="row">
                <div class="col-xs-12">
                    <div class="input-group">
                        <input ng-model="typedInput" type="text" class="form-control" />
                        <div class="input-group-btn">
                            <button type="submit" class="btn">Send</button>
var app = angular.module("GoChatApp", []);
app.controller("MainController", function($scope, $http) {

    $scope.username = ""
    $scope.chatLines = []
    $scope.typedInput = ""

    $scope.getNewData = function()
        $http.get("/chat").then(function (response) {
            $scope.chatLines.splice(0, 0, + "<br>");
            if($scope.chatLines.length > 200)
                $scope.chatLines.splice($scope.chatLines.length-1, 1);
            $( "#chat" ).html($scope.chatLines);

    $scope.sendMsg = function() {
        var data = $.param({
            body: $scope.username + ": " + $scope.typedInput
            method: 'POST',
            url: '/chat',
            data: data,
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            }}).then(function(result) {
        }, function(error) {
        $scope.typedInput = ""

    $( "#chat" ).html($scope.chatLines);

    while ($scope.username == "") {
        $scope.username = prompt("Please enter your name", "");
    $scope.username = "<b>" + $scope.username + "</b>"

*** Sign up for my email list to keep in touch with all the interesting new happenings in the go community with the GolangNewsFeed

comments powered by Disqus