ddp/photoassistant
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

view by folder now has same width for back "button" (hacked width in fa-stack css from font-awesome to force width:2em from 2.5em) - also made figcation wrap to keep horizontal folder spacing - seems much neater

Browse Source
This commit is contained in:
Damien De Paoli
2021-06-21 18:26:18 +10:00
parent 2762f58f98
commit 26cd851325
1 changed files with 17 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files

124
templates/files.html
View File

@@ -41,9 +41,9 @@
</div class="col my-auto"> </div class="col my-auto">
{% endif %} {% endif %}
<div class="col my-auto d-flex justify-content-end"> <div class="col my-auto d-flex justify-content-end">
<button id="prev" name="prev" class="sm-txt btn btn-info"><i class="fas fa-arrow-alt-circle-left"></i></button> <button id="prev" name="prev" class="prev sm-txt btn btn-info"><i class="fas fa-arrow-alt-circle-left"></i></button>
<span class="sm-txt my-auto">&nbsp;{{how_many}} files&nbsp;</span> <span class="sm-txt my-auto">&nbsp;{{how_many}} files&nbsp;</span>
<button id="next" name="next" class="sm-txt btn btn-info"><i class="fas fa-arrow-alt-circle-right"></i></button> <button id="next" name="next" class="next sm-txt btn btn-info"><i class="fas fa-arrow-alt-circle-right"></i></button>
<button id="move" disabled name="move" class="sm-txt btn btn-primary ml-4" onClick="MoveDBox(); return false;"><i class="fas fa-folder-plus"></i></button> <button id="move" disabled name="move" class="sm-txt btn btn-primary ml-4" onClick="MoveDBox(); return false;"><i class="fas fa-folder-plus"></i></button>
{% if "files_rbp" in request.url %} {% if "files_rbp" in request.url %}
<button id="del" disabled name="del" class="sm-txt btn btn-success mx-1" onClick="DelDBox('Restore'); return false;"> <button id="del" disabled name="del" class="sm-txt btn btn-success mx-1" onClick="DelDBox('Restore'); return false;">
@@ -96,9 +96,9 @@
<button id="256" class="sm-txt sz-but btn {{bt}}" onClick="ChangeSize(this,256); return false;">XL</button> <button id="256" class="sm-txt sz-but btn {{bt}}" onClick="ChangeSize(this,256); return false;">XL</button>
</div> </div>
</div class="input-group"> </div class="input-group">
<input id="offset" type="hidden" name="offset" value="{{offset}}">
<input id="size" type="hidden" name="size" value="{{size}}">
</div class="form-row"> </div class="form-row">
<input id="offset" type="hidden" name="offset" value="{{offset}}">
<input id="size" type="hidden" name="size" value="{{size}}">
</form> </form>
{% set last = namespace(printed=0) %} {% set last = namespace(printed=0) %}
@@ -118,7 +118,7 @@
</figure class="figure"> </figure class="figure">
{% else %} {% else %}
{# create an even lighter-grey, unclickable back button - so folders dont jump around when you go into them #} {# create an even lighter-grey, unclickable back button - so folders dont jump around when you go into them #}
<span style="font-size:{{(size|int-22)/2}}" class="fa-stack"> <span style="font-size:{{(size|int-22)/2}}" class="mx-1 fa-stack">
<i style="color:lightgrey" class="fas fa-folder fa-stack-2x"></i> <i style="color:lightgrey" class="fas fa-folder fa-stack-2x"></i>
<i class="fas fa-level-up-alt fa-flip-horizontal fa-stack-1x fa-inverse"></i> <i class="fas fa-level-up-alt fa-flip-horizontal fa-stack-1x fa-inverse"></i>
</span> </span>
@@ -136,7 +136,7 @@
</figure class="figure"> </figure class="figure">
{% else %} {% else %}
{# create an even lighter-grey, unclickable back button - so folders dont jump around when you go into them #} {# create an even lighter-grey, unclickable back button - so folders dont jump around when you go into them #}
<span style="font-size:{{(size|int-22)/2}}" class="fa-stack"> <span style="font-size:{{(size|int-22)/2}}" class="mx-1 fa-stack">
<i style="color:lightgrey" class="fas fa-folder fa-stack-2x"></i> <i style="color:lightgrey" class="fas fa-folder fa-stack-2x"></i>
<i class="fas fa-level-up-alt fa-flip-horizontal fa-stack-1x fa-inverse"></i> <i class="fas fa-level-up-alt fa-flip-horizontal fa-stack-1x fa-inverse"></i>
</span> </span>
@@ -212,7 +212,7 @@
{% if dirname| TopLevelFolderOf(cwd) %} {% if dirname| TopLevelFolderOf(cwd) %}
<figure class="px-1 dir" dir="{{dirname}}"> <figure class="px-1 dir" dir="{{dirname}}">
<i style="font-size:{{size|int-22}};" class="fas fa-folder"></i> <i style="font-size:{{size|int-22}};" class="fas fa-folder"></i>
<figcaption class="figure-caption text-center">{{obj.name}}</figcaption> <figcaption style="display: table-caption;" class="figure-caption text-center">{{obj.name}}</figcaption>
</figure class="figure"> </figure class="figure">
{% endif %} {% endif %}
{% endif %} {% endif %}
@@ -224,107 +224,17 @@
</div> </div>
<div class="container-fluid"> <div class="container-fluid">
<form id="main_form" method="POST""> <form id="nav_form" method="POST"">
<input type="hidden" name="cwd" id="cwd" value="{{cwd}}"> <input type="hidden" name="cwd" id="cwd" value="{{cwd}}">
{% if search_term is defined %} <div class="row">
<input type="hidden" name="term" id="view_term" value="{{search_term}}"> <div class="col my-auto d-flex justify-content-center">
{% endif %} <button onClick="$.each( $('#main_form').serializeArray() , function( index, value ) { $('#nav_form').append( '<input type=hidden name=' + value['name'] +' value='+value['value'] + '>' ); })" id="prev" name="prev" class="prev sm-txt btn btn-info"><i class="fas fa-arrow-alt-circle-left"></i></button>
<div class="row"> <span class="sm-txt my-auto">&nbsp;{{how_many}} files&nbsp;</span>
{% if folders %} <button onClick="$.each( $('#main_form').serializeArray() , function( index, value ) { $('#nav_form').append( '<input type=hidden name=' + value['name'] +' value='+value['value'] + '>' ); });" id="next" name="next" class="next sm-txt btn btn-info"><i class="fas fa-arrow-alt-circle-right"></i></button>
<div class="mx-3 my-auto"> </div>
<span class="alert alert-primary">
{% if "files_ip" in request.url %}
<i class="fas fa-file-upload"></i>
{% set tmp_path=cwd | replace( "static/Import", "" ) + "/" %}
{% elif "files_sp" in request.url %}
<i class="fas fa-database"></i>
{% set tmp_path=cwd | replace( "static/Storage", "" ) + "/" %}
{% elif "files_rbp" in request.url %}
<i class="fas fa-trash-alt"></i>
{% set tmp_path=cwd | replace( "static/Bin", "" ) + "/" %}
{% endif %}
{{tmp_path}}</span>
</div class="col my-auto">
{% endif %}
<div class="px-0 input-group col-lg-4">
{{CreateSelect( "noo", noo, ["Oldest", "Newest"], "$('#offset').val(0)")|safe }}
{{CreateSelect( "how_many", how_many, ["10", "25", "50", "75", "100", "150", "200", "500"])|safe }}
{% if folders %}
<input type="hidden" name="grouping" id="grouping" value="{{grouping}}">
{{CreateFoldersSelect( folders )|safe }}
{% else %}
{{CreateFoldersSelect( folders )|safe }}
<span style="border:0" class="sm-txt my-auto btn btn-outline-info disabled">grouped by:</span>
{{CreateSelect( "grouping", grouping, ["None", "Day", "Week", "Month"])|safe }}
{% endif %}
</div class="input-group">
{% if search_term is defined %}
<div class="col my-auto">
<span class="alert alert-primary">Searched for: '{{search_term}}'</span>
</div class="col my-auto">
{% endif %}
<div class="col my-auto d-flex justify-content-end">
<button id="prev" name="prev" class="sm-txt btn btn-info"><i class="fas fa-arrow-alt-circle-left"></i></button>
<span class="sm-txt my-auto">&nbsp;{{how_many}} files&nbsp;</span>
<button id="next" name="next" class="sm-txt btn btn-info"><i class="fas fa-arrow-alt-circle-right"></i></button>
<button id="move" disabled name="move" class="sm-txt btn btn-primary ml-4" onClick="MoveDBox(); return false;"><i class="fas fa-folder-plus"></i></button>
{% if "files_rbp" in request.url %}
<button id="del" disabled name="del" class="sm-txt btn btn-success mx-1" onClick="DelDBox('Restore'); return false;">
<i class="fas fa-trash-restore-alt"></i>
{% else %}
<button id="del" disabled name="del" class="sm-txt btn btn-danger mx-1" onClick="DelDBox('Delete'); return false;">
<i class="fas fa-trash-alt"></i>
{% endif %}
</button>
</div> </div>
<div class="px-0 input-group col justify-content-end"> </form>
{% if size == "64" %} </div class="container">
{% set bt="btn-info" %}
{% else %}
{% set bt="btn-outline-info" %}
{% endif %}
<div class="input-group-prepend">
<button id="64" style="width:98%" class="sm-txt sz-but btn {{bt}}" onClick="ChangeSize(this,64); return false;">XS</button>
</div>
{% if size == "96" %}
{% set bt="btn-info" %}
{% else %}
{% set bt="btn-outline-info" %}
{% endif %}
<div class="input-group-append">
<button id="96" class="sm-txt sz-but btn {{bt}}" onClick="ChangeSize(this,96); return false;">S</button>
</div>
{% if size == "128" %}
{% set bt="btn-info" %}
{% else %}
{% set bt="btn-outline-info" %}
{% endif %}
<div class="input-group-append">
<button id="128" class="sm-txt sz-but btn {{bt}}" onClick="ChangeSize(this,128); return false;">M</button>
</div>
{% if size == "192" %}
{% set bt="btn-info" %}
{% else %}
{% set bt="btn-outline-info" %}
{% endif %}
<div class="input-group-append">
<button id="192" class="sm-txt sz-but btn {{bt}}" onClick="ChangeSize(this,192); return false;">L</button>
</div>
{% if size == "256" %}
{% set bt="btn-info" %}
{% else %}
{% set bt="btn-outline-info" %}
{% endif %}
<div class="input-group-append">
<button id="256" class="sm-txt sz-but btn {{bt}}" onClick="ChangeSize(this,256); return false;">XL</button>
</div>
</div class="input-group">
</div class="form-row">
<input id="offset" type="hidden" name="offset" value="{{offset}}">
<input id="size" type="hidden" name="size" value="{{size}}">
</form>
</div class="container">
{% endblock main_content %} {% endblock main_content %}
{% block script_content %} {% block script_content %}
<script> <script>