Commits (3)
This diff is collapsed.
{ {
"name": "@coscine/login", "name": "@coscine/login",
"version": "1.5.1", "version": "1.6.0",
"private": true, "private": true,
"directories": { "directories": {
"doc": "docs" "doc": "docs"
...@@ -12,15 +12,16 @@ ...@@ -12,15 +12,16 @@
"test:unit": "vue-cli-service test:unit" "test:unit": "vue-cli-service test:unit"
}, },
"dependencies": { "dependencies": {
"@coscine/api-connection": "^1.15.0",
"@itcenter-layout/bootstrap": "^1.5.5", "@itcenter-layout/bootstrap": "^1.5.5",
"@itcenter-layout/masterpage": "^1.2.9", "@itcenter-layout/masterpage": "^1.2.9",
"@types/jquery": "^3.3.35", "@types/jquery": "^3.3.38",
"@types/jsonp": "^0.2.0", "@types/jsonp": "^0.2.0",
"bootstrap-vue": "^2.12.0", "bootstrap-vue": "^2.15.0",
"jquery": "^3.5.0", "jquery": "^3.5.1",
"jsonp": "^0.2.1", "jsonp": "^0.2.1",
"vue": "^2.6.11", "vue": "^2.6.11",
"vue-i18n": "^8.17.3" "vue-i18n": "^8.18.2"
}, },
"devDependencies": { "devDependencies": {
"@hutson/semantic-delivery-gitlab": "^9.1.0", "@hutson/semantic-delivery-gitlab": "^9.1.0",
...@@ -31,14 +32,14 @@ ...@@ -31,14 +32,14 @@
"@semantic-release/release-notes-generator": "^9.0.1", "@semantic-release/release-notes-generator": "^9.0.1",
"@types/chai": "^4.2.11", "@types/chai": "^4.2.11",
"@types/mocha": "^7.0.2", "@types/mocha": "^7.0.2",
"@vue/cli-plugin-babel": "^4.3.1", "@vue/cli-plugin-babel": "^4.4.4",
"@vue/cli-plugin-typescript": "^4.3.1", "@vue/cli-plugin-typescript": "^4.4.4",
"@vue/cli-plugin-unit-mocha": "^4.3.1", "@vue/cli-plugin-unit-mocha": "^4.4.4",
"@vue/cli-service": "^4.3.1", "@vue/cli-service": "^4.4.4",
"@vue/test-utils": "1.0.0-beta.33", "@vue/test-utils": "1.0.3",
"chai": "^4.2.0", "chai": "^4.2.0",
"semantic-release": "^17.0.7", "semantic-release": "^17.0.8",
"typescript": "^3.8.3", "typescript": "^3.9.5",
"vue-template-compiler": "^2.6.11" "vue-template-compiler": "^2.6.11"
}, },
"repository": { "repository": {
......
<template> <template>
<div id="wrap" :style="cssProps"> <div id="wrap" :style="cssProps">
<header> <RWTHHeader
<nav id="nav-global" class="navbar rwth-black navbar-dark navbar-expand-md"> :rwthImage="rwthImage"
<div class="app-header-container"> :coscineImageBlack="coscineImageBlack"/>
<div id="DeltaSiteLogo">
<a id="ctl00_onetidProjectPropertyTitleGraphic" title="Team Site" class="ms-siteicon-a" href="/">
<img id="ctl00_onetidHeadbnnr2" class="ms-siteicon-img" name="onetidHeadbnnr0" :src="rwthImage" alt="Team Site" data-themekey="#">
</a>
</div>
</div>
<div id="DeltaCoScInESiteLogo">
<a id="ctl00_SPSimpleSiteLink1" title="Team Site" class="ms-siteicon-a coscineSiteIcon" href="/">
<img id="ctl00_SiteLogoImage1" class="ms-siteicon-img" name="onetidHeadbnnr0" :src="coscineImageBlack" alt="Team Site" data-themekey="#">
</a>
<span class="coscineSiteIconLabel">CoScInE</span>
</div>
<ul id="nav-langsearch" class="navbar-nav ml-auto">
<li id="langToggle" class="next-lang" tabindex="0" aria-label="toggle language">
<a class="nav-link lang" href="#" id="Lang" v-on:click="changeLocale()">
<span id="langBox" class="language-box">{{ $t('otherLocale') }}</span>
</a>
</li>
</ul>
</nav>
</header>
<div class="container-fluid app-content"> <div class="container-fluid app-content">
<div class="row"> <div class="row">
<div class="col-xl-2"></div> <div class="col-xl-2"></div>
...@@ -33,7 +12,7 @@ ...@@ -33,7 +12,7 @@
<img class="logo" :src="coscineImageBlue" v-if="imageEnabled" alt /> <img class="logo" :src="coscineImageBlue" v-if="imageEnabled" alt />
<span class="keyword">CoScInE</span> <span class="keyword">CoScInE</span>
</h1> </h1>
<div class="row"> <div v-if="!tos" class="row">
<div class="col-sm-12 col-md-7"> <div class="col-sm-12 col-md-7">
<div class="alert alert-warning" role="alert"> <div class="alert alert-warning" role="alert">
<h5 class="alert-heading">{{ $t('alert_headline') }}</h5> <h5 class="alert-heading">{{ $t('alert_headline') }}</h5>
...@@ -83,37 +62,18 @@ ...@@ -83,37 +62,18 @@
</div> </div>
</div> </div>
</div> </div>
<div v-else class="row">
<div class="col-sm-12 col-md-12">
<TOS
:tosReturnUrl="this.tosReturnUrl"
/>
</div>
</div> </div>
</div>
</div> </div>
<div class="col-xl-2"></div> <div class="col-xl-2"></div>
</div> </div>
<footer id="footer"> <RWTHFooter/>
<div class="row container">
<div id="servicecol" class="col-xs-12 col-sm-6">
<div class="list-group">
<h2>Service</h2>
<a href="http://www.rwth-aachen.de/cms/root/Footer/Services/~cesv/Disclaimer/?lidx=1" class="list-group-item list-group-item-action">{{ $t('help') }}</a>
<a href="https://www.rwth-aachen.de/cms/root/Footer/Services/~cesv/Disclaimer/" class="list-group-item list-group-item-action">{{ $t('disclaimer') }}</a>
<a href="http://www.itc.rwth-aachen.de/cms/IT-Center/Footer/Service/~epvv/Impressum/" class="list-group-item list-group-item-action">{{ $t('imprint') }}</a>
</div>
</div>
<div id="contactcol" class="col-xs-12 col-sm-6">
<div id="contact-list" class="list-group">
<h2 id="footerContact">{{ $t('contact') }}</h2>
<a id="mail" href="mailto:servicedesk@itc.rwth-aachen.de" class="list-group-item list-group-item-action">
servicedesk@itc.rwth-aachen.de
</a>
<span id="phone" class="list-group-item">
+49 241 / 80-24680
</span>
<span id="fax" class="list-group-item">
+49 241 / 80-22981
</span>
</div>
</div>
</div>
</footer>
</div> </div>
</template> </template>
...@@ -122,6 +82,9 @@ import Vue from 'vue'; ...@@ -122,6 +82,9 @@ import Vue from 'vue';
import LoginMain from './components/LoginMain.vue'; import LoginMain from './components/LoginMain.vue';
import LoginForm from './components/LoginForm.vue'; import LoginForm from './components/LoginForm.vue';
import LogoutMain from './components/LogoutMain.vue'; import LogoutMain from './components/LogoutMain.vue';
import TOS from './components/TOS.vue';
import RWTHHeader from './components/RWTHHeader.vue';
import RWTHFooter from './components/RWTHFooter.vue';
import coscineImageBlackPath from './assets/logo-coscine-black.png'; import coscineImageBlackPath from './assets/logo-coscine-black.png';
import coscineImageBluePath from './assets/logo-coscine-blue.png'; import coscineImageBluePath from './assets/logo-coscine-blue.png';
...@@ -154,6 +117,10 @@ function getReturnUrl(method: string) { ...@@ -154,6 +117,10 @@ function getReturnUrl(method: string) {
return returnUrl; return returnUrl;
} }
function getTOSReturnUrl() {
return encodeURI('' + getReturnUrlParam());
}
function getAccountReturnUrl() { function getAccountReturnUrl() {
return getReturnUrl('Account'); return getReturnUrl('Account');
} }
...@@ -182,6 +149,11 @@ function getIsLogout() { ...@@ -182,6 +149,11 @@ function getIsLogout() {
return urlParams.has('logout'); return urlParams.has('logout');
} }
function getIsTOS() {
const urlParams = new URLSearchParams(window.location.search);
return urlParams.has('tos');
}
function getLoggedInWithShibboleth() { function getLoggedInWithShibboleth() {
const urlParams = new URLSearchParams(window.location.search); const urlParams = new URLSearchParams(window.location.search);
return urlParams.has('loggedInWithShibboleth'); return urlParams.has('loggedInWithShibboleth');
...@@ -193,6 +165,9 @@ export default Vue.extend({ ...@@ -193,6 +165,9 @@ export default Vue.extend({
LoginMain, LoginMain,
LoginForm, LoginForm,
LogoutMain, LogoutMain,
TOS,
RWTHHeader,
RWTHFooter,
}, },
computed: { computed: {
cssProps() { cssProps() {
...@@ -212,12 +187,14 @@ export default Vue.extend({ ...@@ -212,12 +187,14 @@ export default Vue.extend({
imageEnabled, imageEnabled,
returnUrl: getAccountReturnUrl(), returnUrl: getAccountReturnUrl(),
shibbolethReturnUrl: getShibbolethReturnUrl(), shibbolethReturnUrl: getShibbolethReturnUrl(),
tosReturnUrl: getTOSReturnUrl(),
idpUrl: getIdpUrl(), idpUrl: getIdpUrl(),
orcidUrl: getORCiDUrl(), orcidUrl: getORCiDUrl(),
logoutState: getIsLogout(), logoutState: getIsLogout(),
loggedInWithShibboleth: getLoggedInWithShibboleth(), loggedInWithShibboleth: getLoggedInWithShibboleth(),
currentInputCard: 'LoginMain', currentInputCard: 'LoginMain',
logoutComponent: 'LogoutMain', logoutComponent: 'LogoutMain',
tos: getIsTOS(),
}; };
}, },
methods: { methods: {
...@@ -230,13 +207,6 @@ export default Vue.extend({ ...@@ -230,13 +207,6 @@ export default Vue.extend({
getORCiDForm() { getORCiDForm() {
window.location.href = this.orcidUrl; window.location.href = this.orcidUrl;
}, },
changeLocale() {
if (this.$root.$i18n.locale === 'en') {
this.$root.$i18n.locale = 'de';
} else {
this.$root.$i18n.locale = 'en';
}
},
changeLogoutState() { changeLogoutState() {
this.logoutState = !this.logoutState; this.logoutState = !this.logoutState;
}, },
......
<template>
<footer id="footer">
<div class="row container">
<div id="servicecol" class="col-xs-12 col-sm-6">
<div class="list-group">
<h2>Service</h2>
<a href="https://help.itc.rwth-aachen.de/service/7ab6210773b04ef28a1a8cb33628be67" class="list-group-item list-group-item-action">{{ $t('help') }}</a>
<a href="https://git.rwth-aachen.de/coscine/terms/-/blob/master/PrivacyPolicy.md" class="list-group-item list-group-item-action">{{ $t('disclaimer') }}</a>
<a href="http://www.itc.rwth-aachen.de/cms/IT-Center/Footer/Service/~epvv/Impressum/" class="list-group-item list-group-item-action">{{ $t('imprint') }}</a>
</div>
</div>
<div id="contactcol" class="col-xs-12 col-sm-6">
<div id="contact-list" class="list-group">
<h2 id="footerContact">{{ $t('contact') }}</h2>
<a id="mail" href="mailto:servicedesk@itc.rwth-aachen.de" class="list-group-item list-group-item-action">
servicedesk@itc.rwth-aachen.de
</a>
<span id="phone" class="list-group-item">
+49 241 / 80-24680
</span>
<span id="fax" class="list-group-item">
+49 241 / 80-22981
</span>
</div>
</div>
</div>
</footer>
</template>
<script lang="ts">
import Vue from 'vue';
export default Vue.extend({
name: 'rwthfooter',
});
</script>
<style scoped></style>
<template>
<header id="header">
<nav id="nav-global" class="navbar rwth-black navbar-dark navbar-expand-md">
<div class="app-header-container">
<div id="DeltaSiteLogo">
<a id="ctl00_onetidProjectPropertyTitleGraphic" title="Team Site" class="ms-siteicon-a" href="/">
<img id="ctl00_onetidHeadbnnr2" class="ms-siteicon-img" name="onetidHeadbnnr0" :src="rwthImage" alt="RWTH Aachen University" data-themekey="#">
</a>
</div>
</div>
<div id="DeltaCoScInESiteLogo">
<a id="ctl00_SPSimpleSiteLink1" title="Team Site" class="ms-siteicon-a coscineSiteIcon" href="/">
<img id="ctl00_SiteLogoImage1" class="ms-siteicon-img" name="onetidHeadbnnr0" :src="coscineImageBlack" alt="Coscine" data-themekey="#">
</a>
<span class="coscineSiteIconLabel">CoScInE</span>
</div>
<ul id="nav-langsearch" class="navbar-nav ml-auto">
<li id="langToggle" class="next-lang" tabindex="0" aria-label="toggle language">
<a class="nav-link lang" href="#" id="Lang" v-on:click="changeLocale()">
<span id="langBox" class="language-box">{{ $t('otherLocale') }}</span>
</a>
</li>
</ul>
</nav>
</header>
</template>
<script lang="ts">
import Vue from 'vue';
export default Vue.extend({
name: 'rwthHeader',
props: {
rwthImage: String,
coscineImageBlack: String,
},
methods: {
changeLocale() {
if (this.$root.$i18n.locale === 'en') {
this.$root.$i18n.locale = 'de';
} else {
this.$root.$i18n.locale = 'en';
}
},
},
});
</script>
<style scoped></style>
<template>
<div>
<div id="TOSAndPP" class="card bg-light w-100">
<div class="card-body">
<h5 class="card-title">{{ $t('tosppTitle') }}</h5>
<p class="card-text">{{ $t('tosBodyStart') }}<a href="https://git.rwth-aachen.de/coscine/terms/-/blob/master/TermsOfUse.md">Link</a>{{ $t('tosBodyEnd') }}</p>
<b-form-checkbox id="checkboxTOS" v-model="checkedTOS">{{ $t('tosBodyCheckBox') }}</b-form-checkbox>
<p class="card-text">{{ $t('ppBodyStart') }}<a href="https://git.rwth-aachen.de/coscine/terms/-/blob/master/PrivacyPolicy.md">Link</a>{{ $t('ppBodyEnd') }}</p>
<b-form-checkbox id="checkboxPP" v-model="checkedPP">{{ $t('ppBodyCheckBox') }}</b-form-checkbox>
<button
class="btn btn-secondary w-100"
name="tosppContinue"
@click.prevent="accept()"
:disabled="!checkedTOS || !checkedPP"
>
{{ $t('tosppContinue') }}
</button>
<button class="btn btn-secondary w-100" name="tosppCancel" @click.prevent="cancel()">
{{ $t('tosppCancel') }}
</button>
</div>
</div>
</div>
</template>
<script lang="ts">
import Vue from 'vue';
import { TOSApi } from '@coscine/api-connection';
export default Vue.extend({
name: 'TOSAndPP',
data() {
return {
checkedTOS: false,
checkedPP: false,
};
},
props: {
tosReturnUrl: String,
},
methods: {
accept() {
TOSApi.acceptCurrentTOSVersion(this.getJWT(), (response: any) => {
location.href = this.tosReturnUrl;
});
},
cancel() {
location.href = 'https://www.rwth-aachen.de/';
},
getJWT() {
const urlParams = new URLSearchParams(window.location.search);
const jwt = urlParams.get('jwt');
return jwt !== null ? jwt : '';
},
removeParam(key: string, sourceURL: string) {
let rtn = sourceURL.split('?')[0];
let param = '';
let paramsArr = [];
const queryString = sourceURL.indexOf('?') !== -1 ? sourceURL.split('?')[1] : '';
if (queryString !== '') {
paramsArr = queryString.split('&');
for (let i = paramsArr.length - 1; i >= 0; i -= 1) {
param = paramsArr[i].split('=')[0];
if (param === key) {
paramsArr.splice(i, 1);
}
}
rtn = rtn + '?' + paramsArr.join('&');
}
return rtn;
},
},
});
</script>
<style scoped>
.custom-checkbox{
margin-left: 1em;
margin-bottom: 0.5em;
margin-top: -0.7em;
}
</style>
...@@ -31,4 +31,15 @@ export default { ...@@ -31,4 +31,15 @@ export default {
einloggen und das System erkunden, aber benutzen Sie es noch nicht für Ihre wichtigen Forschungsdaten! einloggen und das System erkunden, aber benutzen Sie es noch nicht für Ihre wichtigen Forschungsdaten!
Bitte kontaktieren Sie uns, wenn Sie an dem Pilotprogramm teilnehmen möchten. Feedback und Bitte kontaktieren Sie uns, wenn Sie an dem Pilotprogramm teilnehmen möchten. Feedback und
Verbesserungsvorschläge können Sie gerne an [`, Verbesserungsvorschläge können Sie gerne an [`,
tosppTitle: 'Nutzungsbedingungen und Datenschutzerklärung',
tosppCancel: 'Abbrechen',
tosppContinue: 'Fortfahren',
tosBodyStart: 'Um CoScInE nutzen zu können, müssen Sie den Nutzungsbedingungen (',
tosBodyLink: '',
tosBodyEnd: ') zustimmen.',
tosBodyCheckBox: 'Ich akzeptiere die Nutzungsbedingungen',
ppBodyStart: 'Zudem bestätigen Sie, die Datenschutzerklärung (',
ppBodyLink: '',
ppBodyEnd: ') zur Kenntnis genommen zu haben.',
ppBodyCheckBox: 'Ich habe die Datenschutzerklärung zur Kenntnis genommen',
}; };
...@@ -14,7 +14,7 @@ export default { ...@@ -14,7 +14,7 @@ export default {
login_button_without_account: 'Continue without Login', login_button_without_account: 'Continue without Login',
logout_button_orcid: 'Logout from ORCID', logout_button_orcid: 'Logout from ORCID',
logout_shibboleth: 'Logout from Shibboleth', logout_shibboleth: 'Logout from Shibboleth',
signup: 'Signup', signup: 'Sign In',
back: 'Back', back: 'Back',
login_form_headline: 'Login with user ID', login_form_headline: 'Login with user ID',
login_form_submit: 'Submit', login_form_submit: 'Submit',
...@@ -31,4 +31,15 @@ export default { ...@@ -31,4 +31,15 @@ export default {
log in and explore the system, but do not use it for your important log in and explore the system, but do not use it for your important
research data yet! Please contact us if you want to be part of the research data yet! Please contact us if you want to be part of the
pilot program. If you have feedback you are welcome to send it to [`, pilot program. If you have feedback you are welcome to send it to [`,
tosppTitle: 'Terms of use and privacy policy',
tosppCancel: 'Cancel',
tosppContinue: 'Continue',
tosBodyStart: 'In order to access CoScInE you need to accept the current Terms of Use (',
tosBodyLink: '',
tosBodyEnd: ').',
tosBodyCheckBox: 'I accept the Terms of Use',
ppBodyStart: 'Further you need to confirm that you have read and understood the Privacy Policy (',
ppBodyLink: '',
ppBodyEnd: ').',
ppBodyCheckBox: 'I have read and understood the Privacy Policy',
}; };
...@@ -3,6 +3,8 @@ declare module '*.vue' { ...@@ -3,6 +3,8 @@ declare module '*.vue' {
export default Vue; export default Vue;
} }
declare module '@coscine/api-connection';
declare module '@itcenter-layout/bootstrap' declare module '@itcenter-layout/bootstrap'
declare module "*.png" { declare module "*.png" {
const value: any; const value: any;
......