1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-08-02 07:47:32 +00:00

redesigned all checkbox; bugfix & improvement; removed unused code & file

This commit is contained in:
llj 2016-04-07 11:06:48 +08:00
parent d5170f7a18
commit 77aac3d811
16 changed files with 102 additions and 197 deletions

View File

@ -190,12 +190,14 @@ textarea {
outline:0;
}
textarea, input { border: 1px solid #ccc; }
input { height:22px; margin:3px 0; outline:0; }
input {
margin:3px 0;
outline:0;
}
input, button { display:inline-block;/*for ie*/ }
input[type=submit],
input[type=button],
input.submit {
height:auto;
input[type=text],
input[type=password] {
height:22px;
}
button,
input[type=submit],
@ -232,10 +234,10 @@ select {
text-decoration:none;
}
input[type=radio] {
height:auto;
border:0;/*for ie*/
}
input:focus {
input:focus,
textarea:focus {
border-color: #66afe9;
outline: none;
}
@ -316,7 +318,7 @@ table {
table-layout:fixed;
margin:8px 0 40px;
}
caption {font-size:1.1em; font-weight:bold; margin-bottom:.6em;}
caption { font-size:1.1em; font-weight:bold; margin-bottom:.6em; }
th { text-align:left; font-weight:normal; color:#9c9c9c; }
td, th { padding:5px 3px; word-wrap:break-word; border-bottom:1px solid #eee; }
td { color: #333; font-size:14px; }
@ -410,18 +412,12 @@ p { margin:0.5em 0; }
display:block;
margin:1em auto;
}
.icon-plus, .icon-minus, .icon-pencil,
.repo-file-list .icon-star-empty,
.repo-file-list .icon-star {
.icon-plus, .icon-minus, .icon-pencil {
font-size:16px;
line-height:1;
}
.icon-plus, .icon-minus, .icon-pencil {
color:#444;
margin-left:3px;
}
.repo-file-list .icon-star-empty { color:#d0d0d0; }
.repo-file-list .icon-star { color:#505050; }
.op,
.more {
font-weight:normal;
@ -480,28 +476,9 @@ input.btn-disabled:hover {/*for input*/
cursor:default;
background: #efefef;
}
.op-icon-btn {/* icon btn */
font-size:14px;
padding:4px 12px;
line-height:20px;
text-shadow:0 1px 1px rgba(255, 255, 255, 0.75);
background-color:#f5f5f5;background-image:-moz-linear-gradient(top, #ffffff, #e6e6e6);background-image:-webkit-linear-gradient(top, #ffffff, #e6e6e6);background-image:linear-gradient(to bottom, #ffffff, #e6e6e6);background-repeat:repeat-x;border:1px solid #cccccc;border-bottom-color:#b3b3b3;border-radius:4px;box-shadow:inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
}
.op-icon-btn:hover {
background-color: #E6E6E6;
background-position: 0 -15px; /* to rm background-image */
}
.op-list li,
.checkbox,
.checkbox-checked,
.modalCloseImg {
background:transparent url('../img/bg.png') no-repeat scroll 0 0;
}
.op-list li {
padding-left:23px;
line-height:23px;
background-position:0 3px;
}
.add {
color:#909090;
margin-right:3px;
@ -775,32 +752,6 @@ textarea:-moz-placeholder {/* for FF */
background:#fff;
}
/**** checkbox ****/
.checkbox-orig {
width:14px;
height:14px;
font-size:0;
opacity:0;
filter: alpha(opacity=0);
cursor:pointer;
position:absolute;
margin:0;
}
.checkbox {
position:relative;
display:inline-block;
width:15px;
height:15px;
background-position: 0 -1135px;
margin-right:4px;
}
.checkbox-checked {
background-position: 0 -1153px;
}
.checkbox-label .avatar,
.checkbox,
.checkbox-option {
vertical-align:middle;
}
.checkbox-label {
display:block;
}
@ -1933,6 +1884,12 @@ button.dropdown-toggle:focus {
.repo-file-list .star {
width:25px;
}
.repo-file-list .icon-star-empty { color:#d0d0d0; }
.repo-file-list .icon-star { color:#505050; }
.repo-file-list .icon-star-empty,
.repo-file-list .icon-star {
font-size:16px;
}
.repo-file-list .dirent-icon {
width:27px;
text-align:center;
@ -1950,10 +1907,6 @@ button.dropdown-toggle:focus {
.repo-file-list .dirent-op {
width:200px;
}
.repo-file-list .checkbox-label,
.repo-file-list .checkbox {
margin:0;
}
.repo-file-list th {
padding-top:20px;
}

View File

@ -1,7 +1,3 @@
$('.checkbox-orig').click(function() {
$(this).parent().toggleClass('checkbox-checked');
});
$('#title-panel, #left-panel, #right-panel').each(function() { // for ie 7
if ($(this).children().length == 0) {
$(this).addClass('hide');
@ -182,15 +178,6 @@ $('.search-form').submit(function() {
}
});
$(".checkbox-label").hover(
function() {
$(this).addClass('hl');
},
function() {
$(this).removeClass('hl');
}
);
$("tr:gt(0)", $('table')).hover(
function() {
$(this).addClass('hl');

View File

@ -73,14 +73,14 @@
{% if mod == 'personal wiki' %}
<li>
<label class="checkbox-label">
<span class="checkbox {% if mod in request.user.mods_enabled %}checkbox-checked{% endif %}"><input type="checkbox" name="personal_wiki" class="checkbox-orig" {%if mod in request.user.mods_enabled%}checked{% endif%} /></span>
<span class="checkbox-option">{% trans "Personal Wiki" %}</span>
<input type="checkbox" name="personal_wiki" class="vam" {%if mod in request.user.mods_enabled%}checked="checked"{% endif%} />
<span class="checkbox-option vam">{% trans "Personal Wiki" %}</span>
</label>
</li>
{% endif %}
{% endfor %}
</ul>
<input type="submit" id="mods-enable-submit" value="{% trans "Submit"%}" class="submit"/>
<input type="submit" id="mods-enable-submit" value="{% trans "Submit"%}" class="submit" />
</form>
{% endif %}
{% endblock %}

View File

@ -15,8 +15,8 @@
<% if (enable_encrypted_library) { %>
<div class="repo-create-encryption">
<label class="checkbox-label">
<span class="checkbox"><input type="checkbox" name="encryption" id="encrypt-switch" class="checkbox-orig" /></span>
<span class="checkbox-option">{% trans "Encrypt" %}</span>
<input type="checkbox" name="encryption" id="encrypt-switch" class="vam" />
<span class="checkbox-option vam">{% trans "Encrypt" %}</span>
</label>
<label>{% trans "Password" %}</label><span class="tip">{% blocktrans %}(at least {{repo_password_min_length}} characters){% endblocktrans %}</span><br />
<input type="password" name="passwd" disabled="disabled" class="input input-disabled" /><br />
@ -171,7 +171,7 @@
<script type="text/template" id="dirents-hd-tmpl">
<tr>
<th class="select">
<span class="checkbox"><input type="checkbox" class="checkbox-orig" /></span>
<input type="checkbox" class="vam" />
</th>
<th class="star"></th>
<th class="dirent-icon"></th>
@ -186,9 +186,9 @@
<% if (dirent.is_dir) { %>
<td class="select">
<% if (dirent.selected) { %>
<span class="checkbox checkbox-checked"><input type="checkbox" class="checkbox-orig" checked="checked" /></span>
<input type="checkbox" class="vam" checked="checked" />
<% } else { %>
<span class="checkbox"><input type="checkbox" class="checkbox-orig" /></span>
<input type="checkbox" class="vam" />
<% } %>
</td>
<td class="star"></td>
@ -237,9 +237,9 @@
<% } else { %>
<td class="select">
<% if (dirent.selected) { %>
<span class="checkbox checkbox-checked"><input type="checkbox" class="checkbox-orig" checked="checked" /></span>
<input type="checkbox" class="vam" checked="checked" />
<% } else { %>
<span class="checkbox"><input type="checkbox" class="checkbox-orig" /></span>
<input type="checkbox" class="vam" />
<% } %>
</td>
<td class="star alc">
@ -438,8 +438,8 @@
<div id="download-link-share" class="tabs-panel">
<form id="generate-download-link-form" action="" class="hide">
<label class="checkbox-label">
<span class="checkbox"><input type="checkbox" name="use_passwd" class="checkbox-orig" /></span>
<span class="checkbox-option">{% trans "Add password protection"%}</span>
<input type="checkbox" name="use_passwd" class="vam" />
<span class="checkbox-option vam">{% trans "Add password protection"%}</span>
</label>
<div class="hide">
<label>{% trans "Password" %}</label><span class="tip">{% blocktrans %}(at least {{share_link_password_min_length}} characters){% endblocktrans %}</span>
@ -452,8 +452,8 @@
<input type="password" name="password_again" class="input" />
</div>
<label class="checkbox-label">
<span class="checkbox"><input type="checkbox" name="set_expiration" class="checkbox-orig" /></span>
<span class="checkbox-option">{% trans "Add auto expiration"%}</span>
<input type="checkbox" name="set_expiration" class="vam" />
<span class="checkbox-option vam">{% trans "Add auto expiration"%}</span>
</label>
<div class="hide">
<label>{% trans "Days" %}</label><br />
@ -493,8 +493,8 @@
<p class="tip">{% trans "You can share the generated link to others and then they can upload files to this directory via the link." %}</p>
<form id="generate-upload-link-form" action="" class="hide">
<label class="checkbox-label">
<span class="checkbox"><input type="checkbox" name="use_passwd" class="checkbox-orig" /></span>
<span class="checkbox-option">{% trans "Add password protection"%}</span>
<input type="checkbox" name="use_passwd" class="vam" />
<span class="checkbox-option vam">{% trans "Add password protection"%}</span>
</label>
<div class="hide">
<label>{% trans "Password" %}</label><span class="tip">{% blocktrans %}(at least {{share_link_password_min_length}} characters){% endblocktrans %}</span>
@ -690,9 +690,9 @@
<li>
<label class="checkbox-label">
<% if (mods_enabled.indexOf(mods_available[i]) != -1) { %>
<span class="checkbox checkbox-checked"><input type="checkbox" name="personal_wiki" class="checkbox-orig" checked="checked" /></span>
<input type="checkbox" name="personal_wiki" class="vam" checked="checked" />
<% } else { %>
<span class="checkbox"><input type="checkbox" name="personal_wiki" class="checkbox-orig" /></span>
<input type="checkbox" name="personal_wiki" class="vam" />
<% } %>
<span class="checkbox-option">{% trans "Personal Wiki" %}</span>
</label>
@ -720,28 +720,6 @@
</div>
</div>
</script>
<script type="text/template" id="group-mods-enable-form-tmpl">
<form id="mods-enable-form" method="post" action="" class="hide">{% csrf_token%}
<h3>{% trans "Enable Modules"%}</h3>
<ul>
<% for (var i = 0, len = mods_available.length; i < len; i++) { %>
<% if (mods_available[i] == 'group wiki') { %>
<li>
<label class="checkbox-label">
<% if (mods_enabled.indexOf(mods_available[i]) != -1) { %>
<span class="checkbox checkbox-checked"><input type="checkbox" name="group_wiki" class="checkbox-orig" checked="checked" /></span>
<% } else { %>
<span class="checkbox"><input type="checkbox" name="group_wiki" class="checkbox-orig" /></span>
<% } %>
<span class="checkbox-option">{% trans "Wiki" %}</span>
</label>
</li>
<% } %>
<% } %>
</ul>
<input type="submit" value="{% trans "Submit"%}" class="submit" />
</form>
</script>
<script type="text/template" id="folder-perm-item-tmpl">
<% if (for_user) { %>
<td>
@ -883,7 +861,7 @@
</script>
<script type="text/template" id="add-pubrepo-item-tmpl">
<td class="select">
<span class="checkbox"><input type="checkbox" class="checkbox-orig" /></span>
<input type="checkbox" class="vam" />
</td>
<td>
<% if (encrypted) { %>

View File

@ -29,8 +29,8 @@
{% endif %}
<label class="checkbox-label">
<span class="checkbox"><input type="checkbox" name="remember_me" class="checkbox-orig"/></span>
<span class="checkbox-option">{% blocktrans %}Remember me for {{remember_days}} days {% endblocktrans %}</span>
<input type="checkbox" name="remember_me" class="vam" />
<span class="vam">{% blocktrans %}Remember me for {{remember_days}} days {% endblocktrans %}</span>
</label>
<input type="submit" value="{% trans "Log In" %}" class="submit" />

View File

@ -11,8 +11,8 @@
<div id="link-share" class="tabs-panel">
<div id="link-options">
<label class="checkbox-label">
<span class="checkbox"><input type="checkbox" name="use-passwd" id="link-passwd-switch" class="checkbox-orig" /></span>
<span class="checkbox-option">{% trans "Add password protection"%}</span>
<input type="checkbox" name="use-passwd" id="link-passwd-switch" class="vam" />
<span class="checkbox-option vam">{% trans "Add password protection"%}</span>
</label>
<div id="link-passwd" class="hide">
<label>{% trans "Password"%}</label><span class="tip">{% blocktrans %}(at least {{share_link_password_min_length}} characters){% endblocktrans %}</span><br />
@ -21,8 +21,8 @@
<input type="password" name="passwd_again" disabled="disabled" class="input input-disabled" />
</div>
<label class="checkbox-label">
<span class="checkbox"><input type="checkbox" name="set-expiration" id="link-expire-switch" class="checkbox-orig" /></span>
<span class="checkbox-option">{% trans "Add auto expiration"%}</span>
<input type="checkbox" name="set-expiration" id="link-expire-switch" class="vam" />
<span class="checkbox-option vam">{% trans "Add auto expiration"%}</span>
</label>
<div id="link-expire" class="hide">
<label>{% trans "Days" %}</label><br />

View File

@ -1,27 +0,0 @@
{% load i18n %}
<form id="repo-create-form" action="" method="post" class="hide">{% csrf_token %}
<h3>{% trans "New Library"%}</h3>
<label>{% trans "Name"%}</label><br/>
<input type="text" name="repo_name" value="" maxlength="{{max_file_name}}" class="input" /><br />
<label>{% trans "Description"%}</label><br/>
<textarea name="repo_desc" class="textarea"></textarea><br />
{% if create_shared_repo %}
<label>{% trans "Share Permission"%}</label><br />
<select name="permission" class="perm">
<option value="rw" selected="selected">{% trans "Read-Write"%}</option>
<option value="r">{% trans "Read-Only"%}</option>
</select>
{% endif %}
<div class="repo-create-encryption">
<label class="checkbox-label">
<span class="checkbox"><input type="checkbox" name="encryption" id="encrypt-switch" class="checkbox-orig" /></span>
<span class="checkbox-option">{% trans "Encrypt"%}</span>
</label>
<label>{% trans "Password"%}</label><span class="tip">{% blocktrans %}(at least {{repo_password_min_length}} characters){% endblocktrans %}</span><br />
<input type="password" name="passwd" disabled="disabled" class="input input-disabled" /><br />
<label>{% trans "Password again"%}</label><br />
<input type="password" name="passwd_again" disabled="disabled" class="input input-disabled" />
</div>
<p class="error hide"></p>
<input type="submit" value="{% trans "Submit"%}" class="submit" />
</form>

View File

@ -40,14 +40,38 @@
<div class="custom-ftype-options">
{% endif %}
{# ftype value should be the same with utils/file_types.py #}
<label class="checkbox-label"><span class="checkbox"><input type="checkbox" name="ftype" value="Text" class="checkbox-orig" /></span><span class="checkbox-option">{% trans "Text files" %}</span></label>
<label class="checkbox-label"><span class="checkbox"><input type="checkbox" name="ftype" value="Document" class="checkbox-orig" /></span><span class="checkbox-option">{% trans "Documents" %}</span></label>
<label class="checkbox-label"><span class="checkbox"><input type="checkbox" name="ftype" value="Image" class="checkbox-orig" /></span><span class="checkbox-option">{% trans "Images" %}</span></label>
<label class="checkbox-label"><span class="checkbox"><input type="checkbox" name="ftype" value="Video" class="checkbox-orig" /></span><span class="checkbox-option">{% trans "Video" %}</span></label>
<label class="checkbox-label"><span class="checkbox"><input type="checkbox" name="ftype" value="Audio" class="checkbox-orig" /></span><span class="checkbox-option">{% trans "Audio" %}</span></label>
<label class="checkbox-label"><span class="checkbox"><input type="checkbox" name="ftype" value="SVG" class="checkbox-orig" /></span><span class="checkbox-option">{% trans "svg" %}</span></label>
<label class="checkbox-label"><span class="checkbox"><input type="checkbox" name="ftype" value="PDF" class="checkbox-orig" /></span><span class="checkbox-option">{% trans "pdf" %}</span></label>
<label class="checkbox-label"><span class="checkbox"><input type="checkbox" name="ftype" value="Markdown" class="checkbox-orig" /></span><span class="checkbox-option">{% trans "markdown" %}</span></label>
<label class="checkbox-label">
<input type="checkbox" name="ftype" value="Text" class="vam" />
<span class="vam">{% trans "Text files" %}</span>
</label>
<label class="checkbox-label">
<input type="checkbox" name="ftype" value="Document" class="vam" />
<span class="vam">{% trans "Documents" %}</span>
</label>
<label class="checkbox-label">
<input type="checkbox" name="ftype" value="Image" class="vam" />
<span class="vam">{% trans "Images" %}</span>
</label>
<label class="checkbox-label">
<input type="checkbox" name="ftype" value="Video" class="vam" />
<span class="vam">{% trans "Video" %}</span>
</label>
<label class="checkbox-label">
<input type="checkbox" name="ftype" value="Audio" class="vam" />
<span class="vam">{% trans "Audio" %}</span>
</label>
<label class="checkbox-label">
<input type="checkbox" name="ftype" value="SVG" class="vam" />
<span class="vam">{% trans "svg" %}</span>
</label>
<label class="checkbox-label">
<input type="checkbox" name="ftype" value="PDF" class="vam" />
<span class="vam">{% trans "pdf" %}</span>
</label>
<label class="checkbox-label">
<input type="checkbox" name="ftype" value="Markdown" class="vam" />
<span class="vam">{% trans "markdown" %}</span>
</label>
<br/>
<input type="text" value="{{ input_fileexts }}" name="input_fexts" placeholder="{% trans "Input file extensions here, separate with ','" %}" class="fileext-input" />
<p class="error hide">{% trans "Please select at least one file type or input at least one file extension" %}</p>

View File

@ -23,7 +23,7 @@ function showSharePopup(op, name, aj_data, type, cur_path) {
var path = cur_path + name;
var form = $('#file-share');
form.modal({appendTo: "#main",'focus':false, containerCss:{"padding":0}});
form.modal({appendTo: "#main", focus:false});
var hd = $('#file-share .hd');
hd.html(hd.html().replace('%(name)s', '<span class="op-target">' + HTMLescape(trimFilename(name, 30)) + '</span>'));

View File

@ -20,8 +20,8 @@
<h5 class="web-setting-name">{{ setting_display_name }}</h5>
<div class="web-setting-input">
<label class="checkbox-label">
<span class="checkbox{% if setting_val %} checkbox-checked{% endif %}"><input class="checkbox-orig web-setting-checkbox" type="checkbox" name="{{ setting_name }}"{% if setting_val %} checked="checked"{% endif %} /></span>
<span class="checkbox-option">{{ help_tip }}</span>
<input class="web-setting-checkbox vam" type="checkbox" name="{{ setting_name }}"{% if setting_val %} checked="checked"{% endif %} />
<span class="vam">{{ help_tip }}</span>
</label>
</div>
</form>

View File

@ -16,7 +16,7 @@ define([
template: _.template($('#add-pubrepo-popup-tmpl').html()),
initialize: function(pubRepos) {
this.$el.html(this.template()).modal({});
this.$el.html(this.template()).modal({focus:false});
$('#simplemodal-container').css({'width':'auto', 'height':'auto'});
this.$table = this.$('table');

View File

@ -25,9 +25,8 @@ define([
},
select: function () {
var checkbox = this.$('.checkbox');
checkbox.toggleClass('checkbox-checked');
if (checkbox.hasClass('checkbox-checked')) {
var $checkbox = this.$('[type=checkbox]');
if ($checkbox.prop('checked')) {
this.model.set({'selected':true}, {silent:true});
} else {
this.model.set({'selected':false}, {silent:true});

View File

@ -83,13 +83,12 @@ define([
togglePasswdInput: function(e) {
var $checkbox = $('#encrypt-switch');
var pwd_input = this.$('input[type="password"]');
var $pwd_input = this.$('input[type="password"]');
$checkbox.parent().toggleClass('checkbox-checked');
if ($checkbox.prop('checked')) {
pwd_input.attr('disabled', false).removeClass('input-disabled');
$pwd_input.attr('disabled', false).removeClass('input-disabled');
} else {
pwd_input.attr('disabled', true).addClass('input-disabled');
$pwd_input.attr('disabled', true).addClass('input-disabled');
}
}

View File

@ -746,24 +746,23 @@ define([
},
select: function () {
var $el = this.$('th .checkbox');
$el.toggleClass('checkbox-checked');
var $el = this.$('th [type=checkbox]');
var dir = this.dir;
var all_dirent_checkbox = this.$('.checkbox');
var $all_dirent_checkbox = this.$('[type=checkbox]');
var $dirents_op = this.$('#multi-dirents-op');
var $curDirOps = this.$('#upload-file, #add-new-dir, #add-new-file, #share-cur-dir');
if ($el.hasClass('checkbox-checked')) {
all_dirent_checkbox.addClass('checkbox-checked');
if ($el.prop('checked')) {
$all_dirent_checkbox.prop('checked', true);
dir.each(function(model) {
model.set({'selected': true}, {silent: true});
});
$dirents_op.css({'display':'inline-block'});
$curDirOps.hide();
} else {
all_dirent_checkbox.removeClass('checkbox-checked');
$all_dirent_checkbox.prop('checked', false);
dir.each(function(model) {
model.set({'selected': false}, {silent: true});
});

View File

@ -91,9 +91,8 @@ define([
},
select: function () {
var checkbox = this.$('.checkbox');
checkbox.toggleClass('checkbox-checked');
if (checkbox.hasClass('checkbox-checked')) {
var $checkbox = this.$('[type=checkbox]');
if ($checkbox.prop('checked')) {
this.model.set({'selected':true}, {silent:true}); // do not trigger the 'change' event.
} else {
this.model.set({'selected':false}, {silent:true});
@ -101,8 +100,13 @@ define([
var dirView = this.dirView;
var $dirents_op = dirView.$('#multi-dirents-op');
var toggle_all_checkbox = dirView.$('th .checkbox');
var checked_num = dirView.$('tr:gt(0) .checkbox-checked').length;
var $toggle_all_checkbox = dirView.$('th [type=checkbox]');
var checked_num = 0;
dirView.$('tr:gt(0) [type=checkbox]').each(function() {
if ($(this).prop('checked')) {
checked_num += 1;
}
});
var $curDirOps = dirView.$('#upload-file, #add-new-dir, #add-new-file, #share-cur-dir');
@ -114,9 +118,9 @@ define([
$curDirOps.show();
}
if (checked_num == dirView.$('tr:gt(0)').length) {
toggle_all_checkbox.addClass('checkbox-checked');
$toggle_all_checkbox.prop('checked', true);
} else {
toggle_all_checkbox.removeClass('checkbox-checked');
$toggle_all_checkbox.prop('checked', false);
}
},

View File

@ -68,9 +68,7 @@ define([
},
events: {
'mouseenter .checkbox-label': 'highlightCheckbox',
'mouseleave .checkbox-label': 'rmHighlightCheckbox',
'click .checkbox-orig': 'clickCheckbox',
'click [type="checkbox"]': 'clickCheckbox',
// download link
'submit #generate-download-link-form': 'generateDownloadLink',
@ -95,19 +93,10 @@ define([
'click #add-dir-group-share-item .submit': 'dirGroupShare'
},
highlightCheckbox: function (e) {
$(e.currentTarget).addClass('hl');
},
rmHighlightCheckbox: function (e) {
$(e.currentTarget).removeClass('hl');
},
clickCheckbox: function(e) {
var el = e.currentTarget;
$(el).parent().toggleClass('checkbox-checked');
var $el = $(e.currentTarget);
// for link options such as 'password', 'expire'
$(el).closest('.checkbox-label').next().toggleClass('hide');
$el.closest('.checkbox-label').next().toggleClass('hide');
},
downloadLinkPanelInit: function() {