Merge pull request #5709 from jesi-rgb/save-gif

Implement `saveGif` as a native p5 function

Author: endurance21

Gruntfile.js

@@ -150,7 +150,7 @@ module.exports = grunt => {
       source: {
         options: {
           parserOptions: {
-            ecmaVersion: 5
+            ecmaVersion: 8
           }
         },
         src: ['src/**/*.js']
@@ -163,7 +163,7 @@ module.exports = grunt => {
     'eslint-samples': {
       options: {
         parserOptions: {
-          ecmaVersion: 6
+          ecmaVersion: 8
         },
         format: 'unix'
       },
@@ -259,6 +259,16 @@ module.exports = grunt => {
         }
       }
     },
+    babel: {
+      options: {
+        presets: ['@babel/preset-env']
+      },
+      dist: {
+        files: {
+          'lib/p5.pre-min.js': 'lib/p5.js'
+        }
+      }
+    },
 
     // This minifies the javascript into a single file and adds a banner to the
     // front of the file.
@@ -274,8 +284,8 @@ module.exports = grunt => {
       },
       dist: {
         files: {
-          'lib/p5.min.js': 'lib/p5.pre-min.js',
-          'lib/modules/p5Custom.min.js': 'lib/modules/p5Custom.pre-min.js'
+          'lib/p5.min.js': ['lib/p5.pre-min.js'],
+          'lib/modules/p5Custom.min.js': ['lib/modules/p5Custom.pre-min.js']
         }
       }
     },
@@ -523,10 +533,14 @@ module.exports = grunt => {
   grunt.loadNpmTasks('grunt-contrib-clean');
   grunt.loadNpmTasks('grunt-simple-nyc');
 
+  //this library converts the ES6 JS to ES5 so it can be properly minified
+  grunt.loadNpmTasks('grunt-babel');
+
   // Create the multitasks.
   grunt.registerTask('build', [
     'browserify',
     'browserify:min',
+    'babel',
     'uglify',
     'browserify:test'
   ]);

lib/empty-example/.gitignore

@@ -0,0 +1,2 @@
+*.html
+*.js

lib/empty-example/index.html

@@ -9,9 +9,10 @@
     body {
       padding: 0;
       margin: 0;
+      background-color: #1b1b1b;
     }
   </style>
-  <script src="../p5.js"></script>
+  <script src="../p5.min.js"></script>
   <!-- <script src="../addons/p5.sound.js"></script> -->
   <script src="sketch.js"></script>
 </head>

lib/empty-example/sketch.js

@@ -4,4 +4,4 @@ function setup() {
 
 function draw() {
   // put drawing code here
-}
+}

package-lock.json

@@ -67,6 +67,7 @@
     "grunt-mocha-test": "^0.13.3",
     "grunt-newer": "^1.1.0",
     "grunt-simple-nyc": "^3.0.1",
+    "grunt-babel": "^8.0.0",
     "html-entities": "^1.3.1",
     "husky": "^4.2.3",
     "i18next": "^19.0.2",
@@ -85,7 +86,8 @@
     "regenerator-runtime": "^0.13.3",
     "request": "^2.88.0",
     "simple-git": "^3.3.0",
-    "whatwg-fetch": "^2.0.4"
+    "whatwg-fetch": "^2.0.4",
+    "gifenc": "^1.0.3"
   },
   "license": "LGPL-2.1",
   "main": "./lib/p5.min.js",
@@ -154,7 +156,6 @@
     "not dead"
   ],
   "author": "",
-  "dependencies": {},
   "husky": {
     "hooks": {
       "pre-commit": "lint-staged"

package.json

@@ -184,7 +184,10 @@ p5.prototype.saveCanvas = function() {
   }, mimeType);
 };
 
-p5.prototype.saveGif = function(pImg, filename) {
+// this is the old saveGif, left here for compatibility purposes
+// the only place I found it being used was on image/p5.Image.js, on the
+// save function. that has been changed to use this function.
+p5.prototype.encodeAndDownloadGif = function(pImg, filename) {
   const props = pImg.gifProperties;
 
   //convert loopLimit back into Netscape Block formatting