mirror of
https://github.com/Febbweiss/filebrowser-durandal-widget.git
synced 2026-03-04 22:25:43 +00:00
34 lines
1.2 KiB
HTML
34 lines
1.2 KiB
HTML
<div class="row-fluid">
|
|
<aside class="col-sm-2 col-md-2">
|
|
<div data-bind="widget: {kind:'filebrowser'}"></div>
|
|
</aside>
|
|
|
|
<main class="col-sm-10 col-md-6" id="main">
|
|
<pre data-bind="visible: content">
|
|
<code data-bind="attr: {css: type}, text: content" id="editor"></code>
|
|
</pre>
|
|
<span class="text-center" data-bind="visible: !content()">Open file to view it.</span>
|
|
</main>
|
|
|
|
<aside class="col-sd-12 col-md-4" id="helpPane">
|
|
<h2>Welcome to the filebrowser Durandal widget demo</h2>
|
|
<p>
|
|
This <a href="http://durandaljs.com/" target="_blank">Durandal</a> widget allows to display a folder tree and add some actions to manipulate this items.
|
|
<ul>
|
|
<li>A clic on a file or folder selects it.
|
|
<li>A double-clic opens / closes a folder</li>
|
|
<li>A double-clic displays the file content in the editor</li>
|
|
<li>
|
|
A right-clic opens a context menu with different options :
|
|
<ul>
|
|
<li>Rename the item</li>
|
|
<li>Copy the selected item(s)</li>
|
|
<li>Paste the selected item(s)</li>
|
|
<li>Create an item (in a folder)</li>
|
|
<li>Delete an item (and its components)</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</p>
|
|
</aside>
|
|
</div> |