acha-framework
Version:
is a modular framework on both client (angular.js) and server (node.js) side, it provides security, orm, ioc, obfuscation and ...
258 lines (247 loc) • 13 kB
HTML
<div ng-show="visible" class="af-file-manager noselect af-component {{::cssClass}}">
<div ng-if="::toolbar" class="meta-container clearfix">
<div class="info">
<i class="af-icon af-icon-binders_folder"></i>
<span>
{{::toolbarTitle|textOrTranslate:toolbarTitleTranslate}}
</span>
</div>
<div class="actions">
<div class="af-drop-menu af-component">
<a class="drop-handler" href="javascript:void(0)">
<i class="af-icon af-icon-settings_3"></i>
<span class="menu-title">
{{::toolbarActionsTitle|textOrTranslate:toolbarActionsTitleTranslate}}
</span>
<i class="fa fa-caret-down"></i>
<ul class="menu-items">
<li ng-if="::!action.separator"
ng-repeat-start="action in toolbarActions"
ng-click="vm.onAction(action)">
<div>
<i class="{{::action.icon}}"></i>
<span class="menu-item-title">
{{::action.title|textOrTranslate:action.titleTranslate}}
</span>
</div>
</li>
<li ng-if="::action.separator"
ng-repeat-end=""
class="separator"></li>
</ul>
</a>
</div>
</div>
</div>
<div class="inner-container">
<ribbon buttons="vm.ribbon" on-action="vm.onRibbonAction">
<step icon="'af-icon af-icon-dossier_folder'"
title-translate="'fileManager.operations'">
<section title-translate="'fileManager.clipboard'" name="'clipboard'">
<button css-class="'btn-copy'"
enabled="false"
key="'copy'"
icon="'af-icon af-icon-copy'"
title-translate="'fileManager.copy'"></button>
<button css-class="'btn-paste'"
enabled="false"
key="'paste'"
icon="'af-icon af-icon-paste'"
title-translate="'fileManager.paste'"></button>
<button css-class="'btn-cut'"
enabled="false"
key="'cut'"
icon="'af-icon af-icon-cut'"
title-translate="'fileManager.cut'"></button>
</section>
<section title-translate="'fileManager.organize'" name="'organize'">
<button css-class="'btn-delete'"
enabled="false"
key="'delete'"
icon="'af-icon af-icon-delete'"
title-translate="'fileManager.delete'"></button>
<button css-class="'btn-rename'"
enabled="false"
key="'rename'"
icon="'af-icon af-icon-rename'"
title-translate="'fileManager.rename'"></button>
</section>
<section title-translate="'fileManager.new'" name="'new'">
<button css-class="'btn-new'"
key="'new-folder'"
icon="'af-icon af-icon-new-folder'"
title-translate="'fileManager.newFolder'"></button>
</section>
<section title-translate="'fileManager.transfer'" name="'transfer'">
<button css-class="'btn-download'"
enabled="false"
key="'download'"
icon="'af-icon af-icon-download'"
title-translate="'fileManager.download'"></button>
<button css-class="'btn-upload'"
key="'upload'"
icon="'af-icon af-icon-upload'"
title-translate="'fileManager.upload'"></button>
</section>
<section title-translate="'fileManager.open'" name="'open'">
<button css-class="'btn-open'"
enabled="false"
key="'open'"
icon="'af-icon af-icon-open'"
title-translate="'fileManager.open'"></button>
<button css-class="'btn-preview'"
enabled="false"
key="'preview'"
icon="'af-icon af-icon-preview'"
title-translate="'fileManager.preview'"></button>
</section>
<section title-translate="'fileManager.compression'" name="'compression'">
<button css-class="'btn-add-to-zip'"
enabled="false"
key="'zip'"
icon="'af-icon af-icon-archive'"
title-translate="'fileManager.addToZip'"></button>
<button css-class="'btn-extract'"
enabled="false"
icon="'af-icon af-icon-open_archive'"
title-translate="'fileManager.extract'">
<sub-button icon="'af-icon af-icon-file'"
key="'extract-all'"
title-translate="'fileManager.extractAllHere'"></sub-button>
<sub-button icon="'af-icon af-icon-folder'"
key="'extract-seprate'"
title-translate="'fileManager.extractSeprate'"></sub-button>
</button>
</section>
<section title-translate="'fileManager.selection'" name="'select'">
<button css-class="'btn-select-all'"
inline="true"
icon="'af-icon af-icon-select_all'"
key="'select-all'"
title-translate="'fileManager.selectAll'"></button>
<button css-class="'btn-select-none'"
inline="true"
key="'select-none'"
icon="'af-icon af-icon-deselect_all'"
title-translate="'fileManager.selectNone'"></button>
<button css-class="'btn-select-invert'"
inline="true"
key="'select-invert'"
icon="'af-icon af-icon-invert_selection'"
title-translate="'fileManager.invertSelection'"></button>
</section>
</step>
<step icon="'af-icon af-icon-columns'"
title-translate="'fileManager.view'">
<section title-translate="'fileManager.panes'" name="'panes'">
<button css-class="'btn-navigation'"
toggle="true"
key="'navigation-pane'"
icon="'af-icon af-icon-close_pane_ltr'"
title-translate="'fileManager.navigationPane'"></button>
</section>
<section title-translate="'fileManager.layout'" name="'layout'">
<column>
<button css-class="'btn-ex-icon'"
toggle="true"
key="'xlarge-icons'"
inline="true"
toggle-group="'selection'"
icon="'af-icon af-icon-xlarge_icons'"
title-translate="'fileManager.xLargeIcons'"></button>
<button css-class="'btn-m-icon'"
toggle="true"
inline="true"
key="'medium-icons'"
toggle-group="'selection'"
icon="'af-icon af-icon-medium_icons'"
title-translate="'fileManager.mediumIcons'"></button>
<button css-class="'btn-d-icon'"
toggle="true"
inline="true"
key="'details-icons'"
toggle-group="'selection'"
icon="'af-icon af-icon-details_icons'"
title-translate="'fileManager.detailsIcons'"></button>
</column>
<column>
<button css-class="'btn-l-icon'"
toggle="true"
inline="true"
key="'large-icons'"
toggle-group="'selection'"
icon="'af-icon af-icon-large_icons'"
title-translate="'fileManager.largeIcons'"></button>
<button css-class="'btn-s-icon'"
toggle="true"
inline="true"
key="'small-icons'"
toggle-group="'selection'"
icon="'af-icon af-icon-small_icons'"
title-translate="'fileManager.smallIcons'"></button>
<button css-class="'btn-t-icon'"
toggle="true"
inline="true"
key="'tiles-icons'"
toggle-group="'selection'"
icon="'af-icon af-icon-tiles_icons'"
title-translate="'fileManager.tilesIcons'"></button>
</column>
</section>
</step>
</ribbon>
<div class="af-navigation-bar af-component clearfix">
<progressbar ng-if="vm.uploading"
model="vm.uploadPercent"
css-class="'progress-xxs'"></progressbar>
<crumb-nav waiting="vm.waiting"
on-refresh="vm.onCrumbRefresh"
on-select="vm.onCrumbFolderPicked"
model="vm.crumbNav"></crumb-nav>
<div class="search-container">
<div class="input-group clearfix">
<input type="text"
ng-readonly="vm.waiting"
ng-model="vm.search"
placeholder="{{::searchTitle|textOrTranslate:searchTitleTranslate}}">
<div class="prefix">
<button ng-disabled="vm.waiting"
ng-click="vm.refresh()">
<i class="af-icon af-icon-search"></i>
</button>
</div>
</div>
</div>
</div>
</div>
<div class="af-split-panel af-component {{vm.treeToggle? '' :'no-tree'}} clearfix">
<div ng-if="vm.treeToggle" class="panel folder-explorer-panel fixed">
<tree on-node-expand="vm.onNodeExpand"
on-node-select="vm.onNodeSelect"
items="vm.tree"></tree>
</div>
<div class="panel-handler">
<div class="panel-handler-button">
<button ng-click="vm.toggleExplorer($event)">
<i class="fa fa-caret-{{vm.treeToggle? 'left' :'right'}}"></i>
</button>
</div>
</div>
<div class="panel file-explorer-panel">
<waiting ng-if="vm.waiting"></waiting>
<file-explorer ng-if="!vm.waiting"
path="vm.path"
mode="vm.mode"
on-rename="vm.onExplorerRename"
new-folder="vm.newFolder"
on-new-folder="vm.onExplorerNewFolder"
multiple-selection="multipleSelection"
on-parent="vm.onExplorerParent"
on-double-select="vm.onExplorerDoubleSelect"
on-select="vm.onExplorerSelect"
search="vm.search"
items="vm.fileExplorer">
</file-explorer>
</div>
</div>
</div>