haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-25 23:02:26 +00:00
Code Issues Releases Wiki Activity

Merge pull request #1435 from haiwen/mobile

Browse Source 
Mobile
This commit is contained in:
Daniel Pan
2017-01-16 14:31:14 +08:00
committed by GitHub
parent f8433686f1 01fb83c9b2
commit 86e9eb5fbc
30 changed files with 711 additions and 138 deletions
Download Patch File Download Diff File Expand all files Collapse all files

204
media/css/seahub.css
View File

@@ -230,10 +230,13 @@ a.table-sort-op {
font-weight:normal;
display:block;
}
a.mobile-table-sort-op {
display:inline-block;
margin: 0 7px 0 10px;
}
a.table-sort-op:hover,
a.table-sort-op:focus {
outline:none;
font-weight:bold;
text-decoration:none;
}
img { border:none; }
@@ -465,6 +468,13 @@ table img { vertical-align:middle; }
margin-bottom:5px;
}
.textarea { height:70px; }
.repo-meta-info,
.dirent-meta-info {
display:inline-block;
margin-right:8px;
color:#666;
font-size:12px;
}
/* loading implemented with css */
@-moz-keyframes loading {
0% {
@@ -558,6 +568,12 @@ a.op-icon:focus {
margin-top:4px;
font-size:12px;
}
@media (max-width:767px) {
.more-op-icon {
padding:6px;
margin:0;
}
}
.big-more-btn {
padding:.5em 0;
color:#777;
@@ -758,38 +774,70 @@ textarea:-moz-placeholder {/* for FF */
.ui-tabs .ui-tabs-hide { display:none; }
/**** left-right-tabs ****/
.left-right-tabs {
.nav-con-tabs {
padding:0;
overflow:hidden;
}
.left-right-tabs-nav {
margin-right:15px;
@media (max-width:767px) {
.nav-con-tabs-nav {
background:#f2f2f2;
padding:2px;
margin-bottom:10px;
}
.nav-con-tabs-nav .tab {
display:inline-block;
margin:3px 5px;
}
.nav-con-tabs-nav a {
display:inline-block;
padding:3px 3px;
color:#747476;
font-size:14px;
outline:none; /* to overwrite webkit ':focus' style */
text-decoration:none;
border-bottom:3px solid transparent;
}
.nav-con-tabs-nav a:hover,
.nav-con-tabs-nav .ui-state-active a,
.nav-con-tabs-nav .ui-state-active a:hover {
color:#eb8205;
border-color:#eb8205;
text-decoration:none;
}
}
.left-right-tabs-nav a {
display:block;
padding:5px 4px;
border-radius:3px;
color:#747476;
font-size:14px;
outline:none; /* to overwrite webkit ':focus' style */
text-decoration:none;
@media (min-width:768px) {
.nav-con-tabs-nav {
float:left;
margin-right:15px;
}
.nav-con-tabs-content {
float:right;
width:550px;
padding:0 1.4em 1em;
min-height:150px;
max-height:250px;
overflow:auto;
}
.nav-con-tabs-nav a {
display:block;
padding:5px 4px;
border-radius:3px;
color:#747476;
font-size:14px;
outline:none; /* to overwrite webkit ':focus' style */
text-decoration:none;
}
.nav-con-tabs-nav a:hover {
text-decoration:none;
background:#feefb8;
}
.nav-con-tabs-nav .ui-state-active a,
.nav-con-tabs-nav .ui-state-active a:hover {
background:#feac74;
color:#fff;
}
}
.left-right-tabs-nav a:hover {
text-decoration:none;
background:#feefb8;
}
.left-right-tabs-nav .ui-state-active a,
.left-right-tabs-nav .ui-state-active a:hover {
background:#feac74;
color:#fff;
}
.left-right-tabs-content {
width:550px;
padding:0 1.4em 1em;
min-height:150px;
max-height:250px;
overflow:auto;
}
.left-right-tabs .tabs-panel {
.nav-con-tabs .tabs-panel {
padding:0;
}
/**** side-tabnav ****/
@@ -996,6 +1044,11 @@ textarea:-moz-placeholder {/* for FF */
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
}
@media (max-width:400px) {
.right-side-panel {
width:100%;
}
}
.right-side-panel-hd {
background:#f8f8f8;
padding:10px;
@@ -1011,6 +1064,7 @@ textarea:-moz-placeholder {/* for FF */
.right-side-panel-footer {
position:absolute;
bottom:0;
width:100%;
}
/**** messages ****/
.messages {
@@ -1525,7 +1579,7 @@ button.sf-dropdown-toggle:focus {
border-top: 1px solid #c9c9c9;
}
.msg-input {
width:336px;
width:100%;
padding:3px 5px;
height:60px;
}
@@ -1953,7 +2007,7 @@ button.sf-dropdown-toggle:focus {
font-weight: normal;
}
#repo-create-form {
padding:0 20px;
padding:0 5px;
}
#repo-create-form .select {
width:268px;
@@ -2126,11 +2180,13 @@ button.sf-dropdown-toggle:focus {
.repo-file-list {
margin:0;
}
.repo-file-list .select {
padding-left:10px;
}
.repo-file-list .hl .select {
background: transparent url('../img/grippy_large.png') scroll no-repeat 1px 50%;
@media (min-width:768px) { /* for mv by 'drag & drop' in 'dir view' page */
.repo-file-list .select {
padding-left:10px;
}
.repo-file-list .hl .select {
background: transparent url('../img/grippy_large.png') scroll no-repeat 1px 50%;
}
}
.repo-file-list .icon-star-empty { color:#d0d0d0; }
.repo-file-list .icon-star { color:#505050; }
@@ -2148,6 +2204,12 @@ button.sf-dropdown-toggle:focus {
.repo-file-list .dirent-name {
display:inline-block;
}
@media (max-width:767px) {
.repo-file-list .dirent-name,
.repo-file-list .img-name-link {
display:block;
}
}
.repo-file-list .file-locked-icon {
position:absolute;
right:0;
@@ -2195,6 +2257,12 @@ button.sf-dropdown-toggle:focus {
width:500px;
padding:10px 20px;
}
@media (max-width:579px) {
.file-choose-form {
padding:0;
width:280px;
}
}
.file-tree-cont, .dir-tree-cont {
padding:5px;
height:280px;
@@ -2209,6 +2277,19 @@ button.sf-dropdown-toggle:focus {
.inline-rename-form .input {
font-size:14px;
}
@media (max-width:321px) {
.inline-rename-form .input {
width:225px;
}
#dir-view .inline-rename-form .input {
width:200px;
}
}
@media (min-width:375px) and (max-width:400px) {
.inline-rename-form {
width:270px;
}
}
.web-setting-form .cancel,
.inline-rename-form .cancel {
color:#666;
@@ -2433,10 +2514,6 @@ button.sf-dropdown-toggle:focus {
padding:2px;
}
/* file/dir share popup */
#file-share .tip,
#share-popup .tip {
max-width:400px;
}
.ellipsis-op-target {
display:inline-block;
vertical-align:bottom;
@@ -2444,9 +2521,19 @@ button.sf-dropdown-toggle:focus {
#share-popup .op-target {
max-width:400px;
}
@media (max-width:767px) {
#share-popup .op-target {
max-width:240px;
}
}
#mv-form .op-target {
max-width:410px;
}
@media (max-width:579px) {
#mv-form .op-target {
max-width:280px;
}
}
#folder-perm-popup .op-target {
max-width:540px;
}
@@ -3170,7 +3257,7 @@ button.sf-dropdown-toggle:focus {
/* multi repo operation */
.repo-op .op-link {
display:inline-block;
height:30px;
height:29px;
margin-right:15px;
color:#8a8a8a;
font-size:22px;
@@ -3180,9 +3267,6 @@ button.sf-dropdown-toggle:focus {
text-decoration:none;
}
/* multi dirents operation */
#multi-dirents-op {
margin-left:5px;
}
#multi-dirents-op .op-btn {
margin:0;
}
@@ -3214,7 +3298,7 @@ button.sf-dropdown-toggle:focus {
}
/* user & group folder perm */
#repo-folder-perm .left-right-tabs-content {/* for the case that the scrollbar appears */
#repo-folder-perm .nav-con-tabs-content {/* for the case that the scrollbar appears */
width:630px;
padding-right:0;
}
@@ -3503,11 +3587,37 @@ img.thumbnail {
font-size:12px;
color:#888;
}
/****** grid view *****/
/* view mode */
@media (max-width:499px) {
.repo-op-misc {
display:block;
margin:5px 0 0 0;
}
.switch-mode {
vertical-align:middle;
}
.trash-history {
display:inline-block;
margin-left:30px;
vertical-align:middle;
}
}
@media (min-width:500px) {
.repo-op-misc {
display:inline-block;
margin-left:12px;
overflow:hidden;
vertical-align:middle;
}
.trash-history {
float:right;
}
}
.trash-history {
height:29px;
}
.switch-mode {
display:inline-block;
margin-left:12px;
}
.grid-view-icon-btn,
.list-view-icon-btn {

2
seahub/templates/base.html
View File

@@ -8,7 +8,7 @@
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="keywords" content="{% trans "File Collaboration Team Organization" %}" />
{% block viewport %}
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
{% endblock %}
<link rel="icon" type="image/x-icon" href="{{ MEDIA_URL }}img/favicon.png?t=1398068110" />
<!--[if IE]>

2
seahub/templates/base_for_backbone.html
View File

@@ -7,7 +7,7 @@
<title>{{ site_title }}</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="keywords" content="{% trans "File Collaboration Team Organization" %}" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta http-equiv="x-ua-compatible" content="ie=edge">
<link rel="icon" type="image/x-icon" href="{{ MEDIA_URL }}img/favicon.png?t=1398068110" />
<!--[if IE]>

6
seahub/templates/js/sysadmin-templates.html
View File

@@ -617,13 +617,13 @@
<script type="text/template" id="share-popup-tmpl">
<h3 class="hd" id="dialogTitle"><%= title %></h3>
<div id="share-tabs" class="left-right-tabs ovhd">
<ul class="left-right-tabs-nav fleft">
<div id="share-tabs" class="nav-con-tabs">
<ul class="nav-con-tabs-nav">
<li class="tab"><a href="#dir-user-share" class="a">{% trans "Share to user" %}</a></li>
<li class="tab"><a href="#dir-group-share" class="a">{% trans "Share to group" %}</a></li>
</ul>
<div class="left-right-tabs-content fright">
<div class="nav-con-tabs-content">
<span class="loading-icon loading-tip"></span>
<div id="dir-user-share" class="tabs-panel">
<table>

358
seahub/templates/js/templates.html
View File

@@ -74,6 +74,47 @@
<td><%= size_formatted %></td>
<td><%= mtime_relative %></td>
</script>
<script type="text/template" id="repo-mobile-tmpl">
<td>
<img src="<%= icon_url %>" title="<%= icon_title %>" alt="<%= icon_title %>" width="24" />
</td>
<% if (name) { %>
<td>
<span class="repo-name-span">
<a href="#my-libs/lib/<%= id %>"><%- name %></a><br />
<span class="repo-meta-info"><%= size_formatted %></span>
<span class="repo-meta-info"><%= mtime_relative %></span>
</span>
</td>
<td class="repo-op-td">
<div class="op-container">
<div class="sf-dropdown sf-dropdown-inline">
<a href="#" class="sf2-icon-caret-down more-op-icon op-icon sf-dropdown-toggle" title="{% trans "More operations" %}" aria-label="{% trans "More operations" %}"></a>
<ul class="hidden-op repo-hidden-op hide sf-dropdown-menu">
<li><a href="#" class="repo-share-btn op">{% trans "Share" %}</a></li>
<li><a href="#" class="repo-delete-btn op">{% trans "Delete" %}</a></li>
<li><a class="op js-repo-rename" href="#">{% trans "Rename" %}</a></li>
<li><a class="op js-repo-transfer" href="#">{% trans "Transfer" %}</a></li>
<li><a class="op js-popup-history-setting" href="#">{% trans "History Setting" %}</a></li>
<% if (encrypted && enc_version == 2) { %>
<li><a class="op js-repo-change-password" href="#">{% trans "Change Password" %}</a></li>
<% } %>
<% if (!encrypted && (can_generate_share_link || can_generate_upload_link)) { %>
<li><a class="op js-popup-share-link-admin" href="#">{% trans "Share Links" %}</a></li>
<% } %>
<% if (app.pageOptions.folder_perm_enabled) { %>
<li><a class="op js-popup-folder-perm-admin" href="#">{% trans "Folder Permission" %}</a></li>
<% } %>
</ul>
</div>
</div>
</td>
<% } else { %>
<td>{% trans "Broken (please contact your administrator to fix this library)" %}</td>
<td></td>
<% } %>
</script>
<script type="text/template" id="group-repo-tmpl">
<td>
<img src="<%= icon_url %>" title="<%= icon_title %>" alt="<%= icon_title %>" width="24" />
@@ -90,6 +131,25 @@
<td><span title="<%- owner %>"><%- owner_name %></span></td>
<% } %>
</script>
<script type="text/template" id="group-repo-mobile-tmpl">
<td>
<img src="<%= icon_url %>" title="<%= icon_title %>" alt="<%= icon_title %>" width="24" />
</td>
<td>
<a href="#group/<%= group_id %>/lib/<%= id %>"><%- name %></a><br />
<% if (show_shared_by) { %>
<span class="repo-meta-info" title="<%- owner %>"><%- owner_name %></span>
<% } %>
<span class="repo-meta-info"><%= size_formatted %></span>
<span class="repo-meta-info"><%= mtime_relative %></span>
</td>
<td class="alc">
<% if (is_staff || share_from_me) { %>
<a href="#" class="sf2-icon-delete sf2-x cancel-share op-icon" title="{% trans "Unshare" %}" aria-label="{% trans "Unshare" %}"></a>
<% } %>
</td>
</script>
<script type="text/template" id="organization-repo-tmpl">
<td>
<img src="<%= icon_url %>" title="<%= icon_title %>" alt="<%= icon_title %>" width="24" />
@@ -104,6 +164,23 @@
<td><%= mtime_relative %></td>
<td><span title="<%- owner %>"><%- owner_nickname %></span></td>
</script>
<script type="text/template" id="organization-repo-mobile-tmpl">
<td>
<img src="<%= icon_url %>" title="<%= icon_title %>" alt="<%= icon_title %>" width="24" />
</td>
<td>
<a href="#org/lib/<%= id %>"><%- name %></a><br />
<span class="repo-meta-info"><%- size_formatted %></span>
<span class="repo-meta-info"><%= mtime_relative %></span>
<span class="repo-meta-info" title="<%- owner %>"><%- owner_nickname %></span>
</td>
<td class="alc">
<% if (app.pageOptions.is_staff || owner == app.pageOptions.username) { %>
<a href="#" class="sf2-icon-delete sf2-x cancel-share op-icon" title="{% trans "Unshare" %}"></a>
<% } %>
</td>
</script>
<script type="text/template" id="dir-op-bar-tmpl">
<% if (user_perm == 'rw') { %>
<div id="multi-dirents-op" class="hide">
@@ -167,22 +244,24 @@
<% } %>
</div><!-- div#cur-dir-ops ends here -->
<div class="switch-mode vam">
<button class="list-view-icon-btn sf2-icon-list-view <% if (mode == 'list') { %>active<% } %>" title="{% trans "List" %}" id="js-switch-list-view" aria-label="{% trans "list view" %}"></button><button class="grid-view-icon-btn sf2-icon-grid-view <% if (mode == 'grid') { %>active<% } %>" title="{% trans "Grid" %}" id="js-switch-grid-view" aria-label="{% trans "grid view" %}"></button>
</div>
<div class="repo-op-misc">
<div class="switch-mode">
<button class="list-view-icon-btn sf2-icon-list-view <% if (mode == 'list') { %>active<% } %>" title="{% trans "List" %}" id="js-switch-list-view" aria-label="{% trans "list view" %}"></button><button class="grid-view-icon-btn sf2-icon-grid-view <% if (mode == 'grid') { %>active<% } %>" title="{% trans "Grid" %}" id="js-switch-grid-view" aria-label="{% trans "grid view" %}"></button>
</div>
<% if (path == '/') { %>
<div class="fright">
<div class="trash-history">
<% if (path == '/') { %>
<% if (user_perm == 'rw') { %>
<a class="op-link sf2-icon-trash" href="<%= site_root %>repo/recycle/<%- repo_id %>/?referer=<% print(encodeURIComponent(location.href)); %>" title="{% trans 'Trash' %}" aria-label="{% trans "Trash" %}"></a>
<% } %>
<a class="op-link sf2-icon-history" href="<%= site_root %>repo/history/<%- repo_id %>/?referer=<% print(encodeURIComponent(location.href)); %>" title="{% trans 'History' %}" aria-label="{% trans "History" %}"></a>
</div>
<% } else { %>
<% if (user_perm == 'rw') { %>
<a class="op-link sf2-icon-trash fright" href="<%= site_root %>dir/recycle/<%- repo_id %>/?dir_path=<% print(encodeURIComponent(path)); %>&referer=<% print(encodeURIComponent(location.href)); %>" title="{% trans 'Trash' %}"></a>
<% } else { %>
<% if (user_perm == 'rw') { %>
<a class="op-link sf2-icon-trash" href="<%= site_root %>dir/recycle/<%- repo_id %>/?dir_path=<% print(encodeURIComponent(path)); %>&referer=<% print(encodeURIComponent(location.href)); %>" title="{% trans 'Trash' %}"></a>
<% } %>
<% } %>
<% } %>
</div>
</div>
</script>
<script type="text/template" id="dir-path-bar-tmpl">
<% if (context == 'group') { %>
@@ -222,6 +301,22 @@
<th width="13%" class="dirent-update"><a class="table-sort-op by-time" href="#">{% trans "Last Update" %} <span class="sort-icon icon-caret-down hide" aria-hidden="true"></span></a></th>
</tr>
</script>
<script type="text/template" id="dirents-hd-mobile-tmpl">
<tr>
<th width="4%" class="select">
<input type="checkbox" class="vam" />
</th>
<th width="6%" class="star"></th>
<th width="8%" class="dirent-icon"></th>
<th width="74%">
{% trans "Sort:"%}
<a class="table-sort-op mobile-table-sort-op by-name" href="#"><span class="dirent-name">{% trans "name"%} <span class="sort-icon icon-caret-up"></span></span></a>
<a class="table-sort-op mobile-table-sort-op by-time" href="#">{% trans "last update" %} <span class="sort-icon icon-caret-down hide" aria-hidden="true"></span></a>
</th>
<th width="8%" class="dirent-op"><span class="sr-only">{% trans "Actions" %}</span></th>
</tr>
</script>
<script type="text/template" id="dirent-dir-tmpl">
<td class="select">
@@ -279,6 +374,51 @@
<% } %>
</td>
</script>
<script type="text/template" id="dirent-dir-mobile-tmpl">
<td class="select">
<% if (dirent.selected) { %>
<input type="checkbox" class="vam" checked="checked" />
<% } else { %>
<input type="checkbox" class="vam" />
<% } %>
</td>
<td class="star"></td>
<td class="dirent-icon"><img src="<%= icon_url %>" width="24" alt="" /></td>
<td>
<span class="dirent-name">
<a href="<%= url %>" class="dir-link normal"><%- dirent.obj_name %></a>
<br />
<% if (dirent.last_modified) { %>
<span class="dirent-meta-info"><%= dirent.last_update %></span>
<% } %>
</span>
</td>
<td class="dirent-op">
<div class="op-container">
<div class="sf-dropdown sf-dropdown-inline">
<a href="#" class="more-op-icon sf2-icon-caret-down op-icon sf-dropdown-toggle" title="{% trans "More operations" %}" aria-label="{% trans "More Operations" %}"></a>
<ul class="hidden-op dirent-hidden-op hide sf-dropdown-menu">
<li><a class="op download download-dir" href="#">{% trans "Download" %}</a></li>
<% if (!repo_encrypted && (can_generate_share_link || can_generate_upload_link || is_repo_owner)) { %>
<li><a href="#" class="op share">{% trans "Share" %}</a></li>
<% } %>
<% if (dirent.perm == 'rw') { %>
<li><a href="#" class="op delete">{% trans "Delete" %}</a></li>
<li><a class="op rename" href="#">{% trans "Rename" %}</a></li>
<li><a class="op mv" href="#">{% trans "Move" %}</a></li>
<li><a class="op cp" href="#">{% trans "Copy" %}</a></li>
<% if (app.pageOptions.folder_perm_enabled && is_repo_owner && !is_virtual && has_been_shared_out) { %>
<li><a class="op set-folder-permission" href="#">{% trans "Permission" %}</a></li>
<% } %>
<li><a class="op open-via-client" href="seafile://openfile?repo_id=<%- repo_id %>&path=<% print(encodeURIComponent(dirent_path + '/')); %>">{% trans "Open via Client" %}</a></li>
<% } else if (dirent.perm == 'r' && !repo_encrypted) { %>
<li><a class="op cp" href="#">{% trans "Copy" %}</a></li>
<% } %>
</ul>
</div>
</div>
</td>
</script>
<script type="text/template" id="dirent-file-tmpl">
<td class="select">
@@ -375,6 +515,94 @@
</td>
</script>
<script type="text/template" id="dirent-file-mobile-tmpl">
<td class="select">
<% if (dirent.selected) { %>
<input type="checkbox" class="vam" checked="checked" />
<% } else { %>
<input type="checkbox" class="vam" />
<% } %>
</td>
<td class="star alc">
<% if (dirent.starred) { %>
<a href="#" title="{% trans "starred" %}" class="icon-star file-star" aria-label="{% trans "starred" %}"></a>
<% } else { %>
<a href="#" title="{% trans "unstarred" %}" class="icon-star-empty file-star" aria-label="{% trans "unstarred" %}"></a>
<% } %>
</td>
<td class="dirent-icon">
<div class="pos-rel">
<% if (dirent.is_img) { %>
<% if (dirent.encoded_thumbnail_src) { %>
<img class="thumbnail" src="{{ SITE_ROOT }}<%- dirent.encoded_thumbnail_src %>" alt="" />
<% } else { %>
<img src="<%= icon_url %>" width="24" alt="" />
<% } %>
<% } else { %>
<img src="<%= icon_url %>" width="24" alt="" />
<% } %>
<% if (is_pro && dirent.is_locked) { %>
<img class="file-locked-icon" width="16" src="{{ MEDIA_URL }}img/file-locked-32.png" alt="{% trans "locked" %}" />
<% } %>
</div>
</td>
<td>
<span class="dirent-name">
<% if (dirent.is_img) { %>
<a class="normal img-name-link" href="<%= url %>" target="_blank"><%- dirent.obj_name %></a>
<% } else { %>
<a class="normal" href="<%= url %>" target="_blank"><%- dirent.obj_name %></a>
<br />
<% } %>
<span class="dirent-meta-info"><%= dirent.file_size %></span>
<span class="dirent-meta-info">
<% if (dirent.last_modified) { %>
<%= dirent.last_update %>
<% } else { %>
<% print("{% trans "Fetch failed" %}"); %>
<% } %>
</span>
</span>
</td>
<td class="dirent-op">
<div class="op-container">
<div class="sf-dropdown sf-dropdown-inline">
<a href="#" class="more-op-icon sf2-icon-caret-down op-icon sf-dropdown-toggle" title="{% trans "More Operations"%}" aria-label="{% trans "More Operations" %}"></a>
<ul class="hidden-op dirent-hidden-op hide sf-dropdown-menu">
<li><a class="op download" href="<%= download_url %>">{% trans "Download" %}</a></li>
<% if (!repo_encrypted && can_generate_share_link) { %>
<li><a class="op share" href="#">{% trans "Share" %}</a></li>
<% } %>
<% if (dirent.perm == 'rw') { %>
<li><a href="#" class="op delete">{% trans "Delete" %}</a></li>
<li><a class="op rename" href="#">{% trans "Rename" %}</a></li>
<li><a class="op mv" href="#">{% trans "Move" %}</a></li>
<li><a class="op cp" href="#">{% trans "Copy" %}</a></li>
<li><a class="op file-history" href="{{ SITE_ROOT }}repo/file_revisions/<%= repo_id %>/?p=<% print(encodeURIComponent(dirent_path)); %>">{% trans "History" %}</a></li>
<% if (is_pro) { %>
<% if (file_audit_enabled) { %>
<li><a class="op" href="{{ SITE_ROOT }}repo/file-access/<%= repo_id %>/?p=<% print(encodeURIComponent(dirent_path)); %>" target="_blank">{% trans "Access Log" %}</a></li>
<% } %>
<% if (dirent.is_locked) { %>
<% if (dirent.locked_by_me) { %>
<li><a class="op unlock-file" href="#">{% trans "Unlock" %}</a></li>
<% } %>
<% } else { %>
<li><a class="op lock-file" href="#">{% trans "Lock" %}</a></li>
<% } %>
<% } %>
<li><a class="op open-via-client" href="seafile://openfile?repo_id=<%- repo_id %>&path=<% print(encodeURIComponent(dirent_path)); %>">{% trans "Open via Client" %}</a></li>
<% } else if (dirent.perm == 'r' && !repo_encrypted) { %>
<li><a class="op cp" href="#">{% trans "Copy" %}</a></li>
<% } %>
</ul>
</div>
</div>
</td>
</script>
<script type="text/template" id="grid-view-file-item-tmpl">
<a href="<%= url %>" class="img-link" target="_blank">
<% if (dirent.is_img && dirent.encoded_thumbnail_src) { %>
@@ -450,8 +678,8 @@
<script type="text/template" id="share-popup-tmpl">
<h3 class="hd" id="dialogTitle"><%= title %></h3>
<div id="share-tabs" class="left-right-tabs ovhd">
<ul class="left-right-tabs-nav fleft">
<div id="share-tabs" class="nav-con-tabs">
<ul class="nav-con-tabs-nav">
<% if (!repo_encrypted && can_generate_share_link) { %>
<li class="tab"><a href="#download-link-share" class="a">{% trans "Download Link" %}</a></li>
<% } %>
@@ -466,7 +694,7 @@
<% } %>
</ul>
<div class="left-right-tabs-content fright">
<div class="nav-con-tabs-content">
<span class="loading-icon loading-tip"></span>
<% if (!repo_encrypted && can_generate_share_link) { %>
<div id="download-link-share" class="tabs-panel">
@@ -639,6 +867,21 @@
<td><%= mtime_relative %></td>
<td><span title="<%- owner %>"><%- owner_nickname %></span></td>
</script>
<script type="text/template" id="shared-repo-mobile-tmpl">
<td>
<img src="<%= icon_url %>" title="<%= icon_title %>" alt="<%= icon_title %>" width="24" />
</td>
<td>
<a href="#shared-libs/lib/<%= id %>"><%- name %></a><br />
<span class="repo-meta-info" title="<%- owner %>"><%- owner_nickname %></span>
<span class="repo-meta-info"><%= size_formatted %></span>
<span class="repo-meta-info"><%= mtime_relative %></span>
</td>
<td class="alc">
<a href="#" class="sf2-icon-delete sf2-x unshare-btn op-icon" title="{% trans "Leave Share" %}"></a>
</td>
</script>
<script type="text/template" id="side-nav-tmpl">
<div class="side-nav-con">
@@ -837,12 +1080,12 @@
</script>
<script type="text/template" id="folder-perm-popup-tmpl">
<h3 class="hd" id="dialogTitle"><%= title %></h3>
<div id="folder-perm-tabs" class="left-right-tabs ovhd">
<ul class="left-right-tabs-nav fleft">
<div id="folder-perm-tabs" class="nav-con-tabs">
<ul class="nav-con-tabs-nav">
<li class="tab"><a href="#user-folder-perm" class="a">{% trans "User Permission" %}</a></li>
<li class="tab"><a href="#group-folder-perm" class="a">{% trans "Group Permission" %}</a></li>
</ul>
<div class="left-right-tabs-content fright">
<div class="nav-con-tabs-content">
<div id="user-folder-perm" class="tabs-panel">
<table>
<thead>
@@ -898,6 +1141,21 @@
</div>
</div>
</script>
<script type="text/template" id="starred-file-thead-tmpl">
<tr>
<% if ($(window).width() >= 768) { %>
<th width="5%"></th>
<th width="40%">{% trans "File Name" %}</th>
<th width="32%">{% trans "Library" %}</th>
<th width="18%">{% trans "Last Update" %}</th>
<th width="5%"></th>
<% } else { %>
<th width="5%"></th>
<th width="90%">{% trans "File Name" %}</th>
<th width="5%"></th>
<% } %>
</tr>
</script>
<script type="text/template" id="starred-file-item-tmpl">
<td class="alc"><img src="{{ MEDIA_URL }}img/file/<%= icon_path %>" alt="{% trans "icon" %}" /></td>
<td>
@@ -913,6 +1171,23 @@
<a href="#" class="sf2-icon-delete unstar op-icon vh" title="{% trans "Unstar" %}" aria-label="{% trans "Unstar" %}"></a>
</td>
</script>
<script type="text/template" id="starred-file-item-mobile-tmpl">
<td class="alc"><img src="{{ MEDIA_URL }}img/file/<%= icon_path %>" alt="{% trans "icon" %}" /></td>
<td>
<% if (is_img) { %>
<a class="img-name-link" href="{{ SITE_ROOT }}lib/<%= repo_id %>/file<%- encoded_path %>" target="_blank" data-mfp-src="{{ SITE_ROOT }}repo/<%= repo_id %>/raw<%- encoded_path %>"><%- file_name %></a>
<% } else { %>
<a href="{{ SITE_ROOT }}lib/<%= repo_id %>/file<%- encoded_path %>" target="_blank"><%- file_name %></a>
<% } %>
<br />
<span class="dirent-meta-info"><%- repo_name %></span>
<span class="dirent-meta-info"><%= mtime_relative %></span>
</td>
<td>
<a href="#" class="sf2-icon-delete unstar op-icon" title="{% trans "Unstar" %}" aria-label="{% trans "Unstar" %}"></a>
</td>
</script>
<script type="text/template" id="my-repos-hd-tmpl">
<tr>
@@ -923,6 +1198,16 @@
<th width="20%"><a class="table-sort-op by-time" href="#">{% trans "Last Update" %} <span class="sort-icon icon-caret-up"></span></a></th>
</tr>
</script>
<script type="text/template" id="my-repos-hd-mobile-tmpl">
<tr>
<th width="4%"><span class="sr-only">{% trans "Library Type" %}</span><!--icon--></th>
<th width="92%">
{% trans "Sort:" %}
<a class="table-sort-op mobile-table-sort-op by-name" href="#">{% trans "name" %} <span class="sort-icon icon-caret-down hide"></a>
<a class="table-sort-op mobile-table-sort-op by-time" href="#">{% trans "last update" %} <span class="sort-icon icon-caret-up"></span></a>
<th width="4%"><span class="sr-only">{% trans "Actions" %}</span></th>
</tr>
</script>
<script type="text/template" id="shared-repos-hd-tmpl">
<tr>
<th width="4%"><span class="sr-only">{% trans "Library Type" %}</span><!--icon--></th>
@@ -933,6 +1218,18 @@
<th width="16%">{% trans "Shared By" %}</th>
</tr>
</script>
<script type="text/template" id="shared-repos-hd-mobile-tmpl">
<tr>
<th width="4%"><span class="sr-only">{% trans "Library Type" %}</span><!--icon--></th>
<th width="92%">
{% trans "Sort:" %}
<a class="table-sort-op mobile-table-sort-op by-name" href="#">{% trans "name" %} <span class="sort-icon icon-caret-down hide"></span></a>
<a class="table-sort-op mobile-table-sort-op by-time" href="#">{% trans "last update" %} <span class="sort-icon icon-caret-up"></span></a>
</th>
<th width="4%"><span class="sr-only">{% trans "Actions" %}</span><!--op--></th>
</tr>
</script>
<script type="text/template" id="add-pubrepo-popup-tmpl">
<h3 class="hd" id="dialogTitle">{% trans "Select libraries to share" %}</h3>
<span class="loading-icon loading-tip"></span>
@@ -1041,6 +1338,23 @@
<p class="empty-tip alc">{% trans "No library is shared to this group" %}</p>
<% } %>
</script>
<script type="text/template" id="group-item-mobile-tmpl">
<h4 class="group-name ellipsis"><a href="#group/<%= id %>/" title="<%- name %>" class="a normal"><%- name %></a></h4>
<% if (repos.length) { %>
<table>
<thead class="vh"><!--use .vh for <td> width-->
<tr>
<th width="4%"><!--icon--></th>
<th width="92%">{% trans "Name" %}</th>
<th width="4%"><!--op--></th>
</tr>
</thead>
<tbody></tbody>
</table>
<% } else { %>
<p class="empty-tip alc">{% trans "No library is shared to this group" %}</p>
<% } %>
</script>
<script type="text/template" id="group-member-tmpl">
<img src="<%= avatar_url %>" alt="" width="32" class="avatar-circle fleft" />
<div class="txt">
@@ -1253,8 +1567,8 @@
<script type="text/template" id="repo-shared-links-admin-dialog-tmpl">
<h3 id="dialogTitle"><%= title %></h3>
<div id="repo-shared-links" class="left-right-tabs js-tabs ovhd">
<ul class="left-right-tabs-nav fleft">
<div id="repo-shared-links" class="nav-con-tabs js-tabs">
<ul class="nav-con-tabs-nav">
<% if (can_generate_share_link) { %>
<li class="tab"><a href="#js-download-links" class="a">{% trans "Download Links" %}</a></li>
<% } %>
@@ -1263,7 +1577,7 @@
<% } %>
</ul>
<div class="left-right-tabs-content fright">
<div class="nav-con-tabs-content">
<% if (can_generate_share_link) { %>
<div id="js-download-links" class="tabs-panel">
<table>
@@ -1332,13 +1646,13 @@
<script type="text/template" id="repo-folder-perm-admin-dialog-tmpl">
<h3 id="dialogTitle"><%= title %></h3>
<div id="repo-folder-perm" class="left-right-tabs js-tabs ovhd">
<ul class="left-right-tabs-nav fleft">
<div id="repo-folder-perm" class="nav-con-tabs js-tabs">
<ul class="nav-con-tabs-nav">
<li class="tab"><a href="#js-repo-user-folder-perm" class="a">{% trans "User Permission" %}</a></li>
<li class="tab"><a href="#js-repo-group-folder-perm" class="a">{% trans "Group Permission" %}</a></li>
</ul>
<div class="left-right-tabs-content fright">
<div class="nav-con-tabs-content">
<div id="js-repo-user-folder-perm" class="tabs-panel">
<div class="js-folder-perm-content repo-folder-perm-content">
<table>

10
seahub/templates/libraries.html
View File

@@ -163,15 +163,7 @@
<script type="text/template" id="starred-file-tmpl">
<h3 class="hd">{% trans "Favorites" %}</h3>
<table class="hide">
<thead>
<tr>
<th width="5%"></th>
<th width="40%">{% trans "File Name" %}</th>
<th width="32%">{% trans "Library" %}</th>
<th width="18%">{% trans "Last Update" %}</th>
<th width="5%"></th>
</tr>
</thead>
<thead></thead>
<tbody></tbody>
</table>
<span class="loading-icon loading-tip"></span>

6
seahub/templates/snippets/file_share_popup.html
View File

@@ -1,12 +1,12 @@
{% load i18n %}
<div id="file-share" class="hide">
<h3 class="hd" id="dialogTitle">{% trans 'Share %(name)s' %}</h3>
<div id="file-share-tabs" class="left-right-tabs ovhd">
<ul class="left-right-tabs-nav fleft">
<div id="file-share-tabs" class="nav-con-tabs">
<ul class="nav-con-tabs-nav">
<li class="tab"><a href="#link-share" class="a">{% trans "Download Link" %}</a></li>
</ul>
<div class="left-right-tabs-content fright">
<div class="nav-con-tabs-content">
<div id="link-share" class="tabs-panel">
<div id="link-options">

2
seahub/templates/sysadmin/sysadmin_backbone.html
View File

@@ -7,7 +7,7 @@
<title>{{ site_title }}</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="keywords" content="{% trans "File Collaboration Team Organization" %}" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<link rel="icon" type="image/x-icon" href="{{ MEDIA_URL }}img/favicon.png?t=1398068110" />
<!--[if IE]>
<link rel="shortcut icon" href="{{ MEDIA_URL }}img/favicon.png?t=1398068110"/>

32
static/scripts/app/router.js
View File

@@ -86,6 +86,38 @@ define([
this.currentView = this.myReposView;
var _this = this;
var originalWindowWidth = $(window).width();
$(window).resize(function() {
var curWidth = $(window).width();
if (_this.currentView.reset) {
if ((originalWindowWidth < 768 && curWidth >= 768 ) ||
(originalWindowWidth >= 768 && curWidth < 768)) {
_this.currentView.reset();
}
}
originalWindowWidth = curWidth;
});
// for popups such as '#share-popup'
$(window).resize(function() {
var $el = $('#share-popup, #repo-share-link-admin-dialog, #repo-folder-perm-popup, #folder-perm-popup');
if ($el.is(':visible')) {
if ($(window).width() < 768) {
$el.css({
'width': $(window).width() - 50,
'height': $(window).height() - 50,
'overflow': 'auto'
});
$.modal.update($(window).height() - 50, $(window).width() - 50);
} else {
$el.removeAttr('style');
$('#simplemodal-container').css({'width':'auto', 'height':'auto'});
}
}
});
$('#info-bar .close').click(Common.closeTopNoticeBar);
$('#top-browser-tip-close').click(function () {
$('#top-browser-tip').addClass('hide');

17
static/scripts/app/views/dialogs/repo-folder-perm-admin.js
View File

@@ -21,6 +21,13 @@ define([
this.render();
this.$('.op-target').css({'max-width':280}); // for long repo name
if ($(window).width() < 768) {
this.$el.css({
'width': $(window).width() - 50,
'height': $(window).height() - 50,
'overflow': 'auto'
});
}
this.$el.modal({
focus: false,
onClose: function() {
@@ -28,10 +35,12 @@ define([
$.modal.close();
}
});
$("#simplemodal-container").css({
'width':'auto',
'height':'auto'
});
if ($(window).width() >= 768) {
$("#simplemodal-container").css({
'width':'auto',
'height':'auto'
});
}
this.$('.js-tabs').tabs();
this.userPerm = new UserFolderPerm({repo_id: this.repo_id});

17
static/scripts/app/views/dialogs/repo-share-link-admin.js
View File

@@ -20,11 +20,18 @@ define([
this.render();
this.$('.op-target').css({'max-width':280}); // for long repo name
this.$el.modal();
$("#simplemodal-container").css({
'width':'auto',
'height':'auto'
});
if ($(window).width() >= 768) {
this.$el.modal({focus: false});
$('#simplemodal-container').css({'width':'auto', 'height':'auto'});
} else {
this.$el.css({
'width': $(window).width() - 50,
'height': $(window).height() - 50,
'overflow': 'auto'
}).modal({focus:false});
}
this.$('.js-tabs').tabs();
var downloadLinks = new DownloadLinks({repo_id: this.repo_id});

65
static/scripts/app/views/dir.js
View File

@@ -27,6 +27,7 @@ define([
path_bar_template: _.template($('#dir-path-bar-tmpl').html()),
dir_op_bar_template: _.template($('#dir-op-bar-tmpl').html()),
dirents_hd_template: _.template($('#dirents-hd-tmpl').html()),
dirents_hd_mobile_template: _.template($('#dirents-hd-mobile-tmpl').html()),
top_search_form_template: _.template($('#top-search-form-tmpl').html()),
newDirTemplate: _.template($("#add-new-dir-form-template").html()),
@@ -75,13 +76,16 @@ define([
this.render();
// scroll window: get 'more', fix 'op bar'
var _this = this;
// scroll window: get 'more', fix 'op bar'
$(window).scroll(function() {
if ($(_this.el).is(':visible')) {
_this.onWindowScroll();
}
});
$(window).resize(function() {
_this.updateDirOpBarUI();
});
// hide 'rename form'
$(document).click(function(e) {
@@ -168,10 +172,30 @@ define([
reset: function() {
this.renderPath();
this.renderDirOpBar();
this.$el_con.show();
this.setFileInput();
this.updateDirOpBarUI(); // should be after `setFileInput()`
// there may be a 'style' added via 'onWindowScroll()' when visiting last dir
this.$('.js-dir-content').removeAttr('style');
if (this.view_mode == 'list') {
this.renderDirentsHd();
}
this.$dirent_grid.empty();
this.$dirent_list_body.empty();
if (this.view_mode == 'list') {
this.$dirent_list.show();
this.$dirent_grid.hide();
} else {
this.$dirent_list.hide();
this.$dirent_grid.show();
}
// sort
Common.updateSortIconByMode({'context': this.$el});
this.sortDirents();
@@ -182,11 +206,20 @@ define([
this.dir.limit = 100;
this.render_dirents_slice(this.dir.last_start, this.dir.limit);
this.setFileInput();
this.getImageThumbnail();
},
updateDirOpBarUI: function() {
var width;
if ($(window).width() > 500) {
width = this.$('.repo-op').width() - parseInt(this.$('.repo-op-misc').css('margin-left')) - 5;
width -= $('#multi-dirents-op').is(':visible') ? $('#multi-dirents-op').width() : $('#cur-dir-ops').width();
this.$('.repo-op-misc').css({'width': width});
} else {
this.$('.repo-op-misc').removeAttr('style');
}
},
updateMagnificPopupOptions: function() {
var imgs = this.dir.where({is_img: true});
var items = [];
@@ -342,18 +375,8 @@ define([
renderDir: function() {
this.$loading_tip.show();
this.$error.hide();
this.$el_con.show();
this.$el_con.hide();
this.$dirent_grid.empty();
this.$dirent_list_body.empty();
if (this.view_mode == 'list') {
this.$dirent_list.show();
this.$dirent_grid.hide();
} else {
this.$dirent_list.hide();
this.$dirent_grid.show();
}
var _this = this;
var thumbnail_size = app.pageOptions.thumbnail_default_size;
@@ -440,7 +463,9 @@ define([
can_generate_share_link: app.pageOptions.can_generate_share_link,
can_generate_upload_link: app.pageOptions.can_generate_upload_link,
enable_upload_folder: app.pageOptions.enable_upload_folder
})));
})))
.removeAttr('style'); // there may be a 'style' added via 'onWindowScroll()' when visiting last dir
if (dir.user_perm == 'rw') {
// add new folder/file
@@ -451,7 +476,8 @@ define([
},
renderDirentsHd: function() {
this.$('thead').html(this.dirents_hd_template());
var tmpl = $(window).width() < 768 ? this.dirents_hd_mobile_template : this.dirents_hd_template;
this.$('thead').html(tmpl());
},
render_dirents_slice: function(start, limit) {
@@ -838,6 +864,8 @@ define([
$dirents_op.hide();
$curDirOps.show();
}
this.updateDirOpBarUI();
},
download: function () {
@@ -1279,7 +1307,7 @@ define([
// fixed 'dir-op-bar'
var op_bar = this.$dir_op_bar,
path_bar = this.$path_bar, // the element before op_bar
repo_file_list = this.$('.repo-file-list'); // the element after op_bar
repo_file_list = this.$('.js-dir-content'); // the element after op_bar
var op_bar_top = path_bar.offset().top + path_bar.outerHeight(true);
var fixed_styles = {
'position': 'fixed',
@@ -1288,6 +1316,9 @@ define([
'background-color': $('#header').css('background-color'),
'z-index': 12 // make 'op_bar' shown on top of the checkboxes
};
if (!op_bar_top) {
return;
}
if ($(window).scrollTop() >= op_bar_top) {
repo_file_list.css({'margin-top':op_bar.outerHeight(true)});
op_bar.outerWidth(this.$el.width()).css(fixed_styles);

18
static/scripts/app/views/dirent.js
View File

@@ -20,7 +20,9 @@ define([
},
fileTemplate: _.template($('#dirent-file-tmpl').html()),
fileMobileTemplate: _.template($('#dirent-file-mobile-tmpl').html()),
dirTemplate: _.template($('#dirent-dir-tmpl').html()),
dirMobileTemplate: _.template($('#dirent-dir-mobile-tmpl').html()),
renameTemplate: _.template($("#rename-form-template").html()),
initialize: function(options) {
@@ -41,9 +43,9 @@ define([
var file_icon_size = Common.isHiDPI() ? 48 : 24;
var template;
if (this.model.get('is_dir')) {
template = this.dirTemplate;
template = $(window).width() < 768 ? this.dirMobileTemplate : this.dirTemplate;
} else {
template = this.fileTemplate;
template = $(window).width() < 768 ? this.fileMobileTemplate : this.fileTemplate;
}
this.$el.html(template({
@@ -66,7 +68,8 @@ define([
}));
this.$('.file-locked-icon').attr('title', gettext("locked by {placeholder}").replace('{placeholder}', this.model.get('lock_owner_name')));
this.dropdown = new DropdownView({
el: this.$('.sf-dropdown')
el: this.$('.sf-dropdown'),
right: '0'
});
// for image files
@@ -78,6 +81,7 @@ define([
events: {
'click .select': 'select',
'click .file-star': 'starFile',
'click .dirent-name': 'visitDirent',
'click .img-name-link': 'viewImageWithPopup',
// mv by 'drag & drop'
@@ -130,6 +134,7 @@ define([
$dirents_op.hide();
$curDirOps.show();
}
dirView.updateDirOpBarUI();
if (checked_num == dirView.$('tr:gt(0)').length) {
$toggle_all_checkbox.prop('checked', true);
} else {
@@ -334,6 +339,13 @@ define([
return false;
},
visitDirent: function() {
if ($(window).width() < 768 &&
!this.model.get('is_img')) { // dir or non image file
location.href = this.$('.dirent-name a').attr('href');
}
},
viewImageWithPopup: function() {
var index = $('.img-name-link', this.dirView.$dirent_list).index(this.$('.img-name-link'));
$.magnificPopup.open(this.dirView.magnificPopupOptions, index);

11
static/scripts/app/views/folder-perm.js
View File

@@ -23,11 +23,20 @@ define([
this.render();
if ($(window).width() < 768) {
this.$el.css({
'width': $(window).width() - 50,
'height': $(window).height() - 50,
'overflow': 'auto'
});
}
this.$el.modal({
appendTo: "#main",
focus: false
});
$('#simplemodal-container').css({'width':'auto', 'height':'auto'});
if ($(window).width() >= 768) {
$('#simplemodal-container').css({'width':'auto', 'height':'auto'});
}
this.$("#folder-perm-tabs").tabs();

6
static/scripts/app/views/group-item.js
View File

@@ -11,6 +11,7 @@ define([
var GroupItemView = Backbone.View.extend({
template: _.template($('#group-item-tmpl').html()),
mobileTemplate: _.template($('#group-item-mobile-tmpl').html()),
events: {
},
@@ -19,7 +20,8 @@ define([
},
render: function() {
this.$el.html(this.template(this.model.attributes));
var tmpl = $(window).width() >= 768 ? this.template : this.mobileTemplate;
this.$el.html(tmpl(this.model.attributes));
var repos = this.model.get('repos');
if (repos.length) {
this.renderRepoList(repos);
@@ -27,7 +29,7 @@ define([
return this;
},
renderRepoList: function (repos) {
renderRepoList: function(repos) {
repos.sort(function(a, b) {
return Common.compareTwoWord(a.name, b.name);
});

4
static/scripts/app/views/group-repo.js
View File

@@ -11,6 +11,7 @@ define([
tagName: 'tr',
template: _.template($('#group-repo-tmpl').html()),
mobileTemplate: _.template($('#group-repo-mobile-tmpl').html()),
events: {
'click .cancel-share': 'unshare'
@@ -34,6 +35,7 @@ define([
var obj = this.model.toJSON();
var icon_size = Common.isHiDPI() ? 96 : 24;
var icon_url = this.model.getIconUrl(icon_size);
var tmpl = $(window).width() >= 768 ? this.template : this.mobileTemplate;
$.extend(obj, {
group_id: this.group_id,
is_staff: this.is_staff,
@@ -45,7 +47,7 @@ define([
icon_url: icon_url,
icon_title: this.model.getIconTitle()
});
this.$el.html(this.template(obj));
this.$el.html(tmpl(obj));
return this;
},

2
static/scripts/app/views/group-settings.js
View File

@@ -144,7 +144,7 @@ define([
var _this = this;
var $form = $(this.transferTemplate());
$form.modal({focus:false});
$form.modal({focus:false, minWidth:268});
$('#simplemodal-container').css({'width':'auto', 'height':'auto'});
$('[name="email"]', $form).select2($.extend(

4
static/scripts/app/views/group.js
View File

@@ -19,6 +19,7 @@ define([
template: _.template($('#group-tmpl').html()),
groupTopTemplate: _.template($('#group-top-tmpl').html()),
reposHdTemplate: _.template($('#shared-repos-hd-tmpl').html()),
mobileReposHdTemplate: _.template($('#shared-repos-hd-mobile-tmpl').html()),
events: {
'click #group-settings-icon': 'toggleSettingsPanel',
@@ -56,7 +57,8 @@ define([
},
renderReposHd: function() {
this.$tableHead.html(this.reposHdTemplate());
var tmpl = $(window).width() >= 768 ? this.reposHdTemplate : this.mobileReposHdTemplate;
this.$tableHead.html(tmpl());
},
reset: function() {

4
static/scripts/app/views/myhome-repos.js
View File

@@ -14,6 +14,7 @@ define([
template: _.template($('#my-own-repos-tmpl').html()),
reposHdTemplate: _.template($('#my-repos-hd-tmpl').html()),
mobileReposHdTemplate: _.template($('#my-repos-hd-mobile-tmpl').html()),
events: {
'click .repo-create': 'createRepo',
@@ -39,7 +40,8 @@ define([
},
renderReposHd: function() {
this.$tableHead.html(this.reposHdTemplate());
var tmpl = $(window).width() >= 768 ? this.reposHdTemplate : this.mobileReposHdTemplate;
this.$tableHead.html(tmpl());
},
reset: function() {

4
static/scripts/app/views/myhome-shared-repos.js
View File

@@ -13,6 +13,7 @@ define([
template: _.template($('#repos-shared-to-me-tmpl').html()),
reposHdTemplate: _.template($('#shared-repos-hd-tmpl').html()),
mobileReposHdTemplate: _.template($('#shared-repos-hd-mobile-tmpl').html()),
initialize: function(options) {
this.repos = new RepoCollection({type: 'shared'});
@@ -31,7 +32,8 @@ define([
},
renderReposHd: function() {
this.$tableHead.html(this.reposHdTemplate());
var tmpl = $(window).width() >= 768 ? this.reposHdTemplate : this.mobileReposHdTemplate;
this.$tableHead.html(tmpl());
},
reset: function() {

4
static/scripts/app/views/organization-repo.js
View File

@@ -11,6 +11,7 @@ define([
tagName: 'tr',
template: _.template($('#organization-repo-tmpl').html()),
mobileTemplate: _.template($('#organization-repo-mobile-tmpl').html()),
initialize: function() {
HLItemView.prototype.initialize.call(this);
@@ -20,11 +21,12 @@ define([
var obj = this.model.toJSON();
var icon_size = Common.isHiDPI() ? 96 : 24;
var icon_url = this.model.getIconUrl(icon_size);
var tmpl = $(window).width() >= 768 ? this.template : this.mobileTemplate;
_.extend(obj, {
'icon_url': icon_url,
'icon_title': this.model.getIconTitle()
});
this.$el.html(this.template(obj));
this.$el.html(tmpl(obj));
return this;
},

4
static/scripts/app/views/organization.js
View File

@@ -17,6 +17,7 @@ define([
template: _.template($('#organization-repos-tmpl').html()),
reposHdTemplate: _.template($('#shared-repos-hd-tmpl').html()),
mobileReposHdTemplate: _.template($('#shared-repos-hd-mobile-tmpl').html()),
initialize: function(options) {
this.repos = new PubRepoCollection();
@@ -77,7 +78,8 @@ define([
},
renderReposHd: function() {
this.$tableHead.html(this.reposHdTemplate());
var tmpl = $(window).width() >= 768 ? this.reposHdTemplate : this.mobileReposHdTemplate;
this.$tableHead.html(tmpl());
},
reset: function() {

23
static/scripts/app/views/repo.js
View File

@@ -19,10 +19,12 @@ define([
tagName: 'tr',
template: _.template($('#repo-tmpl').html()),
mobileTemplate: _.template($('#repo-mobile-tmpl').html()), // for extra small devices (phones, less than 768px)
renameTemplate: _.template($("#repo-rename-form-template").html()),
transferTemplate: _.template($('#repo-transfer-form-tmpl').html()),
events: {
'click td:lt(2)': 'visitRepo',
'click .repo-delete-btn': 'del',
'click .repo-share-btn': 'share',
'click .js-repo-rename': 'rename',
@@ -43,19 +45,32 @@ define([
var obj = this.model.toJSON();
var icon_size = Common.isHiDPI() ? 96 : 24;
var icon_url = this.model.getIconUrl(icon_size);
var tmpl, dropdownOptions = {};
if ($(window).width() >= 768) {
tmpl = this.template;
} else {
tmpl = this.mobileTemplate;
dropdownOptions = {'right': 0};
}
_.extend(obj, {
'icon_url': icon_url,
'icon_title': this.model.getIconTitle(),
'can_generate_share_link': app.pageOptions.can_generate_share_link,
'can_generate_upload_link': app.pageOptions.can_generate_upload_link
});
this.$el.html(this.template(obj));
this.dropdown = new DropdownView({
this.$el.html(tmpl(obj));
this.dropdown = new DropdownView($.extend({
el: this.$('.sf-dropdown')
});
}, dropdownOptions));
return this;
},
visitRepo: function() {
if ($(window).width() < 768) {
location.href = this.$('.repo-name-span a').attr('href');
}
},
del: function() {
var _this = this;
var repo_name = this.model.get('name');
@@ -201,7 +216,7 @@ define([
$('[name="email"]', $form).select2($.extend(
Common.contactInputOptionsForSelect2(), {
width: '300px',
width: '280px',
maximumSelectionSize: 1,
placeholder: gettext("Search user or enter email and press Enter"), // to override 'placeholder' returned by `Common.conta...`
formatSelectionTooBig: gettext("You cannot select any more choices")

12
static/scripts/app/views/share.js
View File

@@ -24,8 +24,16 @@ define([
this.render();
this.$el.modal({focus: false});
$('#simplemodal-container').css({'width':'auto', 'height':'auto'});
if ($(window).width() >= 768) {
this.$el.modal({focus: false});
$('#simplemodal-container').css({'width':'auto', 'height':'auto'});
} else {
this.$el.css({
'width': $(window).width() - 50,
'height': $(window).height() - 50,
'overflow': 'auto'
}).modal({focus:false});
}
this.$("#share-tabs").tabs();

4
static/scripts/app/views/shared-repo.js
View File

@@ -11,6 +11,7 @@ define([
tagName: 'tr',
template: _.template($('#shared-repo-tmpl').html()),
mobileTemplate: _.template($('#shared-repo-mobile-tmpl').html()),
events: {
'click .unshare-btn': 'removeShare'
@@ -48,11 +49,12 @@ define([
var obj = this.model.toJSON();
var icon_size = Common.isHiDPI() ? 96 : 24;
var icon_url = this.model.getIconUrl(icon_size);
var tmpl = $(window).width() >= 768 ? this.template : this.mobileTemplate;
_.extend(obj, {
'icon_url': icon_url,
'icon_title': this.model.getIconTitle()
});
this.$el.html(this.template(obj));
this.$el.html(tmpl(obj));
return this;
}

9
static/scripts/app/views/side-nav.js
View File

@@ -51,7 +51,14 @@ define([
'click #enable-mods': 'enableMods',
'click .js-close-side-nav': 'closeNav',
'click li > a': 'visitLink',
'click .js-about': 'showAbout'
'click .js-about': 'showAbout',
// for touch devices
'touchstart .side-nav-con': 'conTouchStart'
},
conTouchStart: function() {
this.$('.side-nav-con').css({'overflow':'auto'});
},
toggleGroupList: function() {

4
static/scripts/app/views/starred-file-item.js
View File

@@ -11,6 +11,7 @@ define([
tagName: 'tr',
template: _.template($('#starred-file-item-tmpl').html()),
mobileTemplate: _.template($('#starred-file-item-mobile-tmpl').html()),
events: {
'click .unstar': 'removeShare'
@@ -26,7 +27,8 @@ define([
data['is_img'] = Common.imageCheck(data['file_name']);
data['encoded_path'] = Common.encodePath(data['path']);
this.$el.html(this.template(data));
var tmpl = $(window).width() >= 768 ? this.template : this.mobileTemplate;
this.$el.html(tmpl(data));
return this;
},

8
static/scripts/app/views/starred-file.js
View File

@@ -14,6 +14,7 @@ define([
id: 'starred-file',
template: _.template($('#starred-file-tmpl').html()),
theadTemplate: _.template($('#starred-file-thead-tmpl').html()),
initialize: function() {
this.starredFiles = new StarredFilesCollection();
@@ -29,9 +30,10 @@ define([
reset: function() {
this.$tableBody.empty();
this.$loadingTip.hide();
this.starredFiles.each(this.addOne, this);
if (this.starredFiles.length) {
this.$emptyTip.hide();
this.renderThead();
this.starredFiles.each(this.addOne, this);
this.$table.show();
} else {
this.$emptyTip.show();
@@ -77,6 +79,10 @@ define([
});
},
renderThead: function() {
this.$('thead').html(this.theadTemplate());
},
show: function() {
$("#right-panel").html(this.$el);
this.showStarredFiles();

2
static/scripts/app/views/widgets/dropdown.js
View File

@@ -65,7 +65,7 @@ define([
var $toggle = this.$('.sf-dropdown-toggle');
var $menu = this.$('.sf-dropdown-menu');
app.ui.currentDropdown = this;
if (this.options.right) {
if (this.options.right != undefined) {
$menu.css('right', this.options.right);
} else {
$menu.css('left', this.options.left);

5
static/scripts/app/views/widgets/hl-item-view.js
View File

@@ -51,7 +51,10 @@ define([
return;
}
app.ui.currentHighlightedItem = null;
this.$el.removeClass('hl').find(this.hiddenOperationClass).addClass('vh');
this.$el.removeClass('hl');
if ($(window).width() >= 768) {
this.$el.find(this.hiddenOperationClass).addClass('vh');
}
}
});