extract widgets

This commit is contained in:
Clément 2018-10-19 23:47:15 +02:00
parent 805fa2bbe4
commit 32f8e8a1ea
8 changed files with 117 additions and 123 deletions

View File

@ -15,6 +15,7 @@ script(
)
script(src="/scripts/index.js")
script(src="/scripts/hd-widgets.js")
// Stylesheets
link(rel='stylesheet', href='/lib/normalize.css')

View File

@ -1,23 +1,4 @@
script.
document.addEventListener('WebComponentsReady', function(event) {
class HDAppMember extends SIBWidget {
get template() {
return `
<div name="${this.name}">
<img src="${this.value.avatar}"/>
</div>
`;
}
render() {
store.get(this.value).then( (value) => {
this._value = value;
this.innerHTML = this.template;
});
}
}
customElements.define("hdapp-member", HDAppMember);
});
#group-profile
sib-display(

View File

@ -1,33 +1,4 @@
script.
document.addEventListener('WebComponentsReady', function(event) {
class HDAppAuthor extends SIBDisplayLookupList {
get parentElement() {
return 'div';
}
getTemplate(value, index) {
var firstname, lastname;
if (typeof value == 'object')
if (Object.keys(value).length > 1) {
firstname = value.user.first_name;
lastname = value.user.last_name;
} else {
store.get(value).then(resource => {
this.value.push(resource);
this.render();
});
if (Array.isArray(this.value))
this.value.splice(this.value.indexOf(value), 1);
else this.value = [];
return '';
}
return `${firstname} ${lastname}`;
}
}
customElements.define('hdapp-author', HDAppAuthor);
});
div
h1 New offers
span Here you can find and post offers
sib-display#offers-list.limiter(

View File

@ -7,7 +7,7 @@
name='avatar',
value='',
)
sib-form.edit-form.block(
sib-form.block(
data-fields='user, avatar, bio, cell, jabberID, number, pseudo, skills, website',
widget-user='hdapp-usereditinfo',
range-cell=`${sdn}/cells/`, widget-skills='sib-form-multiple-dropdown',
@ -24,7 +24,7 @@
button#crop-img.btn.btn-link Valider
script.
//-script.
class LDPFormImgUpload extends SIBWidget {
get template() {
return `<label for="${this.name}"><img id="${this.name}-preview" src="${this.value}"/></label>

View File

@ -1,56 +1,3 @@
script.
document.addEventListener("WebComponentsReady", function(event) {
class HDAppUserInfo extends SIBDisplayLookupList {
get parentElement() {return "div"}
getTemplate(value, index) {
var firstname, lastname, email;
if(typeof value == "object")
if(Object.keys(value).length > 1) {
firstname = value.first_name;
lastname = value.last_name;
email = value.email;
}
else {
store.get(value).then(resource => {
this.value.push(resource);
this.render();
});
if(Array.isArray(this.value))this.value.splice(this.value.indexOf(value), 1);
else this.value = [];
return '';
}
return `<div>${firstname} ${lastname}</div>`;
// + `<div id="${email}">${email}</div>`;
}
}
customElements.define('hdapp-userinfo', HDAppUserInfo);
class HDAppCell extends SIBDisplayLookupList {
get parentElement() {return "div"}
getTemplate(value, index) {
var city, country;
if(typeof value == "object")
if(Object.keys(value).length > 1) {
city = value.city;
country = value.country;
}
else {
store.get(value).then(resource => {
this.value.push(resource);
this.render();
});
if(Array.isArray(this.value))this.value.splice(this.value.indexOf(value), 1);
else this.value = [];
return '';
}
return `<span>${city} - ${country}</span>`;
}
}
customElements.define("hdapp-usercell", HDAppCell);
});
div
h1 Members
sib-display#profiles-list(

View File

@ -1,21 +1,3 @@
script.
document.addEventListener('WebComponentsReady', function(event) {
class HDAppClient extends SIBWidget {
get template() {
return `<img name="${this.name}" src="${this.value.logo}"/>`;
}
render() {
store.get(this.value).then( (value) => {
this._value = value;
this.innerHTML = this.template;
});
}
}
customElements.define("hdapp-client", HDAppClient);
});
#projects
h1 Projects
sib-display(

112
src/scripts/hd-widgets.js Normal file
View File

@ -0,0 +1,112 @@
document.addEventListener('WebComponentsReady', function(event) {
class HDAppUserInfo extends SIBDisplayLookupList {
get parentElement() {
return 'div';
}
getTemplate(value, index) {
var firstname, lastname, email;
if (typeof value == 'object')
if (Object.keys(value).length > 1) {
firstname = value.first_name;
lastname = value.last_name;
email = value.email;
} else {
store.get(value).then(resource => {
this.value.push(resource);
this.render();
});
if (Array.isArray(this.value))
this.value.splice(this.value.indexOf(value), 1);
else this.value = [];
return '';
}
return `<div>${firstname} ${lastname}</div>`;
// + `<div id="${email}">${email}</div>`;
}
}
customElements.define('hdapp-userinfo', HDAppUserInfo);
class HDAppCell extends SIBDisplayLookupList {
get parentElement() {
return 'div';
}
getTemplate(value, index) {
var city, country;
if (typeof value == 'object')
if (Object.keys(value).length > 1) {
city = value.city;
country = value.country;
} else {
store.get(value).then(resource => {
this.value.push(resource);
this.render();
});
if (Array.isArray(this.value))
this.value.splice(this.value.indexOf(value), 1);
else this.value = [];
return '';
}
return `<span>${city} - ${country}</span>`;
}
}
customElements.define('hdapp-usercell', HDAppCell);
class HDAppClient extends SIBWidget {
get template() {
return `<img name="${this.name}" src="${this.value.logo}"/>`;
}
render() {
store.get(this.value).then(value => {
this._value = value;
this.innerHTML = this.template;
});
}
}
customElements.define('hdapp-client', HDAppClient);
class HDAppMember extends SIBWidget {
get template() {
return `
<div name="${this.name}">
<img src="${this.value.avatar}"/>
</div>
`;
}
render() {
store.get(this.value).then(value => {
this._value = value;
this.innerHTML = this.template;
});
}
}
customElements.define('hdapp-member', HDAppMember);
class HDAppAuthor extends SIBDisplayLookupList {
get parentElement() {
return 'div';
}
getTemplate(value, index) {
var firstname, lastname;
if (typeof value == 'object')
if (Object.keys(value).length > 1) {
firstname = value.user.first_name;
lastname = value.user.last_name;
} else {
store.get(value).then(resource => {
this.value.push(resource);
this.render();
});
if (Array.isArray(this.value))
this.value.splice(this.value.indexOf(value), 1);
else this.value = [];
return '';
}
return `${firstname} ${lastname}`;
}
}
customElements.define('hdapp-author', HDAppAuthor);
});

View File

@ -1,7 +1,8 @@
//button, checkbox, color, date, datetime-local, email, file, hidden, image, month, number, password, radio, range, reset, search, submit, tel, text, time, url, week, datetime
.form-view{
@extend %frame
@extend %frame;
padding: 1em;
}
sib-form.inline form {
@ -12,7 +13,6 @@ sib-form.inline form {
}
sib-form.block {
display: block;
padding: 1em;
> form {
> * {
display: block;