update: WIP sib-core 0.8

This commit is contained in:
Jean-Baptiste Pasquier 2019-07-23 15:08:59 +02:00
parent cf561e4510
commit 2433e71d44
No known key found for this signature in database
GPG Key ID: F2702E6D22ED4D62
19 changed files with 54 additions and 81 deletions

View File

@ -1,4 +1,4 @@
script(type="module" src="https://unpkg.com/@startinblox/oidc@0.6") script(type="module" src="https://unpkg.com/@startinblox/oidc@0.7")
script(src="/scripts/index.js") script(src="/scripts/index.js")
//- Stylesheets //- Stylesheets
@ -7,19 +7,18 @@ link(rel='stylesheet', href='https://fonts.googleapis.com/css?family=Open+Sans:3
link(rel='stylesheet', href='https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i') link(rel='stylesheet', href='https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i')
//- local //- local
//- script(type="module" src="/lib/sib-core/src/index.js")
//- script(type="module" src="/lib/sib-router/src/index.js") //- script(type="module" src="/lib/sib-router/src/index.js")
//- script(type="module" src="/lib/sib-chat/sib-chat.js") //- script(type="module" src="/lib/sib-chat/sib-chat.js")
//- script(type="module" src="/lib/sib-notifications/sib-notifications.js") //- script(type="module" src="/lib/sib-notifications/sib-notifications.js")
//- script(type="module" src="/lib/sib-conversation/sib-conversation.js") //- script(type="module" src="/lib/sib-conversation/sib-conversation.js")
//- script(type="module" src="/lib/sib-directory/sib-directory.js") //- script(type="module" src="/lib/sib-directory/sib-directory.js")
//- script(type="module" src="/lib/sib-job-board/sib-job-board.js") //- script(type="module" src="/lib/sib-joboffers/sib-job-board.js")
//- CDN //- CDN
script(type="module" src="https://unpkg.com/@startinblox/core@0.7") script(type="module" src="https://unpkg.com/@startinblox/core@0.8")
script(type="module" src="https://unpkg.com/@startinblox/router@0.7") script(type="module" src="https://unpkg.com/@startinblox/router@0.7")
script(type="module" src="https://unpkg.com/@startinblox/component-chat@0.1") //- script(type="module" src="https://unpkg.com/@startinblox/component-chat@0.1")
script(type="module" src="https://unpkg.com/@startinblox/component-notifications@0.1") script(type="module" src="https://unpkg.com/@startinblox/component-notifications@0.2")
script(type="module" src="https://unpkg.com/@startinblox/component-conversation@0.2") script(type="module" src="https://unpkg.com/@startinblox/component-conversation@0.3")
script(type="module" src="https://unpkg.com/@startinblox/component-directory@0.1") script(type="module" src="https://unpkg.com/@startinblox/component-directory@beta")
script(type="module" src="https://unpkg.com/@startinblox/component-job-board@0.1") script(type="module" src="https://unpkg.com/@startinblox/component-job-board@beta")

View File

@ -8,7 +8,7 @@
//- i#close-search-icon.icon-close(aria-hidden='true') //- i#close-search-icon.icon-close(aria-hidden='true')
sib-notifications( sib-notifications(
id-suffix="inbox" nested-field="inbox"
bind-user bind-user
) )
@ -17,7 +17,7 @@ include templates/hd-user-avatar.pug
details#user-controls details#user-controls
summary(tabindex='0' role='button') summary(tabindex='0' role='button')
sib-display#user-controls__profile( sib-display#user-controls__profile(
data-fields='first_name, account.picture' fields='first_name, account.picture'
widget-account.picture='hd-user-avatar' widget-account.picture='hd-user-avatar'
bind-user bind-user
) )

View File

@ -23,8 +23,7 @@ nav#main__menu
div.sub-menu.menu-notification div.sub-menu.menu-notification
sib-display( sib-display(
data-src=`${endpoints.projects}` data-src=`${endpoints.projects}`
data-fields='project, badge' fields='project(customer.name, dash, name), badge'
set-project='customer.name, dash, name'
value-dash=' - ' value-dash=' - '
widget-badge='hd-counter' widget-badge='hd-counter'
action-badge='badge' action-badge='badge'
@ -41,7 +40,7 @@ nav#main__menu
//- div.sub-menu //- div.sub-menu
//- sib-display( //- sib-display(
//- data-src=`${endpoints.circles}`, //- data-src=`${endpoints.circles}`,
//- data-fields='name', //- fields='name',
//- widget-name='sib-display-div', //- widget-name='sib-display-div',
//- next='circle' //- next='circle'
//- ) //- )
@ -56,7 +55,7 @@ nav#main__menu
div.sub-menu.menu-notification div.sub-menu.menu-notification
sib-display( sib-display(
data-src=`${endpoints.users}` data-src=`${endpoints.users}`
data-fields='username, badge' fields='username, badge'
widget-username='sib-display-div' widget-username='sib-display-div'
widget-badge='hd-counter' widget-badge='hd-counter'
action-badge='badge' action-badge='badge'

View File

@ -7,7 +7,7 @@
range-owner=`${endpoints.users}`, range-owner=`${endpoints.users}`,
range-team=`${endpoints.users}` range-team=`${endpoints.users}`
data-fields='name, description, description-text, owner, owner-text, team, team-text, jabberRoom, foaf:jabberID', fields='name, description, description-text, owner, owner-text, team, team-text, jabberRoom, foaf:jabberID',
label-name="Channel's name", label-name="Channel's name",
label-description='Description', label-description='Description',
@ -22,5 +22,5 @@
widget-description='sib-form-textarea', widget-description='sib-form-textarea',
widget-jabberRoom='sib-form-checkbox', widget-jabberRoom='sib-form-checkbox',
widget-team='sib-form-multiple-dropdown'
) )
//- widget-team='sib-form-multiple-dropdown'

View File

@ -2,8 +2,8 @@
h1 Edit group h1 Edit group
sib-form.block( sib-form.block(
range-owner=`${endpoints.users}`, range-owner=`${endpoints.users}`,
data-fields="name, description, owner, team, jabberID, jabberRoom" fields="name, description, owner, team, jabberID, jabberRoom"
range-team=`${endpoints.users}`, range-team=`${endpoints.users}`,
widget-team='sib-form-multiple-dropdown',
bind-resources bind-resources
) )
//- widget-team='sib-form-multiple-dropdown',

View File

@ -1,24 +1,20 @@
.content-box.with-padding.full-width .content-box.with-padding.full-width
h2 Channel's name: h2 Channel's name:
sib-display( sib-display(
data-fields='name', fields='name',
bind-resources bind-resources
) )
h2 Description: h2 Description:
sib-display( sib-display(
data-fields='description', fields='description',
bind-resources bind-resources
) )
h2 In group: h2 In group:
sib-display.block-group( sib-display.block-group(
id-suffix='team', nested-field='team',
data-fields='teammate-img, teammate-name, teammate-pseudonym, teammate-profile, teammate-contact', fields='teammate-img(account.picture), teammate-name(name), teammate-pseudonym(before-pseudo, username), teammate-profile, teammate-contact',
set-teammate-img='account.picture',
set-teammate-pseudonym='before-pseudo, username',
set-teammate-name='name',
template-teammate-contact='chat-link', template-teammate-contact='chat-link',

View File

@ -14,7 +14,7 @@
data-src=`${endpoints.joboffers}` data-src=`${endpoints.joboffers}`
range-skills=`${endpoints.skills}` range-skills=`${endpoints.skills}`
data-fields='title, title-text, description, description-text, skills, closingDate' fields='title, title-text, description, description-text, skills, closingDate'
class-title='field form-label is-light is-expanded' class-title='field form-label is-light is-expanded'
label-title='Title*' label-title='Title*'

View File

@ -5,7 +5,7 @@
bind-resources bind-resources
range-skills=`${endpoints.skills}` range-skills=`${endpoints.skills}`
data-fields='title, description, skills, closingDate' fields='title, description, skills, closingDate'
class-title='field form-label is-light is-expanded' class-title='field form-label is-light is-expanded'
label-title='Title*' label-title='Title*'

View File

@ -7,20 +7,17 @@
range-members=`${endpoints.users}`, range-members=`${endpoints.users}`,
range-team=`${endpoints.users}`, range-team=`${endpoints.users}`,
data-fields='block-project__info, block-project__fee, block-project__customer', fields='block-project__info(customer.name, name, customer.logo, description), block-project__fee(fieldset-fee, businessProvider, businessProviderFee), block-project__customer(fieldset-customer, customer.companyRegister, customer.address, customer.firstName, customer.lastName, customer.role, customer.email, customer.phone)',
set-block-project__info='customer.name, name, customer.logo, description',
label-customer.name='Customer\'s name', label-customer.name='Customer\'s name',
label-name='Project\'s name', label-name='Project\'s name',
label-customer.logo='Customer\'s logo', label-customer.logo='Customer\'s logo',
label-description='Project description', label-description='Project description',
set-block-project__fee='fieldset-fee, businessProvider, businessProviderFee',
widget-fieldset-fee='hd-template-project-title', widget-fieldset-fee='hd-template-project-title',
label-businessProvider='Business provider', label-businessProvider='Business provider',
label-businessProviderFee='Amount of the contribution', label-businessProviderFee='Amount of the contribution',
set-block-project__customer='fieldset-customer, customer.companyRegister, customer.address, customer.firstName, customer.lastName, customer.role, customer.email, customer.phone',
widget-fieldset-customer='hd-template-project-title', widget-fieldset-customer='hd-template-project-title',
label-customer.companyRegister='Company register', label-customer.companyRegister='Company register',
label-customer.address='Address', label-customer.address='Address',

View File

@ -6,6 +6,6 @@ sib-widget(name='hd-drive')
.content-box.with-padding.full-width.chat-view .content-box.with-padding.full-width.chat-view
sib-display( sib-display(
bind-resources="" bind-resources=""
data-fields="driveID" fields="driveID"
widget-driveID='hd-drive' widget-driveID='hd-drive'
) )

View File

@ -13,7 +13,7 @@
sib-form.team.is-horizontal( sib-form.team.is-horizontal(
naked, naked,
data-src='${id}', data-src='${id}',
data-fields='user.name, name', fields='user.name, name',
range-user.name=`${endpoints.users}`, range-user.name=`${endpoints.users}`,
class-name='field', class-name='field',
class-user.name='field', class-user.name='field',
@ -22,15 +22,13 @@
) )
sib-form.block( sib-form.block(
data-fields='block-project__info, block-project__fee, block-project__customer, block-project__team', fields='block-project__info(customer.name, name, customer.logo, description), block-project__fee(fieldset-fee, businessProvider, businessProvider.fee), block-project__customer(fieldset-customer, customer.companyRegister, customer.address, customer.firstName, customer.lastName, customer.role, customer.email, customer.phone), block-project__team(fieldset-team, members)',
set-block-project__info='customer.name, name, customer.logo, description',
label-customer.name='Customer\'s name', label-customer.name='Customer\'s name',
label-name='Project\'s name', label-name='Project\'s name',
label-customer.logo='Customer\'s logo', label-customer.logo='Customer\'s logo',
label-description='Project description', label-description='Project description',
set-block-project__fee='fieldset-fee, businessProvider, businessProvider.fee',
range-businessProvider=`${endpoints.businessproviders}`, range-businessProvider=`${endpoints.businessproviders}`,
label-businessProvider='Business provider', label-businessProvider='Business provider',
label-businessProvider.fee='Amount of the contribution (%)', label-businessProvider.fee='Amount of the contribution (%)',
@ -38,7 +36,6 @@
widget-businessProvider.fee='sib-form-number', widget-businessProvider.fee='sib-form-number',
label-fieldset-fee='Fee', label-fieldset-fee='Fee',
set-block-project__customer='fieldset-customer, customer.companyRegister, customer.address, customer.firstName, customer.lastName, customer.role, customer.email, customer.phone',
label-customer.companyRegister='Company registration number', label-customer.companyRegister='Company registration number',
label-customer.address='Address', label-customer.address='Address',
label-customer.firstName='Name of the contact at the customer\'s premises', label-customer.firstName='Name of the contact at the customer\'s premises',
@ -49,7 +46,6 @@
widget-fieldset-customer='hd-template-project-title', widget-fieldset-customer='hd-template-project-title',
label-fieldset-customer='Customer information', label-fieldset-customer='Customer information',
set-block-project__team='fieldset-team, members',
label-fieldset-team='The team', label-fieldset-team='The team',
widget-fieldset-team='hd-template-project-title', widget-fieldset-team='hd-template-project-title',
widget-members='template-members', widget-members='template-members',

View File

@ -5,28 +5,21 @@
include templates/template-team.pug include templates/template-team.pug
sib-display( sib-display(
data-fields='block-title, infos, block-lead, block-fee, block-customer, block-team', fields='block-title(const-title1, number, customer.name, const-title2, name, entitled, creationDate), infos(block-description(label-description, description), block-logo(customer.logo)), block-lead, block-fee(label-fee, businessProvider), block-customer(label-customer, customer), block-team(label-team, members)',
set-block-title='const-title1, number, customer.name, const-title2, name, entitled, creationDate',
value-const-title1='N°', value-const-title1='N°',
value-const-title2='-', value-const-title2='-',
value-entitled='Creation date:' value-entitled='Creation date:'
set-infos='block-description, block-logo',
set-block-description='label-description, description',
set-block-logo='customer.logo',
value-label-description='DESCRIPTION:', value-label-description='DESCRIPTION:',
widget-customer.logo='sib-display-img', widget-customer.logo='sib-display-img',
set-block-fee='label-fee, businessProvider',
value-label-fee='FEE:', value-label-fee='FEE:',
widget-businessProvider='template-business-provider' widget-businessProvider='template-business-provider'
set-block-customer='label-customer, customer',
value-label-customer='CUSTOMER INFORMATIONS:', value-label-customer='CUSTOMER INFORMATIONS:',
widget-customer='customer-template', widget-customer='customer-template',
set-block-team='label-team, members',
value-label-team='TEAM:', value-label-team='TEAM:',
widget-members='team-template', widget-members='team-template',
multiple-members='', multiple-members='',

View File

@ -6,15 +6,14 @@ include templates/template-groups.pug
sib-display.avatar-display( sib-display.avatar-display(
bind-user='' bind-user=''
data-fields='account.picture' fields='account.picture'
label-account.picture='' label-account.picture=''
widget-account.picture='sib-display-img' widget-account.picture='sib-display-img'
) )
sib-display.name-diplay( sib-display.name-diplay(
bind-user='' bind-user=''
data-fields='user-name-groups, username' fields='user-name-groups(name, groups), username'
set-user-name-groups='name, groups'
class-name='name' class-name='name'
@ -27,13 +26,7 @@ include templates/template-groups.pug
sib-form.info-form( sib-form.info-form(
bind-user='' bind-user=''
data-fields='profile.bio, inline-1, inline-2, inline-3, account.picture, instruction' fields='profile.bio, inline-1(profile.city, email), inline-2(profile.phone, profile.website), inline-3(profile.available), account.picture, instruction'
set-inline-1='profile.city, email'
set-inline-2='profile.phone, profile.website'
set-inline-3='profile.available'
class-profile.bio='form-label is-light' class-profile.bio='form-label is-light'
label-profile.bio='short description' label-profile.bio='short description'
@ -63,7 +56,7 @@ include templates/template-groups.pug
sib-form( sib-form(
bind-user='' bind-user=''
range-skills=`${endpoints.skills}` range-skills=`${endpoints.skills}`
data-fields='skills' fields='skills'
class-skills='form-label is-dark' class-skills='form-label is-dark'
label-skills='Your main skills (4 max.):' label-skills='Your main skills (4 max.):'

View File

@ -36,14 +36,14 @@ document.addEventListener('DOMContentLoaded', function (event) {
}); });
//- Header login hide/show //- Header login hide/show
if(document.querySelector('sib-auth').getUser() !== null) { // if(document.querySelector('sib-auth').getUser() !== null) {
document.querySelector('button[role="log in"]').style.display = 'none'; // document.querySelector('button[role="log in"]').style.display = 'none';
//- Token expired, hack for ask relogin // //- Token expired, hack for ask relogin
if(new Date(document.querySelector('sib-auth').getUser().expires_at*1000) <= new Date()) { // if(new Date(document.querySelector('sib-auth').getUser().expires_at*1000) <= new Date()) {
document.querySelector('button[role="log in"]').style.display = ''; // document.querySelector('button[role="log in"]').style.display = '';
document.querySelector('button[role="log in"]').style.color = 'red'; // document.querySelector('button[role="log in"]').style.color = 'red';
document.querySelector('button[role="log in"]').innerHTML = 'Re-login'; // document.querySelector('button[role="log in"]').innerHTML = 'Re-login';
} // }
} // }
}); });

View File

@ -105,7 +105,7 @@
padding: 10px 10px 10px 32px; padding: 10px 10px 10px 32px;
} }
div[name='project'] { sib-route[name='project'] {
display: flex; display: flex;
flex: 3; flex: 3;
@ -114,7 +114,7 @@
height: 20px; height: 20px;
} }
sib-display-div[name='dash'] { sib-display-value[name='dash'] {
margin: 0 0.4em; margin: 0 0.4em;
} }
} }

View File

@ -29,7 +29,7 @@
top: -2px; top: -2px;
} }
> div[name='teammate-img'] { > sib-set-default[name='teammate-img'] {
background-color: $color-215-9-73; background-color: $color-215-9-73;
border-radius: 50%; border-radius: 50%;
grid-column: 1 / span 2; grid-column: 1 / span 2;
@ -47,12 +47,12 @@
} }
} }
div[name='teammate-name'] { sib-set-default[name='teammate-name'] {
grid-column: 3 / span 2; grid-column: 3 / span 2;
grid-row: 1 / span 1; grid-row: 1 / span 1;
} }
> div[name='teammate-pseudonym'] { > sib-set-default[name='teammate-pseudonym'] {
align-self: start; align-self: start;
font-size: 1.2rem; font-size: 1.2rem;
grid-column: 3 / span 2; grid-column: 3 / span 2;

View File

@ -11,7 +11,7 @@
.member-bio { .member-bio {
div[name='member-profile__bio'] { sib-set-default[name='member-profile__bio'] {
display: grid; display: grid;
grid-gap: 1rem; grid-gap: 1rem;
grid-template-areas: "avatar name status" grid-template-areas: "avatar name status"
@ -20,7 +20,7 @@
"avatar list button"; "avatar list button";
grid-template-columns: 1fr 2fr 1fr; grid-template-columns: 1fr 2fr 1fr;
div[name='member-img'] { sib-set-default[name='member-img'] {
grid-area: avatar; grid-area: avatar;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
@ -35,7 +35,7 @@
} }
} }
div[name='member-profile'] { sib-set-default[name='member-profile'] {
align-items: baseline; align-items: baseline;
align-self: end; align-self: end;
display: flex; display: flex;
@ -51,7 +51,7 @@
grid-area: bio; grid-area: bio;
} }
div[name='infos'] { sib-set-default[name='infos'] {
grid-area: list; grid-area: list;
@extend %member-info; @extend %member-info;

View File

@ -146,7 +146,7 @@ member-info-groups {
} }
} }
div[name='header'] { sib-set-default[name='header'] {
border-bottom: 1px solid $color-210-25-95; border-bottom: 1px solid $color-210-25-95;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -207,7 +207,7 @@ member-info-groups {
} }
} }
div[name='infos'] { sib-set-default[name='infos'] {
padding: 0 1.7rem; padding: 0 1.7rem;
@extend %member-info; @extend %member-info;

View File

@ -4,14 +4,14 @@ sib-widget(name='team-template')
template template
sib-display( sib-display(
data-src="${value.user['@id']}" data-src="${value.user['@id']}"
data-fields='account.picture', fields='account.picture',
widget-account.picture='hd-user-avatar' widget-account.picture='hd-user-avatar'
) )
div(name='user.thumb') div(name='user.thumb')
span ${value.user.name} span ${value.user.name}
sib-display( sib-display(
data-src="${value.user.groups['@id']}", data-src="${value.user.groups['@id']}",
data-fields='name', fields='name',
multiple-name multiple-name
) )
span ${value.name} span ${value.name}