mirror of
https://github.com/ether/etherpad-lite.git
synced 2025-04-23 17:06:16 -04:00
pad_userlist: Don't rely on global pad
variable
This commit is contained in:
parent
bf6ab3bba8
commit
e99eb6366c
1 changed files with 62 additions and 67 deletions
|
@ -369,18 +369,13 @@ const paduserlist = (() => {
|
|||
});
|
||||
|
||||
// color picker
|
||||
$('#myswatchbox').click(showColorPicker);
|
||||
$('#myswatchbox').click(() => self.showColorPicker());
|
||||
$('#mycolorpicker .pickerswatchouter').click(function () {
|
||||
$('#mycolorpicker .pickerswatchouter').removeClass('picked');
|
||||
$(this).addClass('picked');
|
||||
});
|
||||
$('#mycolorpickersave').click(() => {
|
||||
closeColorPicker(true);
|
||||
});
|
||||
$('#mycolorpickercancel').click(() => {
|
||||
closeColorPicker(false);
|
||||
});
|
||||
//
|
||||
$('#mycolorpickersave').click(() => self.closeColorPicker(true));
|
||||
$('#mycolorpickercancel').click(() => self.closeColorPicker(false));
|
||||
},
|
||||
usersOnline: () => {
|
||||
// Returns an object of users who are currently online on this pad
|
||||
|
@ -541,67 +536,67 @@ const paduserlist = (() => {
|
|||
$('#myswatch').css({'background-color': myUserInfo.colorId});
|
||||
$('li[data-key=showusers] > a').css({'box-shadow': `inset 0 0 30px ${myUserInfo.colorId}`});
|
||||
},
|
||||
|
||||
closeColorPicker: (accept) => {
|
||||
if (accept) {
|
||||
let newColor = $('#mycolorpickerpreview').css('background-color');
|
||||
const parts = newColor.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
|
||||
// parts now should be ["rgb(0, 70, 255", "0", "70", "255"]
|
||||
if (parts) {
|
||||
delete (parts[0]);
|
||||
for (let i = 1; i <= 3; ++i) {
|
||||
parts[i] = parseInt(parts[i]).toString(16);
|
||||
if (parts[i].length === 1) parts[i] = `0${parts[i]}`;
|
||||
}
|
||||
newColor = `#${parts.join('')}`; // "0070ff"
|
||||
}
|
||||
myUserInfo.colorId = newColor;
|
||||
pad.notifyChangeColor(newColor);
|
||||
paduserlist.renderMyUserInfo();
|
||||
}
|
||||
|
||||
colorPickerOpen = false;
|
||||
$('#mycolorpicker').removeClass('popup-show');
|
||||
},
|
||||
|
||||
showColorPicker: () => {
|
||||
$.farbtastic('#colorpicker').setColor(myUserInfo.colorId);
|
||||
|
||||
if (!colorPickerOpen) {
|
||||
const palette = pad.getColorPalette();
|
||||
|
||||
if (!colorPickerSetup) {
|
||||
const colorsList = $('#colorpickerswatches');
|
||||
for (let i = 0; i < palette.length; i++) {
|
||||
const li = $('<li>', {
|
||||
style: `background: ${palette[i]};`,
|
||||
});
|
||||
|
||||
li.appendTo(colorsList);
|
||||
|
||||
li.bind('click', (event) => {
|
||||
$('#colorpickerswatches li').removeClass('picked');
|
||||
$(event.target).addClass('picked');
|
||||
|
||||
const newColorId = getColorPickerSwatchIndex($('#colorpickerswatches .picked'));
|
||||
pad.notifyChangeColor(newColorId);
|
||||
});
|
||||
}
|
||||
|
||||
colorPickerSetup = true;
|
||||
}
|
||||
|
||||
$('#mycolorpicker').addClass('popup-show');
|
||||
colorPickerOpen = true;
|
||||
|
||||
$('#colorpickerswatches li').removeClass('picked');
|
||||
$($('#colorpickerswatches li')[myUserInfo.colorId]).addClass('picked'); // seems weird
|
||||
}
|
||||
},
|
||||
|
||||
getColorPickerSwatchIndex: (jnode) => $('#colorpickerswatches li').index(jnode),
|
||||
};
|
||||
return self;
|
||||
})();
|
||||
|
||||
const getColorPickerSwatchIndex = (jnode) => $('#colorpickerswatches li').index(jnode);
|
||||
|
||||
const closeColorPicker = (accept) => {
|
||||
if (accept) {
|
||||
let newColor = $('#mycolorpickerpreview').css('background-color');
|
||||
const parts = newColor.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
|
||||
// parts now should be ["rgb(0, 70, 255", "0", "70", "255"]
|
||||
if (parts) {
|
||||
delete (parts[0]);
|
||||
for (let i = 1; i <= 3; ++i) {
|
||||
parts[i] = parseInt(parts[i]).toString(16);
|
||||
if (parts[i].length === 1) parts[i] = `0${parts[i]}`;
|
||||
}
|
||||
newColor = `#${parts.join('')}`; // "0070ff"
|
||||
}
|
||||
myUserInfo.colorId = newColor;
|
||||
pad.notifyChangeColor(newColor);
|
||||
paduserlist.renderMyUserInfo();
|
||||
}
|
||||
|
||||
colorPickerOpen = false;
|
||||
$('#mycolorpicker').removeClass('popup-show');
|
||||
};
|
||||
|
||||
const showColorPicker = () => {
|
||||
$.farbtastic('#colorpicker').setColor(myUserInfo.colorId);
|
||||
|
||||
if (!colorPickerOpen) {
|
||||
const palette = pad.getColorPalette();
|
||||
|
||||
if (!colorPickerSetup) {
|
||||
const colorsList = $('#colorpickerswatches');
|
||||
for (let i = 0; i < palette.length; i++) {
|
||||
const li = $('<li>', {
|
||||
style: `background: ${palette[i]};`,
|
||||
});
|
||||
|
||||
li.appendTo(colorsList);
|
||||
|
||||
li.bind('click', (event) => {
|
||||
$('#colorpickerswatches li').removeClass('picked');
|
||||
$(event.target).addClass('picked');
|
||||
|
||||
const newColorId = getColorPickerSwatchIndex($('#colorpickerswatches .picked'));
|
||||
pad.notifyChangeColor(newColorId);
|
||||
});
|
||||
}
|
||||
|
||||
colorPickerSetup = true;
|
||||
}
|
||||
|
||||
$('#mycolorpicker').addClass('popup-show');
|
||||
colorPickerOpen = true;
|
||||
|
||||
$('#colorpickerswatches li').removeClass('picked');
|
||||
$($('#colorpickerswatches li')[myUserInfo.colorId]).addClass('picked'); // seems weird
|
||||
}
|
||||
};
|
||||
|
||||
exports.paduserlist = paduserlist;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue