extract widgets
This commit is contained in:
parent
805fa2bbe4
commit
32f8e8a1ea
@ -15,6 +15,7 @@ script(
|
||||
)
|
||||
|
||||
script(src="/scripts/index.js")
|
||||
script(src="/scripts/hd-widgets.js")
|
||||
|
||||
// Stylesheets
|
||||
link(rel='stylesheet', href='/lib/normalize.css')
|
||||
|
@ -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(
|
||||
|
@ -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(
|
||||
|
@ -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>
|
||||
|
@ -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(
|
||||
|
@ -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
112
src/scripts/hd-widgets.js
Normal 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);
|
||||
});
|
@ -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;
|
||||
|
Loading…
Reference in New Issue
Block a user