diff --git a/src/index.js b/src/index.js
index 6539a53fb4233cd418489956a9176cfb533f4bf6..55b8cb6a8804be612c3fa03fec9f973558aa595d 100644
--- a/src/index.js
+++ b/src/index.js
@@ -7,6 +7,7 @@ import('./utils.js').then(utils => {
core.Helpers.importCSS(utils.path() + '/styles/circles.css?min');
core.Helpers.importCSS(utils.path() + '/styles/user-profile.css?min');
core.Helpers.importCSS(utils.path() + '/styles/members-list.css?min');
+ core.Helpers.importCSS(utils.path() + '/styles/territory-profile.css?min');
await import("./custom-tzcld.js");
await import("./widjets-display-user-tzcld.js");
diff --git a/src/styles/territory-profile.scss b/src/styles/territory-profile.scss
new file mode 100644
index 0000000000000000000000000000000000000000..e8170f128286278626f656b6c09b69be8d41d1b9
--- /dev/null
+++ b/src/styles/territory-profile.scss
@@ -0,0 +1,35 @@
+#communities>div {
+ padding-left: 24px;
+ padding-right: 24px;
+}
+#communities-community-profile {
+
+ &>.segment.block {
+ background: none;
+ box-shadow: none;
+
+ .tzcld-territory-profile-col2 {
+ vertical-align: top;
+
+ .children-link-reversed.color-secondary {
+ margin-right: 16px;
+ }
+ .children-link-reversed.color-secondary * {
+ background-color: var(--color-primary);
+ border: 1px solid var(--color-primary);
+ }
+ }
+ .tzcld-territory-profile-ebe {
+ .display-ebes {
+ &>div {
+ white-space: normal;
+ }
+ .half {
+ vertical-align: top;;
+ }
+ .half:nth-child(even) {border-left: 1px solid #F6F6F6;}
+ }
+ }
+ }
+
+}
\ No newline at end of file
diff --git a/src/widjets-display-territory-tzcld.js b/src/widjets-display-territory-tzcld.js
index 9fb854a4797e04bc87b6953467669690e849ec91..42c4e2ff145b8f67f5bbb87e230a52dbb9890655 100644
--- a/src/widjets-display-territory-tzcld.js
+++ b/src/widjets-display-territory-tzcld.js
@@ -60,5 +60,223 @@ import("./utils.js").then((utils) => {
this.element.innerHTML = render;
},
});
+
+ core.Sib.register({
+ name: "customtzcld-display-territory-profile-locations",
+ use: [core.StoreMixin],
+
+ empty() {
+ console.debug();
+ this.element.innerHTML = "";
+ },
+
+ async populate() {
+ this.element.innerHTML = `
+ <div class="loader">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>`;
+ let tzcldprofile = {
+ locations: await this.resource["ldp:contains"]
+ };
+ if("label" in this.element.attributes) {
+ for(let ignore of this.element.attributes['label'].value.split(',')) {
+ tzcldprofile[ignore.trim()] = null;
+ }
+ }
+ let render = `<div class="segment full">`;
+ for(let job of tzcldprofile.locations) {
+
+ render += `<div class="segment half padding-left-xxlarge padding-right-xxlarge margin-top-xxlarge margin-bottom-xxlarge">`;
+ if(await job.name !="") {
+ render += `<h3 class="position text-medium text-color-secondary text-xlarge">${await job.name}</h3>`;
+ } else {
+
+ }
+ render += `<div class="address padding-bottom-small">${await job.address} <br/> ${await job.postal_code} ${await job.city}</div>`;
+ if ((await job.mobile_phone != '') || (await job.phone != '')) {
+ render += `<div class="phone-email segment block padding-bottom-small">`;
+ }
+
+ render += `<solid-display class="segment block margin-bottom-small" bind-resources="" fields="phones"
+ widget-phones="customtzcld-display-user-profile-phones"
+ data-src="${await job}" solid-resource=""></solid-display>`;
+ render += `<solid-display class="segment block" bind-resources="" fields="emails"
+ widget-emails="customtzcld-display-user-profile-emails"
+ data-src="${await job}" solid-resource=""></solid-display>`;
+
+ render += `</div>`;
+ render += `</div>`;
+
+ }
+
+ render += `</div>`;
+
+ this.element.innerHTML = render;
+ },
+ });
+
+ core.Sib.register({
+ name: "customtzcld-display-territory-regions",
+ use: [core.StoreMixin],
+
+ empty() {
+ console.debug();
+ this.element.innerHTML = "";
+ },
+
+ async populate() {
+ this.element.innerHTML = `
+ <div class="loader">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>`;
+ let tzcldprofile = {
+ regions: await this.resource["ldp:contains"]
+ };
+ if("label" in this.element.attributes) {
+ for(let ignore of this.element.attributes['label'].value.split(',')) {
+ tzcldprofile[ignore.trim()] = null;
+ }
+ }
+ let render = ``;
+ for(let region of tzcldprofile.regions) {
+ render += `<div class="region segment tag color-fourth">${await region.name}</div>`;
+ }
+
+ this.element.innerHTML = render;
+ },
+ });
+
+ core.Sib.register({
+ name: "customtzcld-display-territory-profile-widget",
+ use: [core.StoreMixin],
+
+ empty() {
+ console.debug();
+ this.element.innerHTML = "";
+ },
+
+ async populate() {
+ this.element.innerHTML = `
+ <div class="loader">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>`;
+ let tzcldprofile = {
+ id: await this.resource['@id'],
+ name: await this.resource.name,
+ profile: await this.resource.profile,
+ tzcld_profile: await this.resource.tzcld_profile
+ };
+ let etiquettes = {
+ kind: await tzcldprofile.tzcld_profile.kind,
+ step_state: await tzcldprofile.tzcld_profile.step_state,
+ locations: await this.locations
+ };
+
+ if("label" in this.element.attributes) {
+ for(let ignore of this.element.attributes['label'].value.split(',')) {
+ tzcldprofile[ignore.trim()] = null;
+ }
+ }
+ let render = `
+<solid-widget name="communities-profile-linkedin-territory">
+ <template>
+ \${value != "" ? \`<a class="segment children-link-rounded children-icon-social-linkedin children-link-reversed color-secondary bordered margin-right-medium" href="\${value}" target="_blank"><span></span></a>\` : ""}
+ </template>
+ </solid-widget>
+ <solid-widget name="communities-profile-instagram-territory">
+ <template>
+ \${value != "" ? \`<a class="segment children-link-rounded children-icon-social-instagram children-link-reversed color-secondary bordered" href="\${value}" target="_blank"><span></span></a>\` : ""}
+ </template>
+ </solid-widget>
+ <solid-widget name="communities-profile-facebook-territory">
+ <template>
+ \${value != "" ? \`<a class="segment children-link-rounded children-icon-social-facebook children-link-reversed color-secondary bordered margin-right-medium" href="\${value}" target="_blank"><span></span></a>\` : ""}
+ </template>
+ </solid-widget>
+ <solid-widget name="communities-profile-twitter-territory">
+ <template>
+ \${value != "" ? \`<a class="segment children-link-rounded children-icon-social-twitter children-link-reversed color-secondary bordered margin-right-medium" href="\${value}" target="_blank"><span></span></a>\` : ""}
+ </template>
+ </solid-widget>
+
+ <solid-widget name="communities-logo-custom">
+ <template>
+ <div class="communities-logo">
+ \${value != "" ? \`<div \style="background-image:url(\${value});" />\` : \`<div></div>\`}
+ </div>
+ </template>
+ </solid-widget>
+ <div id="tzcld-territory-profile-wrapper" class="tzcld-territory-profile-wrapper segment full shadow bg-color-white">
+ <div class="tzcld-user-profile-col1 segment width-30 padding-right-60">
+ <div class="section-avatar padding-small padding-bottom-large text-center">
+ <div id="loader-tzcld-territory-logo" class="loader loader-top">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ <solid-display
+ class="segment full community-profile-logo"
+ bind-resources=""
+ label-logo=""
+ fields="logo"
+ loader-id="loader-tzcld-territory-logo"
+ class-logo="xlarge text-center"
+ widget-logo="communities-logo-custom"
+ data-src="${tzcldprofile.id}"
+ ></solid-display>
+ </div>
+ </div>
+ <div class="tzcld-territory-profile-col2 segment width-70">`;
+ render += `<div class="segment width-60 margin-top-small text-xxlarge text-semibold text-color-secondary text-cleft">${tzcldprofile.name}</div>`;
+
+ render += `<div class="segment width-40 margin-top-small text-xlarge text-semibold text-color-secondary text-right padding-right-xlarge">
+<solid-display class="segment" bind-resources="" nested-field="profile" fields="tweeter, facebook, linkedin, instagram"
+ widget-linkedin="communities-profile-linkedin-territory"
+ widget-facebook="communities-profile-facebook-territory"
+ widget-tweeter="communities-profile-twitter-territory"
+ widget-instagram="communities-profile-instagram-territory"
+ data-src="${tzcldprofile.id}" solid-resource=""></solid-display>
+
+ </div>`;
+
+ render += `<div><solid-display class="segment" bind-resources="" nested-field="tzcld_profile" fields="regions"
+ widget-regions="customtzcld-display-territory-regions"
+ data-src="${tzcldprofile.id}" solid-resource=""></solid-display>
+ <div class="region segment tag color-fourth">${await etiquettes.kind.name}</div>
+ <div class="region segment tag color-fourth">${await etiquettes.step_state.name}</div>
+ </div>
+
+ <div class="margin-top-small"><a class="text-color-primary" href="${await tzcldprofile.profile.website}">${await tzcldprofile.profile.website}</a></div>
+ <div class="description margin-top-small">${await tzcldprofile.profile.description}</div>
+ </div>
+ </div>` ;//tzcld-territory-profile-wrapper
+
+
+ render += `<div id="tzcld-territory-profile-wrapper2" class="tzcld-territory-profile-wrapper2 segment full margin-top-large">`;
+
+ render += `<div class="tzcld-territory-profile-ebe segment width-30"></div>`;
+ render += `<div class="tzcld-territory-profile-ebe segment width-70">
+ <h2 class="tzcld-h2">Informations de contact</h2>
+ <div class="col-2-wrapper segment full shadow bg-color-white">`;
+
+
+
+ render += `<solid-display class="segment full" bind-resources="" nested-field="tzcld_profile" fields="locations" widget-locations="customtzcld-display-territory-profile-locations" class-locations="display-ebes" data-src="${tzcldprofile.id}" solid-resource="" paginate-by="10"></solid-display>`;
+
+ render += `</div></div>`; //col 2
+
+ this.element.innerHTML = render;
+ },
});
+ });
});
\ No newline at end of file
diff --git a/src/widjets-display-user-tzcld.js b/src/widjets-display-user-tzcld.js
index 62c2bd8766f74616441118286a6b8d64c9e87917..a7615fc38b3ff127612232e3b0e25917d6c7c139 100644
--- a/src/widjets-display-user-tzcld.js
+++ b/src/widjets-display-user-tzcld.js
@@ -61,7 +61,7 @@ import("./utils.js").then((utils) => {
}
let render = ``;
for(let phone of tzcldprofile.phones) {
- render += `<div class="phone">${await phone.phone} ${await phone.phone_type}</div>`;
+ render += `<div class="phone margin-bottom-xxsmall">${await phone.phone} ${await phone.phone_type}</div>`;
}
this.element.innerHTML = render;
@@ -94,7 +94,7 @@ import("./utils.js").then((utils) => {
}
let render = ``;
for(let email of tzcldprofile.emails) {
- render += `<div class="email"><a class="link" href="mailto:${await email.email}">${await email.email}</a> ${await email.email_type}</div>`;
+ render += `<div class="email margin-bottom-xxsmall"><a class="link" href="mailto:${await email.email}">${await email.email}</a> ${await email.email_type}</div>`;
}
this.element.innerHTML = render;