Browse Source
add social media button for diaspora, twitter, facebook and google+
remotes/origin/poc-doctrine-migrations
add social media button for diaspora, twitter, facebook and google+
remotes/origin/poc-doctrine-migrations
7 changed files with 343 additions and 6 deletions
-
49apps/files_sharing/css/3rdparty/gs-share/style.css
-
3apps/files_sharing/css/settings-personal.css
-
BINapps/files_sharing/img/gs-share.png
-
206apps/files_sharing/js/3rdparty/gs-share/gs-share.js
-
15apps/files_sharing/js/settings-personal.js
-
7apps/files_sharing/settings-personal.php
-
69apps/files_sharing/templates/settings-personal.php
@ -0,0 +1,49 @@ |
|||||
|
.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; |
||||
|
} |
||||
@ -0,0 +1,3 @@ |
|||||
|
#fileSharingSettings img { |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
After Width: 29 | Height: 32 | Size: 863 B |
@ -0,0 +1,206 @@ |
|||||
|
/* 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
|
||||
@ -0,0 +1,15 @@ |
|||||
|
$(document).ready(function() { |
||||
|
|
||||
|
$('#fileSharingSettings img').click(function() { |
||||
|
var url = $(this).data('url'); |
||||
|
if (url) { |
||||
|
var width = 600; |
||||
|
var height = 400; |
||||
|
var left = (screen.width/2)-(width/2); |
||||
|
var top = (screen.height/2)-(height/2); |
||||
|
|
||||
|
window.open(url, 'name', 'width=' + width + ', height=' + height + ', top=' + top + ', left=' + left); |
||||
|
} |
||||
|
}); |
||||
|
|
||||
|
}); |
||||
@ -1,12 +1,69 @@ |
|||||
<?php |
<?php |
||||
/** @var OC_L10N $l */ |
/** @var OC_L10N $l */ |
||||
/** @var array $_ */ |
/** @var array $_ */ |
||||
|
script('files_sharing', 'settings-personal'); |
||||
|
style('files_sharing', 'settings-personal'); |
||||
|
script('files_sharing', '3rdparty/gs-share/gs-share'); |
||||
|
style('files_sharing', '3rdparty/gs-share/style'); |
||||
?>
|
?>
|
||||
<div id="fileSharingSettings" class="section"> |
|
||||
<h2><?php p($l->t('Federated Cloud'));?></h2>
|
|
||||
|
|
||||
<p> |
|
||||
<?php p($l->t('Your Federated Cloud ID: %s', [$_['cloudId']])); ?>
|
|
||||
</p> |
|
||||
|
<?php if ($_['outgoingServer2serverShareEnabled']): ?>
|
||||
|
<div id="fileSharingSettings" class="section"> |
||||
|
<h2><?php p($l->t('Federated Cloud')); ?></h2>
|
||||
|
|
||||
</div> |
|
||||
|
<p> |
||||
|
<?php p($l->t('Your Federated Cloud ID: %s', [$_['cloudId']])); ?>
|
||||
|
</p> |
||||
|
|
||||
|
<p> |
||||
|
|
||||
|
<h3><?php p($l->t('Share your Federated Cloud Id:')); ?></h3>
|
||||
|
|
||||
|
<p> |
||||
|
|
||||
|
<div class='gs-share'> |
||||
|
<button data-url='<?php p($_['reference']); ?>' |
||||
|
data-title='<?php p(urlencode($_['message_without_URL'])); ?>' |
||||
|
class='js-gs-share gs-share--icon'> |
||||
|
</button> |
||||
|
</div> |
||||
|
|
||||
|
|
||||
|
<img src='TODO: Add Diaspora Button' style="border: 0px solid;" |
||||
|
alt='Share on Diaspora' |
||||
|
data-url='http://sharetodiaspora.github.io/?title=<?php p($_['message_without_URL']); ?>&url=<?php p($_['reference']); ?>'/> |
||||
|
<img src='TODO: Add Twitter Button' alt=' | Share on Twitter' |
||||
|
data-url='https://twitter.com/intent/tweet?text=<?php p(urlencode($_['message_with_URL'])); ?>'/> |
||||
|
<img src='TODO: Add Facebook Button' alt=' | Share on Facebook' |
||||
|
data-url='https://www.facebook.com/sharer/sharer.php?u=<?php p($_['reference']); ?>'/> |
||||
|
<img src='TODO: Add Google+ Button' alt=' | Share on Google+' |
||||
|
data-url='https://plus.google.com/share?url=<?php p($_['reference']); ?>'/> |
||||
|
|
||||
|
</p> |
||||
|
|
||||
|
<br/> |
||||
|
|
||||
|
<h3><?php p($l->t('Add your Federated Cloud Id to your homepage:')); ?></h3>
|
||||
|
|
||||
|
<p> |
||||
|
|
||||
|
<a href="<?php p($_['reference']); ?>"> |
||||
|
<img src='TODO: Add Example Banner/Button' |
||||
|
alt='<?php p($_['message_with_URL']); ?>'/> |
||||
|
</a> |
||||
|
|
||||
|
<br/> |
||||
|
<?php p($l->t('HTML Code:')); ?>
|
||||
|
<br/> |
||||
|
|
||||
|
<xmp> |
||||
|
<a href="<?php p($_['reference']); ?>"> |
||||
|
<img src='TODO: Add Banner/Button' |
||||
|
alt='<?php p($_['message_with_URL']); ?>'/> |
||||
|
</a> |
||||
|
</xmp> |
||||
|
|
||||
|
</p> |
||||
|
|
||||
|
</div> |
||||
|
<?php endif; ?>
|
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue