summaryrefslogtreecommitdiffstats
path: root/web/react
diff options
context:
space:
mode:
Diffstat (limited to 'web/react')
-rw-r--r--web/react/components/channel_header.jsx2
-rw-r--r--web/react/components/create_comment.jsx2
-rw-r--r--web/react/components/create_post.jsx2
-rw-r--r--web/react/components/file_upload.jsx2
-rw-r--r--web/react/components/login.jsx12
-rw-r--r--web/react/components/navbar.jsx2
-rw-r--r--web/react/components/post_info.jsx4
-rw-r--r--web/react/components/post_right.jsx2
-rw-r--r--web/react/components/setting_item_max.jsx2
-rw-r--r--web/react/components/sidebar_header.jsx4
-rw-r--r--web/react/components/signup_user_complete.jsx23
-rw-r--r--web/react/components/signup_user_oauth.jsx84
-rw-r--r--web/react/components/user_settings.jsx74
-rw-r--r--web/react/pages/login.jsx4
-rw-r--r--web/react/pages/signup_user_complete.jsx6
-rw-r--r--web/react/pages/signup_user_oauth.jsx11
-rw-r--r--web/react/utils/constants.jsx4
17 files changed, 191 insertions, 49 deletions
diff --git a/web/react/components/channel_header.jsx b/web/react/components/channel_header.jsx
index 30435dc08..7a129f200 100644
--- a/web/react/components/channel_header.jsx
+++ b/web/react/components/channel_header.jsx
@@ -205,7 +205,7 @@ module.exports = React.createClass({
<th>
<div className="dropdown channel-header__links">
<a href="#" className="dropdown-toggle theme" type="button" id="channel_header_right_dropdown" data-toggle="dropdown" aria-expanded="true">
- <span dangerouslySetInnerHTML={{__html: " <svg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px'width='4px' height='16px' viewBox='0 0 8 32' enable-background='new 0 0 8 32' xml:space='preserve'> <g> <circle cx='4' cy='4.062' r='4'/> <circle cx='4' cy='16' r='4'/> <circle cx='4' cy='28' r='4'/> </g> </svg>"}} /> </a>
+ <span dangerouslySetInnerHTML={{__html: Constants.MENU_ICON }} /> </a>
<ul className="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="channel_header_right_dropdown">
<li role="presentation"><a role="menuitem" href="#" onClick={this.searchMentions}>Recent Mentions</a></li>
</ul>
diff --git a/web/react/components/create_comment.jsx b/web/react/components/create_comment.jsx
index 3f8e9ed2e..88c01c586 100644
--- a/web/react/components/create_comment.jsx
+++ b/web/react/components/create_comment.jsx
@@ -40,7 +40,7 @@ module.exports = React.createClass({
post.parent_id = this.props.parentId;
post.filenames = this.state.previews;
- this.setState({ submitting: true });
+ this.setState({ submitting: true, limit_error: null });
client.createPost(post, ChannelStore.getCurrent(),
function(data) {
diff --git a/web/react/components/create_post.jsx b/web/react/components/create_post.jsx
index 17ed16735..87895588e 100644
--- a/web/react/components/create_post.jsx
+++ b/web/react/components/create_post.jsx
@@ -45,7 +45,7 @@ module.exports = React.createClass({
return;
}
- this.setState({ submitting: true });
+ this.setState({ submitting: true, limit_error: null });
var user_id = UserStore.getCurrentId();
diff --git a/web/react/components/file_upload.jsx b/web/react/components/file_upload.jsx
index f2429f17e..aee089dbc 100644
--- a/web/react/components/file_upload.jsx
+++ b/web/react/components/file_upload.jsx
@@ -15,7 +15,7 @@ module.exports = React.createClass({
// This looks redundant, but must be done this way due to
// setState being an asynchronous call
var numFiles = 0;
- for(var i = 0; i < files.length && i < Constants.MAX_UPLOAD_FILES; i++) {
+ for(var i = 0; i < files.length; i++) {
if (files[i].size <= Constants.MAX_FILE_SIZE) {
numFiles++;
}
diff --git a/web/react/components/login.jsx b/web/react/components/login.jsx
index 71fefff5b..05918650b 100644
--- a/web/react/components/login.jsx
+++ b/web/react/components/login.jsx
@@ -90,6 +90,17 @@ module.exports = React.createClass({
focusEmail = true;
}
+ var auth_services = JSON.parse(this.props.authServices);
+
+ var login_message;
+ if (auth_services.indexOf("gitlab") >= 0) {
+ login_message = (
+ <div className="form-group form-group--small">
+ <span><a href={"/"+teamName+"/login/gitlab"}>{"Log in with GitLab"}</a></span>
+ </div>
+ );
+ }
+
return (
<div className="signup-team__container">
<div>
@@ -112,6 +123,7 @@ module.exports = React.createClass({
<div className="form-group">
<button type="submit" className="btn btn-primary">Sign in</button>
</div>
+ { login_message }
<div className="form-group form-group--small">
<span><a href="/find_team">{"Find other " + strings.TeamPlural}</a></span>
</div>
diff --git a/web/react/components/navbar.jsx b/web/react/components/navbar.jsx
index 500fabb0e..6d23c0d9b 100644
--- a/web/react/components/navbar.jsx
+++ b/web/react/components/navbar.jsx
@@ -191,7 +191,7 @@ module.exports = React.createClass({
</button>;
var right_sidebar_collapse_button= currentId == null ? null :
<button type="button" className="navbar-toggle menu-toggle pull-right" data-toggle="collapse" data-target="#sidebar-nav" onClick={this.toggleRightSidebar}>
- <span className="dropdown__icon"></span>
+ <span dangerouslySetInnerHTML={{__html: Constants.MENU_ICON }} />
</button>;
diff --git a/web/react/components/post_info.jsx b/web/react/components/post_info.jsx
index d6422fe3a..8eaaf4e8c 100644
--- a/web/react/components/post_info.jsx
+++ b/web/react/components/post_info.jsx
@@ -4,6 +4,8 @@
var UserStore = require('../stores/user_store.jsx');
var utils = require('../utils/utils.jsx');
+var Constants = require('../utils/constants.jsx');
+
module.exports = React.createClass({
getInitialState: function() {
return { };
@@ -21,7 +23,7 @@ module.exports = React.createClass({
var comments = "";
var lastCommentClass = this.props.isLastComment ? " comment-icon__container__show" : " comment-icon__container__hide";
if (this.props.commentCount >= 1) {
- comments = <a href="#" className={"comment-icon__container theme" + lastCommentClass} onClick={this.props.handleCommentClick}><span className="comment-icon" dangerouslySetInnerHTML={{__html: "<svg version='1.1' id='Layer_2' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px'width='15px' height='15px' viewBox='1 1.5 15 15' enable-background='new 1 1.5 15 15' xml:space='preserve'> <g> <g> <path fill='#211B1B' d='M14,1.5H3c-1.104,0-2,0.896-2,2v8c0,1.104,0.896,2,2,2h1.628l1.884,3l1.866-3H14c1.104,0,2-0.896,2-2v-8 C16,2.396,15.104,1.5,14,1.5z M15,11.5c0,0.553-0.447,1-1,1H8l-1.493,2l-1.504-1.991L5,12.5H3c-0.552,0-1-0.447-1-1v-8 c0-0.552,0.448-1,1-1h11c0.553,0,1,0.448,1,1V11.5z'/> </g> </g> </svg>"}} />{this.props.commentCount}</a>;
+ comments = <a href="#" className={"comment-icon__container theme" + lastCommentClass} onClick={this.props.handleCommentClick}><span className="comment-icon" dangerouslySetInnerHTML={{__html: Constants.COMMENT_ICON }} />{this.props.commentCount}</a>;
}
return (
diff --git a/web/react/components/post_right.jsx b/web/react/components/post_right.jsx
index 93f5d91b0..567be1962 100644
--- a/web/react/components/post_right.jsx
+++ b/web/react/components/post_right.jsx
@@ -111,7 +111,7 @@ RootPost = React.createClass({
} else {
postFiles.push(
<div className="post-image__column custom-file" key={fileInfo.path}>
- <a href={fileInfo.path+"."+ext} download={fileInfo.name+"."+ext}>
+ <a href={fileInfo.path+"."+fileInfo.ext} download={fileInfo.name+"."+fileInfo.ext}>
<div className={"file-icon "+utils.getIconClassName(ftype)}/>
</a>
</div>
diff --git a/web/react/components/setting_item_max.jsx b/web/react/components/setting_item_max.jsx
index b8b667e1a..49eb58773 100644
--- a/web/react/components/setting_item_max.jsx
+++ b/web/react/components/setting_item_max.jsx
@@ -20,7 +20,7 @@ module.exports = React.createClass({
<hr />
{ server_error }
{ client_error }
- <a className="btn btn-sm btn-primary" onClick={this.props.submit}>Submit</a>
+ { this.props.submit ? <a className="btn btn-sm btn-primary" onClick={this.props.submit}>Submit</a> : "" }
<a className="btn btn-sm theme" href="#" onClick={this.props.updateSection}>Cancel</a>
</li>
</ul>
diff --git a/web/react/components/sidebar_header.jsx b/web/react/components/sidebar_header.jsx
index 859e425a6..5b442aeac 100644
--- a/web/react/components/sidebar_header.jsx
+++ b/web/react/components/sidebar_header.jsx
@@ -6,6 +6,8 @@ var utils = require('../utils/utils.jsx');
var client = require('../utils/client.jsx');
var UserStore = require('../stores/user_store.jsx');
+var Constants = require('../utils/constants.jsx');
+
function getStateFromStores() {
return { teams: UserStore.getTeams() };
}
@@ -75,7 +77,7 @@ var NavbarDropdown = React.createClass({
<ul className="nav navbar-nav navbar-right">
<li className="dropdown">
<a href="#" className="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
- <span className="dropdown__icon" dangerouslySetInnerHTML={{__html: " <svg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px'width='4px' height='16px' viewBox='0 0 8 32' enable-background='new 0 0 8 32' xml:space='preserve'> <g> <circle cx='4' cy='4.062' r='4'/> <circle cx='4' cy='16' r='4'/> <circle cx='4' cy='28' r='4'/> </g> </svg>"}} />
+ <span className="dropdown__icon" dangerouslySetInnerHTML={{__html: Constants.MENU_ICON }} />
</a>
<ul className="dropdown-menu" role="menu">
<li><a href="#" data-toggle="modal" data-target="#user_settings1">Account Settings</a></li>
diff --git a/web/react/components/signup_user_complete.jsx b/web/react/components/signup_user_complete.jsx
index eed323d1f..dc5ba64aa 100644
--- a/web/react/components/signup_user_complete.jsx
+++ b/web/react/components/signup_user_complete.jsx
@@ -46,7 +46,7 @@ module.exports = React.createClass({
function(data) {
client.track('signup', 'signup_user_02_complete');
- client.loginByEmail(this.props.domain, this.state.user.email, this.state.user.password,
+ client.loginByEmail(this.props.teamName, this.state.user.email, this.state.user.password,
function(data) {
UserStore.setLastEmail(this.state.user.email);
UserStore.setCurrentUser(data);
@@ -58,7 +58,7 @@ module.exports = React.createClass({
}.bind(this),
function(err) {
if (err.message == "Login failed because email address has not been verified") {
- window.location.href = "/verify_email?email="+ encodeURIComponent(this.state.user.email) + "&domain=" + encodeURIComponent(this.props.domain);
+ window.location.href = "/verify_email?email="+ encodeURIComponent(this.state.user.email) + "&domain=" + encodeURIComponent(this.props.teamName);
} else {
this.state.server_error = err.message;
this.setState(this.state);
@@ -79,7 +79,7 @@ module.exports = React.createClass({
props = {};
props.wizard = "welcome";
props.user = {};
- props.user.team_id = this.props.team_id;
+ props.user.team_id = this.props.teamId;
props.user.email = this.props.email;
props.hash = this.props.hash;
props.data = this.props.data;
@@ -103,7 +103,7 @@ module.exports = React.createClass({
var yourEmailIs = this.state.user.email == "" ? "" : <span>Your email address is { this.state.user.email }. </span>
- var email =
+ var email = (
<div className={ this.state.original_email == "" ? "" : "hidden"} >
<label className="control-label">Email</label>
<div className={ email_error ? "form-group has-error" : "form-group" }>
@@ -111,12 +111,25 @@ module.exports = React.createClass({
{ email_error }
</div>
</div>
+ );
+
+ var auth_services = JSON.parse(this.props.authServices);
+
+ var signup_message;
+ if (auth_services.indexOf("gitlab") >= 0) {
+ signup_message = <p>{"Choose your username and password for the " + this.props.teamDisplayName + " " + strings.Team} <a href={"/"+this.props.teamName+"/signup/gitlab"+window.location.search}>{"or sign up with GitLab."}</a></p>;
+ } else {
+ signup_message = <p>{"Choose your username and password for the " + this.props.teamDisplayName + " " + strings.Team + "."}</p>;
+ }
return (
<div>
<img className="signup-team-logo" src="/static/images/logo.png" />
<h4>Welcome to { config.SiteName }</h4>
- <p>{"Choose your username and password for the " + this.props.team_name + " " + strings.Team +"."}</p>
+ <div className="form-group form-group--small">
+ <span></span>
+ </div>
+ { signup_message }
<p>Your username can be made of lowercase letters and numbers.</p>
<label className="control-label">Username</label>
<div className={ name_error ? "form-group has-error" : "form-group" }>
diff --git a/web/react/components/signup_user_oauth.jsx b/web/react/components/signup_user_oauth.jsx
new file mode 100644
index 000000000..6322aedee
--- /dev/null
+++ b/web/react/components/signup_user_oauth.jsx
@@ -0,0 +1,84 @@
+// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+
+var utils = require('../utils/utils.jsx');
+var client = require('../utils/client.jsx');
+var UserStore = require('../stores/user_store.jsx');
+var BrowserStore = require('../stores/browser_store.jsx');
+
+module.exports = React.createClass({
+ handleSubmit: function(e) {
+ e.preventDefault();
+
+ if (!this.state.user.username) {
+ this.setState({name_error: "This field is required", email_error: "", password_error: "", server_error: ""});
+ return;
+ }
+
+ var username_error = utils.isValidUsername(this.state.user.username);
+ if (username_error === "Cannot use a reserved word as a username.") {
+ this.setState({name_error: "This username is reserved, please choose a new one.", email_error: "", password_error: "", server_error: ""});
+ return;
+ } else if (username_error) {
+ this.setState({name_error: "Username must begin with a letter, and contain between 3 to 15 lowercase characters made up of numbers, letters, and the symbols '.', '-' and '_'.", email_error: "", password_error: "", server_error: ""});
+ return;
+ }
+
+ this.setState({name_error: "", server_error: ""});
+
+ this.state.user.allow_marketing = this.refs.email_service.getDOMNode().checked;
+
+ var user = this.state.user;
+ client.createUser(user, "", "",
+ function(data) {
+ client.track('signup', 'signup_user_oauth_02');
+ window.location.href = '/' + this.props.teamName + '/login/'+user.auth_service;
+ }.bind(this),
+ function(err) {
+ this.state.server_error = err.message;
+ this.setState(this.state);
+ }.bind(this)
+ );
+ },
+ handleChange: function() {
+ var user = this.state.user;
+ user.username = this.refs.name.getDOMNode().value;
+ this.setState({ user: user });
+ },
+ getInitialState: function() {
+ var user = JSON.parse(this.props.user);
+ return { user: user };
+ },
+ render: function() {
+
+ client.track('signup', 'signup_user_oauth_01');
+
+ var name_error = this.state.name_error ? <label className='control-label'>{ this.state.name_error }</label> : null;
+ 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 yourEmailIs = this.state.user.email == "" ? "" : <span>Your email address is <b>{ this.state.user.email }.</b></span>;
+
+ return (
+ <div>
+ <img className="signup-team-logo" src="/static/images/logo.png" />
+ <h4>Welcome to { config.SiteName }</h4>
+ <p>{"To continue signing up with " + this.state.user.auth_service + ", please register a username."}</p>
+ <p>Your username can be made of lowercase letters and numbers.</p>
+ <label className="control-label">Username</label>
+ <div className={ name_error ? "form-group has-error" : "form-group" }>
+ <input type="text" ref="name" className="form-control" placeholder="" maxLength="128" value={this.state.user.username} onChange={this.handleChange} />
+ { name_error }
+ </div>
+ <p>{"Pick something " + strings.Team + "mates will recognize. Your username is how you will appear to others."}</p>
+ <p>{ yourEmailIs } You’ll use this address to sign in to {config.SiteName}.</p>
+ <div className="checkbox"><label><input type="checkbox" ref="email_service" /> It's ok to send me occassional email with updates about the {config.SiteName} service. </label></div>
+ <p><button onClick={this.handleSubmit} className="btn-primary btn">Create Account</button></p>
+ { server_error }
+ <p>By proceeding to create your account and use { config.SiteName }, you agree to our <a href={ config.TermsLink }>Terms of Service</a> and <a href={ config.PrivacyLink }>Privacy Policy</a>. If you do not agree, you cannot use {config.SiteName}.</p>
+ </div>
+ );
+ }
+});
+
+
diff --git a/web/react/components/user_settings.jsx b/web/react/components/user_settings.jsx
index b50754ab5..b940a3c6f 100644
--- a/web/react/components/user_settings.jsx
+++ b/web/react/components/user_settings.jsx
@@ -459,7 +459,7 @@ var SecurityTab = React.createClass({
submitPassword: function(e) {
e.preventDefault();
- var user = UserStore.getCurrentUser();
+ var user = this.props.user;
var currentPassword = this.state.current_password;
var newPassword = this.state.new_password;
var confirmPassword = this.state.confirm_password;
@@ -535,53 +535,69 @@ var SecurityTab = React.createClass({
var self = this;
if (this.props.activeSection === 'password') {
var inputs = [];
+ var submit = null;
- inputs.push(
- <div className="form-group">
- <label className="col-sm-5 control-label">Current Password</label>
- <div className="col-sm-7">
- <input className="form-control" type="password" onChange={this.updateCurrentPassword} value={this.state.current_password}/>
+ if (this.props.user.auth_service === "") {
+ inputs.push(
+ <div className="form-group">
+ <label className="col-sm-5 control-label">Current Password</label>
+ <div className="col-sm-7">
+ <input className="form-control" type="password" onChange={this.updateCurrentPassword} value={this.state.current_password}/>
+ </div>
</div>
- </div>
- );
- inputs.push(
- <div className="form-group">
- <label className="col-sm-5 control-label">New Password</label>
- <div className="col-sm-7">
- <input className="form-control" type="password" onChange={this.updateNewPassword} value={this.state.new_password}/>
+ );
+ inputs.push(
+ <div className="form-group">
+ <label className="col-sm-5 control-label">New Password</label>
+ <div className="col-sm-7">
+ <input className="form-control" type="password" onChange={this.updateNewPassword} value={this.state.new_password}/>
+ </div>
</div>
- </div>
- );
- inputs.push(
- <div className="form-group">
- <label className="col-sm-5 control-label">Retype New Password</label>
- <div className="col-sm-7">
- <input className="form-control" type="password" onChange={this.updateConfirmPassword} value={this.state.confirm_password}/>
+ );
+ inputs.push(
+ <div className="form-group">
+ <label className="col-sm-5 control-label">Retype New Password</label>
+ <div className="col-sm-7">
+ <input className="form-control" type="password" onChange={this.updateConfirmPassword} value={this.state.confirm_password}/>
+ </div>
</div>
- </div>
- );
+ );
+
+ submit = this.submitPassword;
+ } else {
+ inputs.push(
+ <div className="form-group">
+ <label className="col-sm-12">Log in occurs through GitLab. Please see your GitLab account settings page to update your password.</label>
+ </div>
+ );
+ }
passwordSection = (
<SettingItemMax
title="Password"
inputs={inputs}
- submit={this.submitPassword}
+ submit={submit}
server_error={server_error}
client_error={password_error}
updateSection={function(e){self.props.updateSection("");e.preventDefault();}}
/>
);
} else {
- var d = new Date(this.props.user.last_password_update);
- var hour = d.getHours() % 12 ? String(d.getHours() % 12) : "12";
- var min = d.getMinutes() < 10 ? "0" + d.getMinutes() : String(d.getMinutes());
- var timeOfDay = d.getHours() >= 12 ? " pm" : " am";
- var dateStr = "Last updated " + Constants.MONTHS[d.getMonth()] + " " + d.getDate() + ", " + d.getFullYear() + " at " + hour + ":" + min + timeOfDay;
+ var describe;
+ if (this.props.user.auth_service === "") {
+ var d = new Date(this.props.user.last_password_update);
+ var hour = d.getHours() % 12 ? String(d.getHours() % 12) : "12";
+ var min = d.getMinutes() < 10 ? "0" + d.getMinutes() : String(d.getMinutes());
+ var timeOfDay = d.getHours() >= 12 ? " pm" : " am";
+ describe = "Last updated " + Constants.MONTHS[d.getMonth()] + " " + d.getDate() + ", " + d.getFullYear() + " at " + hour + ":" + min + timeOfDay;
+ } else {
+ describe = "Log in done through GitLab"
+ }
passwordSection = (
<SettingItemMin
title="Password"
- describe={dateStr}
+ describe={describe}
updateSection={function(){self.props.updateSection("password");}}
/>
);
diff --git a/web/react/pages/login.jsx b/web/react/pages/login.jsx
index 8348f0b5d..6e7528373 100644
--- a/web/react/pages/login.jsx
+++ b/web/react/pages/login.jsx
@@ -3,9 +3,9 @@
var Login = require('../components/login.jsx');
-global.window.setup_login_page = function(teamDisplayName, teamName) {
+global.window.setup_login_page = function(team_display_name, team_name, auth_services) {
React.render(
- <Login teamDisplayName={teamDisplayName} teamName={teamName}/>,
+ <Login teamDisplayName={team_display_name} teamName={team_name} authServices={auth_services} />,
document.getElementById('login')
);
};
diff --git a/web/react/pages/signup_user_complete.jsx b/web/react/pages/signup_user_complete.jsx
index a24c8d4c8..60c3a609a 100644
--- a/web/react/pages/signup_user_complete.jsx
+++ b/web/react/pages/signup_user_complete.jsx
@@ -3,9 +3,9 @@
var SignupUserComplete =require('../components/signup_user_complete.jsx');
-global.window.setup_signup_user_complete_page = function(email, domain, name, id, data, hash) {
+global.window.setup_signup_user_complete_page = function(email, name, ui_name, id, data, hash, auth_services) {
React.render(
- <SignupUserComplete team_id={id} domain={domain} team_name={name} email={email} hash={hash} data={data} />,
+ <SignupUserComplete teamId={id} teamName={name} teamDisplayName={ui_name} email={email} hash={hash} data={data} authServices={auth_services} />,
document.getElementById('signup-user-complete')
);
-}; \ No newline at end of file
+};
diff --git a/web/react/pages/signup_user_oauth.jsx b/web/react/pages/signup_user_oauth.jsx
new file mode 100644
index 000000000..6a0707702
--- /dev/null
+++ b/web/react/pages/signup_user_oauth.jsx
@@ -0,0 +1,11 @@
+// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+var SignupUserOAuth = require('../components/signup_user_oauth.jsx');
+
+global.window.setup_signup_user_oauth_page = function(user, team_name, team_display_name) {
+ React.render(
+ <SignupUserOAuth user={user} teamName={team_name} teamDisplayName={team_display_name} />,
+ document.getElementById('signup-user-complete')
+ );
+};
diff --git a/web/react/utils/constants.jsx b/web/react/utils/constants.jsx
index 2249da0d3..77ce19530 100644
--- a/web/react/utils/constants.jsx
+++ b/web/react/utils/constants.jsx
@@ -82,5 +82,7 @@ module.exports = {
MONTHS: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
MAX_DMS: 10,
ONLINE_ICON_SVG: "<svg version='1.1' id='Layer_1' xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:cc='http://creativecommons.org/ns#' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns#' xmlns:svg='http://www.w3.org/2000/svg' xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd' xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape' sodipodi:docname='TRASH_1_4.svg' inkscape:version='0.48.4 r9939' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='12px' height='12px' viewBox='0 0 12 12' enable-background='new 0 0 12 12' xml:space='preserve'><sodipodi:namedview inkscape:cy='139.7898' inkscape:cx='26.358185' inkscape:zoom='1.18' showguides='true' showgrid='false' id='namedview6' guidetolerance='10' gridtolerance='10' objecttolerance='10' borderopacity='1' bordercolor='#666666' pagecolor='#ffffff' inkscape:current-layer='Layer_1' inkscape:window-maximized='1' inkscape:window-y='-8' inkscape:window-x='-8' inkscape:window-height='705' inkscape:window-width='1366' inkscape:guide-bbox='true' inkscape:pageshadow='2' inkscape:pageopacity='0'><sodipodi:guide position='50.036793,85.991376' orientation='1,0' id='guide2986'></sodipodi:guide><sodipodi:guide position='58.426196,66.216355' orientation='0,1' id='guide3047'></sodipodi:guide></sodipodi:namedview><g><g><path class='online--icon' d='M6,5.487c1.371,0,2.482-1.116,2.482-2.493c0-1.378-1.111-2.495-2.482-2.495S3.518,1.616,3.518,2.994C3.518,4.371,4.629,5.487,6,5.487z M10.452,8.545c-0.101-0.829-0.36-1.968-0.726-2.541C9.475,5.606,8.5,5.5,8.5,5.5S8.43,7.521,6,7.521C3.507,7.521,3.5,5.5,3.5,5.5S2.527,5.606,2.273,6.004C1.908,6.577,1.648,7.716,1.547,8.545C1.521,8.688,1.49,9.082,1.498,9.142c0.161,1.295,2.238,2.322,4.375,2.358C5.916,11.501,5.958,11.501,6,11.501c0.043,0,0.084,0,0.127-0.001c2.076-0.026,4.214-1.063,4.375-2.358C10.509,9.082,10.471,8.696,10.452,8.545z'/></g></g></svg>",
- OFFLINE_ICON_SVG: "<svg version='1.1' id='Layer_1' xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:cc='http://creativecommons.org/ns#' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns#' xmlns:svg='http://www.w3.org/2000/svg' xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd' xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape' sodipodi:docname='TRASH_1_4.svg' inkscape:version='0.48.4 r9939' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='12px' height='12px' viewBox='0 0 12 12' enable-background='new 0 0 12 12' xml:space='preserve'><sodipodi:namedview inkscape:cy='139.7898' inkscape:cx='26.358185' inkscape:zoom='1.18' showguides='true' showgrid='false' id='namedview6' guidetolerance='10' gridtolerance='10' objecttolerance='10' borderopacity='1' bordercolor='#666666' pagecolor='#ffffff' inkscape:current-layer='Layer_1' inkscape:window-maximized='1' inkscape:window-y='-8' inkscape:window-x='-8' inkscape:window-height='705' inkscape:window-width='1366' inkscape:guide-bbox='true' inkscape:pageshadow='2' inkscape:pageopacity='0'><sodipodi:guide position='50.036793,85.991376' orientation='1,0' id='guide2986'></sodipodi:guide><sodipodi:guide position='58.426196,66.216355' orientation='0,1' id='guide3047'></sodipodi:guide></sodipodi:namedview><g><g><path fill='#cccccc' d='M6.002,7.143C5.645,7.363,5.167,7.52,4.502,7.52c-2.493,0-2.5-2.02-2.5-2.02S1.029,5.607,0.775,6.004C0.41,6.577,0.15,7.716,0.049,8.545c-0.025,0.145-0.057,0.537-0.05,0.598c0.162,1.295,2.237,2.321,4.375,2.357c0.043,0.001,0.085,0.001,0.127,0.001c0.043,0,0.084,0,0.127-0.001c1.879-0.023,3.793-0.879,4.263-2h-2.89L6.002,7.143L6.002,7.143z M4.501,5.488c1.372,0,2.483-1.117,2.483-2.494c0-1.378-1.111-2.495-2.483-2.495c-1.371,0-2.481,1.117-2.481,2.495C2.02,4.371,3.13,5.488,4.501,5.488z M7.002,6.5v2h5v-2H7.002z'/></g></g></svg>"
+ OFFLINE_ICON_SVG: "<svg version='1.1' id='Layer_1' xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:cc='http://creativecommons.org/ns#' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns#' xmlns:svg='http://www.w3.org/2000/svg' xmlns:sodipodi='http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd' xmlns:inkscape='http://www.inkscape.org/namespaces/inkscape' sodipodi:docname='TRASH_1_4.svg' inkscape:version='0.48.4 r9939' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='12px' height='12px' viewBox='0 0 12 12' enable-background='new 0 0 12 12' xml:space='preserve'><sodipodi:namedview inkscape:cy='139.7898' inkscape:cx='26.358185' inkscape:zoom='1.18' showguides='true' showgrid='false' id='namedview6' guidetolerance='10' gridtolerance='10' objecttolerance='10' borderopacity='1' bordercolor='#666666' pagecolor='#ffffff' inkscape:current-layer='Layer_1' inkscape:window-maximized='1' inkscape:window-y='-8' inkscape:window-x='-8' inkscape:window-height='705' inkscape:window-width='1366' inkscape:guide-bbox='true' inkscape:pageshadow='2' inkscape:pageopacity='0'><sodipodi:guide position='50.036793,85.991376' orientation='1,0' id='guide2986'></sodipodi:guide><sodipodi:guide position='58.426196,66.216355' orientation='0,1' id='guide3047'></sodipodi:guide></sodipodi:namedview><g><g><path fill='#cccccc' d='M6.002,7.143C5.645,7.363,5.167,7.52,4.502,7.52c-2.493,0-2.5-2.02-2.5-2.02S1.029,5.607,0.775,6.004C0.41,6.577,0.15,7.716,0.049,8.545c-0.025,0.145-0.057,0.537-0.05,0.598c0.162,1.295,2.237,2.321,4.375,2.357c0.043,0.001,0.085,0.001,0.127,0.001c0.043,0,0.084,0,0.127-0.001c1.879-0.023,3.793-0.879,4.263-2h-2.89L6.002,7.143L6.002,7.143z M4.501,5.488c1.372,0,2.483-1.117,2.483-2.494c0-1.378-1.111-2.495-2.483-2.495c-1.371,0-2.481,1.117-2.481,2.495C2.02,4.371,3.13,5.488,4.501,5.488z M7.002,6.5v2h5v-2H7.002z'/></g></g></svg>",
+ MENU_ICON: "<svg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px'width='4px' height='16px' viewBox='0 0 8 32' enable-background='new 0 0 8 32' xml:space='preserve'> <g> <circle cx='4' cy='4.062' r='4'/> <circle cx='4' cy='16' r='4'/> <circle cx='4' cy='28' r='4'/> </g> </svg>",
+ COMMENT_ICON: "<svg version='1.1' id='Layer_2' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px'width='15px' height='15px' viewBox='1 1.5 15 15' enable-background='new 1 1.5 15 15' xml:space='preserve'> <g> <g> <path fill='#211B1B' d='M14,1.5H3c-1.104,0-2,0.896-2,2v8c0,1.104,0.896,2,2,2h1.628l1.884,3l1.866-3H14c1.104,0,2-0.896,2-2v-8 C16,2.396,15.104,1.5,14,1.5z M15,11.5c0,0.553-0.447,1-1,1H8l-1.493,2l-1.504-1.991L5,12.5H3c-0.552,0-1-0.447-1-1v-8 c0-0.552,0.448-1,1-1h11c0.553,0,1,0.448,1,1V11.5z'/> </g> </g> </svg>"
};