Save as jpeg on edit if > limit. (#3943) (#3999)

server/src/config.js

@@ -42,6 +42,20 @@ var conf = convict({
     env: "LOCALHOST_SSL",
     arg: "localhost-ssl"
   },
+  pngToJpegCutoff: {
+    doc: "The limit at which a PNG is converted to a JPEG during an edit save, in bytes.  It should match the setting in the addon",
+    format: "int",
+    default: 2500000,
+    env: "PNG_TO_JPEG_CUTOFF",
+    arg: "pngToJpegCutoff"
+  },
+  requestBodySizeLimit: {
+    doc: "The maximum allowed body size of a request.  It needs to be a format that the 'bytes' node module accepts",
+    format: String,
+    default: "25mb",
+    env: "REQUEST_BODY_SIZE_LIMIT",
+    arg: "requestBodySizeLimit"
+  },
   useS3: {
     doc: "If true, store files in s3. If false, store them locally",
     format: Boolean,

server/src/pages/shot/editor.js

@@ -416,6 +416,14 @@ exports.Editor = class Editor extends React.Component {
     this.imageContext.drawImage(this.highlighter, 0, 0);
     this.highlightContext.clearRect(0, 0, this.imageCanvas.width, this.imageCanvas.height);
     let dataUrl = this.imageCanvas.toDataURL();
+
+    if (this.props.pngToJpegCutoff && dataUrl.length > this.props.pngToJpegCutoff) {
+      let jpegDataUrl = this.imageCanvas.toDataURL("image/jpeg");
+      if (jpegDataUrl.length < dataUrl.length) {
+        dataUrl = jpegDataUrl;
+      }
+    }
+
     let dimensions = {x: this.canvasWidth, y: this.canvasHeight};
     this.props.onClickSave(dataUrl, dimensions);
   }

server/src/pages/shot/model.js

@@ -66,6 +66,7 @@ exports.createModel = function(req) {
     simple: false,
     retentionTime: req.config.expiredRetentionTime * 1000,
     defaultExpiration: req.config.defaultExpiration * 1000,
+    pngToJpegCutoff: req.config.pngToJpegCutoff,
     hashAnalytics: true,
     userAgent: req.headers['user-agent'],
     blockType: req.shot.blockType,

server/src/pages/shot/view.js

@@ -209,7 +209,7 @@ class Body extends React.Component {
     let clipNames = shot.clipNames();
     let clip = shot.getClip(clipNames[0]);
     return <reactruntime.BodyTemplate {...this.props}>
-        <Editor clip={clip} onCancelEdit={this.onCancelEdit.bind(this)} onClickSave={this.onClickSave.bind(this)}></Editor>
+        <Editor clip={clip} pngToJpegCutoff={this.props.pngToJpegCutoff} onCancelEdit={this.onCancelEdit.bind(this)} onClickSave={this.onClickSave.bind(this)}></Editor>
     </reactruntime.BodyTemplate>;
   }
 

server/src/server.js

@@ -182,7 +182,7 @@ app.use((req, res, next) => {
 });
 
 app.use(bodyParser.urlencoded({extended: false}));
-app.use(bodyParser.json({limit: '25mb'}));
+app.use(bodyParser.json({limit: config.requestBodySizeLimit}));
 
 app.use("/static", express.static(path.join(__dirname, "static"), {
   index: false,