From 49d8b5a3df411bf8fb557dc6cbc1575833a7a486 Mon Sep 17 00:00:00 2001 From: chrisgarrity Date: Sat, 6 Apr 2019 16:44:37 -0400 Subject: [PATCH] Move the parental gate before the share buttons MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Change the share flow to have a ‘For Parents’ button that brings up the Parental Gate. Share buttons only become visible after a successful challenge. --- android/ScratchJr/.idea/misc.xml | 2 +- editions/free/src/css/editor.css | 25 +++++++++++++++++++++++++ editions/free/src/localizations/en.json | 1 + src/editor/ui/UI.js | 23 ++++++++++++++++++----- 4 files changed, 45 insertions(+), 6 deletions(-) diff --git a/android/ScratchJr/.idea/misc.xml b/android/ScratchJr/.idea/misc.xml index d2e6725..cbd46bd 100644 --- a/android/ScratchJr/.idea/misc.xml +++ b/android/ScratchJr/.idea/misc.xml @@ -27,7 +27,7 @@ - + diff --git a/editions/free/src/css/editor.css b/editions/free/src/css/editor.css index c333d13..f8318c0 100755 --- a/editions/free/src/css/editor.css +++ b/editions/free/src/css/editor.css @@ -591,10 +591,35 @@ z-index: 5; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255, 255, 255, 0.2)), color-stop(35%,rgba(255, 255, 255, 0)), color-stop(100%,rgba(255, 255, 255, 0))); } +div.infoboxParentsSection { + width: 51%; + margin: auto; + margin-top: 8%; +} + +div.infoboxParentsButton { + color: #fff; + background-image: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 50%, rgba(255,255,255,0.2) 51%); + text-transform: uppercase; + text-align: center; + font-weight: bold; + font-size: 15pt; + letter-spacing: .5px; + width: ${css_vw(23.41)}; + padding-top: ${css_vh(1.56)}; + padding-bottom: ${css_vh(1.56)}; + padding-left: ${css_vw(.5)}; + padding-right: ${css_vw(.5)}; + border-radius: 15px; + border: 2px solid #c19f21; + margin: auto; +} + div.infoboxShareButtons { width: 51%; margin: auto; margin-top: 8%; + visibility: hidden; } div.infoboxShareButton { diff --git a/editions/free/src/localizations/en.json b/editions/free/src/localizations/en.json index c0218d5..d2064ed 100644 --- a/editions/free/src/localizations/en.json +++ b/editions/free/src/localizations/en.json @@ -362,6 +362,7 @@ "SHARING_BY_AIRDROP": "Share by Airdrop", "SHARING_EMAIL_SUBJECT": "ScratchJr Project: {PROJECT_NAME}", "SHARING_EMAIL_TEXT": "Click the icon to try my ScratchJr project on your iPad or Android tablet!

If you don't have the ScratchJr app, you can download it from the Apple App store or the Google Play Store.

With ScratchJr, children can create their own interactive stories and games. To learn more, see scratchjr.org.", + "FOR_PARENTS": "For Parents", "PARENTAL_GATE_EXPLANATION": "Why are we asking this? An adult must approve online sharing.", "GRID_NUMBER": "{N, number}", "NEW_PROJECT_PREFIX": "Project", diff --git a/src/editor/ui/UI.js b/src/editor/ui/UI.js index a772cb3..3b202aa 100644 --- a/src/editor/ui/UI.js +++ b/src/editor/ui/UI.js @@ -118,12 +118,22 @@ export default class UI { author.setAttribute('id', 'deviceName'); if (window.Settings.shareEnabled) { + // For Parents button + var parentsSection = newHTML('div', 'infoboxParentsSection', infobox); + var parentsButton = newHTML('div', 'infoboxParentsButton', parentsSection); + parentsButton.id = 'infoboxParentsSectionButton'; + parentsButton.textContent = Localization.localize('FOR_PARENTS'); + // Sharing var shareButtons = newHTML('div', 'infoboxShareButtons', infobox); + shareButtons.setAttribute('id', 'sharebuttons'); var shareEmail = newHTML('div', 'infoboxShareButton', shareButtons); shareEmail.id = 'infoboxShareButtonEmail'; shareEmail.textContent = Localization.localize('SHARING_BY_EMAIL'); + shareEmail.ontouchstart = function (e) { + UI.infoDoShare(e, nameField, shareLoadingGif, 1); + }; if (isAndroid) { shareEmail.style.margin = 'auto'; @@ -137,9 +147,7 @@ export default class UI { shareAirdrop.textContent = Localization.localize('SHARING_BY_AIRDROP'); shareAirdrop.style.float = 'right'; shareAirdrop.ontouchstart = function (e) { - UI.parentalGate(e, function (e) { - UI.infoDoShare(e, nameField, shareLoadingGif, 1); - }); + UI.infoDoShare(e, nameField, shareLoadingGif, 1); }; } @@ -150,9 +158,9 @@ export default class UI { var shareLoadingGif = newHTML('img', 'infoboxShareLoading', shareButtons); shareLoadingGif.src = './assets/ui/loader.png'; - shareEmail.ontouchstart = function (e) { + parentsButton.ontouchstart = function (e) { UI.parentalGate(e, function (e) { - UI.infoDoShare(e, nameField, shareLoadingGif, 0); + UI.showSharing(e, shareButtons); }); }; } @@ -223,6 +231,10 @@ export default class UI { } } + static showSharing (evt, shareButtons) { + shareButtons.style.visibility = 'visible'; + } + /* + Save the project, including the new name, then package the project and send native-side for sharing + @@ -439,6 +451,7 @@ export default class UI { ScratchAudio.sndFX('exittap.wav'); gn('infobox').className = 'infobox fade'; } + gn('sharebuttons').style.visibility = 'hidden'; infoBoxOpen = false; }