Index.cshtml

@{
    ViewData["Title"] = "View";
}

<div class="container" id="discussion" style="margin-top:20px;">

    <div id="history" class="col-sm-4 col-md-3" style="display:inline-block;border-right:solid 1px #eee">
        <ul style="list-style:none;padding-left:0px;">
            <li style="text-align:right;padding:20px; padding-left:0px; display:flex; justify-content:space-between; align-items:center; border-bottom:solid 1px #eee">
                <img src="https://cdn3.iconfinder.com/data/icons/iconic-1/32/user-48.png" alt="User" />
                <span>Georgi Stoimenov</span>
            </li>
            <li>Veselin Stoimenov</li>
            <li>Stoimen Georgiev</li>
            <li>Stamen Veselinov</li>
        </ul>
    </div>

    <div id="chat-box" class="col-sm-8 col-md-9" style="display:inline-block;">
        <div id="chat-box" style="overflow:auto">
            <ul style="list-style:none;padding-left:0px;">
                <li class="col-sm-10 col-md-10" style="text-align:left">Hi</li>
                <li class="col-sm-offset-6 col-sm-6 col-md-offset-6 col-md-6" style="text-align:right">Hello</li>
            </ul>
        </div>
        <div class="form-row" style="margin-top:10px;">
            <div class="form-group col-sm-10 col-md-10" style="padding-right:2px;">
                <input class="form-control" type="text" id="message" />
            </div>
            <input class="btn btn-primary col-sm-2 col-md-2" type="button" id="sendMessage" value="Send" />
        </div>
    </div>
</div>

@section Scripts {

    @*<script type="text/javascript">
            var name = prompt('Enter your name:', '');

            var transport = signalR.TransportType.WebSockets;
            var connection = new signalR.HubConnection(`http://${document.location.host}/chat`, { transport: transport });


            var messageInput = document.getElementById('message');
            connection.on('broadcastMessage', (name, message) => {
                var liElement = document.createElement('li');
                liElement.innerHTML = '<strong>' + name + '</strong>:&nbsp;&nbsp;' + message;
                document.getElementById('discussion').appendChild(liElement);
            });

            var button = document.getElementById("sendMessage");
            button.addEventListener("click", event => {
                connection.invoke('send', name, messageInput.value);
                messageInput.value = '';
                messageInput.focus();
            });

            connection.start().then(() => {
                console.log('called!');
                connection.invoke('register', name);
            });
        </script>*@

    @*<script type="text/javascript" src="~/lib/signalr/dist/signalr-client-1.0.0-alpha2-final.js"></script>*@
}