Add Scratch font to dropdown

In TurboWarp it is actually ScratchSavers
TurboWarp · May 10, 2024 · 0186bfb · 0186bfb
1 parent cf0ca19
commit 0186bfb
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 0 deletions.
diff --git a/src/components/font-dropdown/font-dropdown.jsx b/src/components/font-dropdown/font-dropdown.jsx
@@ -90,6 +90,16 @@ const ModeToolsComponent = props => (
                         getFontName={props.getFontName}
                     />
                 </Button>
+                <Button
+                    className={classNames(styles.modMenuItem)}
+                    onClick={props.onChoose}
+                    onMouseOver={props.onHoverScratch}
+                >
+                    <DisplayFont
+                        font={Fonts.SCRATCH}
+                        getFontName={props.getFontName}
+                    />
+                </Button>
                 <Button
                     className={classNames(styles.modMenuItem)}
                     onClick={props.onChoose}
@@ -181,6 +191,7 @@ ModeToolsComponent.propTypes = {
     onHoverKorean: PropTypes.func,
     onHoverMarker: PropTypes.func,
     onHoverPixel: PropTypes.func,
+    onHoverScratch: PropTypes.func,
     onHoverSansSerif: PropTypes.func,
     onHoverSerif: PropTypes.func,
     onOpenDropdown: PropTypes.func

diff --git a/src/containers/font-dropdown.jsx b/src/containers/font-dropdown.jsx
@@ -22,6 +22,7 @@ class FontDropdown extends React.Component {
             'handleChangeFontMarker',
             'handleChangeFontCurly',
             'handleChangeFontPixel',
+            'handleChangeFontScratch',
             'handleChangeFontChinese',
             'handleChangeFontJapanese',
             'handleChangeFontKorean',
@@ -91,6 +92,11 @@ class FontDropdown extends React.Component {
             this.props.changeFont(Fonts.PIXEL);
         }
     }
+    handleChangeFontScratch () {
+        if (this.dropDown.isOpen()) {
+            this.props.changeFont(Fonts.SCRATCH);
+        }
+    }
     handleChangeFontChinese () {
         if (this.dropDown.isOpen()) {
             this.props.changeFont(Fonts.CHINESE);
@@ -155,6 +161,7 @@ class FontDropdown extends React.Component {
                 onHoverKorean={this.handleChangeFontKorean}
                 onHoverMarker={this.handleChangeFontMarker}
                 onHoverPixel={this.handleChangeFontPixel}
+                onHoverScratch={this.handleChangeFontScratch}
                 onHoverSansSerif={this.handleChangeFontSansSerif}
                 onHoverSerif={this.handleChangeFontSerif}
                 onOpenDropdown={this.handleOpenDropdown}

diff --git a/src/lib/fonts.js b/src/lib/fonts.js
@@ -5,6 +5,7 @@ const Fonts = {
     MARKER: 'Marker',
     CURLY: 'Curly',
     PIXEL: 'Pixel',
+    SCRATCH: 'Scratch',
     CHINESE: '"Microsoft YaHei", "微软雅黑", STXihei, "华文细黑"',
     JAPANESE: '"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic"',
     KOREAN: 'Malgun Gothic'