Commit fae9be51 authored by  JosephK's avatar JosephK
Browse files

Découpage data.yml, import dans i18n, bouton play/pause (presque)

parent 4a316db7
......@@ -14,3 +14,28 @@ pages:
cache:
paths:
- node_modules/
production:
stage: deploy
script:
- npm install
- npm run prod
- mkdir "${HOME}/.ssh"
- chmod 700 "${HOME}/.ssh"
- if [ ! -z ${DEPLOYEMENT_KNOWN_HOSTS+x} ]; then echo -e "${DEPLOYEMENT_KNOWN_HOSTS}" > ${HOME}/.ssh/known_hosts; fi
- eval `ssh-agent -s`
- if [ ! -z ${DEPLOYEMENT_KEY+x} ]; then ssh-add <(echo "${DEPLOYEMENT_KEY}" | base64 --decode -i); fi
- if [ ! -z ${DEPLOYEMENT_KEY+x} ]; then echo "put -r public/* ${DEPLOYEMENT_USER}/" | sftp ${DEPLOYEMENT_USER}@${DEPLOYEMENT_HOST}; fi
only:
- master
# Push new translations strings to https://trad.framasoft.org
trads:
stage: deploy
image: framasoft/push-trad:latest
script:
- sed -e "s@<project-version>.*</project-version>@<project-version>$CI_COMMIT_REF_SLUG</project-version>@" -i zanata.xml
- if [ ! -z ${ZANATA_CONFIG_FRAMABOT+x} ]; then mkdir -p ${HOME}/.config; echo -e "${ZANATA_CONFIG_FRAMABOT}" > ${HOME}/.config/zanata.ini; fi
- if [ ! -z ${ZANATA_CONFIG_FRAMABOT+x} ]; then make push-locales; fi
only:
- master
#!/bin/bash
cp app/locales/en.yml po/template.yml
for i in po/*.po
do
j=$(echo $i | cut -d '.' -f 1 | cut -d '/' -f 2)
po2yaml -i $i --progress none -t po/template.yml -o app/locales/$j.yml
done
locales:
yaml2po -P --progress=none -i app/locales/en.yml -o po/accueil.pot
push-locales: locales
zanata-cli -q -B push
pull-locales:
zanata-cli -q -B pull --min-doc-percent 75
./.po2yml.sh
preview:
npm run preview
build:
npm run prod
......@@ -5,11 +5,11 @@
:description="$t('msg.meta.desc')"
:keywords="$t('msg.meta.keywords')"
:head="{
'meta[name=author]': {content: $t('msg.meta.name') },
'meta[name=author]': {content: $t('msg.data.meta.name') },
'meta[name^=DC][name$=title]': {content: $t('msg.meta.title') },
'meta[name^=DC][name$=publisher]': {content: $t('msg.meta.name') },
'meta[name^=DC][name$=contributor]': {content: $t('msg.meta.name') },
'meta[name^=DC][name$=language]': {content: $t('msg.meta.lang') },
'meta[name^=DC][name$=publisher]': {content: $t('msg.data.meta.name') },
'meta[name^=DC][name$=contributor]': {content: $t('msg.data.meta.name') },
'meta[name^=DC][name$=language]': {content: $t('lang') },
'meta[name^=DC][name$=subject]': {content: $t('msg.meta.keywords') },
'meta[name^=DC][name$=rights]': {content: $t('msg.meta.license') },
'meta[name^=DC][name$=description]': {content: $t('msg.meta.desc') },
......
#carousel-actus {
.containerActu {
.carousel {
margin:1em;
margin: 1em;
a {
border-bottom: none;
}
img {
width:100%;
margin:0;
width: 100%;
margin: 0;
}
}
.carousel-inner {
padding-bottom:75px;
padding-bottom: 75px;
box-shadow: $carousel-ombre;
}
......@@ -24,8 +24,8 @@
#play-pause {
position: absolute;
margin-top: -100px;
margin-left:30px;
margin-top: -110px;
margin-left: 60px;
left: 0%;
button {
......@@ -39,8 +39,8 @@
height: 40px;
padding-left: 4px;
padding-top: 0px;
position:absolute;
opacity:1;
position: absolute;
opacity: 1;
text-shadow:none;
box-shadow: $button-ombre;
border-color: transparent;
......@@ -51,15 +51,19 @@
}
}
.carousel-caption{
.carousel-caption {
background: #f3f3f3;
bottom:-75px;
color: #333;
left:0;
right:0;
position:absolute;
height:78px ;
text-shadow:none;
border-top:1px solid #ddd;
left: 0;
right: 0;
position: absolute;
height: 78px ;
text-shadow: none;
border-top: 1px solid #ddd;
h4 {
border: none;
}
}
}
<template lang="html">
<template>
<div id="home">
<div class="container ombre" id="topPgAccueil">
......@@ -8,7 +8,7 @@
<div class="col-md-8">
<div class="row">
<figure id="pingouinVolant" class="pull-right" >
<img :src="image.pinchot" alt="" />
<img :src="$t('baseImg') + 'pingouinVolantRefait.png'" alt="" />
</figure>
<ul class="accroche" v-html="$t('msg.pages.accroche')"></ul>
......@@ -57,7 +57,7 @@
<h4 class="titreFramaTrucs">
<a
:href="`#topPg${titre}`"
:class="section.color">{{ section.title }}</a>
:class="$t('data.cat.' + titre + '.color')">{{ section.title }}</a>
</h4>
<div class="row">
<ul class="listeFramaTrucs col-md-12">
......@@ -69,15 +69,9 @@
:class="hideRepeat(index, tradEntries(section.sites))"
>{{ frama.what }}</span>
<a
:href="frama.link"
:href="$t('data.cat.' + titre + '.sites.' + key + '.link')"
:class="section.color">&nbsp;&nbsp;
<span>
<b
v-for="(part, color) in frama.name"
:key="color"
:class="color"
>{{ part }}</b>
</span>
<span v-html="$t('data.cat.' + titre + '.sites.' + key + '.name')"></span>
</a>
</li>
</ul>
......@@ -106,7 +100,7 @@
<div class="row partenaires" id="contentCommunaute">
<div class="col-md-4 blocCommunaute" >
<img :src="image.team1" class="img-responsive" alt="" />
<img :src="$t('baseImg') + 'framateam1.jpg'" class="img-responsive" alt="" />
</div>
<div class="col-md-4 blocCommunaute">
......@@ -134,13 +128,17 @@
</div>
<div class="col-md-4 blocCommunaute">
<img :src="image.team2" class="img-responsive" alt="" />
<img :src="$t('baseImg') + 'framateam2.jpg'" class="img-responsive" alt="" />
</div>
<div class="col-md-12 blocCommunaute partenaires">
<h4 class="titreBloc">{{ $t('msg.pages.partenaires.title') }}</h4>
<p class="miniBlocTexte" v-html="$t('msg.pages.partenaires.desc')"></p>
<ul class="list-inline text-center" v-html="$t('msg.pages.partenaires.text')"></ul>
<ul class="list-inline text-center">
<li><a href="http://milliweb.fr/"><img src="https://soutenir.framasoft.org/sites/default/files/partenaires/logoMilliweb_150.png" alt="Milliweb"></a></li>
<li><a href="https://www.flexilivre.com/"><img src="https://soutenir.framasoft.org/sites/default/files/flexilivre.png" alt="FlexiLivre"></a></li>
<li><a href="http://linphone.org/"><img src="https://soutenir.framasoft.org/sites/default/files/belledonne2.png" alt="Belledonne Communication"></a></li>
</ul>
</div>
</div>
......@@ -173,17 +171,15 @@
<div class="col-md-4">
<figure id="pingouinMuseeWindows">
<img :src="image.musee" alt="" />
<img :src="$t('baseImg') + 'musee-windows_ll-de-mars_licence-art-libre.jpg'" alt="" />
</figure>
</div>
</div>
<div class="row">
<div class="col-md-3 miniBloc" v-for="(frama, index) in $t('msg.cat.logiciel.sites')">
<a :href="frama.link">
<h4 class="bleu">
<b :key="color" :class="color" v-for="(part, color) in frama.name">{{ part }}</b>
</h4>
<a :href="$t(`data.cat.logiciel.sites.${index}.link`)">
<h4 class="bleu" v-html="$t(`data.cat.logiciel.sites.${index}.name`)"></h4>
</a>
<p class="miniBlocSubTitle" v-bind:class="frama.icon" v-html="frama.title"></p>
<p class="miniBlocTexte" v-html="frama.desc"></p>
......@@ -220,7 +216,7 @@
<div class="row col-md-12">
<figure id="pingouinsQuelquesBriques">
<img :src="image.briques" alt="" />
<img :src="$t('baseImg') + 'quelques-briques_licence-art-libre.jpg'" alt="" />
</figure>
</div>
......@@ -234,10 +230,8 @@
<div class="col-md-6">
<div class="row">
<div class="col-md-6 miniBloc2" v-for="(frama, index) in $t('msg.cat.culture.sites')">
<a :href="frama.link">
<h4 class="rouge">
<b :key="color" :class="color" v-for="(part, color) in frama.name">{{ part }}</b>
</h4>
<a :href="$t(`data.cat.culture.sites.${index}.link`)">
<h4 class="rouge" v-html="$t(`data.cat.culture.sites.${index}.name`)"></h4>
</a>
<p class="miniBlocSubTitle" v-bind:class="frama.icon" v-html="frama.title"></p>
<p class="miniBlocTexte" v-html="frama.desc"></p>
......@@ -281,9 +275,7 @@
<ImageServiceBlock
v-if="['bee', 'bag', 'drop', 'site'].includes(index)"
:image="beforeImage(index)" />
<ServiceBlock
:frama="frama"
:index="index" />
<ServiceBlock :index="index" />
</div>
</div>
</div>
......@@ -319,7 +311,7 @@
<h4 class="titreBloc">{{ $t('msg.pages.vrac.une.title') }}</h4>
<p class="miniBlocSubTitle">{{ $t('msg.pages.vrac.une.desc') }}</p>
<figure id="GeGeGenerator">
<a href="" ><img :src="image.gege" :alt="$t('msg.pages.vrac.une.desc')" /></a>
<a href="https://framalab.org/gknd-creator/"><img :src="$t('baseImg') + 'GeGeGenerator.jpg'" :alt="$t('msg.pages.vrac.une.desc')" /></a>
</figure>
<p class="legende">{{ $t('msg.pages.vrac.une.desc') }}</p>
</div>
......@@ -332,10 +324,8 @@
:key="index"
class="col-md-4 miniBloc"
>
<a :href="frama.link">
<h4 class="jaune">
<b :key="color" :class="color" v-for="(part, color) in frama.name">{{ part }}</b>
</h4>
<a :href="$t(`data.cat.vrac.sites.${index}.link`)">
<h4 class="jaune" v-html="$t(`data.cat.vrac.sites.${index}.name`)"></h4>
</a>
<p class="miniBlocSubTitle" :class="frama.icon" v-html="frama.title"></p>
<p class="miniBlocTexte" v-html="frama.desc"></p>
......@@ -370,8 +360,7 @@ export default {
Search,
},
data() {
const { lang } = document.getElementsByTagName('html')[0];
const base = (window.location.href.split('/')[3] !== lang) ? `/${window.location.href.split('/')[3]}` : '';
console.log(this.$i18n.locale); // eslint-disable-line
return {
service2image: {
bee: 'stallmanoramix',
......@@ -380,32 +369,26 @@ export default {
site: 'fight',
},
image: {
pinchot: `${base}/img/pingouinVolantRefait.png`,
team1: `${base}/img/framateam1.jpg`,
team2: `${base}/img/framateam2.jpg`,
musee: `${base}/img/musee-windows_ll-de-mars_licence-art-libre.jpg`,
briques: `${base}/img/quelques-briques_licence-art-libre.jpg`,
gege: `${base}/img/GeGeGenerator.jpg`,
stallmanoramix: {
src: `${base}/img/stallmanoramix.png`,
src: 'stallmanoramix.png',
link: 'https://degooglisons-internet.org',
width: '6',
alt: '',
},
village: {
src: `${base}/img/village.png`,
src: 'village.png',
link: 'https://degooglisons-internet.org',
width: '6',
alt: '',
},
fight: {
src: `${base}/img/fight.png`,
src: 'fight.png',
link: 'https://degooglisons-internet.org',
width: '6',
alt: '',
},
carte: {
src: `${base}/img/carte_petite.png`,
src: 'carte_petite.png',
link: 'https://degooglisons-internet.org',
width: '3',
alt: '',
......@@ -434,16 +417,9 @@ export default {
},
},
};
// document.addEventListener('DOMContentLoaded', () => {
// document.querySelector('#f-bee').before(document.querySelector('#stallmanoramix'));
// document.querySelector('#f-bag').before(document.querySelector('#village'));
// document.querySelector('#f-drop').before(document.querySelector('#carte'));
// document.querySelector('#f-site').before(document.querySelector('#fight'));
// });
</script>
<style>
.clearBoth{
clear: both;
}
.clearBoth{
clear: both;
}
</style>
<template lang="html">
<template>
<div id="lite">
<div class="container ombre" id="topPgAccueil">
......@@ -21,12 +21,11 @@
<ul class="list-inline">
<li class="col-xs-4 col-sm-3 text-center"
v-for="(frama, index) in $t('msg.cat.cloud.sites')">
<a :href="frama.link" class="btn btn-lg btn-block btn-default"
<a :href="$t('data.cat.cloud.sites.' + index + '.link')" class="btn btn-lg btn-block btn-default"
:title="frama.title" >
<i :class="`fa fa-3x fa-fw ${frama.icon}`"></i>
<br/><span>
<b :key="color" :class="color" v-for="(part, color) in frama.name">{{ part }}</b>
</span>
<i :class="`fa fa-3x fa-fw ${$t('data.cat.cloud.sites.' + index + '.icon')}`"></i>
<br/>
<span v-html="$t('data.cat.cloud.sites.' + index + '.name')"></span>
</a>
</li>
</ul>
......@@ -36,13 +35,11 @@
<ul class="list-inline">
<li class="col-xs-4 col-sm-3 text-center"
v-for="(frama, index) in $t('msg.cat.logiciel.sites')">
<a :href="frama.link" class="btn btn-lg btn-block btn-default"
<a :href="$t('data.cat.logiciel.sites.' + index + '.link')" class="btn btn-lg btn-block btn-default"
:title="frama.title" >
<i :class="('fa fa-3x fa-fw ' + frama.icon )"></i>
<i :class="`fa fa-3x fa-fw ${$t('data.cat.logiciel.sites.' + index + '.icon')}`"></i>
<br/>
<span>
<b :key="color" :class="color" v-for="(part, color) in frama.name">{{ part }}</b>
</span>
<span v-html="$t('data.cat.logiciel.sites.' + index + '.name')"></span>
</a>
</li>
</ul>
......@@ -52,13 +49,11 @@
<ul class="list-inline">
<li class="col-xs-4 col-sm-3 text-center"
v-for="(frama, index) in $t('msg.cat.culture.sites')">
<a :href="frama.link" class="btn btn-lg btn-block btn-default"
<a :href="$t('data.cat.culture.sites.' + index + '.link')" class="btn btn-lg btn-block btn-default"
:title="frama.title" >
<i :class="('fa fa-3x fa-fw ' + frama.icon )"></i>
<i :class="`fa fa-3x fa-fw ${$t('data.cat.culture.sites.' + index + '.icon')}`"></i>
<br/>
<span>
<b :key="color" :class="color" v-for="(part, color) in frama.name">{{ part }}</b>
</span>
<span v-html="$t('data.cat.culture.sites.' + index + '.name')"></span>
</a>
</li>
</ul>
......@@ -68,13 +63,11 @@
<ul class="list-inline">
<li class="col-xs-4 col-sm-3 text-center"
v-for="(frama, index) in $t('msg.cat.vrac.sites')">
<a :href="frama.link" class="btn btn-lg btn-block btn-default"
<a :href="$t('data.cat.vrac.sites.' + index + '.link')" class="btn btn-lg btn-block btn-default"
:title="frama.title" >
<i :class="('fa fa-3x fa-fw ' + frama.icon )"></i>
<i :class="`fa fa-3x fa-fw ${$t('data.cat.vrac.sites.' + index + '.icon')}`"></i>
<br/>
<span>
<b :key="color" :class="color" v-for="(part, color) in frama.name">{{ part }}</b>
</span>
<span v-html="$t('data.cat.vrac.sites.' + index + '.name')"></span>
</a>
</li>
</ul>
......@@ -83,7 +76,7 @@
<hr class="trait" role="presentation" style="margin-left:-15px; margin-right:-15px">
<div class="row">
<div class="col-xs-12">
<div class="col-xs-12 containerActu">
<h3 id="news">{{ $t('msg.pages.news') }}</h3>
<Carousel/>
</div>
......
<template lang="html">
<carousel
ref="carousel"
:indicators="false"
>
<slide
v-for="(slide, index) in slides"
:key="index">
<a
:href="slide.src"
>
<img :src="slide.img" />
</a>
<div class="carousel-caption">
<h4>{{ slide.title }}</h4>
</div>
</slide>
</carousel>
<template>
<div id="carousel">
<carousel :indicators="false" :controls="true" :interval="interval" ref="carousel">
<slide
v-for="(slide, index) in slides"
:key="index">
<a :href="slide.link" >
<img :src="slide.img" />
</a>
<div class="carousel-caption">
<h4>{{ slide.title }}</h4>
</div>
</slide>
</carousel>
<!-- <p class="text-center" id="play-pause" v-if="interval === 5000">
<button class="carousel-control" :title="$t('msg.carousel.pause')"
@click="play=0">
<i class="glyphicon glyphicon-pause" aria-hidden="true"></i>
<span class="sr-only">{{ $t('msg.carousel.pause') }}</span>
</button>
</p>
<p class="text-center" id="play-pause" v-else>
<button class="carousel-control" :title="$t('msg.carousel.play')"
@click="interval=5000">
<i class="glyphicon glyphicon-play" aria-hidden="true"></i>
<span class="sr-only">{{ $t('msg.carousel.play') }}</span>
</button>
</p> -->
</div>
</template>
<script>
......@@ -26,16 +37,14 @@ export default {
Carousel, Slide,
},
data() {
const { lang } = document.getElementsByTagName('html')[0];
const base = (window.location.href.split('/')[3] !== lang) ? `/${window.location.href.split('/')[3]}` : '';
return {
playPause: 'pause',
interval: 5000,
// Slides are loaded from https://rss.framasoft.org/carousel/carousel.json
slides: [
{
link: 'https://…',
title: '',
img: `${base}/img/…`,
img: '',
},
],
};
......@@ -44,23 +53,6 @@ export default {
this.loadSlides();
},
methods: {
/**
* Le composant Carousel de uiv ne permet pas *facilement* d'intégrer le bouton play/pause
*/
// togglePlayPause() {
// if (this.playPause === 'play') {
// $(document).ready(() => {
// $('#carousel-actus').carousel('cycle');
// });
// this.playPause = 'pause';
// } else {
// $(document).ready(() => {
// $('#carousel-actus').carousel('pause');
// });
// this.playPause = 'play';
// }
// return this.playPause;
// },
loadSlides() {
fetch('https://rss.framasoft.org/carousel/carousel.json').then(response => response.json()).then((data) => {
this.slides = data.slides;
......
<template lang="html">
<template>
<div id="framaheader" class="clearfix header">
<div class="col-md-4">
<h1 id="framasoft" class="sitename"">
<a :href="$t('msg.meta.baseURL')">
<b :key="color" :class="color" v-for="(part, color) in $t('msg.meta.framaname')">{{ part }}</b>
<a :href="`${$t('base')}${$t('lang')}/`" v-html="$t('data.meta.framaname')">
</a>
</h1>
</div>
......
<template lang="html">
<template>
<div class="pull-right">
<router-link :to="'/' + this.$i18n.locale + '/lite'" class="btn btn-default" :title="$t('msg.lite')">
<i class="fa fa-lg fa-th-large" aria-hidden="true"></i>
......
......@@ -4,7 +4,7 @@
:class="`col-md-${image.width} miniBloc`">
<a :href="image.link">
<img
:src="image.src"
:src="`${$t('baseImg')}${image.src}`"
:alt="image.alt"
class="img-responsive" />
</a>
......
<template lang="html">
<template>
<div class="row finPseudoPage">
<div class="col-md-2">
<ul class="navEntities2">
......
<template lang="html">
<template>
<ul class="row navEntities">
<li
v-for="(part, key) in $t('msg.nav.parts')"
......
<template lang="html">
<template>
<form method="post" id="search" action="https://framabee.org">
<div class="input-group input-group-lg">
<input type="search" name="q" class="form-control">
......
<template>
<div :class="`col-md-${serviceWidth(index)} miniBloc ${clearBoth(index)}`">
<a :href="frama.link">
<h4 class="vert">
<b
v-for="(part, color) in frama.name"
:key="color"
:class="color">{{ part }}</b>
</h4>
<a :href="$t(`data.cat.cloud.sites.${index}.link`)">
<h4 class="vert" v-html="$t(`data.cat.cloud.sites.${index}.name`)"></h4>
</a>
<p
:class="`miniBlocSubTitle ${frama.icon}`"
v-html="frama.title"></p>
:class="`miniBlocSubTitle ${$t('data.cat.cloud.sites.' + index + '.icon')}`"
v-html="$t(`msg.cat.cloud.sites.${index}.title`)"></p>
<p
class="miniBlocTexte"
v-html="frama.desc"></p>
v-html="$t(`msg.cat.cloud.sites.${index}.desc`)"></p>
</div>
</template>
<script>
export default {
name: 'ServiceBlock',
props: {
frama: {
type: Object,
required: true,
},
index: {
type: Number,
type: String,
required: true,
},
},
......
lite: Accès rapide
full: Accès classique
home: Accueil
meta:
name: Framasoft
baseURL: https://framasoft.org