{% extends "base.html" %}
{% block title %}Главна блога{% endblock %}
{% block body %}
	<div class="intro-header">
		<div class="container">
			<div class="row">
				<div class="col-lg-12">
					<div class="intro-message">
						<h1>Мой блог</h1>
						<h3>Блог Александра Шестакова</h3>
						<h4>{{ config_name }}</h4>
						<hr class="intro-divider">
						<form action="" id="emit">
							<input type="text" id="emit_data">
							<input type="submit" value="emit">
						</form>
						<form action="" id="broadcast">
							<input type="text" id="broadcast_data">
							<input type="submit" value="emit">
						</form>
						<div id="log"></div>
					</div>
				</div>
			</div>
		</div>
	</div>
{% endblock %}
{% block scripts %}
	<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.6/socket.io.min.js"></script>
	<script type="text/javascript" charset="utf-8">
		{#var socket = io.connect('http://' + document.domain + ':' + location.port);
		socket.on('connect', function() {
			socket.emit('my event', {data: 'I\'m connected!'});
		});#}
		$(document).ready(function() {
			var socket = io.connect('//' + document.domain + ':' + location.port + '/test/websocket');
			socket.on('my response', function(msg) {
				$('#log').append('<p>Received: ' + msg.data + '</p>');
			});
			$('form#emit').submit(function(event) {
				socket.emit('my event', {data: $('#emit_data').val()});
				return false;
			});
			$('form#broadcast').submit(function(event) {
				socket.emit('my broadcast event', {data: $('#broadcast_data').val()});
				return false;
			});
		});
	</script>
{% endblock %}