Skip to content
This repository was archived by the owner on Dec 14, 2023. It is now read-only.

Commit e2f4093

Browse files
JeddfJeddf
authored
Merge pull request #296 from CoderDojo/rpi-redirect
RPI auth opt in/out page
2 parents d315bde + 1429654 commit e2f4093

File tree

5 files changed

+110
-6
lines changed

5 files changed

+110
-6
lines changed

‎index.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -120,6 +120,16 @@ exports.register = function (server, options, next) {
120120
}
121121
});
122122

123+
server.route({
124+
method: 'GET',
125+
path: '/raspberry-opt',
126+
handler: {
127+
file: {
128+
path: 'index.html'
129+
}
130+
}
131+
});
132+
123133
server.route({
124134
method: 'GET',
125135
path: '/login',

‎src/common/cd-header.vue

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@
99
<div class="cd-menu__nav-right">
1010
<a class="emphasis" href="https://help.coderdojo.com">{{ $t('Help') }}</a>
1111
<div class="cd-menu__account">
12-
<a href="/register/user">{{ $t('Register') }}</a>
13-
<a href="/login">{{ $t('Login') }}</a>
12+
<a :href="registerPath">{{ $t('Register') }}</a>
13+
<a :href="loginPath">{{ $t('Login') }}</a>
1414
</div>
1515
<div class="cd-menu__profile">
1616
<div class="cd-menu__profile-pic"></div>
@@ -25,7 +25,7 @@
2525
<li class="cd-menu__cdf-admin-link"><a href="/dashboard/manage-dojos">{{ $t('Manage Dojos') }}</a></li>
2626
<li class="cd-menu__cdf-admin-link"><a href="http://badgekit.coderdojo.com/">Badgekit</a></li>
2727
<li class="cd-menu__cdf-admin-link"><a href="/dashboard/stats">{{ $t('Stats') }}</a></li>
28-
<li><a class="cd-menu__referer-link" href="/logout">{{ $t('Logout') }}</a></li>
28+
<li><a class="cd-menu__referer-link" :href="logoutPath">{{ $t('Logout') }}</a></li>
2929
</ul>
3030
</div>
3131
</div>
@@ -63,8 +63,8 @@
6363
<div class="cd-menu__content-pre">
6464
<a class="emphasis" href="https://help.coderdojo.com">{{ $t('Help') }}</a>
6565
<div class="cd-menu__account">
66-
<a href="/register/user">{{ $t('Register') }}</a>
67-
<a href="/login">{{ $t('Login') }}</a>
66+
<a :href="registerPath">{{ $t('Register') }}</a>
67+
<a :href="loginPath">{{ $t('Login') }}</a>
6868
</div>
6969
<ul class="cd-menu__content-block">
7070
<li class="cd-menu__profile">
@@ -92,7 +92,7 @@
9292
<li class="cd-menu__cdf-admin-link"><a href="/dashboard/manage-dojos">{{ $t('Manage Dojos') }}</a></li>
9393
<li class="cd-menu__cdf-admin-link"><a href="http://badgekit.coderdojo.com/">Badgekit</a></li>
9494
<li class="cd-menu__cdf-admin-link"><a href="/dashboard/stats">{{ $t('Stats') }}</a></li>
95-
<li><a class="cd-menu__referer-link" href="/logout">{{ $t('Logout') }}</a></li>
95+
<li><a class="cd-menu__referer-link" :href="logoutPath">{{ $t('Logout') }}</a></li>
9696
</ul>
9797
</div>
9898
</div>
@@ -133,7 +133,11 @@ import '@coderdojo/cd-common/dist/cd-common.min';
133133
export default {
134134
name: 'cd-header',
135135
data() {
136+
const rpiAuthFlag = window.localStorage.getItem('rpiAuth') === 'true';
136137
return {
138+
loginPath: rpiAuthFlag ? '/rpi/login' : '/login',
139+
logoutPath: rpiAuthFlag ? '/rpi/logout' : '/logout',
140+
registerPath: rpiAuthFlag ? '/rpi/register' : '/register/user',
137141
navigationLinks: [
138142
{
139143
href: 'https://coderdojo.com/about/',

‎src/router/index.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import EventForm from '@/events/cd-event-form';
1111
import BookingConfirmation from '@/events/order/cd-booking-confirmation';
1212
import Login from '@/users/cd-login';
1313
import AccountType from '@/users/cd-account-type';
14+
import RaspberryOpt from '@/users/cd-raspberry-opt';
1415
import orderWrapper from '@/events/order/wrapper';
1516
import UserService from '@/users/service';
1617
import store from '@/store';
@@ -113,6 +114,11 @@ const router = new Router({
113114
name: 'AccountType',
114115
component: AccountType,
115116
},
117+
{
118+
path: '/raspberry-opt',
119+
name: 'RaspberryOpt',
120+
component: RaspberryOpt,
121+
},
116122
{
117123
path: '/login',
118124
name: 'Login',

‎src/users/cd-login.vue

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,9 @@
3535
<p>
3636
{{ $t('The account for email {msg} is linked to a My Raspberry Pi account.', { msg: email }) }}
3737
</p>
38+
<p>
39+
<a :href="`/raspberry-opt?optIn=true`">{{$t('Opt this browser in to My Raspberry Pi authentication.')}}</a>
40+
</p>
3841
<p>
3942
<a :href="`/rpi/login?user=${email}`">{{$t('Login through My Raspberry Pi.')}}</a>
4043
</p>
@@ -108,6 +111,7 @@
108111
field: 'loginFailed',
109112
msg: response.body.why });
110113
} else {
114+
window.localStorage.clear('rpiAuth');
111115
const forumUrl = `^${Vue.config.forumsUrlBase}/auth/CoderDojo$`;
112116
if (this.redirectUrl.match(forumUrl)) {
113117
this.redirectTo(this.redirectUrl);

‎src/users/cd-raspberry-opt.vue

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
<template>
2+
<div class="cd-auth-type container-fluid">
3+
<div class="row">
4+
<div class="cd-auth-type__box">
5+
<span v-if="rpiAuthFlag">
6+
<h3
7+
class="cd-auth-type__header"
8+
>{{ $t("This browser is opted in to My Raspberry Pi authentication.") }}</h3>
9+
<div class="form-group text-center">
10+
<button class="cd-auth-type__opt btn btn-primary" v-on:click="optOut">Opt Out</button>
11+
<div>
12+
</span>
13+
<span v-else>
14+
<h3
15+
class="cd-auth-type__header"
16+
>{{ $t("This browser is opted out of My Raspberry Pi authentication.") }}</h3>
17+
<div class="form-group text-center">
18+
<button class="cd-auth-type__opt btn btn-primary" v-on:click="optIn">Opt In</button>
19+
<div>
20+
</span>
21+
</div>
22+
</div>
23+
</div>
24+
</template>
25+
26+
<script>
27+
import store from '@/store';
28+
29+
export default {
30+
name: 'Auth-Type',
31+
created() {
32+
if (this.$route.query.optIn) {
33+
const rpiAuthFlag = window.localStorage.getItem('rpiAuth') === 'true';
34+
if (!rpiAuthFlag) {
35+
this.optIn();
36+
}
37+
}
38+
},
39+
data() {
40+
return {
41+
rpiAuthFlag: window.localStorage.getItem('rpiAuth') === 'true',
42+
};
43+
},
44+
store,
45+
methods: {
46+
optIn() {
47+
window.localStorage.setItem('rpiAuth', true);
48+
location.reload();
49+
},
50+
optOut() {
51+
window.localStorage.clear('rpiAuth');
52+
// reload and clear optIn query param
53+
location.href = location.href.split('?')[0];
54+
},
55+
},
56+
};
57+
</script>
58+
59+
<style scoped lang="less">
60+
@import "~@coderdojo/cd-common/common/_colors";
61+
@import "../common/styles/cd-primary-button.less";
62+
63+
.cd-auth-type {
64+
&__header {
65+
padding: 12px;
66+
}
67+
&__box {
68+
border-style: solid;
69+
border-color: @cd-orange;
70+
border-width: 1px 1px 3px 1px;
71+
padding: 32px 56px 56px;
72+
max-width: 425px;
73+
margin: 20px auto 128px;
74+
}
75+
76+
&__opt {
77+
.primary-button;
78+
}
79+
}
80+
</style>

0 commit comments

Comments
 (0)