From 2433e71d44d16ce0d5fd4243fdc08f4e1a04f3d5 Mon Sep 17 00:00:00 2001 From: Jean-Baptiste Pasquier Date: Tue, 23 Jul 2019 15:08:59 +0200 Subject: [PATCH] update: WIP sib-core 0.8 --- src/dependencies.pug | 17 ++++++++--------- src/header.pug | 4 ++-- src/menu-left.pug | 7 +++---- src/page-circle-create.pug | 4 ++-- src/page-circle-edit.pug | 4 ++-- src/page-circle-profile.pug | 12 ++++-------- src/page-job-offer-create.pug | 2 +- src/page-job-offer-edit.pug | 2 +- src/page-project-create.pug | 5 +---- src/page-project-drive.pug | 2 +- src/page-project-edit.pug | 8 ++------ src/page-project-profile.pug | 9 +-------- src/page-user-profile.pug | 15 ++++----------- src/scripts/index.js | 18 +++++++++--------- src/styles/base/menu-left.scss | 4 ++-- .../layout/circle-profile/circle-profile.scss | 6 +++--- src/styles/layout/members/member-profile.scss | 8 ++++---- src/styles/layout/members/members.scss | 4 ++-- src/templates/template-team.pug | 4 ++-- 19 files changed, 54 insertions(+), 81 deletions(-) diff --git a/src/dependencies.pug b/src/dependencies.pug index 1b4295f..ad9ce01 100644 --- a/src/dependencies.pug +++ b/src/dependencies.pug @@ -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") //- 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') //- 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-chat/sib-chat.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-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 -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/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-conversation@0.2") -script(type="module" src="https://unpkg.com/@startinblox/component-directory@0.1") -script(type="module" src="https://unpkg.com/@startinblox/component-job-board@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.2") +script(type="module" src="https://unpkg.com/@startinblox/component-conversation@0.3") +script(type="module" src="https://unpkg.com/@startinblox/component-directory@beta") +script(type="module" src="https://unpkg.com/@startinblox/component-job-board@beta") diff --git a/src/header.pug b/src/header.pug index a4ce606..2e44180 100644 --- a/src/header.pug +++ b/src/header.pug @@ -8,7 +8,7 @@ //- i#close-search-icon.icon-close(aria-hidden='true') sib-notifications( - id-suffix="inbox" + nested-field="inbox" bind-user ) @@ -17,7 +17,7 @@ include templates/hd-user-avatar.pug details#user-controls summary(tabindex='0' role='button') sib-display#user-controls__profile( - data-fields='first_name, account.picture' + fields='first_name, account.picture' widget-account.picture='hd-user-avatar' bind-user ) diff --git a/src/menu-left.pug b/src/menu-left.pug index 79cc956..59e078a 100644 --- a/src/menu-left.pug +++ b/src/menu-left.pug @@ -23,8 +23,7 @@ nav#main__menu div.sub-menu.menu-notification sib-display( data-src=`${endpoints.projects}` - data-fields='project, badge' - set-project='customer.name, dash, name' + fields='project(customer.name, dash, name), badge' value-dash=' - ' widget-badge='hd-counter' action-badge='badge' @@ -41,7 +40,7 @@ nav#main__menu //- div.sub-menu //- sib-display( //- data-src=`${endpoints.circles}`, - //- data-fields='name', + //- fields='name', //- widget-name='sib-display-div', //- next='circle' //- ) @@ -56,7 +55,7 @@ nav#main__menu div.sub-menu.menu-notification sib-display( data-src=`${endpoints.users}` - data-fields='username, badge' + fields='username, badge' widget-username='sib-display-div' widget-badge='hd-counter' action-badge='badge' diff --git a/src/page-circle-create.pug b/src/page-circle-create.pug index cfc2a83..6ad81a1 100644 --- a/src/page-circle-create.pug +++ b/src/page-circle-create.pug @@ -7,7 +7,7 @@ range-owner=`${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-description='Description', @@ -22,5 +22,5 @@ widget-description='sib-form-textarea', widget-jabberRoom='sib-form-checkbox', - widget-team='sib-form-multiple-dropdown' ) + //- widget-team='sib-form-multiple-dropdown' diff --git a/src/page-circle-edit.pug b/src/page-circle-edit.pug index b27226d..7e23b00 100644 --- a/src/page-circle-edit.pug +++ b/src/page-circle-edit.pug @@ -2,8 +2,8 @@ h1 Edit group sib-form.block( range-owner=`${endpoints.users}`, - data-fields="name, description, owner, team, jabberID, jabberRoom" + fields="name, description, owner, team, jabberID, jabberRoom" range-team=`${endpoints.users}`, - widget-team='sib-form-multiple-dropdown', bind-resources ) + //- widget-team='sib-form-multiple-dropdown', diff --git a/src/page-circle-profile.pug b/src/page-circle-profile.pug index 70260fa..9deac43 100644 --- a/src/page-circle-profile.pug +++ b/src/page-circle-profile.pug @@ -1,24 +1,20 @@ .content-box.with-padding.full-width h2 Channel's name: sib-display( - data-fields='name', + fields='name', bind-resources ) h2 Description: sib-display( - data-fields='description', + fields='description', bind-resources ) h2 In group: sib-display.block-group( - id-suffix='team', - data-fields='teammate-img, teammate-name, teammate-pseudonym, teammate-profile, teammate-contact', - - set-teammate-img='account.picture', - set-teammate-pseudonym='before-pseudo, username', - set-teammate-name='name', + nested-field='team', + fields='teammate-img(account.picture), teammate-name(name), teammate-pseudonym(before-pseudo, username), teammate-profile, teammate-contact', template-teammate-contact='chat-link', diff --git a/src/page-job-offer-create.pug b/src/page-job-offer-create.pug index f218644..dcf9bec 100644 --- a/src/page-job-offer-create.pug +++ b/src/page-job-offer-create.pug @@ -14,7 +14,7 @@ data-src=`${endpoints.joboffers}` 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' label-title='Title*' diff --git a/src/page-job-offer-edit.pug b/src/page-job-offer-edit.pug index bce315c..619a3dd 100644 --- a/src/page-job-offer-edit.pug +++ b/src/page-job-offer-edit.pug @@ -5,7 +5,7 @@ bind-resources range-skills=`${endpoints.skills}` - data-fields='title, description, skills, closingDate' + fields='title, description, skills, closingDate' class-title='field form-label is-light is-expanded' label-title='Title*' diff --git a/src/page-project-create.pug b/src/page-project-create.pug index 29f271c..80cbcea 100644 --- a/src/page-project-create.pug +++ b/src/page-project-create.pug @@ -7,20 +7,17 @@ range-members=`${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-name='Project\'s name', label-customer.logo='Customer\'s logo', label-description='Project description', - set-block-project__fee='fieldset-fee, businessProvider, businessProviderFee', widget-fieldset-fee='hd-template-project-title', label-businessProvider='Business provider', 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', label-customer.companyRegister='Company register', label-customer.address='Address', diff --git a/src/page-project-drive.pug b/src/page-project-drive.pug index 0e2a9f3..1c06462 100644 --- a/src/page-project-drive.pug +++ b/src/page-project-drive.pug @@ -6,6 +6,6 @@ sib-widget(name='hd-drive') .content-box.with-padding.full-width.chat-view sib-display( bind-resources="" - data-fields="driveID" + fields="driveID" widget-driveID='hd-drive' ) \ No newline at end of file diff --git a/src/page-project-edit.pug b/src/page-project-edit.pug index ecb101b..3aad238 100644 --- a/src/page-project-edit.pug +++ b/src/page-project-edit.pug @@ -13,7 +13,7 @@ sib-form.team.is-horizontal( naked, data-src='${id}', - data-fields='user.name, name', + fields='user.name, name', range-user.name=`${endpoints.users}`, class-name='field', class-user.name='field', @@ -22,15 +22,13 @@ ) 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-name='Project\'s name', label-customer.logo='Customer\'s logo', label-description='Project description', - set-block-project__fee='fieldset-fee, businessProvider, businessProvider.fee', range-businessProvider=`${endpoints.businessproviders}`, label-businessProvider='Business provider', label-businessProvider.fee='Amount of the contribution (%)', @@ -38,7 +36,6 @@ widget-businessProvider.fee='sib-form-number', 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.address='Address', label-customer.firstName='Name of the contact at the customer\'s premises', @@ -49,7 +46,6 @@ widget-fieldset-customer='hd-template-project-title', label-fieldset-customer='Customer information', - set-block-project__team='fieldset-team, members', label-fieldset-team='The team', widget-fieldset-team='hd-template-project-title', widget-members='template-members', diff --git a/src/page-project-profile.pug b/src/page-project-profile.pug index a25bbab..c3aa6d3 100644 --- a/src/page-project-profile.pug +++ b/src/page-project-profile.pug @@ -5,28 +5,21 @@ include templates/template-team.pug 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-title2='-', 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:', widget-customer.logo='sib-display-img', - set-block-fee='label-fee, businessProvider', value-label-fee='FEE:', widget-businessProvider='template-business-provider' - set-block-customer='label-customer, customer', value-label-customer='CUSTOMER INFORMATIONS:', widget-customer='customer-template', - set-block-team='label-team, members', value-label-team='TEAM:', widget-members='team-template', multiple-members='', diff --git a/src/page-user-profile.pug b/src/page-user-profile.pug index ed4a578..a563404 100644 --- a/src/page-user-profile.pug +++ b/src/page-user-profile.pug @@ -6,15 +6,14 @@ include templates/template-groups.pug sib-display.avatar-display( bind-user='' - data-fields='account.picture' + fields='account.picture' label-account.picture='' widget-account.picture='sib-display-img' ) sib-display.name-diplay( bind-user='' - data-fields='user-name-groups, username' - set-user-name-groups='name, groups' + fields='user-name-groups(name, groups), username' class-name='name' @@ -27,13 +26,7 @@ include templates/template-groups.pug sib-form.info-form( bind-user='' - data-fields='profile.bio, inline-1, inline-2, inline-3, account.picture, instruction' - - set-inline-1='profile.city, email' - - set-inline-2='profile.phone, profile.website' - - set-inline-3='profile.available' + fields='profile.bio, inline-1(profile.city, email), inline-2(profile.phone, profile.website), inline-3(profile.available), account.picture, instruction' class-profile.bio='form-label is-light' label-profile.bio='short description' @@ -63,7 +56,7 @@ include templates/template-groups.pug sib-form( bind-user='' range-skills=`${endpoints.skills}` - data-fields='skills' + fields='skills' class-skills='form-label is-dark' label-skills='Your main skills (4 max.):' diff --git a/src/scripts/index.js b/src/scripts/index.js index 4a43608..621808e 100644 --- a/src/scripts/index.js +++ b/src/scripts/index.js @@ -36,14 +36,14 @@ document.addEventListener('DOMContentLoaded', function (event) { }); //- Header login hide/show - if(document.querySelector('sib-auth').getUser() !== null) { - document.querySelector('button[role="log in"]').style.display = 'none'; - //- Token expired, hack for ask relogin - 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.color = 'red'; - document.querySelector('button[role="log in"]').innerHTML = 'Re-login'; - } - } + // if(document.querySelector('sib-auth').getUser() !== null) { + // document.querySelector('button[role="log in"]').style.display = 'none'; + // //- Token expired, hack for ask relogin + // 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.color = 'red'; + // document.querySelector('button[role="log in"]').innerHTML = 'Re-login'; + // } + // } }); \ No newline at end of file diff --git a/src/styles/base/menu-left.scss b/src/styles/base/menu-left.scss index 8f417f4..d5c98cb 100644 --- a/src/styles/base/menu-left.scss +++ b/src/styles/base/menu-left.scss @@ -105,7 +105,7 @@ padding: 10px 10px 10px 32px; } - div[name='project'] { + sib-route[name='project'] { display: flex; flex: 3; @@ -114,7 +114,7 @@ height: 20px; } - sib-display-div[name='dash'] { + sib-display-value[name='dash'] { margin: 0 0.4em; } } diff --git a/src/styles/layout/circle-profile/circle-profile.scss b/src/styles/layout/circle-profile/circle-profile.scss index 94d0bbf..1df3fff 100644 --- a/src/styles/layout/circle-profile/circle-profile.scss +++ b/src/styles/layout/circle-profile/circle-profile.scss @@ -29,7 +29,7 @@ top: -2px; } - > div[name='teammate-img'] { + > sib-set-default[name='teammate-img'] { background-color: $color-215-9-73; border-radius: 50%; 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-row: 1 / span 1; } - > div[name='teammate-pseudonym'] { + > sib-set-default[name='teammate-pseudonym'] { align-self: start; font-size: 1.2rem; grid-column: 3 / span 2; diff --git a/src/styles/layout/members/member-profile.scss b/src/styles/layout/members/member-profile.scss index 1911aa9..fdd4749 100644 --- a/src/styles/layout/members/member-profile.scss +++ b/src/styles/layout/members/member-profile.scss @@ -11,7 +11,7 @@ .member-bio { - div[name='member-profile__bio'] { + sib-set-default[name='member-profile__bio'] { display: grid; grid-gap: 1rem; grid-template-areas: "avatar name status" @@ -20,7 +20,7 @@ "avatar list button"; grid-template-columns: 1fr 2fr 1fr; - div[name='member-img'] { + sib-set-default[name='member-img'] { grid-area: avatar; overflow: hidden; position: relative; @@ -35,7 +35,7 @@ } } - div[name='member-profile'] { + sib-set-default[name='member-profile'] { align-items: baseline; align-self: end; display: flex; @@ -51,7 +51,7 @@ grid-area: bio; } - div[name='infos'] { + sib-set-default[name='infos'] { grid-area: list; @extend %member-info; diff --git a/src/styles/layout/members/members.scss b/src/styles/layout/members/members.scss index 4af55b7..68e5543 100644 --- a/src/styles/layout/members/members.scss +++ b/src/styles/layout/members/members.scss @@ -146,7 +146,7 @@ member-info-groups { } } - div[name='header'] { + sib-set-default[name='header'] { border-bottom: 1px solid $color-210-25-95; display: flex; flex-direction: column; @@ -207,7 +207,7 @@ member-info-groups { } } - div[name='infos'] { + sib-set-default[name='infos'] { padding: 0 1.7rem; @extend %member-info; diff --git a/src/templates/template-team.pug b/src/templates/template-team.pug index 2b80733..ac3a2ff 100644 --- a/src/templates/template-team.pug +++ b/src/templates/template-team.pug @@ -4,14 +4,14 @@ sib-widget(name='team-template') template sib-display( data-src="${value.user['@id']}" - data-fields='account.picture', + fields='account.picture', widget-account.picture='hd-user-avatar' ) div(name='user.thumb') span ${value.user.name} sib-display( data-src="${value.user.groups['@id']}", - data-fields='name', + fields='name', multiple-name ) span ${value.name}