box-filelist.html

<div class="boxes">
    <div class="contentblock">
        <h2>
            Adattár
        </h2>
        <div class="content">
            <ul class="file-list">
                <li class="wm small">
                    <div class="summary">
                        <div class="name">Jelenlegi hely: <span data-bind="text: currentPath"></span></div>
                        <div class="clear"></div>
                    </div>
                </li>
                <li class="wm real" data-bind="visible: notInRoot, click: jumpUp">
                    <div class="summary">
                        <div class="name filetype-jump-out">
                            ..
                        </div>
                        <div class="clear"></div>
                    </div>
                </li>
                <li class="wm small real" data-bind="visible: files().length == 0">
                    <div class="summary">
                        <div class="name">Nincs megjeleníthető fájl.</div>
                        <div class="clear"></div>
                    </div>
                </li>
                <!-- ko foreach: {data:files,afterAdd:fadeIn} -->
                <li class="wm real">
                    <div class="summary" data-bind="click: clickHandler">
                        <div class="name" data-bind="text: name, attr: {class: getTypeClass}"></div>
                        <div class="info" data-bind="text: size"></div>
                        <div class="actions">
                            <a href="#">
                                <img src="/static/icons/pencil.png" alt="rename" />
                            </a>
                            <a href="#" data-bind="click: $parent.delete, clickBubble: false">
                                <img src="/static/icons/minus-circle.png" alt="delete" />
                            </a>
                            <a href="#" data-bind="click: $parent.download, clickBubble: false">
                                <img src="/static/icons/download-cloud.png" alt="download" />
                            </a>
                        </div>
                        <div class="clear"></div>
                    </div>
                    <div class="details">
                        <div class="details-container">
                            <ul>
                                <li>Módosítva: <span class="value" data-bind="text: mTime"></span></li>
                                <li>Típus: <span class="value" data-bind="text: type"></span></li>
                            </ul>
                        </div>
                    </div>
                </li>
                <!-- /ko -->
                <li class="file-details wm" id="load-more-files" data-bind="visible: (files().length>0 && files().length != allFiles.length)">
                    <div class="summary" data-bind="click: showMore">
                        <div class="name filetype-more">
                            Mutass több fájlt!
                        </div>
                        <div class="clear"></div>
                    </div>
                </li>
                <li class="wm">
                    <div class="summary">
                        <div class="name filetype-new-folder">Új mappa</div>
                        <div id="new-folder-form">
                            <input type="text" placeholder="Új mappa neve" data-bind="value: newFolderName, click: function(m,e){console.log(arguments); e.preventDefault(); e.stopPropagation(); return false;}" />
                            <input type="submit" data-bind="click: newFolder, clickBubble: false" value="Létrehozás" />
                        </div>
                        <div class="clear"></div>
                    </div>
                </li>
                <li class="file-upload wm">
                    <div class="summary" data-bind="click: getUploadURL">
                        <div class="name filetype-up">Fájlfeltöltés</div>
                        <div class="clear"></div>
                    </div>
                    <div class="details">
                        <div class="container">
                            <form method="POST" data-bind="attr: {action: uploadURL}" enctype="multipart/form-data">
                                {% csrf_token %}
                                <input name="data" type="file" />
                                <input type="submit" value="Feltöltés"/>
                            </form>
                        </div>
                    </div>
                </li>
                <li class="wm small">
                    <div class="summary">
                        <div class="quota">
                            <div class="used" style="background-color: rgba(0,255,0,0.2); width: 2%"></div>
                        </div>
                        <div class="name">Kvóta: 20MB/2GB</div>
                        <div class="clear"></div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</div>