work in progress styling filemanager list: having now only one row with [+] button to upload, not yet giving path all remaining space

This commit is contained in:
Ralf Becker 2016-03-08 13:55:26 +00:00
parent 22d833affa
commit 396478215c
4 changed files with 61 additions and 155 deletions

View File

@ -294,7 +294,6 @@ class filemanager_ui
'parent_id' => 'dir',
'is_parent' => 'mime',
'is_parent_value'=> egw_vfs::DIR_MIME_TYPE,
'header_left' => 'filemanager.index.header_left',
'favorites' => true,
'placeholder_actions' => array('mkdir','file_drop_mail','file_drop_move','file_drop_copy','file_drop_symlink')
);
@ -492,9 +491,8 @@ class filemanager_ui
// Set view button to match current settings
if($content['nm']['view'] == 'tile')
{
$tpl->setElementAttribute('nm[buttons][button][change_view]','label',lang('List view'));
$tpl->setElementAttribute('nm[buttons][button][change_view]','image','list_row');
$tpl->setElementAttribute('nm[button][change_view]','statustext',lang('List view'));
$tpl->setElementAttribute('nm[button][change_view]','image','list_row');
}
// if initial load is done via GET request (idots template or share.php)
// get_rows cant call app.filemanager.set_readonly, so we need to do that here

View File

@ -11,68 +11,32 @@
/**
* CSS for new eTemplate filemanager UI
*/
.mimeHuge img { width: 64px; height: 64px; }
.fileName input { font-weight: bold; width: 100%; }
.previewImage img { max-width: 430px; max-height: 275px; border: 1px solid black; }
.previewText div { }
.pathSelection { font-weight: bold; }
.pathSelection a { font-weight: bold; font-size: 120%; }
.pathSelectionContainer { width: 640px; overflow: auto; }
/**
* Get path input to take all remaining width
*/
#filemanager-index_filemanager-index-header_left {
select#filemanager-index_filter {
width: 160px;
}
input#filemanager-index_path {
width: 300px;
font-size: 150%;
padding: 1px 5px 3px 2px;
}
#filemanager-index_filemanager-index-header_right .et2_hbox > *,
#filemanager-index_filemanager-index-header_row > *,
#filemanager-index_filemanager-index-header_left .et2_hbox > *
{
float: left;
width: 100%;
margin-bottom: 2px;
}
div.filemanager_navigation {
position: relative;
width: 100%;
white-space: normal;
#filemanager-index_filemanager-index-header_left .et2_file,
#filemanager-index_filemanager-index-header_left .et2_file input {
width: 24px;
}
div.filemanager_navigation > * {
vertical-align: middle;
}
div.filemanager_navigation > img {
margin-top: 3px;
}
#filemanager-index_buttons {
float: right;
}
button#filemanager-index_button\[change_view\] {
margin-right: 20px;
}
div.filemanager_navigation > label {
position: absolute;
left: 56px;
right: 456px;
font-size: 140%;
white-space: nowrap;
}
div.filemanager_navigation > label > input {
width: 100%;
}
#filemanager-index_buttons div.et2_file {
margin: 2px 0 0 0;
vertical-align: top;
padding-right: 7px;
}
#filemanager-index_buttons div.et2_file span, #filemanager-index_buttons div.et2_file input {
width: 130px;
height: 16px;
top: 0;
background-position: 3px 3px;
margin: 0;
text-indent: 22px;
color: #666666;
}
#filemanager-index_buttons div.et2_file .progress {
width:auto;
margin:0;
overflow: hidden;
text-overflow: ellipsis;
max-height: none;
#filemanager-index_filemanager-index-header_left .et2_file span {
width: 22px;
height: 22px;
padding: 0;
background-position-x: 3px;
background-image: url(../../../pixelegg/images/add.png);
overflow: hidden;
text-indent: 100px;
}
/**

View File

@ -45,25 +45,24 @@
</grid>
</template>
<template id="filemanager.index.header_left" template="" lang="" group="0" version="1.9.002">
<hbox span="all" class="filemanager_navigation">
<buttononly id="up" statustext="Up" image="goup" background_image="true" onclick="app.filemanager.change_dir('..',widget);"/>
<buttononly id="home" statustext="Go to your home directory" image="gohome" background_image="true" onclick="app.filemanager.change_dir('~',widget);"/>
<vfs-name label="Path" id="path" onchange="if(widget.getValue() == '') { app.filemanager.change_dir('~',widget);} return true;" size="80" class="address"/>
<hbox id="buttons">
<button statustext="Go to" id="button[go]" image="key_enter" background_image="true"/>
<buttononly statustext="Tile view" id="button[change_view]" onclick="app.filemanager.change_view" image="list_tile" background_image="true"/>
<buttononly statustext="Rename, change permissions or ownership" id="button[edit]" onclick="app.filemanager.editprefs();" image="edit" background_image="true"/>
<buttononly statustext="Create directory" id="button[createdir]" onclick="app.filemanager.createdir();" image="button_createdir" ro_image="createdir_disabled" background_image="true"/>
<buttononly statustext="Create a link" id="button[symlink]" onclick="app.filemanager.symlink();" image="link" ro_image="link_disabled" background_image="true"/>
<buttononly statustext="Paste" id="button[paste]" onclick="app.filemanager.paste('paste');" image="editpaste" ro_image="editpaste_disabled" background_image="true"/>
<buttononly statustext="Paste link" id="button[linkpaste]" onclick="app.filemanager.paste('linkpaste');" image="linkpaste" ro_image="linkpaste_disabled" background_image="true"/>
<buttononly statustext="Mail paste" id="button[mailpaste]" onclick="app.filemanager.paste('mailpaste');" image="mailpaste" ro_image="mailpaste_disabled" background_image="true"/>
<buttononly statustext="File a file" onclick="window.open(egw::link('/index.php','menuaction=stylite.stylite_filemanager.upload'),'_blank','dependent=yes,width=550,height=350,scrollbars=yes,status=yes');" image="upload" background_image="true"/>
<file statustext="Select file to upload in current directory" id="upload" progress_dropdownlist = "true" drop_target ="divAppbox" multiple="true" onFinishOne="app.filemanager.uploadOnOne"/>
</hbox>
</hbox>
<file statustext="Select file to upload in current directory" id="upload" progress_dropdownlist = "true" drop_target ="divAppbox" multiple="true" onFinishOne="app.filemanager.uploadOnOne"/>
</template>
<template id="filemanager.index.header_row" template="" lang="" group="0" version="1.9.002">
<buttononly id="up" statustext="Up" image="goup" background_image="true" onclick="app.filemanager.change_dir('..',widget);"/>
<buttononly id="home" statustext="Go to your home directory" image="gohome" background_image="true" onclick="app.filemanager.change_dir('~',widget);"/>
<vfs-name id="path" onchange="if(widget.getValue() == '') { app.filemanager.change_dir('~',widget);} return true;" size="80" class="address"/>
<buttononly statustext="Tile view" id="button[change_view]" onclick="app.filemanager.change_view" image="list_tile" background_image="true"/>
</template>
<template id="filemanager.index.header_right" template="" lang="" group="0" version="1.9.003">
<buttononly statustext="Rename, change permissions or ownership" id="button[edit]" onclick="app.filemanager.editprefs();" image="edit" background_image="true"/>
<buttononly statustext="Create directory" id="button[createdir]" onclick="app.filemanager.createdir();" image="button_createdir" ro_image="createdir_disabled" background_image="true"/>
<buttononly statustext="Create a link" id="button[symlink]" onclick="app.filemanager.symlink();" image="link" ro_image="link_disabled" background_image="true"/>
<!--buttononly statustext="Paste" id="button[paste]" onclick="app.filemanager.paste('paste');" image="editpaste" ro_image="editpaste_disabled" background_image="true"/>
<buttononly statustext="Paste link" id="button[linkpaste]" onclick="app.filemanager.paste('linkpaste');" image="linkpaste" ro_image="linkpaste_disabled" background_image="true"/>
<buttononly statustext="Mail paste" id="button[mailpaste]" onclick="app.filemanager.paste('mailpaste');" image="mailpaste" ro_image="mailpaste_disabled" background_image="true"/-->
<buttononly statustext="File a file" onclick="window.open(egw::link('/index.php','menuaction=stylite.stylite_filemanager.upload'),'_blank','dependent=yes,width=550,height=350,scrollbars=yes,status=yes');" image="upload" background_image="true"/>
</template>
<template id="filemanager.index" template="" lang="" group="0" version="1.9.003">
<nextmatch id="nm" template="filemanager.index.rows" header_left="filemanager.index.header_left"/>
<nextmatch id="nm" template="filemanager.index.rows" header_left="filemanager.index.header_left" header_row="filemanager.index.header_row" header_right="filemanager.index.header_right"/>
</template>
</overlay>

View File

@ -23,86 +23,31 @@
/**
* CSS for new eTemplate filemanager UI
*/
.mimeHuge img {
width: 64px;
height: 64px;
select#filemanager-index_filter {
width: 160px;
}
.fileName input {
font-weight: bold;
width: 100%;
input#filemanager-index_path {
width: 300px;
font-size: 150%;
padding: 1px 5px 3px 2px;
}
.previewImage img {
max-width: 430px;
max-height: 275px;
border: 1px solid black;
}
.pathSelection {
font-weight: bold;
}
.pathSelection a {
font-weight: bold;
font-size: 120%;
}
.pathSelectionContainer {
width: 640px;
overflow: auto;
}
/**
* Get path input to take all remaining width
*/
#filemanager-index_filemanager-index-header_left {
#filemanager-index_filemanager-index-header_right .et2_hbox > *,
#filemanager-index_filemanager-index-header_row > *,
#filemanager-index_filemanager-index-header_left .et2_hbox > * {
float: left;
width: 100%;
margin-bottom: 2px;
}
div.filemanager_navigation {
position: relative;
width: 100%;
white-space: normal;
#filemanager-index_filemanager-index-header_left .et2_file,
#filemanager-index_filemanager-index-header_left .et2_file input {
width: 24px;
}
div.filemanager_navigation > * {
vertical-align: middle;
}
div.filemanager_navigation > img {
margin-top: 3px;
}
#filemanager-index_buttons {
float: right;
}
button#filemanager-index_button\[change_view\] {
margin-right: 20px;
}
div.filemanager_navigation > label {
position: absolute;
left: 56px;
right: 456px;
font-size: 140%;
white-space: nowrap;
}
div.filemanager_navigation > label > input {
width: 100%;
}
#filemanager-index_buttons div.et2_file {
margin: 2px 0 0 0;
vertical-align: top;
padding-right: 7px;
}
#filemanager-index_buttons div.et2_file span,
#filemanager-index_buttons div.et2_file input {
width: 130px;
height: 16px;
top: 0;
background-position: 3px 3px;
margin: 0;
text-indent: 22px;
color: #666666;
}
#filemanager-index_buttons div.et2_file .progress {
width: auto;
margin: 0;
#filemanager-index_filemanager-index-header_left .et2_file span {
width: 22px;
height: 22px;
padding: 0;
background-position-x: 3px;
background-image: url(../../../pixelegg/images/add.png);
overflow: hidden;
text-overflow: ellipsis;
max-height: none;
text-indent: 100px;
}
/**
* Tile view