Skip to content

Commit

Permalink
Feature: Room adverts (#804)
Browse files Browse the repository at this point in the history
* add first steps for room feature

* rooms useable when logged in

* some minor changed to logged in view of room adverts

* added public view of room forum

* made header slightly bigger

* small fixes

* small fixes

* small fixes

* small linting fixes

* fixed ordering of adverts on public site

* reverted testing settings

* Implemented comments in PR

* Fixed legacy ember component usage and added translation of error message

* Fixed future merge conflicts with branch feature/public/indentity

* fixed long text creating long item

* fix backdrop

* fix all newly introduced action helper usages

* use glimmer instaed of ember component

* Removed header.js and fixed form not submitting anymore

* re-commit harmless change 😄

* I am stupid

* change input type

* format where availableFrom is shown

---------

Co-authored-by: DrumsnChocolate <[email protected]>
  • Loading branch information
Ellen-Wittingen and DrumsnChocolate authored Oct 29, 2024
1 parent 037e0f2 commit c7bb827
Show file tree
Hide file tree
Showing 52 changed files with 946 additions and 128 deletions.
31 changes: 31 additions & 0 deletions app/abilities/room-advert.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import { isNone } from '@ember/utils';
import { Ability } from 'ember-can';

export default class RoomAdvert extends Ability {
get canCreate() {
return this.session.hasPermission('room-advert.create');
}

get canShow() {
return this.session.hasPermission('room-advert.read');
}

get canDestroy() {
return (
this.session.hasPermission('room-advert.destroy') ||
this.isRoomAdvertOwner(this.model)
);
}

get canEdit() {
return (
this.session.hasPermission('room-advert.update') ||
this.isRoomAdvertOwner(this.model)
);
}

isRoomAdvertOwner(roomAdvert) {
const { currentUser } = this.session;
return !isNone(currentUser) && roomAdvert.isOwner(currentUser);
}
}
2 changes: 1 addition & 1 deletion app/components/cards/article-card.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,7 @@
</span>
{{#if useMaxHeight}}
<LinkTo @route='articles.article' @model={{article.id}} itemprop='url'>
<span class='float-md-end'> {{t 'tag.button.readMore'}} </span>
<span class='float-md-end'><i>{{t 'tag.button.readMore'}}</i></span>
</LinkTo>
{{/if}}
</div>
Expand Down
76 changes: 76 additions & 0 deletions app/components/cards/public-room-advert-card.hbs
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
<div class='col-md-12 room-advert-card {{if @collapsed "collapsed mb-5 col-xl-10 mx-xl-auto"}}' {{on "click" (fn this.open @roomAdvert)}}>
<div class='d-flex justify-content-center'>
<div class='card mb-0 w-100 {{if @collapsed "mx-lg-5"}}'>
{{#if (not @collapsed)}}
<div class="advert-modal-header card-header card-header--overlay">
<img class="card-img-top" src="{{@roomAdvert.coverPhotoUrl}}">
<div class="card-title-bar gradient-overlay">
<h1 class="card-title title ms-3 mb-2">{{@roomAdvert.houseName}}</h1>
</div>
</div>
{{/if}}
<div class='card-body m-4 fs-5'>
<div class="row">
<div class="pe-4 col-12 col-md-6 mb-3">
{{#if @collapsed}}
<div class="width-fit-content">
<h2 class="text-secondary me-5">{{@roomAdvert.houseName}}</h2>
<hr class="border border-secondary bg-secondary border-3 opacity-100 mt-0" />
</div>
{{/if}}
<table>
{{#if @roomAdvert.location}}
<tr>
<th class="pe-3 text-secondary">{{t 'component.public.roomForum.location'}}</th>
<td>
<a
href='https://maps.google.com/?q={{@roomAdvert.location}}'
target='_blank'
>
{{@roomAdvert.location}}
</a>
</td>
</tr>
{{/if}}
{{#if @roomAdvert.availableFrom}}
<tr>
<th class="pe-3 text-secondary">{{t 'component.public.roomForum.availableFrom'}}</th>
<td>{{moment-format @roomAdvert.availableFrom 'DD-M-YYYY'}}</td>
</tr>
{{/if}}
<tr>
<th class="pe-3 text-secondary">{{t 'component.public.roomForum.contact'}}</th>
<td>
{{#if (is-phone @roomAdvert.contact)}}
<a href='tel:{{@roomAdvert.contact}}'>{{@roomAdvert.contact}}</a>
{{else if (is-email @roomAdvert.contact)}}
<a href='mailto:{{@roomAdvert.contact}}'>{{@roomAdvert.contact}}</a>
{{else if (is-url @roomAdvert.contact)}}
<a href='{{@roomAdvert.contact}}' target='_blank'>{{@roomAdvert.contact}}</a>
{{else}}
{{@roomAdvert.contact}}
{{/if}}
</td>
</tr>
</table>
</div>
{{#if (and @roomAdvert.coverPhotoUrl @collapsed)}}
<img src={{@roomAdvert.coverPhotoUrl}} class='col-12 col-md-6 mb-3 object-fit-cover'/>
{{/if}}
</div>
<p class='card-text description overflow-hidden mb-1' data-test-room-advert-description>
{{markdown-to-html
@roomAdvert.descriptionCamofied
extensions='youtubeEmbed bootstrapTable'
}}
<div class="{{if @collapsed "fade-to-white-background"}}"></div>
</p>
{{#if @collapsed}}
<button class="btn btn-secondary float-end fw-bold mt-1" type="button" {{on "click" (fn this.open @roomAdvert)}}>
Lees meer...
</button>
{{/if}}
</div>
</div>
</div>
</div>
11 changes: 11 additions & 0 deletions app/components/cards/public-room-advert-card.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
import Component from '@glimmer/component';
import { action } from '@ember/object';

export default class PublicRoomAdvertCardComponent extends Component {
@action
open(advert) {
if (this.args.open) {
this.args.open(advert);
}
}
}
72 changes: 72 additions & 0 deletions app/components/cards/room-advert-card.hbs
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
<div class='card'>
<div class='card-header card-header--overlay'>
<img class='card-img-top' src={{@roomAdvert.coverPhotoUrlOrDefault}} />

<div class='card-title-bar gradient-overlay'>

<div class='card-titles'>
<h2 class='card-title' data-test-room-advert-house-name>
{{@roomAdvert.houseName}}
</h2>
<h3 class='card-subtitle'>
<span class='subtitle-author' data-test-room-advert-author>
<LinkTo
@route='users.user'
@model={{@roomAdvert.author.id}}
class='link-to card-subtitle-link'
>
{{@roomAdvert.author.fullName}}
</LinkTo>
</span>
</h3>
</div>
</div>
</div>

<div class='row card-subheader-row ms-0 me-0'>
{{#if @roomAdvert.location}}
<div class='col-12 col-md-6 card-subheader-item align-items-center p-3'>
<b>Locatie: </b>
<a
href='https://maps.google.com/?q={{@roomAdvert.location}}'
target='_blank'
>
{{@roomAdvert.location}}
</a>
</div>
{{/if}}

{{#if @roomAdvert.availableFrom}}
<div class='col-12 col-md-6 card-subheader-item align-items-center p-3'>
<b>Beschikbaar vanaf: </b>
{{moment-format @roomAdvert.availableFrom 'DD-M-YYYY'}}
</div>
{{/if}}
</div>

<div class='card-body'>
<p class='card-text' data-test-room-advert-description>
{{markdown-to-html
@roomAdvert.descriptionCamofied
extensions='youtubeEmbed bootstrapTable'
}}
</p>
</div>

{{#if @roomAdvert.contact}}
<div class='row card-sub-bottom-row ms-0 me-0'>
<div class='col-12 card-sub-item align-items-center p-3'>
<b>Contact: </b>
{{#if (is-phone @roomAdvert.contact)}}
<a href='tel:{{@roomAdvert.contact}}'>{{@roomAdvert.contact}}</a>
{{else if (is-email @roomAdvert.contact)}}
<a href='mailto:{{@roomAdvert.contact}}'>{{@roomAdvert.contact}}</a>
{{else if (is-url @roomAdvert.contact)}}
<a href='{{@roomAdvert.contact}}' target='_blank'>{{@roomAdvert.contact}}</a>
{{else}}
{{@roomAdvert.contact}}
{{/if}}
</div>
</div>
{{/if}}
</div>
81 changes: 81 additions & 0 deletions app/components/forms/room-advert-form.hbs
Original file line number Diff line number Diff line change
@@ -0,0 +1,81 @@
<div class='card'>
<div class='card-header'>
<h5>{{if @model.isNew 'Kamer advertentie aanmaken' 'Kamer advertentie wijzigen'}}</h5>
</div>
<div class='card-body'>
<form {{action @onSubmit on='submit'}}>
<ModelForm::TextInput
@model={{@model}}
@property='houseName'
@label='Huisnaam'
@required={{true}}
@maxlength={{50}}
/>
<ModelForm::FileInput
@model={{@model}}
@property='coverPhoto'
@label='Coverfoto'
@loadedCallback={{@onCoverPhotoLoaded}}
/>
<ModelForm::TextInput
@model={{@model}}
@property='contact'
@label='Contact (e-mailadres, telefoonnummer of link)'
@required={{true}}
@maxlength={{50}}
/>
<ModelForm::TextInput
@model={{@model}}
@property='location'
@label='Locatie'
@maxlength={{100}}
/>
<ModelForm::DateInput
@model={{@model}}
@property='availableFrom'
@label='Beschikbaar vanaf'
@required={{true}}
/>
<ModelForm::CheckboxInput
@model={{@model}}
@property='publiclyVisible'
@label='Zichtbaar voor externen'
/>

{{#if @model.publiclyVisible}}
<div class="row">
<div class="col-sm-10 offset-sm-2">
<div class='alert alert-warning' role='alert'>
Een publieke kamer advertentie is ook zichtbaar voor niet-leden. Houd hier
rekening mee in je advertentie.
<br />
Plaats je een coverfoto met mensen er op? Zorg dan wel dat je
toestemming van deze mensen hebt.
</div>
</div>
</div>
{{/if}}

<ModelForm::MdInput
@model={{@model}}
@property='description'
@label='Beschrijving'
@required={{true}}
@inputIdentifier='article-form-content'
/>

<ModelForm::FormActions
@errors={{@model.errors}}
@errorMessage={{@errorMessage}}
>
<button
{{on 'click' @onCancel}}
type="button"
class='btn btn-default'
>
Annuleren
</button>
</ModelForm::FormActions>
</form>
</div>
</div>
40 changes: 21 additions & 19 deletions app/components/header-nav.hbs
Original file line number Diff line number Diff line change
@@ -1,70 +1,72 @@
<nav class='navbar pb-0 pt-0 {{if (not session.isAuthenticated) "public"}}' aria-label='breadcrumb'>
<nav class='header-nav navbar pb-0 pt-0 {{if (not this.session.isAuthenticated) "public"}}' aria-label='breadcrumb'>
<div class="container-fluid d-flex justify-content-between">
<span
class='{{if session.isAuthenticated "half-toggle" "pe-2"}} left-sidebar-toggle d-block d-md-none link'
{{action 'toggleLeftSidebar'}}
class='{{if this.session.isAuthenticated "half-toggle" "pe-2"}} left-sidebar-toggle d-block d-md-none link'
{{on 'click' this.toggleLeftSidebar}}
>
</span>

{{#if session.isAuthenticated }}
<span {{action 'handleLogoAction'}} class='navbar-brand'>
{{#if this.session.isAuthenticated }}
<span {{on 'click' this.handleLogoAction}} class='navbar-brand'>
<div class='header-logo'> </div>
</span>
{{else}}
<div class='public-header-logo'> </div>
{{/if}}

<div class='d-flex col ps-0 pe-0 navbar-contents-holder {{if (not session.isAuthenticated) "public"}}'>
<div class='d-flex col ps-0 pe-0 navbar-contents-holder {{if (not this.session.isAuthenticated) "public"}}'>
<div class='navbar-overflow-wrapper'>
<div class='navbar-nav col d-flex flex-row'>
{{#if session.isAuthenticated}}
{{#if this.session.isAuthenticated}}
<Breadcrumbs @routeInfos={{@routeInfos}} />
{{else if media.isMobile}}
{{else if (not media.isMobile)}}
{{else if (not this.media.isMobile)}}
<LinkTo @route='index' class="page-actions-buttons">
<BsButton @type="primary" class="public-navbar-button {{if (eq router.currentRouteName 'index') 'selected'}}">Home</BsButton>
<BsButton @type="primary" class="public-navbar-button {{if (eq this.router.currentRouteName 'index') 'selected'}}">Home</BsButton>
</LinkTo>
<BsDropdown class="position-static" as |dd| {{did-insert (action 'setStaticPages')}}>
<BsDropdown class="position-static" as |dd| {{did-insert this.setStaticPages}}>
<dd.button @type="primary" class="public-navbar-button {{if this.onAboutUsPage 'selected'}}">
{{t "component.headerNav.aboutUs"}}
</dd.button>
<dd.menu class="public-about-us-dropdown" @renderInPlace={{true}} as |ddm|>
{{#each-in staticPages as |id title|}}
{{#each-in this.staticPages as |id title|}}
<ddm.item>
<ddm.linkTo @route='static-pages.static-page' @model={{id}} class="btn btn-primary">
{{title}}
</ddm.linkTo>
</ddm.item>
{{/each-in}}
<LinkTo @route='public.room-forum' class="dropdown-item btn btn-primary">
{{t 'mixin.menuItems.roomForum'}}
</LinkTo>
</dd.menu>
</BsDropdown>
<LinkTo @route='static-pages.static-page' @model='word-lid' class="page-actions-buttons">
<BsButton @type="primary" class="public-navbar-button {{if (eq router.currentURL '/static-pages/word-lid') 'selected'}}">{{t "component.headerNav.becomeMember"}}</BsButton>
<BsButton @type="primary" class="public-navbar-button {{if (eq this.router.currentURL '/static-pages/word-lid') 'selected'}}">{{t "component.headerNav.becomeMember"}}</BsButton>
</LinkTo>
<LinkTo @route='static-pages.static-page' @model='sponsoring' class="page-actions-buttons">
<BsButton @type="primary" class="public-navbar-button {{if (eq router.currentURL '/static-pages/sponsoring') 'selected'}}">{{t "component.headerNav.sponsoring"}}</BsButton>
<BsButton @type="primary" class="public-navbar-button {{if (eq this.router.currentURL '/static-pages/sponsoring') 'selected'}}">{{t "component.headerNav.sponsoring"}}</BsButton>
</LinkTo>
{{/if}}
</div>
</div>

<div id='navbar-wormhole'></div>

{{#unless session.isAuthenticated}}
{{#unless this.session.isAuthenticated}}
<LinkTo @route='login' class='d-none d-md-flex me-2'>
<button class='btn btn-primary public-navbar-button {{if (eq router.currentRouteName 'login') 'selected'}}' type='button'>
<button class='btn btn-primary public-navbar-button {{if (eq this.router.currentRouteName 'login') 'selected'}}' type='button'>
{{t 'tag.button.signin'}}
</button>
</LinkTo>
{{/unless}}
</div>

{{#unless session.isAuthenticated}}
{{#unless this.session.isAuthenticated}}
<button
class='btn btn-locale btn-inverse-locale-{{intl.locale}} me-2'
class='btn btn-locale btn-inverse-locale-{{this.intl.locale}} me-2'
title='{{t "component.headerNav.changeLocale"}}'
{{action 'toggleLocale'}}
{{on 'click' this.toggleLocale}}
type='button'>
</button>
{{/unless}}
Expand Down
Loading

0 comments on commit c7bb827

Please sign in to comment.