Skip to content

Commit c7bb827

Browse files
Ellen-WittingenDrumsnChocolate
Ellen-Wittingen
and
DrumsnChocolate
authored
Feature: Room adverts (#804)
* 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]>
1 parent 037e0f2 commit c7bb827

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

52 files changed

+946
-128
lines changed

‎app/abilities/room-advert.js‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import { isNone } from '@ember/utils';
2+
import { Ability } from 'ember-can';
3+
4+
export default class RoomAdvert extends Ability {
5+
get canCreate() {
6+
return this.session.hasPermission('room-advert.create');
7+
}
8+
9+
get canShow() {
10+
return this.session.hasPermission('room-advert.read');
11+
}
12+
13+
get canDestroy() {
14+
return (
15+
this.session.hasPermission('room-advert.destroy') ||
16+
this.isRoomAdvertOwner(this.model)
17+
);
18+
}
19+
20+
get canEdit() {
21+
return (
22+
this.session.hasPermission('room-advert.update') ||
23+
this.isRoomAdvertOwner(this.model)
24+
);
25+
}
26+
27+
isRoomAdvertOwner(roomAdvert) {
28+
const { currentUser } = this.session;
29+
return !isNone(currentUser) && roomAdvert.isOwner(currentUser);
30+
}
31+
}

‎app/components/cards/article-card.hbs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,7 @@
102102
</span>
103103
{{#if useMaxHeight}}
104104
<LinkTo @route='articles.article' @model={{article.id}} itemprop='url'>
105-
<span class='float-md-end'> {{t 'tag.button.readMore'}} </span>
105+
<span class='float-md-end'><i>{{t 'tag.button.readMore'}}</i></span>
106106
</LinkTo>
107107
{{/if}}
108108
</div>

‎app/components/cards/public-room-advert-card.hbs‎

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
<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)}}>
2+
<div class='d-flex justify-content-center'>
3+
<div class='card mb-0 w-100 {{if @collapsed "mx-lg-5"}}'>
4+
{{#if (not @collapsed)}}
5+
<div class="advert-modal-header card-header card-header--overlay">
6+
<img class="card-img-top" src="{{@roomAdvert.coverPhotoUrl}}">
7+
<div class="card-title-bar gradient-overlay">
8+
<h1 class="card-title title ms-3 mb-2">{{@roomAdvert.houseName}}</h1>
9+
</div>
10+
</div>
11+
{{/if}}
12+
<div class='card-body m-4 fs-5'>
13+
<div class="row">
14+
<div class="pe-4 col-12 col-md-6 mb-3">
15+
{{#if @collapsed}}
16+
<div class="width-fit-content">
17+
<h2 class="text-secondary me-5">{{@roomAdvert.houseName}}</h2>
18+
<hr class="border border-secondary bg-secondary border-3 opacity-100 mt-0" />
19+
</div>
20+
{{/if}}
21+
<table>
22+
{{#if @roomAdvert.location}}
23+
<tr>
24+
<th class="pe-3 text-secondary">{{t 'component.public.roomForum.location'}}</th>
25+
<td>
26+
<a
27+
href='https://maps.google.com/?q={{@roomAdvert.location}}'
28+
target='_blank'
29+
>
30+
{{@roomAdvert.location}}
31+
</a>
32+
</td>
33+
</tr>
34+
{{/if}}
35+
{{#if @roomAdvert.availableFrom}}
36+
<tr>
37+
<th class="pe-3 text-secondary">{{t 'component.public.roomForum.availableFrom'}}</th>
38+
<td>{{moment-format @roomAdvert.availableFrom 'DD-M-YYYY'}}</td>
39+
</tr>
40+
{{/if}}
41+
<tr>
42+
<th class="pe-3 text-secondary">{{t 'component.public.roomForum.contact'}}</th>
43+
<td>
44+
{{#if (is-phone @roomAdvert.contact)}}
45+
<a href='tel:{{@roomAdvert.contact}}'>{{@roomAdvert.contact}}</a>
46+
{{else if (is-email @roomAdvert.contact)}}
47+
<a href='mailto:{{@roomAdvert.contact}}'>{{@roomAdvert.contact}}</a>
48+
{{else if (is-url @roomAdvert.contact)}}
49+
<a href='{{@roomAdvert.contact}}' target='_blank'>{{@roomAdvert.contact}}</a>
50+
{{else}}
51+
{{@roomAdvert.contact}}
52+
{{/if}}
53+
</td>
54+
</tr>
55+
</table>
56+
</div>
57+
{{#if (and @roomAdvert.coverPhotoUrl @collapsed)}}
58+
<img src={{@roomAdvert.coverPhotoUrl}} class='col-12 col-md-6 mb-3 object-fit-cover'/>
59+
{{/if}}
60+
</div>
61+
<p class='card-text description overflow-hidden mb-1' data-test-room-advert-description>
62+
{{markdown-to-html
63+
@roomAdvert.descriptionCamofied
64+
extensions='youtubeEmbed bootstrapTable'
65+
}}
66+
<div class="{{if @collapsed "fade-to-white-background"}}"></div>
67+
</p>
68+
{{#if @collapsed}}
69+
<button class="btn btn-secondary float-end fw-bold mt-1" type="button" {{on "click" (fn this.open @roomAdvert)}}>
70+
Lees meer...
71+
</button>
72+
{{/if}}
73+
</div>
74+
</div>
75+
</div>
76+
</div>

‎app/components/cards/public-room-advert-card.js‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import Component from '@glimmer/component';
2+
import { action } from '@ember/object';
3+
4+
export default class PublicRoomAdvertCardComponent extends Component {
5+
@action
6+
open(advert) {
7+
if (this.args.open) {
8+
this.args.open(advert);
9+
}
10+
}
11+
}

‎app/components/cards/room-advert-card.hbs‎

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
<div class='card'>
2+
<div class='card-header card-header--overlay'>
3+
<img class='card-img-top' src={{@roomAdvert.coverPhotoUrlOrDefault}} />
4+
5+
<div class='card-title-bar gradient-overlay'>
6+
7+
<div class='card-titles'>
8+
<h2 class='card-title' data-test-room-advert-house-name>
9+
{{@roomAdvert.houseName}}
10+
</h2>
11+
<h3 class='card-subtitle'>
12+
<span class='subtitle-author' data-test-room-advert-author>
13+
<LinkTo
14+
@route='users.user'
15+
@model={{@roomAdvert.author.id}}
16+
class='link-to card-subtitle-link'
17+
>
18+
{{@roomAdvert.author.fullName}}
19+
</LinkTo>
20+
</span>
21+
</h3>
22+
</div>
23+
</div>
24+
</div>
25+
26+
<div class='row card-subheader-row ms-0 me-0'>
27+
{{#if @roomAdvert.location}}
28+
<div class='col-12 col-md-6 card-subheader-item align-items-center p-3'>
29+
<b>Locatie: </b>
30+
<a
31+
href='https://maps.google.com/?q={{@roomAdvert.location}}'
32+
target='_blank'
33+
>
34+
{{@roomAdvert.location}}
35+
</a>
36+
</div>
37+
{{/if}}
38+
39+
{{#if @roomAdvert.availableFrom}}
40+
<div class='col-12 col-md-6 card-subheader-item align-items-center p-3'>
41+
<b>Beschikbaar vanaf: </b>
42+
{{moment-format @roomAdvert.availableFrom 'DD-M-YYYY'}}
43+
</div>
44+
{{/if}}
45+
</div>
46+
47+
<div class='card-body'>
48+
<p class='card-text' data-test-room-advert-description>
49+
{{markdown-to-html
50+
@roomAdvert.descriptionCamofied
51+
extensions='youtubeEmbed bootstrapTable'
52+
}}
53+
</p>
54+
</div>
55+
56+
{{#if @roomAdvert.contact}}
57+
<div class='row card-sub-bottom-row ms-0 me-0'>
58+
<div class='col-12 card-sub-item align-items-center p-3'>
59+
<b>Contact: </b>
60+
{{#if (is-phone @roomAdvert.contact)}}
61+
<a href='tel:{{@roomAdvert.contact}}'>{{@roomAdvert.contact}}</a>
62+
{{else if (is-email @roomAdvert.contact)}}
63+
<a href='mailto:{{@roomAdvert.contact}}'>{{@roomAdvert.contact}}</a>
64+
{{else if (is-url @roomAdvert.contact)}}
65+
<a href='{{@roomAdvert.contact}}' target='_blank'>{{@roomAdvert.contact}}</a>
66+
{{else}}
67+
{{@roomAdvert.contact}}
68+
{{/if}}
69+
</div>
70+
</div>
71+
{{/if}}
72+
</div>

‎app/components/forms/room-advert-form.hbs‎

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
<div class='card'>
2+
<div class='card-header'>
3+
<h5>{{if @model.isNew 'Kamer advertentie aanmaken' 'Kamer advertentie wijzigen'}}</h5>
4+
</div>
5+
<div class='card-body'>
6+
<form {{action @onSubmit on='submit'}}>
7+
<ModelForm::TextInput
8+
@model={{@model}}
9+
@property='houseName'
10+
@label='Huisnaam'
11+
@required={{true}}
12+
@maxlength={{50}}
13+
/>
14+
<ModelForm::FileInput
15+
@model={{@model}}
16+
@property='coverPhoto'
17+
@label='Coverfoto'
18+
@loadedCallback={{@onCoverPhotoLoaded}}
19+
/>
20+
<ModelForm::TextInput
21+
@model={{@model}}
22+
@property='contact'
23+
@label='Contact (e-mailadres, telefoonnummer of link)'
24+
@required={{true}}
25+
@maxlength={{50}}
26+
/>
27+
<ModelForm::TextInput
28+
@model={{@model}}
29+
@property='location'
30+
@label='Locatie'
31+
@maxlength={{100}}
32+
/>
33+
<ModelForm::DateInput
34+
@model={{@model}}
35+
@property='availableFrom'
36+
@label='Beschikbaar vanaf'
37+
@required={{true}}
38+
/>
39+
<ModelForm::CheckboxInput
40+
@model={{@model}}
41+
@property='publiclyVisible'
42+
@label='Zichtbaar voor externen'
43+
/>
44+
45+
{{#if @model.publiclyVisible}}
46+
<div class="row">
47+
<div class="col-sm-10 offset-sm-2">
48+
<div class='alert alert-warning' role='alert'>
49+
Een publieke kamer advertentie is ook zichtbaar voor niet-leden. Houd hier
50+
rekening mee in je advertentie.
51+
<br />
52+
Plaats je een coverfoto met mensen er op? Zorg dan wel dat je
53+
toestemming van deze mensen hebt.
54+
</div>
55+
</div>
56+
</div>
57+
{{/if}}
58+
59+
<ModelForm::MdInput
60+
@model={{@model}}
61+
@property='description'
62+
@label='Beschrijving'
63+
@required={{true}}
64+
@inputIdentifier='article-form-content'
65+
/>
66+
67+
<ModelForm::FormActions
68+
@errors={{@model.errors}}
69+
@errorMessage={{@errorMessage}}
70+
>
71+
<button
72+
{{on 'click' @onCancel}}
73+
type="button"
74+
class='btn btn-default'
75+
>
76+
Annuleren
77+
</button>
78+
</ModelForm::FormActions>
79+
</form>
80+
</div>
81+
</div>

‎app/components/header-nav.hbs‎

Lines changed: 21 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,70 +1,72 @@
1-
<nav class='navbar pb-0 pt-0 {{if (not session.isAuthenticated) "public"}}' aria-label='breadcrumb'>
1+
<nav class='header-nav navbar pb-0 pt-0 {{if (not this.session.isAuthenticated) "public"}}' aria-label='breadcrumb'>
22
<div class="container-fluid d-flex justify-content-between">
33
<span
4-
class='{{if session.isAuthenticated "half-toggle" "pe-2"}} left-sidebar-toggle d-block d-md-none link'
5-
{{action 'toggleLeftSidebar'}}
4+
class='{{if this.session.isAuthenticated "half-toggle" "pe-2"}} left-sidebar-toggle d-block d-md-none link'
5+
{{on 'click' this.toggleLeftSidebar}}
66
>
77
☰
88
</span>
99

10-
{{#if session.isAuthenticated }}
11-
<span {{action 'handleLogoAction'}} class='navbar-brand'>
10+
{{#if this.session.isAuthenticated }}
11+
<span {{on 'click' this.handleLogoAction}} class='navbar-brand'>
1212
<div class='header-logo'> </div>
1313
</span>
1414
{{else}}
1515
<div class='public-header-logo'> </div>
1616
{{/if}}
1717

18-
<div class='d-flex col ps-0 pe-0 navbar-contents-holder {{if (not session.isAuthenticated) "public"}}'>
18+
<div class='d-flex col ps-0 pe-0 navbar-contents-holder {{if (not this.session.isAuthenticated) "public"}}'>
1919
<div class='navbar-overflow-wrapper'>
2020
<div class='navbar-nav col d-flex flex-row'>
21-
{{#if session.isAuthenticated}}
21+
{{#if this.session.isAuthenticated}}
2222
<Breadcrumbs @routeInfos={{@routeInfos}} />
23-
{{else if media.isMobile}}
24-
{{else if (not media.isMobile)}}
23+
{{else if (not this.media.isMobile)}}
2524
<LinkTo @route='index' class="page-actions-buttons">
26-
<BsButton @type="primary" class="public-navbar-button {{if (eq router.currentRouteName 'index') 'selected'}}">Home</BsButton>
25+
<BsButton @type="primary" class="public-navbar-button {{if (eq this.router.currentRouteName 'index') 'selected'}}">Home</BsButton>
2726
</LinkTo>
28-
<BsDropdown class="position-static" as |dd| {{did-insert (action 'setStaticPages')}}>
27+
<BsDropdown class="position-static" as |dd| {{did-insert this.setStaticPages}}>
2928
<dd.button @type="primary" class="public-navbar-button {{if this.onAboutUsPage 'selected'}}">
3029
{{t "component.headerNav.aboutUs"}}
3130
</dd.button>
3231
<dd.menu class="public-about-us-dropdown" @renderInPlace={{true}} as |ddm|>
33-
{{#each-in staticPages as |id title|}}
32+
{{#each-in this.staticPages as |id title|}}
3433
<ddm.item>
3534
<ddm.linkTo @route='static-pages.static-page' @model={{id}} class="btn btn-primary">
3635
{{title}}
3736
</ddm.linkTo>
3837
</ddm.item>
3938
{{/each-in}}
39+
<LinkTo @route='public.room-forum' class="dropdown-item btn btn-primary">
40+
{{t 'mixin.menuItems.roomForum'}}
41+
</LinkTo>
4042
</dd.menu>
4143
</BsDropdown>
4244
<LinkTo @route='static-pages.static-page' @model='word-lid' class="page-actions-buttons">
43-
<BsButton @type="primary" class="public-navbar-button {{if (eq router.currentURL '/static-pages/word-lid') 'selected'}}">{{t "component.headerNav.becomeMember"}}</BsButton>
45+
<BsButton @type="primary" class="public-navbar-button {{if (eq this.router.currentURL '/static-pages/word-lid') 'selected'}}">{{t "component.headerNav.becomeMember"}}</BsButton>
4446
</LinkTo>
4547
<LinkTo @route='static-pages.static-page' @model='sponsoring' class="page-actions-buttons">
46-
<BsButton @type="primary" class="public-navbar-button {{if (eq router.currentURL '/static-pages/sponsoring') 'selected'}}">{{t "component.headerNav.sponsoring"}}</BsButton>
48+
<BsButton @type="primary" class="public-navbar-button {{if (eq this.router.currentURL '/static-pages/sponsoring') 'selected'}}">{{t "component.headerNav.sponsoring"}}</BsButton>
4749
</LinkTo>
4850
{{/if}}
4951
</div>
5052
</div>
5153

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

54-
{{#unless session.isAuthenticated}}
56+
{{#unless this.session.isAuthenticated}}
5557
<LinkTo @route='login' class='d-none d-md-flex me-2'>
56-
<button class='btn btn-primary public-navbar-button {{if (eq router.currentRouteName 'login') 'selected'}}' type='button'>
58+
<button class='btn btn-primary public-navbar-button {{if (eq this.router.currentRouteName 'login') 'selected'}}' type='button'>
5759
{{t 'tag.button.signin'}}
5860
</button>
5961
</LinkTo>
6062
{{/unless}}
6163
</div>
6264

63-
{{#unless session.isAuthenticated}}
65+
{{#unless this.session.isAuthenticated}}
6466
<button
65-
class='btn btn-locale btn-inverse-locale-{{intl.locale}} me-2'
67+
class='btn btn-locale btn-inverse-locale-{{this.intl.locale}} me-2'
6668
title='{{t "component.headerNav.changeLocale"}}'
67-
{{action 'toggleLocale'}}
69+
{{on 'click' this.toggleLocale}}
6870
type='button'>
6971
</button>
7072
{{/unless}}

0 commit comments

Comments
 (0)