kompot
/
publiccode.si
5
3
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'feature/share-links' of pmpc/website into master

lektura
Max Mehl 2017-05-25 22:09:05 +00:00 committed by Gogs
parent 38a8225b15 1c1957fee6
commit 0d253ed744
21 changed files with 424 additions and 175 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
data/de/share/1-diaspora.yaml
View File

@ -2,4 +2,4 @@ id: diaspora
name: Diaspora
titleBefore: Auf
titleAfter: teilen
link: https://test.fsfe.org/cgi-bin/share.php?service=diaspora&ref=pmpc&url=https://publicmoneypubliccode.org&title=Public%20Money%3F%20Public%20Code!%20%23pmpc
userinput: true

2
data/de/share/2-gnusocial.yaml
View File

@ -2,4 +2,4 @@ id: gnusocial
name: GNU Social
titleBefore: Auf
titleAfter: teilen
link: https://test.fsfe.org/cgi-bin/share.php?service=gnusocial&ref=pmpc&url=https://publicmoneypubliccode.org&title=Public%20Money%3F%20Public%20Code!%20%23pmpc
userinput: true

1
data/de/share/3-reddit.yaml
View File

@ -2,4 +2,3 @@ id: reddit
name: Reddit
titleBefore: Auf
titleAfter: teilen
link: https://test.fsfe.org/cgi-bin/share.php?service=reddit&ref=pmpc&url=https://publicmoneypubliccode.org&title=Public%20Money%3F%20Public%20Code!%20%23pmpc

1
data/de/share/4-twitter.yaml
View File

@ -2,4 +2,3 @@ id: twitter
name: Twitter
titleBefore: Auf
titleAfter: teilen
link: https://test.fsfe.org/cgi-bin/share.php?service=twitter&ref=pmpc&url=https://publicmoneypubliccode.org&title=Public%20Money%3F%20Public%20Code!%20%23pmpc

1
data/de/share/5-gplus.yaml
View File

@ -2,4 +2,3 @@ id: gplus
name: Google+
titleBefore: Auf
titleAfter: teilen
link: https://test.fsfe.org/cgi-bin/share.php?service=gplus&ref=pmpc&url=https://publicmoneypubliccode.org&title=Public%20Money%3F%20Public%20Code!%20%23pmpc

1
data/de/share/6-facebook.yaml
View File

@ -2,4 +2,3 @@ id: facebook
name: Facebook
titleBefore: Auf
titleAfter: teilen
link: https://test.fsfe.org/cgi-bin/share.php?service=facebook&ref=pmpc&url=https://publicmoneypubliccode.org&title=Public%20Money%3F%20Public%20Code!%20%23pmpc

1
data/de/share/7-support.yaml
View File

@ -2,4 +2,3 @@ id: support
name: Kampagne unterstützen!
titleBefore:
titleAfter:
link: https://fsfe.org/donate?pmpc

2
data/en/share/1-diaspora.yaml
View File

@ -2,4 +2,4 @@ id: diaspora
name: Diaspora
titleBefore: Share on
titleAfter:
link: https://test.fsfe.org/cgi-bin/share.php?service=diaspora&ref=pmpc&url=https://publicmoneypubliccode.org&title=Public%20Money%3F%20Public%20Code!%20%23pmpc
userinput: true

2
data/en/share/2-gnusocial.yaml
View File

@ -2,4 +2,4 @@ id: gnusocial
name: GNU Social
titleBefore: Share on
titleAfter:
link: https://test.fsfe.org/cgi-bin/share.php?service=gnusocial&ref=pmpc&url=https://publicmoneypubliccode.org&title=Public%20Money%3F%20Public%20Code!%20%23pmpc
userinput: true

1
data/en/share/3-reddit.yaml
View File

@ -2,4 +2,3 @@ id: reddit
name: Reddit
titleBefore: Share on
titleAfter:
link: https://test.fsfe.org/cgi-bin/share.php?service=reddit&ref=pmpc&url=https://publicmoneypubliccode.org&title=Public%20Money%3F%20Public%20Code!%20%23pmpc

1
data/en/share/4-twitter.yaml
View File

@ -2,4 +2,3 @@ id: twitter
name: Twitter
titleBefore: Share on
titleAfter:
link: https://test.fsfe.org/cgi-bin/share.php?service=twitter&ref=pmpc&url=https://publicmoneypubliccode.org&title=Public%20Money%3F%20Public%20Code!%20%23pmpc

1
data/en/share/5-gplus.yaml
View File

@ -2,4 +2,3 @@ id: gplus
name: Google+
titleBefore: Share on
titleAfter:
link: https://test.fsfe.org/cgi-bin/share.php?service=gplus&ref=pmpc&url=https://publicmoneypubliccode.org&title=Public%20Money%3F%20Public%20Code!%20%23pmpc

1
data/en/share/6-facebook.yaml
View File

@ -2,4 +2,3 @@ id: facebook
name: Facebook
titleBefore: Share on
titleAfter:
link: https://test.fsfe.org/cgi-bin/share.php?service=facebook&ref=pmpc&url=https://publicmoneypubliccode.org&title=Public%20Money%3F%20Public%20Code!%20%23pmpc

1
data/en/share/7-support.yaml
View File

@ -2,4 +2,3 @@ id: support
name: Support the Campaign!
titleBefore:
titleAfter:
link: https://fsfe.org/donate?pmpc

2
layouts/partials/head.html
View File

@ -22,6 +22,8 @@
{{ "<!-- Custom CSS -->" | safeHTML }}
<link rel="stylesheet" href="{{ "css/creative.css" | absURL }}" type="text/css">
<link rel="stylesheet" href="{{ "css/custom.css" | absURL }}" type="text/css">
<link rel="stylesheet" href="{{ "css/buttons-spread.css" | absURL }}" type="text/css">
<link rel="stylesheet" href="{{ "css/buttons-side.css" | absURL }}" type="text/css">
<link rel="stylesheet" href="{{ "css/modals.css" | absURL }}" type="text/css">
{{ "<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->" | safeHTML }}

30
layouts/partials/sharecolumn.html
View File

@ -1,7 +1,31 @@
{{ "<!-- SHARE COLUMN -->" | safeHTML }}
{{ $data := index .Site.Data .Site.Language.Lang }}
<aside class="sharecolumn">
<div class="sharecolumn">
<form action="/cgi/share.php" method="GET" class="share-buttons side" target="_blank">
<input name="popup" id="no-share-popup-side" type="radio" />
<input name="ref" value="pmpc-side" type="hidden" />
<input name="url" value="{{ .Site.Params.url }}#TEST" type="hidden" /> <!-- replace with your URL -->
<input name="title" value="Public Money, Public Code!" type="hidden" /> <!-- replace with site/share title -->
<input class="n" name="website" placeholder="Please do not put anything here" /> <!-- stupid bot detection -->
{{ range $data.share }}
<a id="{{ .id }}-left" href="{{ .link }}" title="{{ .titleBefore}} {{ .name }} {{ .titleAfter }}" target="_blank">&nbsp;</a>
{{ if eq .userinput true }}
<label class="button share-{{ .id }}" title="{{ .titleBefore}} {{ .name }} {{ .titleAfter }}" for="{{ .id }}-share-side">&nbsp;</label>
<input name="popup" id="{{ .id }}-share-side" type="radio" />
<span class="popup {{ .id }}">
<label for="no-share-popup-side"></label>
<input name="{{ .id }}pod" value="" placeholder="{{ .name }} URL ({{ .id }}.tld)" type="text" />
<button type="submit" name="service" value="{{ .id }}">OK</button>
</span>
{{ end }}
{{ end }}
</aside>
{{ range $data.share }}
{{ if ne .userinput true }}
<button type="submit" name="service" value="{{ .id }}" class="button share-{{ .id }}" title="{{ .titleBefore}} {{ .name }} {{ .titleAfter }}">&nbsp;</button>
{{ end }}
{{ end }}
</form>
</div>

27
layouts/partials/spread.html
View File

@ -18,9 +18,36 @@
<div class="share-buttons">
{{ .Site.Params.spread.shareTitle }}
<!--
{{ range $data.share }}
<a id="{{ .id }}" href="{{ .link }}" title="{{ .titleBefore}} {{ .name }} {{ .titleAfter }}" target="_blank">{{ .name }}</a>
{{ end }}
-->
<form action="/cgi/share.php" method="GET" class="share-buttons spread" target="_blank">
<input name="popup" id="no-share-popup-spread" type="radio" />
<input name="ref" value="pmpc-spread" type="hidden" />
<input name="url" value="{{ .Site.Params.url }}#TEST" type="hidden" />
<input name="title" value="Public Money, Public Code!" type="hidden" />
<input class="n" name="website" placeholder="Please do not put anything here" />
{{ range $data.share }}
{{ if eq .userinput true }}
<label class="button share-{{ .id }}" title="{{ .titleBefore}} {{ .name }} {{ .titleAfter }}" for="{{ .id }}-share-spread">{{ .name }}</label>
<input name="popup" id="{{ .id }}-share-spread" type="radio" />
<span class="popup {{ .id }}">
<label for="no-share-popup-spread"></label>
<input name="{{ .id }}pod" value="" placeholder="{{ .name }} URL ({{ .id }}.tld)" type="text" />
<button type="submit" name="service" value="{{ .id }}">OK</button>
</span>
{{ end }}
{{ end }}
{{ range $data.share }}
{{ if ne .userinput true }}
<button type="submit" name="service" value="{{ .id }}" class="button share-{{ .id }}" title="{{ .titleBefore}} {{ .name }} {{ .titleAfter }}">{{ .name }}</button>
{{ end }}
{{ end }}
</form>
</div>
</div>
</div>

70
static/cgi/share.php 100644
View File

@ -0,0 +1,70 @@
<?php
// Change these variables
$gnusocialuser = "fsfe@quitter.no";
$twitteruser = "fsfe";
$flattruser = "fsfe";
$supporturl = "https://fsfe.org/donate?pmpc";
// Don't change below here
$service = isset($_GET['service']) ? $_GET['service'] : false;
$url = isset($_GET['url']) ? $_GET['url'] : false;
$title = isset($_GET['title']) ? $_GET['title'] : false;
$diasporapod = isset($_GET['diasporapod']) ? $_GET['diasporapod'] : false;
$gnusocialpod = isset($_GET['gnusocialpod']) ? $_GET['gnusocialpod'] : false;
if(empty($service) || empty($url)) {
echo 'At least one required variable is empty. You have to define at least service and url';
}
else {
$service = htmlspecialchars($service);
$diasporapod = htmlspecialchars($diasporapod);
$gnusocialpod = htmlspecialchars($gnusocialpod);
$url = urlencode(htmlspecialchars($url));
$title = urlencode(htmlspecialchars($title));
if ($service === "diaspora") {
$diasporapod = validateurl($diasporapod);
echo $diasporapod;
header("Location: " . $diasporapod . "/bookmarklet?url=" . $url . "&title=" . $title);
die();
} elseif($service === "gnusocial") {
$gnusocialpod = validateurl($gnusocialpod);
header("Location: " . $gnusocialpod . "/notice/new?status_textarea=" . $title . " " . $url . " via " . $gnusocialuser);
die();
} elseif($service === "reddit") {
header("Location: https://reddit.com/submit?url=" . $url . "&title=" . $title);
die();
} elseif($service === "flattr") {
header("Location: https://flattr.com/submit/auto?user_id=" . $flattruser . "&url=" . $url . "&title=" . $title);
die();
} elseif($service === "hnews") {
header("Location: https://news.ycombinator.com/submitlink?u=" . $url . "&t=" . $title);
die();
} elseif($service === "twitter") {
header("Location: https://twitter.com/share?url=" . $url . "&text=" . $title . "&via=" . $twitteruser);
die();
} elseif($service === "facebook") {
header("Location: https://www.facebook.com/sharer/sharer.php?u=" . $url);
die();
} elseif($service === "gplus") {
header("Location: https://plus.google.com/share?url=" . $url);
die();
} elseif($service === "support") {
header("Location: " . $supporturl);
die();
} else {
echo 'Social network unknown.';
}
}
// If diaspora/GS pod has been typed without http(s):// prefix, add it
function validateurl($url) {
if (preg_match('#^https?://#i', $url) === 0) {
return 'https://' . $url;
} else {
return $url;
}
}
?>

134
static/css/buttons-side.css 100644
View File

@ -0,0 +1,134 @@
div.sharecolumn .share-buttons.side {
display: flex;
left: 0;
padding: 0.1vh 0.5vh;
position: fixed;
top: 35%;
z-index: 10;
flex-direction: column;
}
@media(max-width:767px) {
.share-buttons.side {
display: none !important;
}
}
.share-buttons.side button.button,
.share-buttons.side label.button {
background-position: center center;
background-repeat: no-repeat;
background-size: 2.7vh auto;
background-color: #474747;
border-radius: 3px;
border: none;
color: #000;
display: inline-block;
margin: 2.5px 5px 2.5px 0;
opacity: 0.9;
text-decoration: none;
height: 4vh;
width: 4vh;
cursor: pointer;
}
/* Single services with their colours and logos */
.share-buttons.side button:hover, .share-buttons.side label:hover {
background-color: #F05F40;
}
.share-buttons.side .share-diaspora {
background-image: url("/img/share/diaspora_white.png");
}
.share-buttons.side .share-gnusocial {
background-image: url("/img/share/gnusocial_white.png");
}
.share-buttons.side .share-reddit {
background-image: url("/img/share/reddit_white.png");
}
.share-buttons.side .share-flattr {
background-image: url("/img/share/flattr_white.png");
display: none !important;
}
.share-buttons.side .share-hnews {
background-image: url("/img/share/hackernews_white.png");
display: none !important;
}
.share-buttons.side .share-twitter {
background-image: url("/img/share/twitter_white.png");
}
.share-buttons.side .share-facebook {
background-image: url("/img/share/facebook_white.png");
}
.share-buttons.side .share-gplus {
background-image: url("/img/share/gplus_white.png");
display: none !important;
}
.share-buttons.side .share-support {
background-image: url("/img/share/support_red.png");
}
/* Share pop-up behaviour hacks */
.share-buttons.side input[type="radio"],
.share-buttons.side input[type="radio"] + span,
.share-buttons.side input[type="checkbox"],
.share-buttons.side input[type="checkbox"] + span {
display: none;
}
.share-buttons.side input[type="radio"]:checked + span,
.share-buttons.side input[type="checkbox"]:checked + span {
position: absolute;
margin-top: 3.5em; margin-left: 0;
width: 300px;
padding: .5em;
z-index: 3;
background-color: #333;
border-radius: .5em;
display: inline-block;
}
.share-buttons.side input[type="radio"]:checked + span:before,
.share-buttons.side input[type="checkbox"]:checked + span:before {
content: '';
position: absolute;
top: -1em;
height: 0em; width: 0em;
border-bottom: 1em solid #333;
border-left: 1em solid transparent;
border-right: 1em solid transparent;
z-index: 3;
}
.share-buttons.side input[type="radio"] + span > *{
vertical-align: middle;
}
.share-buttons.side input[type="radio"] + span > button {
margin: 2.5px 0 2.5px 5px;
min-width: 4em;
padding: .25em;
font-weight: normal;
font-size: 1em;
line-height: normal;
}
.share-buttons.side input[type="radio"] + span > label {
position: fixed;
top: 0; left: 0; right: 0; bottom: 0;
z-index: -1;
background-color: rgba(0, 0, 0, .5);
}
/* Separate share buttons form from possibly floating content */
form.share-buttons.side {
clear: both;
}
/* Hide something */
.n {
display: none;
}
/* Media Query to resize social links for portrait tablet view */
@media screen and (max-height: 770px) {
.share-buttons.side button.button,
.share-buttons.side label.button {
background-size: 3.7vh auto;
height: 6vh;
width: 6vh;
}
}

160
static/css/buttons-spread.css 100644
View File

@ -0,0 +1,160 @@
/* General button look */
.share-buttons.spread {
color: initial;
}
.share-buttons.spread button.button,
.share-buttons.spread label.button {
display: inline-block;
margin: 0px 5px 10px 0;
color: #fff;
font-weight: 700;
font-size: 1em;
font-family: "Open Sans","Helvetica Neue",Arial,sans-serif;
line-height: normal;
text-align: center;
text-decoration: none;
padding: 7px 7px 7px 20px;
min-width: 120px;
box-sizing: border-box;
display: inline-block;
border: none;
border-radius: 3px;
background-position: left 5px center;
background-repeat: no-repeat;
background-size: 20px auto;
opacity: 0.9;
vertical-align: top;
line-height: 1.2em;
}
/* Single services with their colours and logos */
.share-buttons.spread .share-diaspora {
background-color: #404040;
background-image: url("/img/share/diaspora_white.png");
}
.share-buttons.spread .share-diaspora:hover {
background-color: #101010 !important;
}
.share-buttons.spread .share-gnusocial {
background-color: #a22430;
background-image: url("/img/share/gnusocial_white.png");
}
.share-buttons.spread .share-gnusocial:hover {
background-color: #850713 !important;
}
.share-buttons.spread .share-reddit {
background-color: #ff5700;
background-image: url("/img/share/reddit_white.png");
}
.share-buttons.spread .share-reddit:hover {
background-color: #dd3500 !important;
}
.share-buttons.spread .share-flattr {
background-color: #7ea352;
background-image: url("/img/share/flattr_white.png");
display: none !important;
}
.share-buttons.spread .share-flattr:hover {
background-color: #5a7f2e !important;
}
.share-buttons.spread .share-hnews {
background-color: #ff6600;
background-image: url("/img/share/hackernews_white.png");
display: none !important;
}
.share-buttons.spread .share-hnews:hover {
background-color: #dd3500 !important;
}
.share-buttons.spread .share-twitter {
background-color: #55acee;
background-image: url("/img/share/twitter_white.png");
}
.share-buttons.spread .share-twitter:hover {
background-color: #338acc !important;
}
.share-buttons.spread .share-facebook {
background-color: #3b5998;
background-image: url("/img/share/facebook_white.png");
}
.share-buttons.spread .share-facebook:hover {
background-color: #143271 !important;
}
.share-buttons.spread .share-gplus {
background-color: #d34836;
background-image: url("/img/share/gplus_white.png");
display: none !important;
}
.share-buttons.spread .share-gplus:hover {
background-color: #b12614 !important;
}
.share-buttons.spread .share-support {
background-color: #47a447;
background-image: url("/img/share/support_red.png");
}
.share-buttons.spread .share-support:hover {
background-color: #2a872a !important;
}
.share-buttons.spread .share-support {
padding-left: 30px !important;
}
/* Share pop-up behaviour hacks */
.share-buttons.spread input[type="radio"],
.share-buttons.spread input[type="radio"] + span,
.share-buttons.spread input[type="checkbox"],
.share-buttons.spread input[type="checkbox"] + span {
display: none;
}
.share-buttons.spread input[type="radio"]:checked + span,
.share-buttons.spread input[type="checkbox"]:checked + span {
position: absolute;
margin-top: 3.5em; margin-left: -10em;
padding: .5em;
z-index: 3;
background-color: #333;
border-radius: .5em;
display: inline-block;
}
.share-buttons.spread input[type="radio"]:checked + span:before,
.share-buttons.spread input[type="checkbox"]:checked + span:before {
content: '';
position: absolute;
top: -1em;
height: 0em; width: 0em;
border-bottom: 1em solid #333;
border-left: 1em solid transparent;
border-right: 1em solid transparent;
z-index: 3;
}
.share-buttons.spread input[type="radio"] + span > * {
vertical-align: middle;
}
.share-buttons.spread input[type="radio"] + span > button {
margin: 2.5px 0 2.5px 5px;
min-width: 4em;
padding: .25em;
font-weight: normal;
font-size: 1em;
line-height: normal;
}
.share-buttons.spread input[type="radio"] + span > label {
position: fixed;
top: 0; left: 0; right: 0; bottom: 0;
z-index: -1;
background-color: rgba(0, 0, 0, .5);
}
/* Separate share buttons form from possibly floating content */
form.share-buttons.spread {
clear: both;
}
/* Hide something */
.n {
display: none;
}
/* Reset colour */
.share-buttons.spread span label, .share-buttons.spread > span > button {
color: normal;
}

158
static/css/custom.css
View File

@ -100,161 +100,3 @@ table.signatures th, table.signatures td {
text-align: left;
padding: 2px;
}
/* SHARE BUTTONS IN "SPREAD THE WORD" SECTION */
.share-buttons a {
background-position: left 5px center;
background-repeat: no-repeat;
background-size: 20px auto;
border-radius: 3px;
color: #000;
display: inline-block;
margin: 2.5px 5px 2.5px 0;
min-width: 120px;
opacity: 0.9;
padding: 7px 7px 7px 30px;
text-align: center;
text-decoration: none;
font-family: "Open Sans","Helvetica Neue",Arial,sans-serif;
font-weight: 700;
}
.share-buttons a#facebook {
background-color: #3b5998;
background-image: url("/img/share/facebook_white.png");
color: #fff;
}
.share-buttons a#facebook:hover {
background-color: #143271 !important;
}
.share-buttons a#twitter {
background-color: #55acee;
background-image: url("/img/share/twitter_white.png");
color: #fff;
}
.share-buttons a#twitter:hover {
background-color: #338acc !important;
}
.share-buttons a#gplus {
background-color: #d34836;
background-image: url("/img/share/gplus_white.png");
color: #fff;
display: none;
}
.share-buttons a#gplus:hover {
background-color: #b12614 !important;
}
.share-buttons a#diaspora {
background-color: #404040;
background-image: url("/img/share/diaspora_white.png");
color: #fff;
}
.share-buttons a#diaspora:hover {
background-color: #101010 !important;
}
.share-buttons a#flattr {
background-color: #7ea352;
background-image: url("/img/share/flattr_white.png");
color: #fff;
}
.share-buttons a#flattr:hover {
background-color: #5a7f2e !important;
}
.share-buttons a#support {
background-color: #47a447;
background-image: url("/img/share/support_red.png");
color: #fff;
}
.share-buttons a#support:hover {
background-color: #2a872a !important;
}
.share-buttons a#reddit {
background-color: #ff5700;
background-image: url("/img/share/reddit_white.png");
color: #fff;
}
.share-buttons a#reddit:hover {
background-color: #dd3500 !important;
}
.share-buttons a#gnusocial {
background-color: #a22430;
background-image: url("/img/share/gnusocial_white.png");
color: #fff;
}
.share-buttons a#gnusocial:hover {
background-color: #850713 !important;
}
.share-buttons a#hnews {
background-color: #ff6600;
background-image: url("/img/share/hackernews_white.png");
color: #fff;
}
.share-buttons a#hnews:hover {
background-color: #dd3500 !important;
}
/* SHARE BUTTONS ON LEFT SIDE */
aside.sharecolumn {
display: none;
left: 0;
padding: 0.1vh 0.5vh;
position: fixed;
top: 50%;
transform: translateY(-50%);
z-index: 10;
flex-direction: column;
}
@media(min-width:768px) {
aside.sharecolumn {
display: flex;
}
}
aside.sharecolumn a {
background-position: center center;
background-repeat: no-repeat;
background-size: 2.7vh auto;
background-color: #474747;
border-radius: 3px;
color: #000;
display: inline-block;
margin: 2.5px 5px 2.5px 0;
opacity: 0.9;
text-decoration: none;
height: 4vh;
width: 4vh;
}
aside.sharecolumn a:hover {
background-color: #F05F40;
}
aside.sharecolumn a#diaspora-left {
background-image: url("/img/share/diaspora_white.png");
}
aside.sharecolumn a#gnusocial-left {
background-image: url("/img/share/gnusocial_white.png");
}
aside.sharecolumn a#reddit-left {
background-image: url("/img/share/reddit_white.png");
}
aside.sharecolumn a#twitter-left {
background-image: url("/img/share/twitter_white.png");
}
aside.sharecolumn a#gplus-left {
background-image: url("/img/share/gplus_white.png");
display: none;
}
aside.sharecolumn a#facebook-left {
background-image: url("/img/share/facebook_white.png");
}
aside.sharecolumn a#support-left {
background-image: url("/img/share/support_red.png");
}
/* Media Query to resize social links for portrait tablet view */
@media screen and (max-height: 770px) {
aside.sharecolumn a {
background-size: 3.7vh auto;
height: 6vh;
width: 6vh;
}
}