diff --git a/examples/bi_icecream.png b/examples/bi_icecream.png new file mode 100644 index 0000000..332cf38 Binary files /dev/null and b/examples/bi_icecream.png differ diff --git a/examples/gay_samsung.png b/examples/gay_samsung.png new file mode 100644 index 0000000..b887b9d Binary files /dev/null and b/examples/gay_samsung.png differ diff --git a/examples/pan_pokemon.png b/examples/pan_pokemon.png new file mode 100644 index 0000000..311fe2f Binary files /dev/null and b/examples/pan_pokemon.png differ diff --git a/examples/readme.txt b/examples/readme.txt new file mode 100644 index 0000000..be6e3b2 --- /dev/null +++ b/examples/readme.txt @@ -0,0 +1,3 @@ +all made using the website ! +use these if u want idc +no credit needed but u can if u want :3 \ No newline at end of file diff --git a/index.html b/index.html index 2ced751..e181f8c 100644 --- a/index.html +++ b/index.html @@ -1,10 +1,15 @@ - ((working title)) + Pride PFP Maker + + + + + @@ -17,7 +22,10 @@
- Pride PFP Generator | + + + Pride PFP Maker | + customize your PFPs with pride flags ! v0.5
@@ -81,7 +89,11 @@ change the pride flag !
-
+ +
+ + +
@@ -93,8 +105,8 @@
- - + more settings ! +
@@ -141,7 +153,7 @@ img.onerror = () => alert('bitch the fuck did u give me !'); img.src = URL.createObjectURL(file); // set src to blob url - }; + } function onPfpUpload(img) { resetEditor(); @@ -151,6 +163,19 @@ selectDiv(editorDiv); } + var refreshing = false; + const refreshCool = 250; + function requestRefresh() { + if (refreshing) + return; + refreshing = true; + + setTimeout(() => { + refreshing = false; + editor.refreshCanvas(); + }, refreshCool); + } + // editor var editor = null; function resetEditor() { diff --git a/src/assets/example_assets/bathtime.jpg b/src/assets/example_assets/bathtime.jpg new file mode 100644 index 0000000..a7b4ae0 Binary files /dev/null and b/src/assets/example_assets/bathtime.jpg differ diff --git a/src/assets/example_assets/clouds.png b/src/assets/example_assets/clouds.png new file mode 100644 index 0000000..e519fe7 Binary files /dev/null and b/src/assets/example_assets/clouds.png differ diff --git a/src/assets/example_assets/custom_gradient.jpg b/src/assets/example_assets/custom_gradient.jpg new file mode 100644 index 0000000..c3a54ef Binary files /dev/null and b/src/assets/example_assets/custom_gradient.jpg differ diff --git a/src/assets/example_assets/custom_modern.jpg b/src/assets/example_assets/custom_modern.jpg new file mode 100644 index 0000000..82b1c9d Binary files /dev/null and b/src/assets/example_assets/custom_modern.jpg differ diff --git a/src/assets/example_assets/custom_trans.png b/src/assets/example_assets/custom_trans.png new file mode 100644 index 0000000..8dc30e6 Binary files /dev/null and b/src/assets/example_assets/custom_trans.png differ diff --git a/src/assets/example_assets/eye.png b/src/assets/example_assets/eye.png new file mode 100644 index 0000000..2f56423 Binary files /dev/null and b/src/assets/example_assets/eye.png differ diff --git a/src/assets/example_assets/flowers.jpg b/src/assets/example_assets/flowers.jpg new file mode 100644 index 0000000..e4b4716 Binary files /dev/null and b/src/assets/example_assets/flowers.jpg differ diff --git a/src/assets/example_assets/kiss.jpg b/src/assets/example_assets/kiss.jpg new file mode 100644 index 0000000..a88b2f6 Binary files /dev/null and b/src/assets/example_assets/kiss.jpg differ diff --git a/src/assets/example_assets/milk.jpg b/src/assets/example_assets/milk.jpg new file mode 100644 index 0000000..871bd07 Binary files /dev/null and b/src/assets/example_assets/milk.jpg differ diff --git a/src/assets/favicon.png b/src/assets/favicon.png new file mode 100644 index 0000000..f817bcb Binary files /dev/null and b/src/assets/favicon.png differ diff --git a/src/assets/logo_24.png b/src/assets/logo_24.png new file mode 100644 index 0000000..a5b51da Binary files /dev/null and b/src/assets/logo_24.png differ diff --git a/src/assets/logo_32.png b/src/assets/logo_32.png new file mode 100644 index 0000000..57fb97b Binary files /dev/null and b/src/assets/logo_32.png differ diff --git a/src/assets/logo_64.png b/src/assets/logo_64.png new file mode 100644 index 0000000..748b909 Binary files /dev/null and b/src/assets/logo_64.png differ diff --git a/src/pfppride/editor.js b/src/pfppride/editor.js index 1a8a281..f87ea47 100644 --- a/src/pfppride/editor.js +++ b/src/pfppride/editor.js @@ -84,8 +84,8 @@ class Editor { this.ctx.drawImage( this.pfpImg, - -(scaledWidth - this.pfpImg.width)/2 + this.pfpImgScale * this.pfpImgOffX, - -(scaledHeight - this.pfpImg.height*widthHeightRatio)/2 + this.pfpImgScale * this.pfpImgOffY, + -(scaledWidth - this.pfpImg.width)/2 + this.pfpImgOffX, + -(scaledHeight - this.pfpImg.height*widthHeightRatio)/2 + this.pfpImgOffY, scaledWidth, scaledHeight ); @@ -126,20 +126,29 @@ class Editor { } } + // settings + centerImgScale() { + this.pfpImgScale = (this.pfpImg.width > this.pfpImg.height) + ? this.pfpImg.width / this.pfpImg.height + : this.pfpImg.height / this.pfpImg.width; + } + + fitImgScaleToRing() { + this.centerImgScale(); + this.pfpImgScale *= this.pfpRingScale; + } + resetSettingsDefault() { this.pfpImgOffX = 0; this.pfpImgOffY = 0; - this.pfpImgScale = - this.pfpImg.width > this.pfpImg.height ? - this.pfpImg.width / this.pfpImg.height : - this.pfpImg.height / this.pfpImg.width; + this.centerImgScale(); // pfp mode cases ! switch (this.pfpMode) { case 0: { - this.pfpRingScale = 0.875; - this.pfpImgScale *= this.pfpRingScale; + this.pfpRingScale = 0.9; // 0.9 for thin, 0.875 for thick + this.fitImgScaleToRing(); break; } }