fixes mm-1316 improves channel notifications UI and updates channellist etag

Этот коммит содержится в:
JoramWilander
2015-06-22 14:23:59 -04:00
родитель afb62bb40a
Коммит 2b4888d062
5 изменённых файлов: 185 добавлений и 76 удалений

Просмотреть файл

@@ -53,6 +53,12 @@ func (o *ChannelList) Etag() string {
t = member.LastViewedAt
id = v.Id
}
if member.LastUpdateAt > t {
t = member.LastUpdateAt
id = v.Id
}
}
}

Просмотреть файл

@@ -25,6 +25,7 @@ type ChannelMember struct {
MsgCount int64 `json:"msg_count"`
MentionCount int64 `json:"mention_count"`
NotifyLevel string `json:"notify_level"`
LastUpdateAt int64 `json:"last_update_at"`
}
func (o *ChannelMember) ToJson() string {
@@ -70,6 +71,10 @@ func (o *ChannelMember) IsValid() *AppError {
return nil
}
func (o *ChannelMember) PreSave() {
o.LastUpdateAt = GetMillis()
}
func IsChannelNotifyLevelValid(notifyLevel string) bool {
return notifyLevel == CHANNEL_NOTIFY_ALL || notifyLevel == CHANNEL_NOTIFY_MENTION || notifyLevel == CHANNEL_NOTIFY_NONE || notifyLevel == CHANNEL_NOTIFY_QUIET
}

Просмотреть файл

@@ -37,6 +37,7 @@ func NewSqlChannelStore(sqlStore *SqlStore) ChannelStore {
}
func (s SqlChannelStore) UpgradeSchemaIfNeeded() {
s.CreateColumnIfNotExists("ChannelMembers", "LastUpdateAt", "NotifyLevel", "bigint(20)", "0")
}
func (s SqlChannelStore) CreateIndexesIfNotExists() {
@@ -273,6 +274,7 @@ func (s SqlChannelStore) SaveMember(member *model.ChannelMember) StoreChannel {
go func() {
result := StoreResult{}
member.PreSave()
if result.Err = member.IsValid(); result.Err != nil {
storeChannel <- result
return
@@ -484,7 +486,8 @@ func (s SqlChannelStore) UpdateLastViewedAt(channelId string, userId string) Sto
SET
ChannelMembers.MentionCount = 0,
ChannelMembers.MsgCount = Channels.TotalMsgCount,
ChannelMembers.LastViewedAt = Channels.LastPostAt
ChannelMembers.LastViewedAt = Channels.LastPostAt,
ChannelMembers.LastUpdateAt = Channels.LastPostAt
WHERE
Channels.Id = ChannelMembers.ChannelId
AND UserId = ?
@@ -533,15 +536,18 @@ func (s SqlChannelStore) UpdateNotifyLevel(channelId, userId, notifyLevel string
go func() {
result := StoreResult{}
updateAt := model.GetMillis()
_, err := s.GetMaster().Exec(
`UPDATE
ChannelMembers
SET
NotifyLevel = ?
NotifyLevel = ?,
LastUpdateAt = ?
WHERE
UserId = ?
AND ChannelId = ?`,
notifyLevel, userId, channelId)
notifyLevel, updateAt, userId, channelId)
if err != nil {
result.Err = model.NewAppError("SqlChannelStore.UpdateNotifyLevel", "We couldn't update the notify level", "channel_id="+channelId+", user_id="+userId+", "+err.Error())
}

Просмотреть файл

@@ -15,17 +15,8 @@ var AppDispatcher = require('../dispatcher/app_dispatcher.jsx');
var Constants = require('../utils/constants.jsx');
var ActionTypes = Constants.ActionTypes;
function getExtraInfoStateFromStores() {
return {
extra_info: ChannelStore.getCurrentExtraInfo()
};
}
var ExtraMembers = React.createClass({
componentDidMount: function() {
ChannelStore.addExtraInfoChangeListener(this._onChange);
ChannelStore.addChangeListener(this._onChange);
var originalLeave = $.fn.popover.Constructor.prototype.leave;
$.fn.popover.Constructor.prototype.leave = function(obj) {
var self = obj instanceof this.constructor ? obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type);
@@ -49,25 +40,12 @@ var ExtraMembers = React.createClass({
});
},
componentWillUnmount: function() {
ChannelStore.removeExtraInfoChangeListener(this._onChange);
ChannelStore.removeChangeListener(this._onChange);
},
_onChange: function() {
var newState = getExtraInfoStateFromStores();
if (!utils.areStatesEqual(newState, this.state)) {
this.setState(newState);
}
},
getInitialState: function() {
return getExtraInfoStateFromStores();
},
render: function() {
var count = this.state.extra_info.members.length == 0 ? "-" : this.state.extra_info.members.length;
count = this.state.extra_info.members.length > 19 ? "20+" : count;
var count = this.props.members.length == 0 ? "-" : this.props.members.length;
count = this.props.members.length > 19 ? "20+" : count;
var data_content = "";
this.state.extra_info.members.forEach(function(m) {
this.props.members.forEach(function(m) {
data_content += "<div style='white-space: nowrap'>" + m.username + "</div>";
});
@@ -228,7 +206,7 @@ module.exports = React.createClass({
<a href="#"><strong className="heading">{channelTitle}</strong></a>
}
</th>
<th><ExtraMembers channelId={this.state.channel.id} /></th>
<th><ExtraMembers members={this.state.users} channelId={this.state.channel.id} /></th>
{ searchForm }
<th>
<div className="dropdown" style={{"marginLeft":"5px", "marginRight":"10px"}}>

Просмотреть файл

@@ -1,6 +1,8 @@
// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
// See License.txt for license information.
var SettingItemMin = require('./setting_item_min.jsx');
var SettingItemMax = require('./setting_item_max.jsx');
var utils = require('../utils/utils.jsx');
var client = require('../utils/client.jsx');
@@ -9,26 +11,50 @@ var ChannelStore = require('../stores/channel_store.jsx');
module.exports = React.createClass({
componentDidMount: function() {
ChannelStore.addChangeListener(this._onChange);
var self = this;
$(this.refs.modal.getDOMNode()).on('show.bs.modal', function(e) {
var button = e.relatedTarget;
var channel_id = button.dataset.channelid;
var notifyLevel = ChannelStore.getMember(channel_id).notify_level;
self.setState({ notify_level: notifyLevel, title: button.dataset.title, channel_id: channel_id });
var quietMode = false;
if (notifyLevel === "quiet") quietMode = true;
self.setState({ notify_level: notifyLevel, quiet_mode: quietMode, title: button.dataset.title, channel_id: channel_id });
});
},
getInitialState: function() {
return { notify_level: "", title: "", channel_id: "" };
componentWillUnmount: function() {
ChannelStore.removeChangeListener(this._onChange);
},
handleUpdate: function(e) {
_onChange: function() {
if (!this.state.channel_id) return;
var notifyLevel = ChannelStore.getMember(this.state.channel_id).notify_level;
var quietMode = false;
if (notifyLevel === "quiet") quietMode = true;
var newState = this.state;
newState.notify_level = notifyLevel;
newState.quiet_mode = quietMode;
if (!utils.areStatesEqual(this.state, newState)) {
this.setState(newState);
}
},
updateSection: function(section) {
this.setState({ activeSection: section });
},
getInitialState: function() {
return { notify_level: "", title: "", channel_id: "", activeSection: "" };
},
handleUpdate: function() {
var channel_id = this.state.channel_id;
var notify_level = this.state.notify_level;
var notify_level = this.state.quiet_mode ? "quiet" : this.state.notify_level;
var data = {};
data["channel_id"] = channel_id;
data["user_id"] = UserStore.getCurrentId();
data["notify_level"] = this.state.notify_level;
data["notify_level"] = notify_level;
if (!data["notify_level"] || data["notify_level"].length === 0) return;
@@ -37,7 +63,7 @@ module.exports = React.createClass({
var member = ChannelStore.getMember(channel_id);
member.notify_level = notify_level;
ChannelStore.setChannelMember(member);
$(this.refs.modal.getDOMNode()).modal('hide');
this.updateSection("");
}.bind(this),
function(err) {
this.setState({ server_error: err.message });
@@ -45,42 +71,138 @@ module.exports = React.createClass({
);
},
handleRadioClick: function(notifyLevel) {
this.setState({ notify_level: notifyLevel });
this.setState({ notify_level: notifyLevel, quiet_mode: false });
this.refs.modal.getDOMNode().focus();
},
handleQuietToggle: function() {
if (this.state.notify_level === "quiet") {
this.setState({ notify_level: "none" });
this.refs.modal.getDOMNode().focus();
} else {
this.setState({ notify_level: "quiet" });
this.refs.modal.getDOMNode().focus();
}
handleQuietToggle: function(quietMode) {
this.setState({ notify_level: "none", quiet_mode: quietMode });
this.refs.modal.getDOMNode().focus();
},
render: function() {
var server_error = this.state.server_error ? <div className='form-group has-error'><label className='control-label'>{ this.state.server_error }</label></div> : null;
var allActive = "";
var mentionActive = "";
var noneActive = "";
var quietActive = "";
var desktopHidden = "";
var self = this;
if (this.state.notify_level === "quiet") {
desktopHidden = "hidden";
quietActive = "active";
} else if (this.state.notify_level === "mention") {
mentionActive = "active";
} else if (this.state.notify_level === "none") {
noneActive = "active";
var desktopSection;
if (this.state.activeSection === 'desktop') {
var notifyActive = [false, false, false];
if (this.state.notify_level === "mention") {
notifyActive[1] = true;
} else if (this.state.notify_level === "all") {
notifyActive[0] = true;
} else {
notifyActive[2] = true;
}
var inputs = [];
inputs.push(
<div className="col-sm-12">
<div className="radio">
<label>
<input type="radio" checked={notifyActive[0]} onClick={function(){self.handleRadioClick("all")}}>For all activity</input>
</label>
<br/>
</div>
<div className="radio">
<label>
<input type="radio" checked={notifyActive[1]} onClick={function(){self.handleRadioClick("mention")}}>Only for mentions</input>
</label>
<br/>
</div>
<div className="radio">
<label>
<input type="radio" checked={notifyActive[2]} onClick={function(){self.handleRadioClick("none")}}>Never</input>
</label>
</div>
</div>
);
desktopSection = (
<SettingItemMax
title="Send desktop notifications"
inputs={inputs}
submit={this.handleUpdate}
server_error={server_error}
updateSection={function(e){self.updateSection("");self._onChange();e.preventDefault();}}
/>
);
} else {
allActive = "active";
var describe = "";
if (this.state.notify_level === "mention") {
describe = "Only for mentions";
} else if (this.state.notify_level === "all") {
describe = "For all activity";
} else {
describe = "Never";
}
desktopSection = (
<SettingItemMin
title="Send desktop notifications"
describe={describe}
updateSection={function(e){self.updateSection("desktop");e.preventDefault();}}
/>
);
}
var quietSection;
if (this.state.activeSection === 'quiet') {
var quietActive = ["",""];
if (this.state.quiet_mode) {
quietActive[0] = "active";
} else {
quietActive[1] = "active";
}
var inputs = [];
inputs.push(
<div className="col-sm-12">
<div className="btn-group" data-toggle="buttons-radio">
<button className={"btn btn-default "+quietActive[0]} onClick={function(){self.handleQuietToggle(true)}}>On</button>
<button className={"btn btn-default "+quietActive[1]} onClick={function(){self.handleQuietToggle(false)}}>Off</button>
</div>
</div>
);
inputs.push(
<div className="col-sm-12">
<br/>
Enabling quiet mode will turn off desktop notifications and only mark the channel as unread if you have been mentioned.
</div>
);
quietSection = (
<SettingItemMax
title="Quiet mode"
inputs={inputs}
submit={this.handleUpdate}
server_error={server_error}
updateSection={function(e){self.updateSection("");self._onChange();e.preventDefault();}}
/>
);
} else {
var describe = "";
if (this.state.quiet_mode) {
describe = "On";
} else {
describe = "Off";
}
quietSection = (
<SettingItemMin
title="Quiet mode"
describe={describe}
updateSection={function(e){self.updateSection("quiet");e.preventDefault();}}
/>
);
}
var self = this;
return (
<div className="modal fade" id="channel_notifications" ref="modal" tabIndex="-1" role="dialog" aria-hidden="true">
<div className="modal-dialog">
<div className="modal-dialog settings-modal">
<div className="modal-content">
<div className="modal-header">
<button type="button" className="close" data-dismiss="modal">
@@ -90,31 +212,23 @@ module.exports = React.createClass({
<h4 className="modal-title">{"Notification Preferences for " + this.state.title}</h4>
</div>
<div className="modal-body">
<div className={desktopHidden}>
<span>Desktop Notifications</span>
<br/>
<div className="btn-group" data-toggle="buttons-radio">
<button className={"btn btn-default "+allActive} onClick={function(){self.handleRadioClick("all")}}>Any activity (default)</button>
<button className={"btn btn-default "+mentionActive} onClick={function(){self.handleRadioClick("mention")}}>Mentions of my name</button>
<button className={"btn btn-default "+noneActive} onClick={function(){self.handleRadioClick("none")}}>Nothing</button>
<div className="settings-table">
<div className="settings-content">
<div ref="wrapper" className="user-settings">
<br/>
<div className="divider-dark first"/>
{desktopSection}
<div className="divider-light"/>
{quietSection}
<div className="divider-dark"/>
</div>
<br/>
<br/>
</div>
<span>Quiet Mode</span>
<br/>
<div className="btn-group" data-toggle="buttons-checkbox">
<button className={"btn btn-default "+quietActive} onClick={this.handleQuietToggle}>Quiet Mode</button>
</div>
{ server_error }
</div>
<div className="modal-footer">
<button type="button" className="btn btn-primary" onClick={this.handleUpdate}>Done</button>
</div>
</div>
</div>
</div>
);
}
});