scratchfoundation/scratch-paint
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-paint.git synced 2025-01-08 13:42:00 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Remove dependency on svg renderer

Browse source
This commit is contained in:
DD Liu 2020-10-13 20:59:07 -04:00
parent 6107361318
commit 53cb72d527
4 changed files with 13 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -32,7 +32,7 @@
"minilog": "3.1.0", "minilog": "3.1.0",
"parse-color": "1.0.0", "parse-color": "1.0.0",
"prop-types": "^15.5.10", "prop-types": "^15.5.10",
"scratch-svg-renderer": "0.2.0-prerelease.20200610220938" "scratch-render-fonts": "latest"
}, },
"peerDependencies": { "peerDependencies": {
"react": "^16", "react": "^16",

3
src/containers/paint-editor.jsx
View file

@ -129,7 +129,7 @@ class PaintEditor extends React.Component {
if (this.props.format === Formats.VECTOR && isBitmap(prevProps.format)) { if (this.props.format === Formats.VECTOR && isBitmap(prevProps.format)) {
convertToVector(this.props.clearSelectedItems, this.props.onUpdateImage); convertToVector(this.props.clearSelectedItems, this.props.onUpdateImage);
} else if (isVector(prevProps.format) && this.props.format === Formats.BITMAP) { } else if (isVector(prevProps.format) && this.props.format === Formats.BITMAP) {
convertToBitmap(this.props.clearSelectedItems, this.props.onUpdateImage); convertToBitmap(this.props.clearSelectedItems, this.props.onUpdateImage, this.props.fontInlineFn);
} }
} }
componentWillUnmount () { componentWillUnmount () {
@ -344,6 +344,7 @@ PaintEditor.propTypes = {
changeMode: PropTypes.func.isRequired, changeMode: PropTypes.func.isRequired,
clearSelectedItems: PropTypes.func.isRequired, clearSelectedItems: PropTypes.func.isRequired,
format: PropTypes.oneOf(Object.keys(Formats)), // Internal, up-to-date data format format: PropTypes.oneOf(Object.keys(Formats)), // Internal, up-to-date data format
fontInlineFn: PropTypes.func,
handleSwitchToBitmap: PropTypes.func.isRequired, handleSwitchToBitmap: PropTypes.func.isRequired,
handleSwitchToVector: PropTypes.func.isRequired, handleSwitchToVector: PropTypes.func.isRequired,
image: PropTypes.oneOfType([ image: PropTypes.oneOfType([

10
src/helper/bitmap.js
View file

@ -3,8 +3,8 @@ import {createCanvas, clearRaster, getRaster, hideGuideLayers, showGuideLayers}
import {getGuideColor} from './guides'; import {getGuideColor} from './guides';
import {clearSelection} from './selection'; import {clearSelection} from './selection';
import {ART_BOARD_WIDTH, ART_BOARD_HEIGHT, CENTER, MAX_WORKSPACE_BOUNDS} from './view'; import {ART_BOARD_WIDTH, ART_BOARD_HEIGHT, CENTER, MAX_WORKSPACE_BOUNDS} from './view';
import {inlineSvgFonts} from 'scratch-svg-renderer';
import Formats from '../lib/format'; import Formats from '../lib/format';
import log from '../log/log';
const forEachLinePoint = function (point1, point2, callback) { const forEachLinePoint = function (point1, point2, callback) {
// Bresenham line algorithm // Bresenham line algorithm
@ -404,7 +404,7 @@ const getTrimmedRaster = function (shouldInsert) {
return trimmedRaster; return trimmedRaster;
}; };
const convertToBitmap = function (clearSelectedItems, onUpdateImage) { const convertToBitmap = function (clearSelectedItems, onUpdateImage, optFontInlineFn) {
// @todo if the active layer contains only rasters, drawing them directly to the raster layer // @todo if the active layer contains only rasters, drawing them directly to the raster layer
// would be more efficient. // would be more efficient.
@ -424,7 +424,11 @@ const convertToBitmap = function (clearSelectedItems, onUpdateImage) {
svg.setAttribute('shape-rendering', 'crispEdges'); svg.setAttribute('shape-rendering', 'crispEdges');
let svgString = (new XMLSerializer()).serializeToString(svg); let svgString = (new XMLSerializer()).serializeToString(svg);
svgString = inlineSvgFonts(svgString); if (optFontInlineFn) {
svgString = optFontInlineFn(svgString);
} else {
log.error('Fonts may be converted to bitmap incorrectly if fontInlineFn prop is not set on PaintEditor.');
}
// Put anti-aliased SVG into image, and dump image back into canvas // Put anti-aliased SVG into image, and dump image back into canvas
const img = new Image(); const img = new Image();

3
src/playground/playground.jsx
View file

@ -7,6 +7,9 @@ import {createStore} from 'redux';
import reducer from './reducers/combine-reducers'; import reducer from './reducers/combine-reducers';
import {intlInitialState, IntlProvider} from './reducers/intl.js'; import {intlInitialState, IntlProvider} from './reducers/intl.js';
import styles from './playground.css'; import styles from './playground.css';
// scratch-render-fonts is a playground-only dep. Fonts are expected to be imported
// as a peer dependency, otherwise there will be two copies of them.
import {FONTS} from 'scratch-render-fonts';
const appTarget = document.createElement('div'); const appTarget = document.createElement('div');
appTarget.setAttribute('class', styles.playgroundContainer); appTarget.setAttribute('class', styles.playgroundContainer);