Skip to content

Commit fc057a9

Browse files
takaokoujitakaokouji
authored
Merge pull request #190 from smalruby/merge/scratch-gui
merged scratch-gui
2 parents 675d19b + 5738a51 commit fc057a9

36 files changed

+783
-321
lines changed

‎package.json‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,7 @@
7979
"mkdirp": "^0.5.1",
8080
"opal-runtime": "^1.0.11",
8181
"opal-compiler": "^1.0.11",
82+
"papaparse": "4.6.2",
8283
"postcss-import": "^12.0.0",
8384
"postcss-loader": "^3.0.0",
8485
"postcss-simple-vars": "^5.0.1",
@@ -108,12 +109,12 @@
108109
"rimraf": "^2.6.1",
109110
"scratch-audio": "0.1.0-prerelease.20181023202904",
110111
"scratch-blocks": "0.1.0-prerelease.1545162154",
111-
"scratch-l10n": "3.1.20181213173343",
112-
"scratch-paint": "0.2.0-prerelease.20181218161344",
113-
"scratch-render": "0.1.0-prerelease.20181218160410",
112+
"scratch-l10n": "3.1.20181220222259",
113+
"scratch-paint": "0.2.0-prerelease.20181220194927",
114+
"scratch-render": "0.1.0-prerelease.20181220195236",
114115
"scratch-storage": "1.2.1",
115-
"scratch-svg-renderer": "0.2.0-prerelease.20181218153528",
116-
"scratch-vm": "0.2.0-prerelease.20181219200003",
116+
"scratch-svg-renderer": "0.2.0-prerelease.20181220183040",
117+
"scratch-vm": "0.2.0-prerelease.20181221030743",
117118
"selenium-webdriver": "3.6.0",
118119
"startaudiocontext": "1.2.1",
119120
"style-loader": "^0.23.0",

‎src/components/gui/gui.jsx‎

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,14 +24,15 @@ import BackdropLibrary from '../../containers/backdrop-library.jsx';
2424
import Watermark from '../../containers/watermark.jsx';
2525

2626
import Backpack from '../../containers/backpack.jsx';
27+
import PreviewModal from '../../containers/preview-modal.jsx';
2728
import ImportModal from '../../containers/import-modal.jsx';
2829
import WebGlModal from '../../containers/webgl-modal.jsx';
2930
import TipsLibrary from '../../containers/tips-library.jsx';
3031
import Cards from '../../containers/cards.jsx';
3132
import Alerts from '../../containers/alerts.jsx';
3233
import DragLayer from '../../containers/drag-layer.jsx';
3334
import ConnectionModal from '../../containers/connection-modal.jsx';
34-
35+
import TelemetryModal from '../telemetry-modal/telemetry-modal.jsx';
3536

3637
import layout, {STAGE_SIZE_MODES} from '../../lib/layout-constants';
3738
import {resolveStageSize} from '../../lib/screen-utils';
@@ -103,13 +104,19 @@ const GUIComponent = props => {
103104
onExtensionButtonClick,
104105
onRequestCloseBackdropLibrary,
105106
onRequestCloseCostumeLibrary,
107+
onRequestCloseTelemetryModal,
106108
onSeeCommunity,
107109
onShare,
110+
onTelemetryModalCancel,
111+
onTelemetryModalOptIn,
112+
onTelemetryModalOptOut,
113+
previewInfoVisible,
108114
showComingSoon,
109115
soundsTabVisible,
110116
rubyTabVisible,
111117
stageSizeMode,
112118
targetIsStage,
119+
telemetryModalVisible,
113120
tipsLibraryVisible,
114121
vm,
115122
...componentProps
@@ -151,6 +158,17 @@ const GUIComponent = props => {
151158
dir={isRtl ? 'rtl' : 'ltr'}
152159
{...componentProps}
153160
>
161+
{previewInfoVisible ? (
162+
<PreviewModal />
163+
) : null}
164+
{telemetryModalVisible ? (
165+
<TelemetryModal
166+
onCancel={onTelemetryModalCancel}
167+
onOptIn={onTelemetryModalOptIn}
168+
onOptOut={onTelemetryModalOptOut}
169+
onRequestClose={onRequestCloseTelemetryModal}
170+
/>
171+
) : null}
154172
{loading ? (
155173
<Loader />
156174
) : null}
@@ -400,17 +418,23 @@ GUIComponent.propTypes = {
400418
onOpenRegistration: PropTypes.func,
401419
onRequestCloseBackdropLibrary: PropTypes.func,
402420
onRequestCloseCostumeLibrary: PropTypes.func,
421+
onRequestCloseTelemetryModal: PropTypes.func,
403422
onSeeCommunity: PropTypes.func,
404423
onShare: PropTypes.func,
405424
onTabSelect: PropTypes.func,
425+
onTelemetryModalCancel: PropTypes.func,
426+
onTelemetryModalOptIn: PropTypes.func,
427+
onTelemetryModalOptOut: PropTypes.func,
406428
onToggleLoginOpen: PropTypes.func,
407429
onUpdateProjectTitle: PropTypes.func,
430+
previewInfoVisible: PropTypes.bool,
408431
renderLogin: PropTypes.func,
409432
rubyTabVisible: PropTypes.bool,
410433
showComingSoon: PropTypes.bool,
411434
soundsTabVisible: PropTypes.bool,
412435
stageSizeMode: PropTypes.oneOf(Object.keys(STAGE_SIZE_MODES)),
413436
targetIsStage: PropTypes.bool,
437+
telemetryModalVisible: PropTypes.bool,
414438
tipsLibraryVisible: PropTypes.bool,
415439
vm: PropTypes.instanceOf(VM).isRequired
416440
};

‎src/components/menu-bar/login-dropdown.jsx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,11 @@ const LoginDropdownMessages = defineMessages({ // eslint-disable-line no-unused-
3535
defaultMessage: 'Need Help?',
3636
description: 'Button text for user to indicate that they need help',
3737
id: 'login.needHelp'
38+
},
39+
validationRequired: {
40+
defaultMessage: 'This field is required',
41+
description: 'Message to tell user they must enter text in a form field',
42+
id: 'form.validationRequired'
3843
}
3944
});
4045

‎src/components/monitor/monitor.jsx‎

Lines changed: 39 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -54,35 +54,52 @@ const MonitorComponent = props => (
5454
})}
5555
</Box>
5656
</Draggable>
57-
{props.mode === 'list' ? null : ReactDOM.createPortal((
57+
{ReactDOM.createPortal((
5858
// Use a portal to render the context menu outside the flow to avoid
5959
// positioning conflicts between the monitors `transform: scale` and
6060
// the context menus `position: fixed`. For more details, see
6161
// http://meyerweb.com/eric/thoughts/2011/09/12/un-fixing-fixed-elements-with-css-transforms/
6262
<ContextMenu id={`monitor-${props.label}`}>
63-
<MenuItem onClick={props.onSetModeToDefault}>
64-
<FormattedMessage
65-
defaultMessage="normal readout"
66-
description="Menu item to switch to the default monitor"
67-
id="gui.monitor.contextMenu.default"
68-
/>
69-
</MenuItem>
70-
<MenuItem onClick={props.onSetModeToLarge}>
71-
<FormattedMessage
72-
defaultMessage="large readout"
73-
description="Menu item to switch to the large monitor"
74-
id="gui.monitor.contextMenu.large"
75-
/>
76-
</MenuItem>
77-
{props.onSetModeToSlider ? (
63+
{props.onSetModeToDefault &&
64+
<MenuItem onClick={props.onSetModeToDefault}>
65+
<FormattedMessage
66+
defaultMessage="normal readout"
67+
description="Menu item to switch to the default monitor"
68+
id="gui.monitor.contextMenu.default"
69+
/>
70+
</MenuItem>}
71+
{props.onSetModeToLarge &&
72+
<MenuItem onClick={props.onSetModeToLarge}>
73+
<FormattedMessage
74+
defaultMessage="large readout"
75+
description="Menu item to switch to the large monitor"
76+
id="gui.monitor.contextMenu.large"
77+
/>
78+
</MenuItem>}
79+
{props.onSetModeToSlider &&
7880
<MenuItem onClick={props.onSetModeToSlider}>
7981
<FormattedMessage
8082
defaultMessage="slider"
8183
description="Menu item to switch to the slider monitor"
8284
id="gui.monitor.contextMenu.slider"
8385
/>
84-
</MenuItem>
85-
) : null}
86+
</MenuItem>}
87+
{props.onImport &&
88+
<MenuItem onClick={props.onImport}>
89+
<FormattedMessage
90+
defaultMessage="import"
91+
description="Menu item to import into list monitors"
92+
id="gui.monitor.contextMenu.import"
93+
/>
94+
</MenuItem>}
95+
{props.onExport &&
96+
<MenuItem onClick={props.onExport}>
97+
<FormattedMessage
98+
defaultMessage="export"
99+
description="Menu item to export from list monitors"
100+
id="gui.monitor.contextMenu.export"
101+
/>
102+
</MenuItem>}
86103
</ContextMenu>
87104
), document.body)}
88105
</ContextMenuTrigger>
@@ -100,9 +117,11 @@ MonitorComponent.propTypes = {
100117
label: PropTypes.string.isRequired,
101118
mode: PropTypes.oneOf(monitorModes),
102119
onDragEnd: PropTypes.func.isRequired,
120+
onExport: PropTypes.func,
121+
onImport: PropTypes.func,
103122
onNextMode: PropTypes.func.isRequired,
104-
onSetModeToDefault: PropTypes.func.isRequired,
105-
onSetModeToLarge: PropTypes.func.isRequired,
123+
onSetModeToDefault: PropTypes.func,
124+
onSetModeToLarge: PropTypes.func,
106125
onSetModeToSlider: PropTypes.func
107126
};
108127

‎src/components/telemetry-modal/telemetry-modal-header.png‎

9.58 KB
Loading

‎src/components/telemetry-modal/telemetry-modal.css‎

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
@import "../../css/colors.css";
2+
@import "../../css/units.css";
3+
@import "../../css/typography.css";
4+
@import "../../css/z-index.css";
5+
6+
.modal-overlay {
7+
position: fixed;
8+
top: 0;
9+
left: 0;
10+
right: 0;
11+
bottom: 0;
12+
z-index: $z-index-modal;
13+
background-color: $ui-modal-overlay;
14+
}
15+
16+
.modal-content {
17+
margin: 100px auto;
18+
outline: none;
19+
border: .25rem solid $ui-white-transparent;
20+
padding: 0;
21+
border-radius: $space;
22+
user-select: none;
23+
width: 640px;
24+
25+
color: $text-primary;
26+
overflow: hidden;
27+
}
28+
29+
.illustration {
30+
width: 100%;
31+
height: 123px;
32+
background-color: $motion-primary;
33+
background-image: url('./telemetry-modal-header.png');
34+
background-size: cover;
35+
}
36+
37+
.body {
38+
background: $ui-white;
39+
padding: 1.5rem 2.25rem;
40+
text-align: left;
41+
}
42+
43+
.privacy-policy-link {
44+
color: $motion-primary;
45+
text-decoration: none;
46+
}
47+
48+
/* Confirmation buttons at the bottom of the modal */
49+
.button-row {
50+
margin: 1.5rem 0;
51+
font-weight: bolder;
52+
text-align: right;
53+
display: flex;
54+
justify-content: center;
55+
}
56+
57+
.button-row button {
58+
border: 1px solid $motion-primary;
59+
border-radius: 0.25rem;
60+
padding: 0.5rem 1.5rem;
61+
background: white;
62+
font-weight: bold;
63+
font-size: .875rem;
64+
cursor: pointer;
65+
}
66+
67+
.button-row button.opt-in {
68+
background: $motion-primary;
69+
color: white;
70+
}
71+
72+
.button-row button.opt-out {
73+
color: $motion-primary;
74+
}
75+
76+
[dir="ltr"] .button-row button + button {
77+
margin-left: 0.5rem;
78+
}
79+
80+
[dir="rtl"] .button-row button + button {
81+
margin-right: 0.5rem;
82+
}

0 commit comments

Comments
 (0)