diff --git a/src/styles/circles.scss b/src/styles/circles.scss index 2c8ae666952d3cf0a70878e3da47624591347b2b..b5a05aa6e87de23243b2f5d2a80d54788c2dd8ea 100644 --- a/src/styles/circles.scss +++ b/src/styles/circles.scss @@ -201,10 +201,26 @@ } } } - #circles-chat #conversejs { - .chat-msg__content { - .badge { - display: none; - } +#circles-chat #conversejs { + .chat-msg__content { + .badge { + display: none; } } +} +.user-first-job-circle { + h4 { + display: block; + margin: 0; + a.link { + vertical-align: baseline; + } + } + .tag { + font-size: 10px; + padding: 0 5px; + line-height: 14px; + height: auto; + margin-left: 0; + } +} diff --git a/src/widjets-display-user-tzcld.js b/src/widjets-display-user-tzcld.js index f0218318a46d36f17b582a4a838532c0ffcbc874..b1f9a9c8f8cd3944d47604479c0fff142493d09c 100644 --- a/src/widjets-display-user-tzcld.js +++ b/src/widjets-display-user-tzcld.js @@ -355,5 +355,62 @@ import("./utils.js").then((utils) => { this.element.innerHTML = render; }, }); + + + core.Sib.register({ + name: "customtzcld-display-user-profile-first-job-circle", + 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 userEntity = { + user: await this.resource.tzcld_profile + } + let tzcldUserProfile = { + profile: await userEntity.user.jobs, + regions: await userEntity.user.regions, + }; + + 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 margin-bottom-xxsmall user-first-job-circle whitespace-normal">`; + for(let job of tzcldUserProfile.profile["ldp:contains"]) { + if(await job.organisation !="") { + if(await job.link !="") { + render += `<h4 class="position text-small text-normal padding-bottom-xxsmall">${await job.position} - <a class="link" target="_blank" href="${await job.link}">${await job.organisation}</a></h4>`; + } else { + render += `<h4 class="position text-small text-normal padding-bottom-xxsmall">${await job.position} - ${await job.organisation}</h4>`; + } + } else { + render += `<h4 class="position text-small text-normal padding-bottom-xxsmall">${await job.position}</h4>`; + } + + break ; + } + + for(let region of await tzcldUserProfile.regions["ldp:contains"]) { + render += `<div class="region segment tag color-fourth">${await region.name}</div>`; + } + + render += `</div>`; + + this.element.innerHTML = render; + }, + }); + }); }); \ No newline at end of file