From e5a7f713085dc230d1685ab1280a640f8e0be1cc Mon Sep 17 00:00:00 2001
From: Greg Fodor <gfodor@gmail.com>
Date: Thu, 11 Oct 2018 21:36:07 +0000
Subject: [PATCH] Add scene tweet link
---
src/assets/images/twitter.svg | 3 +++
src/assets/stylesheets/scene-ui.scss | 16 ++++++++++++++++
src/assets/translations.data.json | 1 +
src/react-components/scene-ui.js | 10 ++++++++++
4 files changed, 30 insertions(+)
create mode 100755 src/assets/images/twitter.svg
diff --git a/src/assets/images/twitter.svg b/src/assets/images/twitter.svg
new file mode 100755
index 000000000..4f1679067
--- /dev/null
+++ b/src/assets/images/twitter.svg
@@ -0,0 +1,3 @@
+<svg width="400" height="400" viewBox="0 0 400 400" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M153.6 301.6C247.9 301.6 299.5 223.4 299.5 155.7C299.5 153.5 299.5 151.3 299.4 149.1C309.4 141.9 318.1 132.8 325 122.5C315.8 126.6 305.9 129.3 295.5 130.6C306.1 124.3 314.2 114.2 318.1 102.2C308.2 108.1 297.2 112.3 285.5 114.6C276.1 104.6 262.8 98.4 248.1 98.4C219.8 98.4 196.8 121.4 196.8 149.7C196.8 153.7 197.3 157.6 198.1 161.4C155.5 159.3 117.7 138.8 92.4 107.8C88 115.4 85.5 124.2 85.5 133.6C85.5 151.4 94.6 167.1 108.3 176.3C99.9 176 92 173.7 85.1 169.9C85.1 170.1 85.1 170.3 85.1 170.6C85.1 195.4 102.8 216.2 126.2 220.9C121.9 222.1 117.4 222.7 112.7 222.7C109.4 222.7 106.2 222.4 103.1 221.8C109.6 242.2 128.6 257 151 257.4C133.4 271.2 111.3 279.4 87.3 279.4C83.2 279.4 79.1 279.2 75.1 278.7C97.7 293.1 124.7 301.6 153.6 301.6Z" fill="white"/>
+</svg>
diff --git a/src/assets/stylesheets/scene-ui.scss b/src/assets/stylesheets/scene-ui.scss
index 2f48ccee5..55b703e3f 100644
--- a/src/assets/stylesheets/scene-ui.scss
+++ b/src/assets/stylesheets/scene-ui.scss
@@ -52,6 +52,22 @@
margin-bottom: 32px;
}
+:local(.tweetButton) {
+ @extend %action-button;
+ margin-top: 12px;
+ background-color: #1b95e0;
+ align-self: center;
+ padding-right: 32px;
+ display: flex;
+ flex-direction: row;
+
+ img {
+ width: 42px;
+ height: 42px;
+ margin-right: 6px;
+ }
+}
+
:local(.logo) {
width: 100%;
display: block;
diff --git a/src/assets/translations.data.json b/src/assets/translations.data.json
index 1fd38b1c0..c0a4ece7c 100644
--- a/src/assets/translations.data.json
+++ b/src/assets/translations.data.json
@@ -80,6 +80,7 @@
"help.report_issue": "Report an Issue",
"scene.logo_tagline": "A new way to get together",
"scene.create_button": "Create a room with this scene",
+ "scene.tweet_button": "Share on Twitter",
"link.in_your_browser": "In your headset's browser, go to:",
"link.enter_code": "Then, enter this one-time link code:",
"link.do_not_close": "Keep this open to use this code.",
diff --git a/src/react-components/scene-ui.js b/src/react-components/scene-ui.js
index ec04e095e..129d9edce 100644
--- a/src/react-components/scene-ui.js
+++ b/src/react-components/scene-ui.js
@@ -66,6 +66,10 @@ class SceneUI extends Component {
};
render() {
+ const sceneUrl = [location.protocol, "//", location.host, location.pathname].join("");
+ const text = `${this.props.sceneName} in #hubs`;
+ const tweetLink = `https://twitter.com/share?url=${encodeURIComponent(sceneUrl)}&text=${encodeURIComponent(text)}`;
+
return (
<IntlProvider locale={lang} messages={messages}>
<div className={styles.ui}>
@@ -89,6 +93,12 @@ class SceneUI extends Component {
<button onClick={this.createRoom}>
<FormattedMessage id="scene.create_button" />
</button>
+ <a href={tweetLink} rel="noopener noreferrer" target="_blank" className={styles.tweetButton}>
+ <img src="../assets/images/twitter.svg" />
+ <div>
+ <FormattedMessage id="scene.tweet_button" />
+ </div>
+ </a>
</div>
</div>
<div className={styles.info}>
--
GitLab