Mirrors/overte
3
0
Fork 0
mirror of https://github.com/overte-org/overte.git synced 2025-04-16 16:26:17 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

External share buttons!

Browse source
This commit is contained in:
Zach Fox 2017-04-20 14:00:28 -07:00
parent 4270086a22
commit 2880b22f9f
3 changed files with 101 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
scripts/system/html/SnapshotReview.html
View file

@ -5,12 +5,29 @@
<link rel="stylesheet" type="text/css" href="css/SnapshotReview.css">
<script type="text/javascript" src="js/eventBridgeLoader.js"></script>
<script type="text/javascript" src="js/SnapshotReview.js"></script>
<script>
window.twttr = (function (d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0],
t = window.twttr || {};
if (d.getElementById(id)) return t;
js = d.createElement(s);
js.id = id;
js.src = "https://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
t._e = [];
t.ready = function (f) {
t._e.push(f);
};
return t;
}(document, "script", "twitter-wjs"));
</script>
</head>
<body>
<div class="snapsection title">
<label>Snap</label>
<label id="settingsLabel" for="snapshotSettings">Settings</label>
<input type="button" class="hifi-glyph naked" id="snapshotSettings" value="@" onclick="snapshotSettings()" />
</div>

33
scripts/system/html/css/SnapshotReview.css
View file

@ -123,6 +123,39 @@ input[type=button].naked:active {
.shareButton:active {
background-color: white;
}
/*
// START styling of share overlay
*/
.shareOverlayDiv {
text-align: center;
}
.shareControls {
text-align: left;
display: flex;
justify-content: center;
flex-direction: row;
align-items: flex-start;
height: 50px;
}
.shareOverlayLabel {
line-height: 75px;
}
.hifiShareControls {
text-align: left;
width: 40%;
margin-left: 10%;
}
.externalShareControls {
text-align: left;
width: 40%;
margin-right: 10%;
}
.cancelShare {
}
/*
// END styling of share overlay
*/
/*
// END styling of snapshot pane and its contents
*/

54
scripts/system/html/js/SnapshotReview.js
View file

@ -70,14 +70,44 @@ function createShareOverlay(parentID, isGif) {
'</div>'
shareOverlayContainer.appendChild(shareBar);
var shareOverlayBackground = document.createElement("div");
shareOverlayBackground.id = parentID + "shareOverlayBackground";
shareOverlayBackground.style.display = "none";
shareOverlayBackground.style.position = "absolute";
shareOverlayBackground.style.zIndex = "1";
shareOverlayBackground.style.top = "0px";
shareOverlayBackground.style.left = "0px";
shareOverlayBackground.style.backgroundColor = "black";
shareOverlayBackground.style.opacity = "0.5";
shareOverlayBackground.style.width = "100%";
shareOverlayBackground.style.height = "100%";
shareOverlayContainer.appendChild(shareOverlayBackground);
var shareOverlay = document.createElement("div");
shareOverlay.id = parentID + "shareOverlay";
shareOverlay.className = "shareOverlayDiv";
shareOverlay.style.display = "none";
shareOverlay.style.backgroundColor = "black";
shareOverlay.style.opacity = "0.5";
shareOverlay.style.width = "100%";
shareOverlay.style.height = "100%";
shareOverlay.style.zIndex = "2";
var shareWithEveryoneButtonID = parentID + "shareWithEveryoneButton";
var inviteConnectionsCheckboxID = parentID + "inviteConnectionsCheckbox";
shareOverlay.innerHTML = '<label class="shareOverlayLabel">SHARE</label>' +
'<br/>' +
'<div class="shareControls">' +
'<div class="hifiShareControls">' +
'<input type="button" class="shareWithEveryone" id="' + shareWithEveryoneButtonID + '" value="SHARE WITH EVERYONE" onclick="" /><br>' +
'<input type="checkbox" class="inviteConnections" id="' + inviteConnectionsCheckboxID + '" checked="checked" />' +
'<label class="shareButtonLabel" for="' + inviteConnectionsCheckboxID + '">Invite My Connections</label><br>' +
'<input type="button" class="cancelShare" value="CANCEL" onclick="cancelSharing(' + parentID + ')" />' +
'</div>' +
'<div class="externalShareControls">' +
'<iframe src="https://www.facebook.com/plugins/share_button.php?href=http%3A%2F%2Fhighfidelity.io&layout=button_count&size=small&mobile_iframe=false&width=84&height=20&appId" width="84" height="20" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>' +
'<a class="twitter-share-button" href="https://twitter.com/intent/tweet">Tweet</a>' +
'</div>' +
'</div>';
shareOverlayContainer.appendChild(shareOverlay);
twttr.widgets.load(shareOverlay);
return shareOverlayContainer;
}
@ -85,15 +115,31 @@ function selectImageToShare(selectedID) {
selectedID = selectedID.id; // Why is this necessary?
var shareOverlayContainer = document.getElementById(selectedID + "shareOverlayContainer");
var shareBar = document.getElementById(selectedID + "shareBar");
var shareOverlayBackground = document.getElementById(selectedID + "shareOverlayBackground");
var shareOverlay = document.getElementById(selectedID + "shareOverlay");
shareOverlayContainer.style.outline = "4px solid #00b4ef";
shareOverlayContainer.style.outlineOffset = "-4px";
shareOverlay.style.outline = "4px solid #00b4ef";
shareOverlay.style.outlineOffset = "-4px";
shareBar.style.display = "none";
shareOverlayBackground.style.display = "inline";
shareOverlay.style.display = "inline";
}
function cancelSharing(selectedID) {
selectedID = selectedID.id; // Why is this necessary?
var shareOverlayContainer = document.getElementById(selectedID + "shareOverlayContainer");
var shareBar = document.getElementById(selectedID + "shareBar");
var shareOverlayBackground = document.getElementById(selectedID + "shareOverlayBackground");
var shareOverlay = document.getElementById(selectedID + "shareOverlay");
shareOverlay.style.outline = "none";
shareBar.style.display = "inline";
shareOverlayBackground.style.display = "none";
shareOverlay.style.display = "none";
}
function handleCaptureSetting(setting) {
var stillAndGif = document.getElementById('stillAndGif');