Reorder the buttons by importance

This commit is contained in:
Joas Schilling 2016-08-26 14:11:37 +02:00
parent 419c42b0aa
commit 6b885bbc56
No known key found for this signature in database
GPG Key ID: E166FD8976B3BAC8
4 changed files with 8 additions and 353 deletions

View File

@ -1,49 +0,0 @@
.js-gs-share, .gs-share [aria-hidden="true"], .gs-share-form[aria-hidden="true"] {
display: none;
}
.js-gs-share-enabled .js-gs-share {
display: inline;
float: left;
}
.gs-share .js-gs-share[href] {
display: inline;
}
.gs-share [aria-hidden="false"], .gs-share-form[aria-hidden="false"] {
display: block;
margin-top: 40px;
}
.gs-share {
position: relative;
}
.gs-share-form {
background: #FFF;
border: 1px solid #000;
border-radius: 5px;
padding: 5px;
position: absolute;
z-index: 1;
}
.gs-share [for="gs-account"], .gs-share [type="text"] {
display: block;
margin-bottom: 8px;
}
.gs-share [type="submit"] {
display: block;
margin-top: 8px;
}
.gs-share--icon {
border: none;
cursor: pointer;
min-height: 32px;
padding: 0;
padding-left: 33px;
background: transparent url('../../../img/gs-share.png') no-repeat left center;
}

View File

@ -1,79 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="32"
height="32"
id="svg2880"
version="1.1"
inkscape:version="0.91 r13725"
sodipodi:docname="social-gnu.svg"
inkscape:export-filename="/home/robmyers/Desktop/social_logo_competition/gnu-social-logo.png"
inkscape:export-xdpi="90"
inkscape:export-ydpi="90">
<defs
id="defs2882">
<inkscape:perspective
sodipodi:type="inkscape:persp3d"
inkscape:vp_x="0 : 526.18109 : 1"
inkscape:vp_y="0 : 1000 : 0"
inkscape:vp_z="744.09448 : 526.18109 : 1"
inkscape:persp3d-origin="372.04724 : 350.78739 : 1"
id="perspective2888" />
<inkscape:perspective
id="perspective2859"
inkscape:persp3d-origin="0.5 : 0.33333333 : 1"
inkscape:vp_z="1 : 0.5 : 1"
inkscape:vp_y="0 : 1000 : 0"
inkscape:vp_x="0 : 0.5 : 1"
sodipodi:type="inkscape:persp3d" />
</defs>
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="17.21204"
inkscape:cx="13.854211"
inkscape:cy="18.472465"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:window-width="1022"
inkscape:window-height="730"
inkscape:window-x="0"
inkscape:window-y="49"
inkscape:window-maximized="0" />
<metadata
id="metadata2885">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(-119.19595,-352.32438)">
<path
style="opacity:0.5;fill:#000000;fill-opacity:1;stroke:none"
d="m 125.14074,354.32438 c -2.18531,0 -3.94479,1.75948 -3.94479,3.94479 l 0,15.76964 c 0,2.18531 1.75948,3.94419 3.94479,3.94419 l 11.72461,0 c -0.0131,4.46851 -6.05322,6.34138 -6.05322,6.34138 0,0 10.21217,-0.0335 11.65719,-6.34138 l 2.12751,0 c 2.18532,0 3.94479,-1.75888 3.94479,-3.94419 l 0,-15.76964 c 0,-2.18531 -1.75947,-3.94479 -3.94479,-3.94479 l -19.45609,0 z m 5.66602,3.16145 c 0.042,-0.007 0.0803,-0.007 0.11455,0 0.0366,0.007 0.0681,0.022 0.0943,0.0454 0.41895,0.37367 -0.69461,0.73954 -0.60497,2.57737 0.0394,0.80713 -0.2017,1.43484 1.34476,1.43484 1.03195,0 0.60505,-0.91938 1.90498,-0.91938 0.77317,0 1.0581,0.49786 1.16578,0.90268 0.10769,-0.40482 0.39265,-0.90268 1.16577,-0.90268 1.29994,0 0.87304,0.91938 1.90498,0.91938 1.54648,0 1.3054,-0.62771 1.34477,-1.43484 0.0896,-1.83783 -1.02452,-2.2037 -0.60556,-2.57737 0.41895,-0.37366 2.21932,1.81578 2.26414,2.66745 0.0469,0.89057 0.0697,2.29462 -1.25467,3.02244 1.47777,1.45682 1.67588,3.38756 1.67588,3.38756 l -2.55469,-0.0447 c 0,0 -0.58278,-2.64503 -3.67572,-2.51054 -3.09293,0.13447 -3.49614,0.67255 -3.49614,3.94479 0,3.27223 1.43378,4.39676 3.63037,4.48234 3.45154,0.13448 3.13818,-1.79282 3.13818,-1.79282 l -1.61383,0.0895 -0.89671,-2.42045 5.51329,0 c 0,2.64468 -1.12011,6.76843 -6.36465,6.49949 -5.24455,-0.26896 -6.41052,-4.39271 -6.45534,-7.17187 -0.0246,-1.52551 0.22386,-3.24602 1.47363,-4.46265 -1.31045,-0.72721 -1.2678,-2.13094 -1.2678,-3.02303 0,-1.10312 1.42517,-2.61621 2.05473,-2.71279 z"
id="path4639"
inkscape:connector-curvature="0" />
</g>
</svg>

Before

Width:  |  Height:  |  Size: 3.8 KiB

View File

@ -1,206 +0,0 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
// @license magnet:?xt=urn:btih:3877d6d54b3accd4bc32f8a48bf32ebc0901502a&dn=mpl-2.0.txt MPL 2.0
document.addEventListener('DOMContentLoaded', function () {
'use strict';
/**
* 'Share' widget for GNU social
* http://code.chromic.org/project/view/2/
*
* We make a few assumptions about the target instance:
* 1) The API root is in the default location
* 2) Fancy URLs are enabled
* 3) CORS is allowed
* 4) The Bookmark plugin is enabled
*
* If 1), 3) or 4) are wrong, we fall back to a regular
* notice (instead of a bookmark notice)
*
* If 2) is wrong the user will be directed to a 404 :(
*/
// TODO: input sanitation [1], [2]
// TODO: server-side fallback if JS is disabled
var createForm,
bindClicks,
frm,
shareAsNotice,
shareAsBookmark,
extractURLParams,
shareURL,
shareTitle,
closest,
i18n = window.i18n;
/**
* Internationalization
*/
if (i18n === undefined) {
i18n = {
invalidId: 'The account id provided is invalid',
yourAcctId: 'Your account ID:',
idPlaceholder: 'user@example.org',
shareAsBookmark: 'Share as a bookmark'
};
}
shareAsNotice = function (title, url, domain) {
window.open('http://' + domain + '/notice/new?status_textarea=' + title + ' ' + url); // [1]
};
shareAsBookmark = function (title, url, domain) {
window.open('http://' + domain + '/main/bookmark/new?url=' + url + '&title=' + title); // [2]
};
/**
* Extract parameters from query string
*
* ex:
* ?foo=bar&baz=test
* will return:
* {foo: 'bar', baz: 'test'}
*/
extractURLParams = function (queryStr) {
var parts = queryStr.substr(1).split('&'),
i, len, keyVal, params = {};
for (i = 0, len = parts.length; i < len; i += 1) {
keyVal = parts[i].split('=');
params[keyVal[0]] = keyVal[1];
}
return params;
};
// Create the form that we'll re-use throughout the page
createForm = function () {
var err = document.createElement('div');
err.setAttribute('class', 'gs-share-err');
err.setAttribute('tabindex', '-1');
err.setAttribute('aria-hidden', 'true');
err.textContent = i18n.invalidId;
frm = document.createElement('form');
frm.setAttribute('class', 'gs-share-form');
frm.setAttribute('tabindex', '-1');
frm.setAttribute('aria-hidden', 'true');
frm.innerHTML = '<label for="gs-account">' + i18n.yourAcctId + '</label>' +
'<input type="text" id="gs-account" placeholder="' + i18n.idPlaceholder + '" />' +
'<input type="checkbox" id="gs-bookmark" /> <label for="gs-bookmark">' + i18n.shareAsBookmark + '</label>' +
'<input type="submit" value="Share"/>';
frm.insertBefore(err, frm.firstChild);
// Submit handler
frm.addEventListener('submit', function (e) {
e.preventDefault();
var accountParts = document.getElementById('gs-account').value.split('@'),
username, domain, xhr, bookmarkURL;
if (accountParts.length === 2) {
err.setAttribute('aria-hidden', 'true');
username = accountParts[0];
domain = accountParts[1];
bookmarkURL = 'http://' + domain + '/api/bookmarks/' + username + '.json';
// Try bookmark
if (document.getElementById('gs-bookmark').checked) {
xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
if (xhr.status === 200) { // Success
shareAsBookmark(shareTitle, shareURL, domain);
} else { // Failure, fallback to regular notice
shareAsNotice(shareTitle, shareURL, domain);
}
}
};
xhr.open('GET', bookmarkURL, true);
xhr.send();
} else { // Regular notice
shareAsNotice(shareTitle, shareURL, domain);
}
} else { // Invalid account id
err.setAttribute('aria-hidden', 'false');
err.focus();
}
});
// Keydown handler
frm.addEventListener('keydown', function (e) {
if (e.keyCode === 27) { // Escape key closes the dialog
frm.parentElement.getElementsByClassName('js-gs-share')[0].focus();
frm.setAttribute('aria-hidden', 'true');
}
});
document.body.appendChild(frm);
};
/**
* Something similar to jQuery.closest
*
* Given `elm`, return the closest parent with class `cls`
* or false if there is no matching ancestor.
*/
closest = function (elm, cls) {
while (elm !== document) {
if (elm.classList.contains(cls)) {
return elm;
}
elm = elm.parentNode;
}
return false;
};
bindClicks = function () {
document.addEventListener('click', function (e) {
var target = e.target,
urlParams,
lnk = closest(target, 'js-gs-share');
// Don't do anything on right/middle click or if ctrl or shift was pressed while left-clicking
if (!e.button && !e.ctrlKey && !e.shiftKey && lnk) {
e.preventDefault();
// Check for submission information in href first
if (lnk.search !== undefined) {
urlParams = extractURLParams(lnk.search);
shareURL = urlParams.url;
shareTitle = urlParams.title;
} else { // If it's not there, try data-* attributes. If not, use current document url and title
shareURL = lnk.getAttribute('data-url') || window.location.href;
shareTitle = lnk.getAttribute('data-title') || document.title;
}
// Move form after the clicked link
lnk.parentNode.appendChild(frm);
// Show form
frm.setAttribute('aria-hidden', 'false');
// Focus on form
frm.focus();
} else if (!frm.contains(target)) {
frm.setAttribute('aria-hidden', 'true');
}
});
};
// Flag that js is enabled
document.body.classList.add('js-gs-share-enabled');
createForm();
bindClicks();
});
// @license-end

View File

@ -3,10 +3,6 @@
/** @var array $_ */
script('federatedfilesharing', 'settings-personal');
style('federatedfilesharing', 'settings-personal');
if ($_['showShareIT']) {
script('federatedfilesharing', '3rdparty/gs-share/gs-share');
style('federatedfilesharing', '3rdparty/gs-share/style');
}
?>
<?php if ($_['outgoingServer2serverShareEnabled']): ?>
@ -23,30 +19,23 @@ if ($_['showShareIT']) {
<?php if ($_['showShareIT']) {?>
<p>
<?php p($l->t('Share it:')); ?>
<div class="gs-share">
<button data-url="<?php p(urlencode($_['reference'])); ?>"
data-title='<?php p(urlencode($_['message_without_URL'])); ?>'
class='js-gs-share social-gnu'>
GNU Social
</button>
</div>
<button class="social-diaspora pop-up"
data-url='https://sharetodiaspora.github.io/?title=<?php p($_['message_without_URL']); ?>&url=<?php p(urlencode($_['reference'])); ?>'>
Diaspora
<?php p($l->t('Share it:')); ?><br>
<button class="social-facebook pop-up"
data-url='https://www.facebook.com/sharer/sharer.php?u=<?php p(urlencode($_['reference'])); ?>'>
Facebook
</button>
<button class="social-twitter pop-up"
data-url='https://twitter.com/intent/tweet?text=<?php p(urlencode($_['message_with_URL'])); ?>'>
Twitter
</button>
<button class="social-facebook pop-up"
data-url='https://www.facebook.com/sharer/sharer.php?u=<?php p(urlencode($_['reference'])); ?>'>
Facebook
</button>
<button class="social-googleplus pop-up"
data-url='https://plus.google.com/share?url=<?php p(urlencode($_['reference'])); ?>'>
Google+
</button>
<button class="social-diaspora pop-up"
data-url='https://sharetodiaspora.github.io/?title=<?php p($_['message_without_URL']); ?>&url=<?php p(urlencode($_['reference'])); ?>'>
Diaspora
</button>
<button id="oca-files-sharing-add-to-your-website">
<?php p($l->t('Add to your website')) ?>
</button>