mirror of
https://github.com/haiwen/seahub.git
synced 2025-09-01 15:09:14 +00:00
Update group discussion
This commit is contained in:
Daniel Pan
llj
@@ -11,6 +11,8 @@
|
||||
* Helper
|
||||
* common class .......... common class
|
||||
*
|
||||
* Widget
|
||||
*
|
||||
* (TODO: complete this TOC)
|
||||
*
|
||||
*/
|
||||
@@ -1222,6 +1224,52 @@ textarea:-moz-placeholder {/* for FF */
|
||||
text-decoration:none;
|
||||
color:#fff;
|
||||
}
|
||||
/**** discussions/comments ****/
|
||||
.msg {
|
||||
padding:10px 0;
|
||||
}
|
||||
.msg-avatar {
|
||||
float:left;
|
||||
margin-left:10px;
|
||||
}
|
||||
.msg-body {
|
||||
margin-left:54px;
|
||||
}
|
||||
.msg-header {
|
||||
}
|
||||
.msg-username {
|
||||
}
|
||||
.msg-content p:first-child {
|
||||
margin-top:0px;
|
||||
}
|
||||
.msg-time {
|
||||
font-size:11px;
|
||||
color:#999;
|
||||
margin-left:5px;
|
||||
}
|
||||
.msg-form {
|
||||
background:#f2f2f2;
|
||||
position:relative;
|
||||
padding-top:10px;
|
||||
border-top: 1px solid #c9c9c9;
|
||||
}
|
||||
.msg-input {
|
||||
width:350px;
|
||||
padding:3px 5px;
|
||||
}
|
||||
.msg-form .submit {
|
||||
color:#fff;
|
||||
background:#4abb49;
|
||||
border:1px solid #5cb25b;
|
||||
margin:0px 0 8px;
|
||||
}
|
||||
.msg-form .submit:hover {
|
||||
background:#55ab22;
|
||||
}
|
||||
.no-discussion-tip {
|
||||
text-align:center;
|
||||
margin:10px 0;
|
||||
}
|
||||
/********** container ***********/
|
||||
#main, #footer {
|
||||
width:950px;
|
||||
@@ -2271,250 +2319,8 @@ textarea:-moz-placeholder {/* for FF */
|
||||
.member .name {
|
||||
vertical-align:middle;
|
||||
}
|
||||
|
||||
/* notification admin */
|
||||
.cur-note { color: red; font-size: 75%; }
|
||||
|
||||
/* group message and replies */
|
||||
.msg-panel {
|
||||
width:640px;
|
||||
margin-top:10px;
|
||||
}
|
||||
.msg-form .avatar,
|
||||
.msg .avatar {
|
||||
border-radius:1000px;
|
||||
}
|
||||
#personal-msg-panel {
|
||||
margin-top:22px;
|
||||
}
|
||||
.msg-num {
|
||||
font-size:12px;
|
||||
color:#333;
|
||||
}
|
||||
.msg-form {
|
||||
padding:10px;
|
||||
background:#f2f2f2;
|
||||
border-radius:3px;
|
||||
margin:0 0 22px 64px;
|
||||
position:relative;
|
||||
}
|
||||
#send-msg-form {
|
||||
padding:0;
|
||||
background:transparent;
|
||||
margin:0;
|
||||
}
|
||||
.msg-form .avatar {
|
||||
position:absolute;
|
||||
left:-64px;
|
||||
top:-1px;
|
||||
}
|
||||
#send-msg-form .avatar {
|
||||
border-radius:3px;
|
||||
position:static;
|
||||
}
|
||||
.msg-form .ops {
|
||||
text-align:right;
|
||||
margin-top:6px;
|
||||
}
|
||||
.msg-form .add-file {
|
||||
margin:9px 10px 0 3px;
|
||||
}
|
||||
#selected-files .item {
|
||||
text-align:left;
|
||||
padding:2px 3px;
|
||||
}
|
||||
#selected-files .rm {
|
||||
margin-right:3px;
|
||||
}
|
||||
#selected-files .rm,
|
||||
.msg-form .add-file {
|
||||
cursor:pointer;
|
||||
opacity:0.8;
|
||||
}
|
||||
#selected-files .rm:hover,
|
||||
.msg-form .add-file:hover {
|
||||
opacity:1;
|
||||
}
|
||||
.msg-input {
|
||||
width:544px;
|
||||
padding:3px 5px;
|
||||
height:25px;
|
||||
vertical-align:top;
|
||||
}
|
||||
.personal-msg-panel .msg-input {
|
||||
width:480px;
|
||||
}
|
||||
.say {
|
||||
position:absolute;
|
||||
width:10px;
|
||||
height:21px;
|
||||
background:transparent url('../img/say.png') no-repeat scroll left top;
|
||||
left:-10px;
|
||||
top:20px;
|
||||
}
|
||||
.msg {
|
||||
word-wrap: break-word;
|
||||
padding:1px 0; /* to fix 'top border missing' when only 1 discussion & no scrollbar in chrome */
|
||||
margin:15px 0 20px;
|
||||
}
|
||||
.msg .txt {
|
||||
margin-left:64px;
|
||||
}
|
||||
.personal-msg-panel .msg-form,
|
||||
.personal-msg-panel .msg .txt {
|
||||
margin-right:64px;
|
||||
}
|
||||
.msg a {
|
||||
font-weight: normal;
|
||||
}
|
||||
.msg-main {
|
||||
position:relative;
|
||||
padding:16px;
|
||||
background:#fff;
|
||||
border:1px solid #ccc;
|
||||
border-top-left-radius:3px;
|
||||
border-top-right-radius:3px;
|
||||
}
|
||||
.personal-msg-panel .msg-main {
|
||||
border-radius:3px;
|
||||
}
|
||||
.msg-main .say {
|
||||
background-image:url('../img/say_white.png');
|
||||
}
|
||||
.msg-received .say {
|
||||
background-image:url('../img/say_white_reverse.png');
|
||||
left:auto;
|
||||
right:-10px;
|
||||
}
|
||||
.msg-attachment {
|
||||
padding-top:10px;
|
||||
border-top:1px solid #e9e9e9;
|
||||
margin-top:12px;
|
||||
}
|
||||
.msg-attachment .img-cont {
|
||||
display:block;
|
||||
text-align:center;
|
||||
line-height:0;
|
||||
background:#fcfcfc;
|
||||
padding:5px 0;
|
||||
}
|
||||
.msg-attachment .img {
|
||||
width:auto;
|
||||
height:auto;
|
||||
max-width:100%;
|
||||
max-height:300px;
|
||||
}
|
||||
.msg-hd .author {
|
||||
font-weight:bold;
|
||||
}
|
||||
.msg .time {
|
||||
font-size:11px;
|
||||
color:#999;
|
||||
margin-left:5px;
|
||||
}
|
||||
.msg .op {
|
||||
font-size:11px;
|
||||
color:#999;
|
||||
cursor:pointer;
|
||||
margin-left:5px;
|
||||
}
|
||||
.msg-hd .group,
|
||||
.discussion-to-grp .time {
|
||||
color: #808080;
|
||||
}
|
||||
.msg-hd .group {
|
||||
margin-left:30px;
|
||||
}
|
||||
.msg-con {
|
||||
margin-bottom:0;
|
||||
}
|
||||
.msg-op {
|
||||
color:#444;
|
||||
padding:10px 16px;
|
||||
background:#f8f8f8;
|
||||
border:1px solid #d5d5d5;
|
||||
border-top:0;
|
||||
border-bottom-left-radius:3px;
|
||||
border-bottom-right-radius:3px;
|
||||
}
|
||||
.replies-op {
|
||||
font-weight:bold;
|
||||
cursor:pointer;
|
||||
margin-bottom:10px;
|
||||
position:relative;
|
||||
}
|
||||
.unfold-replies,
|
||||
.fold-replies {
|
||||
padding-right:14px;
|
||||
background:transparent scroll no-repeat right center;
|
||||
}
|
||||
.unfold-replies {
|
||||
background-image:url('../img/unfold.png');
|
||||
}
|
||||
.fold-replies {
|
||||
background-image:url('../img/fold.png');
|
||||
}
|
||||
.unfold-replies-nobg {
|
||||
background-image:none;
|
||||
}
|
||||
.replies-loading-icon {
|
||||
position:absolute;
|
||||
top:0;
|
||||
width:12px;
|
||||
height:12px;
|
||||
display:none;
|
||||
}
|
||||
.msg .at {
|
||||
color:#808;
|
||||
}
|
||||
.reply {
|
||||
line-height:1.2;
|
||||
margin-bottom:15px;
|
||||
}
|
||||
.reply .txt {
|
||||
margin-left:38px;
|
||||
}
|
||||
.reply-con {
|
||||
font-size:12px;
|
||||
line-height:1.3;
|
||||
margin:4px 0 0;
|
||||
}
|
||||
.reply-input {
|
||||
width:530px;
|
||||
padding:5px;
|
||||
height:20px;
|
||||
vertical-align:top;
|
||||
}
|
||||
.msg-form .submit,
|
||||
.msg-form .cancel,
|
||||
.reply-submit,
|
||||
.reply-cancel {
|
||||
padding:5px 15px;
|
||||
background:#fff;
|
||||
margin-top:6px;
|
||||
}
|
||||
.msg-form .submit {
|
||||
color:#fff;
|
||||
background:#4abb49;
|
||||
border:1px solid #5cb25b;
|
||||
}
|
||||
.msg-form .submit:hover {
|
||||
background:#55ab22;
|
||||
}
|
||||
.msg-form .cancel {
|
||||
margin-left:6px;
|
||||
}
|
||||
#msg-upward {
|
||||
position:fixed;
|
||||
font-weight:normal;
|
||||
}
|
||||
#msg-upward:hover {
|
||||
text-decoration:none;
|
||||
}
|
||||
#msgs-more {
|
||||
width:576px;
|
||||
margin-left:64px;
|
||||
}
|
||||
/*file upload*/
|
||||
.files-add {
|
||||
position: relative;
|
||||
@@ -3606,6 +3412,9 @@ img.thumbnail {
|
||||
#group-discussions .outer-caret {
|
||||
right:30px;
|
||||
}
|
||||
#group-discussions .popover-con {
|
||||
padding:0 0;
|
||||
}
|
||||
/****** grid view *****/
|
||||
/* view mode */
|
||||
.switch-mode {
|
||||
|
||||
@@ -982,13 +982,13 @@
|
||||
</script>
|
||||
|
||||
<script type="text/template" id="group-discussion-tmpl">
|
||||
<img src="<%= avatar_url %>" alt="" width="32" class="avatar-circle fleft" />
|
||||
<div class="txt">
|
||||
<div>
|
||||
<span class="txt-item ellipsis" title="<%- user_name %>"><%- user_name %></span>
|
||||
<span class="txt-item ellipsis" title="<%- created_at %>"><%- created_at %></span>
|
||||
<img src="<%= avatar_url %>" alt="" width="32" class="msg-avatar avatar-circle" />
|
||||
<div class="msg-body">
|
||||
<div class="msg-header">
|
||||
<a class="msg-username ellipsis" href="<%= user_profile_url %>"><%- user_name %></a>
|
||||
<span class="msg-time" title="<%- time %>"><%- time_from_now %></span>
|
||||
</div>
|
||||
<div class="txt-item" title=""><%= content_marked %></div>
|
||||
<div class="msg-content" title=""><%= content_marked %></div>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
|
||||
@@ -160,11 +160,14 @@
|
||||
<div class="popover-con">
|
||||
<span class="loading-icon loading-tip"></span>
|
||||
<ul id="group-discussion-list" class="hide"></ul>
|
||||
<div class="no-discussion-tip" style="display:none;">
|
||||
<p>{% blocktrans %}No discussion in this group yet.{% endblocktrans %}</p>
|
||||
</div>
|
||||
<div>
|
||||
<form id="group-message-form" action="" method="post" class="">{% csrf_token %}
|
||||
<img src="{% avatar_url request.user 64 %}" alt="" width="32" class="avatar-circle fleft" />
|
||||
<div class="txt">
|
||||
<textarea name="message" id="message" placeholder="{% trans "Add a discussion..." %}" class=""></textarea>
|
||||
<form id="group-message-form" action="" method="post" class="msg-form">{% csrf_token %}
|
||||
<img src="{% avatar_url request.user 64 %}" alt="" width="32" class="msg-avatar avatar-circle" />
|
||||
<div class="msg-body">
|
||||
<textarea name="message" id="add-discussion" placeholder="{% trans "Add a discussion..." %}" class="msg-input"></textarea>
|
||||
<div class="ops">
|
||||
<button type="submit" class="submit">{% trans "Submit" %}</button>
|
||||
</div>
|
||||
|
||||
@@ -42,16 +42,9 @@ define([
|
||||
data['synced_repos_length'] = 0;
|
||||
}
|
||||
|
||||
// convert to human readable time
|
||||
var now = new Date(),
|
||||
last_accessed = Moment(data['last_accessed']);
|
||||
|
||||
var last_accessed = Moment(data['last_accessed']);
|
||||
data['time'] = last_accessed.format('LLLL');
|
||||
if (last_accessed - now > 0) {
|
||||
data['time_from_now'] = gettext("Just now");
|
||||
} else {
|
||||
data['time_from_now'] = last_accessed.fromNow();
|
||||
}
|
||||
data['time_from_now'] = Common.getRelativeTimeStr(last_accessed);
|
||||
|
||||
this.$el.html(this.template(data));
|
||||
|
||||
|
||||
@@ -3,13 +3,14 @@ define([
|
||||
'underscore',
|
||||
'backbone',
|
||||
'common',
|
||||
'marked'
|
||||
], function($, _, Backbone, Common, Marked) {
|
||||
'marked',
|
||||
'moment'
|
||||
], function($, _, Backbone, Common, Marked, Moment) {
|
||||
'use strict';
|
||||
|
||||
var View = Backbone.View.extend({
|
||||
tagName: 'li',
|
||||
className: 'user-item cspt ovhd',
|
||||
className: 'msg cspt ovhd',
|
||||
|
||||
template: _.template($('#group-discussion-tmpl').html()),
|
||||
|
||||
@@ -23,9 +24,17 @@ define([
|
||||
|
||||
render: function() {
|
||||
var obj = this.model.attributes;
|
||||
Common.getMomentWithLocale(obj['created_at']);
|
||||
var m = Moment(obj['created_at']);
|
||||
|
||||
var user_profile_url = Common.getUrl({
|
||||
'name': 'user_profile',
|
||||
'username': encodeURIComponent(obj.user_email)
|
||||
});
|
||||
_.extend(obj, {
|
||||
'content_marked': Marked(obj.content, { breaks: true })
|
||||
'content_marked': Marked(obj.content, { breaks: true }),
|
||||
'time': m.format('LLLL'),
|
||||
'time_from_now': Common.getRelativeTimeStr(m),
|
||||
'user_profile_url': user_profile_url
|
||||
});
|
||||
this.$el.html(this.template(obj));
|
||||
return this;
|
||||
|
||||
@@ -18,6 +18,7 @@ define([
|
||||
|
||||
this.$loadingTip = this.$('.loading-tip');
|
||||
this.$listContainer = this.$('#group-discussion-list');
|
||||
this.$emptyTip = this.$('.no-discussion-tip');
|
||||
this.$error = this.$('.error');
|
||||
|
||||
var _this = this;
|
||||
@@ -59,9 +60,15 @@ define([
|
||||
this.$error.hide();
|
||||
this.$loadingTip.hide();
|
||||
this.$listContainer.empty();
|
||||
this.collection.each(this.addOne, this);
|
||||
this.$listContainer.removeClass('hide');
|
||||
this.$listContainer.show();
|
||||
if (this.collection.length) {
|
||||
this.$emptyTip.hide();
|
||||
this.collection.each(this.addOne, this);
|
||||
this.$listContainer.removeClass('hide');
|
||||
this.$listContainer.show();
|
||||
} else {
|
||||
this.$emptyTip.show();
|
||||
this.$listContainer.hide();
|
||||
}
|
||||
},
|
||||
|
||||
render: function() {
|
||||
@@ -124,6 +131,9 @@ define([
|
||||
prepend: true,
|
||||
success: function() {
|
||||
_this.$('[name="message"]').val('');
|
||||
if (_this.collection.length == 1) {
|
||||
_this.collection.reset(_this.collection.models);
|
||||
}
|
||||
},
|
||||
error: function(collection, response, options) {
|
||||
var err_msg;
|
||||
|
||||
@@ -478,6 +478,15 @@ define([
|
||||
Moment.locale(language_code);
|
||||
},
|
||||
|
||||
getRelativeTimeStr: function(m) {
|
||||
var now = new Date();
|
||||
if (m - now > 0) {
|
||||
return gettext("Just now");
|
||||
} else {
|
||||
return m.fromNow();
|
||||
}
|
||||
},
|
||||
|
||||
closePopup: function(e, popup, popup_switch) {
|
||||
var target = e.target || event.srcElement;
|
||||
if (!popup.hasClass('hide') && !popup.is(target) && !popup.find('*').is(target) && !popup_switch.is(target) && !popup_switch.find('*').is(target) ) {
|
||||
|
||||
Reference in New Issue
Block a user