diff options
| author | Jared Adams <jaxad0127@gmail.com> | 2013-06-26 17:29:39 -0600 |
|---|---|---|
| committer | Ben Longbons <b.r.longbons@gmail.com> | 2013-06-26 16:45:36 -0700 |
| commit | bf3c95526b3d28c200745470197d65e2a3de0f21 (patch) | |
| tree | db1a279818d95cbdcb1041b92c7cd7404bf7b270 | |
| parent | d4f71d8ed7a57cddb59dd58ca0b60558a984a2a1 (diff) | |
| download | manaportal-bf3c95526b3d28c200745470197d65e2a3de0f21.tar.gz manaportal-bf3c95526b3d28c200745470197d65e2a3de0f21.tar.bz2 manaportal-bf3c95526b3d28c200745470197d65e2a3de0f21.tar.xz manaportal-bf3c95526b3d28c200745470197d65e2a3de0f21.zip | |
Add mp.dye.asDyeString(dye) and fix up some HTML
| -rw-r--r-- | public/dye.html | 3 | ||||
| -rw-r--r-- | public/images/bigcake.png | bin | 0 -> 957 bytes | |||
| -rw-r--r-- | public/js/mp/dye.js | 34 | ||||
| -rw-r--r-- | public/playground.html | 16 |
4 files changed, 45 insertions, 8 deletions
diff --git a/public/dye.html b/public/dye.html index f7ca177..6e8026d 100644 --- a/public/dye.html +++ b/public/dye.html @@ -1,6 +1,7 @@ <!DOCTYPE html> -<html> +<html lang="en"> <head> + <meta charset="utf-8"/> <title>Dyer</title> <style type="text/css"> .viewport { diff --git a/public/images/bigcake.png b/public/images/bigcake.png Binary files differnew file mode 100644 index 0000000..7cc92b5 --- /dev/null +++ b/public/images/bigcake.png diff --git a/public/js/mp/dye.js b/public/js/mp/dye.js index e7af938..c8c5fd5 100644 --- a/public/js/mp/dye.js +++ b/public/js/mp/dye.js @@ -3,6 +3,7 @@ var mp = function(mp) { mp.dye = { getChannel: getChannel, parseDyeString: parseDyeString, + asDyeString: asDyeString, dyeImage: dyeImage }; @@ -63,6 +64,39 @@ var mp = function(mp) { } /* + * Return a dye string matching the given dye specification. + */ + function asDyeString(dye) { + var dyeString = ""; + + // skip null channel + for (var i = 1; i < channel.length; i++) { + var dyeChannel = channel[i]; + var dyeParts = dye[dyeChannel]; + if (!dyeParts || dyeParts.length == 0) { + continue; + } + + dyeString += dyeChannel + ":#"; + + for (var j = 0; j < dyeParts.length; j++) { + var color = dyeParts[j]; + dyeString += color[0].toString(16) + color[1].toString(16) + color[2].toString(16) + ","; + } + + dyeString = dyeString.slice(0, -1); + + dyeString += "|"; + } + + if (dyeString.length > 0) { + dyeString = dyeString.slice(0, -1); + } + + return dyeString; + } + + /* * Dye the internal image data based on the specification provided by dyeData. * The specification can be generated from a dyeString by parseDyeString. * The array passed in will be modified. diff --git a/public/playground.html b/public/playground.html index 10ac6c2..4e9e98c 100644 --- a/public/playground.html +++ b/public/playground.html @@ -1,20 +1,21 @@ <!DOCTYPE html> -<meta charset="utf-8"> -<html> +<html lang="en"> <head> +<meta charset="utf-8"> +<title>Mana Portal Playground</title> +<script src="js/mp/dye.js"></script> +<script src="js/mp/resource.js"></script> </head> <body> <canvas id="original" width="32" height="32"></canvas> <canvas id="dyed" width="32" height="32"></canvas> -</body> - -<script src="js/mp/dye.js"></script> -<script src="js/mp/resource.js"></script> +<span id="dyeOut"></span> <script> var dyeString = "R:#ede5b2,fff7bf|G:#cccccc,ffffff"; var dyeData = mp.dye.parseDyeString(dyeString); +document.getElementById("dyeOut").innerText = mp.dye.asDyeString(dyeData); -mp.resource.loadImage("bigcake.png", function(err, imageData) { +mp.resource.loadImage("images/bigcake.png", function(err, imageData) { var oContext = document.getElementById("original").getContext("2d"); var dContext = document.getElementById("dyed").getContext("2d"); oContext.putImageData(imageData, 0, 0); @@ -22,4 +23,5 @@ mp.resource.loadImage("bigcake.png", function(err, imageData) { dContext.putImageData(imageData, 0, 0); }); </script> +</body> </html> |
