223 lines
8.6 KiB
JavaScript
223 lines
8.6 KiB
JavaScript
|
// Generated by LiveScript 1.6.0
|
||
|
(function(){
|
||
|
var h, AuthWS, getFullName, defaultSideBarRenderer, defaultHeadingRenderer, Fields, UserConfigurationPanel;
|
||
|
h = require("maquette").h;
|
||
|
AuthWS = require("./authws.js");
|
||
|
getFullName = function(self){
|
||
|
var fullName, ref$;
|
||
|
fullName = ((ref$ = self.profile) != null ? ref$.fullName : void 8) || "";
|
||
|
if (fullName === "") {
|
||
|
return self.user.login;
|
||
|
} else {
|
||
|
return fullName;
|
||
|
}
|
||
|
};
|
||
|
defaultSideBarRenderer = function(self){
|
||
|
var avatar, ref$;
|
||
|
return h('div', {
|
||
|
key: 'side-bar'
|
||
|
}, [h('figure.image.is-128x128.is-clipped', [(avatar = (ref$ = self.profile) != null ? ref$.avatar : void 8) ? h('img', {
|
||
|
src: avatar,
|
||
|
alt: "Avatar of " + getFullName(self)
|
||
|
}) : void 8])]);
|
||
|
};
|
||
|
defaultHeadingRenderer = function(self){
|
||
|
var fullName;
|
||
|
fullName = getFullName(self);
|
||
|
return h('div.section', {
|
||
|
key: 'heading'
|
||
|
}, [h('div.media', [
|
||
|
h('div.media-content', [h('div.title.is-2', [fullName]), fullName !== self.user.login ? h('div.title.is-3.subtitle', [self.user.login]) : void 8]), self.onLogout ? h('div.media-right', [h('a', {
|
||
|
onclick: function(){
|
||
|
return self.onLogout();
|
||
|
}
|
||
|
}, ["Logout"])]) : void 8
|
||
|
])]);
|
||
|
};
|
||
|
Fields = {
|
||
|
renderTextInput: function(token, authWs, key, inputs, model, onRequest){
|
||
|
var upload;
|
||
|
upload = function(){
|
||
|
var payload, _key, ref$, value;
|
||
|
console.log("clickity click", key, inputs[key], inputs);
|
||
|
if (!inputs[key]) {
|
||
|
return;
|
||
|
}
|
||
|
payload = {};
|
||
|
for (_key in ref$ = model) {
|
||
|
value = ref$[_key];
|
||
|
payload[_key] = value;
|
||
|
}
|
||
|
payload[key] = inputs[key];
|
||
|
inputs[key] = void 8;
|
||
|
onRequest();
|
||
|
return authWs.setExtra(token, "profile", payload);
|
||
|
};
|
||
|
return h('div.field.has-addons', {
|
||
|
key: key
|
||
|
}, [
|
||
|
h('div.control.is-expanded', [h('input.input', {
|
||
|
value: inputs[key] || model[key],
|
||
|
oninput: function(e){
|
||
|
console.log("input for", key);
|
||
|
return inputs[key] = e.target.value;
|
||
|
}
|
||
|
})]), h('div.control', [h('div.button', {
|
||
|
onclick: upload
|
||
|
}, ["Update"])])
|
||
|
]);
|
||
|
}
|
||
|
};
|
||
|
UserConfigurationPanel = function(args){
|
||
|
var self, authWs;
|
||
|
self = {
|
||
|
user: args.user || {},
|
||
|
profile: args.profile,
|
||
|
token: args.token,
|
||
|
authwsUrl: args.authwsUrl || (location.protocol === 'https' ? 'wss' : 'ws') + '://' + location.hostname + ":9999/auth.JSON",
|
||
|
sideBarRenderer: args.sideBarRenderer || defaultSideBarRenderer,
|
||
|
headingRenderer: args.headingRenderer || defaultHeadingRenderer,
|
||
|
onModelUpdate: args.onModelUpdate || function(){},
|
||
|
onLogout: args.onLogout || void 8,
|
||
|
model: args.model || [["fullName", "Full Name", "string"], ["avatar", "Profile Picture", "image-url"], ["email", "Mail Address", "string"]],
|
||
|
input: {}
|
||
|
};
|
||
|
authWs = AuthWS(self.authwsUrl);
|
||
|
authWs.addEventListener('extra', function(message){
|
||
|
if (message.name === "profile") {
|
||
|
console.log("got profile", message.extra);
|
||
|
self.profile = message.extra || {};
|
||
|
return self.onModelUpdate();
|
||
|
}
|
||
|
});
|
||
|
authWs.addEventListener('extra-updated', function(message){
|
||
|
if (message.name === "profile") {
|
||
|
console.log("got profile", message.extra);
|
||
|
self.profile = message.extra || {};
|
||
|
return self.onModelUpdate();
|
||
|
}
|
||
|
});
|
||
|
authWs.addEventListener('error', function(message){
|
||
|
self.error = message.reason;
|
||
|
return self.onModelUpdate();
|
||
|
});
|
||
|
authWs.addEventListener('user-edited', function(message){
|
||
|
self.input["password.old"] = void 8;
|
||
|
self.input["password.new"] = void 8;
|
||
|
self.input["password.new2"] = void 8;
|
||
|
self.success = "password";
|
||
|
return self.onModelUpdate();
|
||
|
});
|
||
|
if (!self.profile) {
|
||
|
authWs.socket.onopen = function(){
|
||
|
return authWs.getExtra(self.token, "profile");
|
||
|
};
|
||
|
}
|
||
|
self.render = function(){
|
||
|
var element, key, label, type, service, permissions;
|
||
|
return h('div.columns', {
|
||
|
key: self
|
||
|
}, [
|
||
|
h('div.column.is-narrow', [self.sideBarRenderer(self)]), h('div.column', [
|
||
|
self.headingRenderer(self), self.profile
|
||
|
? h('div.box', {
|
||
|
key: 'profile'
|
||
|
}, [h('div.form', [
|
||
|
h('div.title.is-4', ["Profile"]), (function(){
|
||
|
var i$, ref$, len$, results$ = [];
|
||
|
for (i$ = 0, len$ = (ref$ = self.model).length; i$ < len$; ++i$) {
|
||
|
element = ref$[i$];
|
||
|
key = element[0], label = element[1], type = element[2];
|
||
|
switch (type) {
|
||
|
case "string":
|
||
|
case "image-url":
|
||
|
results$.push(h('div.field', {
|
||
|
key: key
|
||
|
}, [h('div.label', [label]), Fields.renderTextInput(self.token, authWs, key, self.input, self.profile, fn$)]));
|
||
|
}
|
||
|
}
|
||
|
return results$;
|
||
|
function fn$(){
|
||
|
return self.error = void 8;
|
||
|
}
|
||
|
}())
|
||
|
])])
|
||
|
: h('div.button.is-loading'), h('div.box', {
|
||
|
key: 'password'
|
||
|
}, [
|
||
|
h('div.title.is-4', ["Password"]), h('div.label', ["Old password"]), h('div.control', [
|
||
|
h('input.input', {
|
||
|
type: 'password',
|
||
|
value: self.input["password.old"],
|
||
|
oninput: function(e){
|
||
|
return self.input["password.old"] = e.target.value;
|
||
|
}
|
||
|
}), self.error === "invalid credentials" ? h('div.help.is-danger', ["The old password was invalid!"]) : void 8
|
||
|
]), h('div.label', ["New password"]), h('div.control', [h('input.input', {
|
||
|
type: 'password',
|
||
|
value: self.input["password.new"],
|
||
|
oninput: function(e){
|
||
|
return self.input["password.new"] = e.target.value;
|
||
|
}
|
||
|
})]), h('div.label', ["New password (repeat)"]), h('div.field.has-addons', [
|
||
|
h('div.control.is-expanded', [h('input.input', {
|
||
|
type: 'password',
|
||
|
value: self.input["password.new2"],
|
||
|
oninput: function(e){
|
||
|
return self.input["password.new2"] = e.target.value;
|
||
|
}
|
||
|
})]), h('div.control', [h('div.button', {
|
||
|
classes: {
|
||
|
"is-danger": self.input["password.new"] && self.input["password.new"] !== self.input["password.new2"],
|
||
|
"is-static": !self.input["password.new"] && self.input["password.new"] !== self.input["password.new2"]
|
||
|
},
|
||
|
onclick: function(){
|
||
|
if (self.input["password.new"] !== self.input["password.new2"]) {
|
||
|
return;
|
||
|
}
|
||
|
self.error = void 8;
|
||
|
return authWs.updatePassword(self.user.login, self.input["password.old"], self.input["password.new"]);
|
||
|
}
|
||
|
}, ["Update"])])
|
||
|
]), self.success === "password" ? h('div.help.is-success', ["Password successfully updated!"]) : void 8
|
||
|
]), self.showDeveloper
|
||
|
? h('div.box', {
|
||
|
key: 'passwd'
|
||
|
}, [
|
||
|
h('div.title.is-4', ["Permissions"]), h('div.form', [
|
||
|
h('div.field', {
|
||
|
key: 'uid'
|
||
|
}, [h('div.label', ["User ID"]), h('div.control', [self.user.uid.toString()])]), h('div.field', {
|
||
|
key: 'gid'
|
||
|
}, [h('div.label', ["Group ID"]), h('div.control', [self.user.gid.toString()])]), h('div.field', {
|
||
|
key: 'permissions'
|
||
|
}, [
|
||
|
h('div.label', ["Permissions"]), h('div.control.is-grouped', [h('div.tags', [(function(){
|
||
|
var ref$, results$ = [];
|
||
|
for (service in ref$ = self.user.permissions) {
|
||
|
permissions = ref$[service];
|
||
|
results$.push(permissions.map(fn$));
|
||
|
}
|
||
|
return results$;
|
||
|
function fn$(perm){
|
||
|
return h('div.tag', [service, permission]);
|
||
|
}
|
||
|
}())])])
|
||
|
])
|
||
|
])
|
||
|
])
|
||
|
: h('a.is-pulled-right.is-small.has-text-grey', {
|
||
|
key: 'passwd',
|
||
|
onclick: function(){
|
||
|
self.showDeveloper = true;
|
||
|
return self.onModelUpdate();
|
||
|
}
|
||
|
}, ["Show developer data!"])
|
||
|
])
|
||
|
]);
|
||
|
};
|
||
|
return self;
|
||
|
};
|
||
|
module.exports = UserConfigurationPanel;
|
||
|
}).call(this);
|