{% extends "base.html" %}
{% block title %}Inici{% endblock %}
{% load staticfiles %}
{% block content %}

<div class="maincontent">
	<div id="leftbar">
		<div id="news">
			{% if noticies %}
			{% for noticia in noticies %}
			<div class="card">
				<a class="title" href="/read/{{ noticia.id }}">{{ noticia.titol }}</a>
				{% if noticia.media.all|length == 0 %}
				<div class="img" style="background-image: url('{% static "media/news.png" %}')"></div>
				{% elif noticia.media.all.0.isvideo %}
				<div class="img" style="background-image: url('{% static "media/video.png" %}')"></div>
				{% else %}
				<div class="img" style="background-image: url('{{ noticia.media.all.0.file.url }}')"></div>
				{% endif %}
					<span>
						<i class="fa fa-calendar" title="Data"></i><b>{{ noticia.data|date:"j F Y" }} {{ noticia.data|date:"H:i O" }}</b>
						<a href="/profile/{{ noticia.autor }}"><i class="fa fa-user" title="Autor"></i><b>{{ noticia.autor }}</b></a>
						<a href="/news/{{ noticia.categoria }}"><i class="fa fa-quote-left" title="Categoria"></i><b>{{ noticia.categoria }}</b></a>
						<a href="/read/{{ noticia.id }}/#comments"><i class="fa fa-comments" title="Comentaris"></i><b>{{ noticia.comentari_set.count }} comentaris</b></a>
						{% if noticia.geolatitud != 0 %}
						<i class="fa fa-map-marker" title="Localització"></i><b>{{ noticia.localitzacio }}</b>
						{% endif %}
					</span>
				<div class="text">{{ noticia.contingut | safe }}</div>
			</div>
			{% endfor %}
			{% else %}
			<span style="font-size:12px">No hi ha notícies per mostrar<span>
			{% endif %}
		</div>
	</div>
	<div id="rightbar">
		{% if user.is_authenticated %}
		<div class="userinfo">
			{% if profileDataProfile.picture %}
			<a href="/profile/"><div class="img rnd100" style="background-image: url('{{ profileDataProfile.picture.url }}');"></div></a>
			{% else %}
			<a href="/profile/"><div class="img rnd100" style="background-image: url('{% static "media/user.png" %}');"></div></a>
			{% endif %}
			<div class="userdata">
				<i class="fa fa-camera"></i>{{ profileDataProfile.num_fotos }}
			</div>
			<div class="userdata">
				<i class="fa fa-video-camera"></i>{{ profileDataProfile.num_videos }}
			</div>
			<div class="userdata">
				<i class="fa fa-comments"></i>{{ profileDataProfile.num_comentaris }}
			</div>
			<div class="userdata">
				<i class="fa fa-pencil"></i>{{ profileDataProfile.num_noticies }}
			</div>
			<a href="/profile/"><span class="name">{{ user.username }}</span></a>
			<span class="realname">{{ user.fname }} {{ user.lname }}</span>
		</div>
		{% else %}
		<div class="loginpanel" id="login">
			<a href="/register">Nou usuari?</a>
			<span>Connecta't</span>
			<form action="/login/" method="post">{% csrf_token %}
			    <label for="username">Usuari</label>
			    <input id="username" type="text" value="" name="username">
			    <br>
			    <label for="password">Contrasenya</label>
			    <input id="password" type="password" value="" name="password">
			    <br>
			    <input class="button" type="submit" value="ENTRAR" />
		    </form>
		</div>
		{% endif %}
		<br>
		<div id="map_canvas" class="minimap"></div>
	</div>
</div>

{% endblock %}