added colorpicker to frontend, badge colour changes for groups, #2588

v1.18.x
Julian Lam 10 years ago
parent 7be0830751
commit b4731ad47b

@ -9,5 +9,7 @@
"details.has_no_posts": "This group's members have not made any posts.",
"details.latest_posts": "Latest Posts",
"details.private": "Private Group",
"details.public": "Public Group"
"details.public": "Public Group",
"details.owner_options": "Group Administration"
}

@ -5,7 +5,10 @@ define('forum/groups/details', function() {
var Details = {};
Details.init = function() {
var detailsPage = $('.groups');
var detailsPage = $('.groups'),
settingsFormEl = detailsPage.find('form');
Details.prepareSettings();
$('.latest-posts .content img').addClass('img-responsive');
@ -31,6 +34,10 @@ define('forum/groups/details', function() {
});
break;
case 'update':
Details.update();
break;
case 'join': // intentional fall-throughs!
case 'leave':
case 'accept':
@ -50,5 +57,64 @@ define('forum/groups/details', function() {
});
};
Details.prepareSettings = function() {
var settingsFormEl = $('.groups form'),
colorBtn = settingsFormEl.find('[data-action="color-select"]'),
colorValueEl = settingsFormEl.find('[name="labelColor"]'),
previewEl = settingsFormEl.find('.label');
if (settingsFormEl.length) {
// Add color picker to settings form
require(['vendor/colorpicker/colorpicker'], function() {
console.log(colorBtn, colorBtn.ColorPicker);
colorBtn.ColorPicker({
color: colorValueEl.val() || '#000',
onChange: function(hsb, hex) {
colorValueEl.val('#' + hex);
previewEl.css('background-color', '#' + hex);
},
onShow: function(colpkr) {
$(colpkr).css('z-index', 1051);
}
});
});
}
};
Details.update = function() {
var settingsFormEl = $('.groups form');
if (settingsFormEl.length) {
require(['vendor/jquery/serializeObject/jquery.ba-serializeobject.min'], function() {
var settings = settingsFormEl.serializeObject(),
keys = Object.keys(settings),
inputEl;
// Fix checkbox values
keys.forEach(function(key) {
inputEl = settingsFormEl.find('input[type="checkbox"][name="' + key + '"]');
if (inputEl.length) {
settings[key] = settings[key] === 'on' ? true : false;
}
});
socket.emit('groups.update', {
groupName: ajaxify.variables.get('group_name'),
values: settings
}, function(err) {
if (err) {
return app.alertError(err.message);
}
if (settings.name) {
ajaxify.go('groups/' + encodeURIComponent(settings.name));
} else {
ajaxify.refresh();
}
});
});
}
};
return Details;
});

@ -3,7 +3,7 @@
height: 176px;
overflow: hidden;
position: absolute;
background: url(./images/custom_background.png);
background: url(./vendor/colorpicker/images/custom_background.png);
font-family: Arial, Helvetica, sans-serif;
display: none;
}
@ -23,7 +23,7 @@
left: 0;
width: 150px;
height: 150px;
background: url(./images/colorpicker_overlay.png);
background: url(./vendor/colorpicker/images/colorpicker_overlay.png);
}
.colorpicker_color div div {
position: absolute;
@ -32,7 +32,7 @@
width: 11px;
height: 11px;
overflow: hidden;
background: url(./images/colorpicker_select.gif);
background: url(./vendor/colorpicker/images/colorpicker_select.gif);
margin: -5px 0 0 -5px;
}
.colorpicker_hue {
@ -48,7 +48,7 @@
width: 35px;
height: 9px;
overflow: hidden;
background: url(./images/custom_indic.gif) left top;
background: url(./vendor/colorpicker/images/custom_indic.gif) left top;
margin: -4px 0 0 0;
left: 0px;
}
@ -86,7 +86,7 @@
position: absolute;
width: 72px;
height: 22px;
background: url(./images/custom_hex.png) top;
background: url(./vendor/colorpicker/images/custom_hex.png) top;
left: 212px;
top: 142px;
}
@ -109,32 +109,32 @@
cursor: n-resize;
}
.colorpicker_rgb_r {
background-image: url(./images/custom_rgb_r.png);
background-image: url(./vendor/colorpicker/images/custom_rgb_r.png);
top: 52px;
left: 212px;
}
.colorpicker_rgb_g {
background-image: url(./images/custom_rgb_g.png);
background-image: url(./vendor/colorpicker/images/custom_rgb_g.png);
top: 82px;
left: 212px;
}
.colorpicker_rgb_b {
background-image: url(./images/custom_rgb_b.png);
background-image: url(./vendor/colorpicker/images/custom_rgb_b.png);
top: 112px;
left: 212px;
}
.colorpicker_hsb_h {
background-image: url(./images/custom_hsb_h.png);
background-image: url(./vendor/colorpicker/images/custom_hsb_h.png);
top: 52px;
left: 282px;
}
.colorpicker_hsb_s {
background-image: url(./images/custom_hsb_s.png);
background-image: url(./vendor/colorpicker/images/custom_hsb_s.png);
top: 82px;
left: 282px;
}
.colorpicker_hsb_b {
background-image: url(./images/custom_hsb_b.png);
background-image: url(./vendor/colorpicker/images/custom_hsb_b.png);
top: 112px;
left: 282px;
}
@ -143,7 +143,7 @@
position: absolute;
width: 22px;
height: 22px;
background: url(./images/custom_submit.png) top;
background: url(./vendor/colorpicker/images/custom_submit.png) top;
left: 322px;
top: 142px;
overflow: hidden;

@ -423,7 +423,8 @@ var async = require('async'),
description: values.description || '',
icon: values.icon || '',
labelColor: values.labelColor || '#000000',
hidden: values.hidden || '0'
hidden: values.hidden || '0',
'private': values.private === false ? '0' : '1'
}, function(err) {
if (err) {
return callback(err);

@ -49,9 +49,11 @@ module.exports = function(Meta) {
source += '\n@import (inline) "..' + path.sep + '..' + path.sep + 'public/vendor/jquery/css/smoothness/jquery-ui-1.10.4.custom.min.css";';
source += '\n@import (inline) "..' + path.sep + '..' + path.sep + 'public/vendor/jquery/bootstrap-tagsinput/bootstrap-tagsinput.css";';
source += '\n@import (inline) "..' + path.sep + '..' + path.sep + 'public/vendor/colorpicker/colorpicker.css";';
acpSource = '\n@import "..' + path.sep + 'public/less/admin/admin";\n' + source;
acpSource += '\n@import (inline) "..' + path.sep + 'public/vendor/colorpicker/colorpicker.css";';
source = '@import "./theme";\n' + source;
async.parallel([

@ -41,6 +41,7 @@ Groups.leave = function(socket, data, callback) {
groups.leave(data.groupName, data.uid, callback);
};
// Possibly remove this and call SocketGroups.update instead
Groups.update = function(socket, data, callback) {
if(!data) {
return callback(new Error('[[error:invalid-data]]'));

@ -87,4 +87,18 @@ SocketGroups.reject = function(socket, data, callback) {
});
};
SocketGroups.update = function(socket, data, callback) {
if(!data) {
return callback(new Error('[[error:invalid-data]]'));
}
groups.ownership.isOwner(socket.uid, data.groupName, function(err, isOwner) {
if (!isOwner) {
return callback(new Error('[[error:no-privileges]]'));
}
groups.update(data.groupName, data.values, callback);
});
};
module.exports = SocketGroups;

@ -5,7 +5,6 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="{relative_path}/vendor/jquery/css/smoothness/jquery-ui-1.10.4.custom.min.css?{cache-buster}">
<link rel="stylesheet" type="text/css" href="{relative_path}/vendor/colorpicker/colorpicker.css?{cache-buster}">
<link rel="stylesheet" type="text/css" href="{relative_path}/vendor/nanoscroller/nanoscroller.css?{cache-buster}">
<link rel="stylesheet" type="text/css" href="{relative_path}/admin.css?{cache-buster}" />

Loading…
Cancel
Save