{% extends "base.html" %}
{% load i18n %}

{% block content %}
<div class="boxes">
        <div class="contentblock" id="state">
            <h2>Virtuális gépek</h2>
            <ul class="wm-list">
                {% include "box-vmlist.html" %}
                <li id="new-wm-button" class="wm">
                    <div class="summary">
                        <div class="name">Új gép indítása</div>
                        <div class="clear"></div>
                    </div>
                </li>
                <li id="new-wm" style="display: none">
                    <h2>Rendelkezésre álló sablonok</h2>
                    {% for m in templates %}
                        <form method="POST" action="/vm/new/{{m.pk}}/">{% csrf_token %}
                            <p><input type="submit" value="{{m.name}}" class="button widebutton"/></p>
                        </form>
                    {% endfor %}
                </li>
            </ul>
        </div>
    {% for box in boxes %}
    {% if forloop.counter0|divisibleby:2 %}
        <div class="contentblock">
            <h2>{{ box.title }}</h2>
            <div class="content">
                {{ box.text|safe }}
            </div>
        </div>
    {% endif %}
    {% endfor %}
</div>
<div class="boxes">
    <div class="contentblock">
        <h2>
            Adattár
        </h2>
        <div class="content">
            <ul class="file-list">
                <li class="wm">
                    <div class="summary">
                        <div class="name filetype-c">hello.c</div>
                        <div class="info">1 Kb</div>
                        <div class="actions">
                            <a href="#"><img src="/static/icons/pencil.png" alt="rename" /></a>
                            <a href="#"><img src="/static/icons/minus-circle.png" alt="delete" /></a>
                            <a href="#"><img src="/static/icons/download-cloud.png" alt="download" /></a>
                        </div>
                        <div class="clear"></div>
                    </div>
                    <div class="details">
                        <h3>Részletek</h3>
                        <ul>
                            <li>Létrehozva: <span class="value">2012.12.29. 23:12</span></li>
                            <li>Módosítva: <span class="value">2012.12.29. 23:12</span></li>
                            <li>Hozzáférés: <span class="value">2012.12.29. 23:12</span></li>
                            <li>Típus: <span class="value">text/plain</span></li>
                        </ul>
                    </div>
                </li>
                <li class="wm">
                    <div class="summary">
                        <div class="name filetype-image">suna.jpg</div>
                        <div class="info">1 Kb</div>
                        <div class="actions">
                            <a href="#"><img src="/static/icons/pencil.png" alt="rename" /></a>
                            <a href="#"><img src="/static/icons/minus-circle.png" alt="delete" /></a>
                            <a href="#"><img src="/static/icons/download-cloud.png" alt="download" /></a>
                        </div>
                        <div class="clear"></div>
                    </div>
                    <div class="details">
                        <h3>Részletek</h3>
                        <ul>
                            <li>Létrehozva: <span class="value">2012.12.29. 23:12</span></li>
                            <li>Módosítva: <span class="value">2012.12.29. 23:12</span></li>
                            <li>Hozzáférés: <span class="value">2012.12.29. 23:12</span></li>
                            <li>Típus: <span class="value">image/jpg</span></li>
                        </ul>
                    </div>
                </li>
                <li class="wm">
                    <div class="summary">
                        <div class="name filetype-folder">poresz</div>
                        <div class="info">katalógus</div>
                        <div class="actions">
                            <a href="#"><img src="/static/icons/pencil.png" alt="rename" /></a>
                            <a href="#"><img src="/static/icons/minus-circle.png" alt="delete" /></a>
                        </div>
                        <div class="clear"></div>
                    </div>
                    <div class="details">
                        <h3>Részletek</h3>
                        <ul>
                            <li>Létrehozva: <span class="value">2012.12.29. 23:12</span></li>
                            <li>Módosítva: <span class="value">2012.12.29. 23:12</span></li>
                            <li>Hozzáférés: <span class="value">2012.12.29. 23:12</span></li>
                            <li>Fájlok: <span class="value">666 db</span></li>
                        </ul>
                    </div>
                </li>
                <li class="wm" style="display: none">
                    <div class="summary">
                        <div class="name filetype-text">matlab_serial.txt</div>
                        <div class="info">358 Kb</div>
                        <div class="actions">
                            <a href="#"><img src="/static/icons/pencil.png" alt="rename" /></a>
                            <a href="#"><img src="/static/icons/minus-circle.png" alt="delete" /></a>
                            <a href="#"><img src="/static/icons/download-cloud.png" alt="download" /></a>
                        </div>
                        <div class="clear"></div>
                    </div>
                    <div class="details">
                        <h3>Részletek</h3>
                        <ul>
                            <li>Létrehozva: <span class="value">2012.12.29. 23:12</span></li>
                            <li>Módosítva: <span class="value">2012.12.29. 23:12</span></li>
                            <li>Hozzáférés: <span class="value">2012.12.29. 23:12</span></li>
                            <li>Típus: <span class="value">text/plain</span></li>
                        </ul>
                    </div>
                </li>
                <li class="file-details wm" id="load-more-files">
                    <div class="summary">
                        <div class="name filetype-more">
                            Mutasd a régebbi fájlokat! 
                        </div>
                        <div class="actions" style="text-align: right; display: none">
                            <img src="/static/load-3.gif" alt="loading" />
                        </div>
                        <div class="clear"></div>
                    </div>
                </li>
                <li class="file-upload wm">
                    <div class="summary">
                        <div class="name filetype-up">Fájlfeltöltés</div>
                        <div class="clear"></div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</div>
{% endblock %}