add pack download feature

docs/_next/static/chunks/2d2bdb29c69093a9.js

@@ -1 +1 @@
-(globalThis.TURBOPACK||(globalThis.TURBOPACK=[])).push(["object"==typeof document?document.currentScript:void 0,78631,(e,t,n)=>{!function(t,n){if("function"==typeof define&&define.amd){let t;void 0!==(t=n())&&e.v(t)}else n()}(e.e,function(){"use strict";function n(e,t,n){var o=new XMLHttpRequest;o.open("GET",e),o.responseType="blob",o.onload=function(){s(o.response,t,n)},o.onerror=function(){console.error("could not download file")},o.send()}function o(e){var t=new XMLHttpRequest;t.open("HEAD",e,!1);try{t.send()}catch(e){}return 200<=t.status&&299>=t.status}function a(e){try{e.dispatchEvent(new MouseEvent("click"))}catch(n){var t=document.createEvent("MouseEvents");t.initMouseEvent("click",!0,!0,window,0,0,0,80,20,!1,!1,!1,!1,0,null),e.dispatchEvent(t)}}var i="object"==typeof window&&window.window===window?window:"object"==typeof self&&self.self===self?self:e.g.global===e.g?e.g:void 0,r=i.navigator&&/Macintosh/.test(navigator.userAgent)&&/AppleWebKit/.test(navigator.userAgent)&&!/Safari/.test(navigator.userAgent),s=i.saveAs||("object"!=typeof window||window!==i?function(){}:"download"in HTMLAnchorElement.prototype&&!r?function(e,t,r){var s=i.URL||i.webkitURL,c=document.createElement("a");c.download=t=t||e.name||"download",c.rel="noopener","string"==typeof e?(c.href=e,c.origin===location.origin?a(c):o(c.href)?n(e,t,r):a(c,c.target="_blank")):(c.href=s.createObjectURL(e),setTimeout(function(){s.revokeObjectURL(c.href)},4e4),setTimeout(function(){a(c)},0))}:"msSaveOrOpenBlob"in navigator?function(e,t,i){if(t=t||e.name||"download","string"!=typeof e){var r;navigator.msSaveOrOpenBlob((void 0===(r=i)?r={autoBom:!1}:"object"!=typeof r&&(console.warn("Deprecated: Expected third argument to be a object"),r={autoBom:!r}),r.autoBom&&/^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(e.type)?new Blob(["\uFEFF",e],{type:e.type}):e),t)}else if(o(e))n(e,t,i);else{var s=document.createElement("a");s.href=e,s.target="_blank",setTimeout(function(){a(s)})}}:function(e,t,o,a){if((a=a||open("","_blank"))&&(a.document.title=a.document.body.innerText="downloading..."),"string"==typeof e)return n(e,t,o);var s="application/octet-stream"===e.type,c=/constructor/i.test(i.HTMLElement)||i.safari,l=/CriOS\/[\d]+/.test(navigator.userAgent);if((l||s&&c||r)&&"undefined"!=typeof FileReader){var u=new FileReader;u.onloadend=function(){var e=u.result;e=l?e:e.replace(/^data:[^;]*;/,"data:attachment/file;"),a?a.location.href=e:location=e,a=null},u.readAsDataURL(e)}else{var f=i.URL||i.webkitURL,d=f.createObjectURL(e);a?a.location=d:location.href=d,a=null,setTimeout(function(){f.revokeObjectURL(d)},4e4)}});i.saveAs=s.saveAs=s,t.exports=s})},69642,e=>{"use strict";e.s(["createZipFile",()=>o,"savePngFile",()=>i,"saveZipFile",()=>a]);var t=e.i(71315),n=e.i(78631);function o(e){let n=new t.default;for(let t of e)n.file("textures/skins/".concat(t.name),t.data);return n}async function a(e,t){let o=await e.generateAsync({type:"blob"});(0,n.saveAs)(o,t)}function i(e,t){(0,n.saveAs)(e,t)}}]);
+(globalThis.TURBOPACK||(globalThis.TURBOPACK=[])).push(["object"==typeof document?document.currentScript:void 0,78631,(e,t,n)=>{!function(t,n){if("function"==typeof define&&define.amd){let t;void 0!==(t=n())&&e.v(t)}else n()}(e.e,function(){"use strict";function n(e,t,n){var o=new XMLHttpRequest;o.open("GET",e),o.responseType="blob",o.onload=function(){s(o.response,t,n)},o.onerror=function(){console.error("could not download file")},o.send()}function o(e){var t=new XMLHttpRequest;t.open("HEAD",e,!1);try{t.send()}catch(e){}return 200<=t.status&&299>=t.status}function a(e){try{e.dispatchEvent(new MouseEvent("click"))}catch(n){var t=document.createEvent("MouseEvents");t.initMouseEvent("click",!0,!0,window,0,0,0,80,20,!1,!1,!1,!1,0,null),e.dispatchEvent(t)}}var i="object"==typeof window&&window.window===window?window:"object"==typeof self&&self.self===self?self:e.g.global===e.g?e.g:void 0,r=i.navigator&&/Macintosh/.test(navigator.userAgent)&&/AppleWebKit/.test(navigator.userAgent)&&!/Safari/.test(navigator.userAgent),s=i.saveAs||("object"!=typeof window||window!==i?function(){}:"download"in HTMLAnchorElement.prototype&&!r?function(e,t,r){var s=i.URL||i.webkitURL,c=document.createElement("a");c.download=t=t||e.name||"download",c.rel="noopener","string"==typeof e?(c.href=e,c.origin===location.origin?a(c):o(c.href)?n(e,t,r):a(c,c.target="_blank")):(c.href=s.createObjectURL(e),setTimeout(function(){s.revokeObjectURL(c.href)},4e4),setTimeout(function(){a(c)},0))}:"msSaveOrOpenBlob"in navigator?function(e,t,i){if(t=t||e.name||"download","string"!=typeof e){var r;navigator.msSaveOrOpenBlob((void 0===(r=i)?r={autoBom:!1}:"object"!=typeof r&&(console.warn("Deprecated: Expected third argument to be a object"),r={autoBom:!r}),r.autoBom&&/^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(e.type)?new Blob(["\uFEFF",e],{type:e.type}):e),t)}else if(o(e))n(e,t,i);else{var s=document.createElement("a");s.href=e,s.target="_blank",setTimeout(function(){a(s)})}}:function(e,t,o,a){if((a=a||open("","_blank"))&&(a.document.title=a.document.body.innerText="downloading..."),"string"==typeof e)return n(e,t,o);var s="application/octet-stream"===e.type,c=/constructor/i.test(i.HTMLElement)||i.safari,l=/CriOS\/[\d]+/.test(navigator.userAgent);if((l||s&&c||r)&&"undefined"!=typeof FileReader){var u=new FileReader;u.onloadend=function(){var e=u.result;e=l?e:e.replace(/^data:[^;]*;/,"data:attachment/file;"),a?a.location.href=e:location=e,a=null},u.readAsDataURL(e)}else{var f=i.URL||i.webkitURL,d=f.createObjectURL(e);a?a.location=d:location.href=d,a=null,setTimeout(function(){f.revokeObjectURL(d)},4e4)}});i.saveAs=s.saveAs=s,t.exports=s})},69642,e=>{"use strict";e.s(["collectFiles",()=>r,"createZipFile",()=>o,"savePngFile",()=>i,"saveZipFile",()=>a]);var t=e.i(71315),n=e.i(78631);function o(e){let n=new t.default;for(let t of e)n.file("textures/skins/".concat(t.name),t.data);return n}async function a(e,t){let o=await e.generateAsync({type:"blob"});(0,n.saveAs)(o,t)}function i(e,t){(0,n.saveAs)(e,t)}async function r(e){return await Promise.all(e.map(async e=>{let t="".concat("https://exogen.github.io/t2-skins/skins","/").concat(e),n=await fetch(t);return{name:e,data:await n.arrayBuffer()}}))}}]);

docs/_next/static/chunks/3952d3ec98949fe5.css

@@ -0,0 +1 @@
+.gallery-module__zlwOTG__GalleryPage{flex-direction:column}.gallery-module__zlwOTG__Tools{text-align:center;z-index:2;background:rgba(0,0,0,.7);flex:none;grid-template-columns:1fr auto 1fr;align-items:center;padding:10px;display:grid;position:-webkit-sticky;position:sticky;top:0}.gallery-module__zlwOTG__Tools select:focus{outline:none;box-shadow:0 0 1px 1px rgba(0,0,0,.5),0 0 2px 3px #98ffd4}.gallery-module__zlwOTG__HeaderEnd{justify-content:space-between;align-items:center;margin-left:10px;display:flex}.gallery-module__zlwOTG__DownloadSection{align-items:center;gap:8px;display:flex}.gallery-module__zlwOTG__PackVersion{color:rgba(127,180,166,.6);font-size:11px}.gallery-module__zlwOTG__DownloadButton{color:#f7ffdc;letter-spacing:-.03em;text-shadow:0 -1px rgba(25,39,34,.4);cursor:pointer;background:0 0,linear-gradient(#43a782,#0f5957);border:0;border-radius:4px;margin-left:3px;padding:4px 8px 5px;font-size:13px;font-weight:500;text-decoration:none;display:inline-block}.gallery-module__zlwOTG__DownloadButton:active{transform:translateY(1px)}.gallery-module__zlwOTG__Back{color:#fff;justify-self:start;align-items:center;gap:4px;font-size:14px;text-decoration:none;display:inline-flex}.gallery-module__zlwOTG__IconLink{color:rgba(255,255,255,.3);place-content:center;justify-self:end;margin-left:auto;display:grid}.gallery-module__zlwOTG__IconLink:hover{color:#fff}.gallery-module__zlwOTG__Gallery{background:#0c1f28;flex:none;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));width:100%;display:grid}.gallery-module__zlwOTG__Skin{text-align:center;padding-bottom:32px;font-size:12px;position:relative;overflow:hidden}.gallery-module__zlwOTG__Preview{width:100%;height:auto;display:block}.gallery-module__zlwOTG__Name{white-space:nowrap;color:#fff;opacity:.5;background:rgba(0,0,0,.5);border-radius:9999px;padding:3px 10px;display:inline-block;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.gallery-module__zlwOTG__Skin:hover .gallery-module__zlwOTG__Name{opacity:1}@keyframes gallery-module__zlwOTG__spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.gallery-module__zlwOTG__Spinner{flex:none;margin:auto;font-size:64px;animation:2s linear infinite gallery-module__zlwOTG__spin}.gallery-module__zlwOTG__DownloadSpinner{flex:none;margin:auto;font-size:20px;animation:2s linear infinite gallery-module__zlwOTG__spin}@media (max-width:479px){.gallery-module__zlwOTG__Back .gallery-module__zlwOTG__Label,.gallery-module__zlwOTG__DownloadButton{display:none}}@media (max-width:719px){.gallery-module__zlwOTG__PackVersion{display:none}}

docs/_next/static/chunks/be25e0c53b3e76c3.css

@@ -1 +0,0 @@
-.gallery-module__zlwOTG__GalleryPage{flex-direction:column}.gallery-module__zlwOTG__Tools{text-align:center;z-index:2;background:rgba(0,0,0,.7);flex:none;grid-template-columns:1fr auto 1fr;align-items:center;padding:10px;display:grid;position:-webkit-sticky;position:sticky;top:0}.gallery-module__zlwOTG__Tools select:focus{outline:none;box-shadow:0 0 1px 1px rgba(0,0,0,.5),0 0 2px 3px #98ffd4}.gallery-module__zlwOTG__Back{color:#fff;justify-self:start;align-items:center;gap:4px;font-size:14px;text-decoration:none;display:inline-flex}.gallery-module__zlwOTG__IconLink{color:rgba(255,255,255,.3);place-content:center;justify-self:end;display:grid}.gallery-module__zlwOTG__IconLink:hover{color:#fff}.gallery-module__zlwOTG__Gallery{background:#0c1f28;flex:none;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));width:100%;display:grid}.gallery-module__zlwOTG__Skin{text-align:center;padding-bottom:32px;font-size:12px;position:relative;overflow:hidden}.gallery-module__zlwOTG__Preview{width:100%;height:auto;display:block}.gallery-module__zlwOTG__Name{white-space:nowrap;color:#fff;opacity:.5;background:rgba(0,0,0,.5);border-radius:9999px;padding:3px 10px;display:inline-block;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.gallery-module__zlwOTG__Skin:hover .gallery-module__zlwOTG__Name{opacity:1}@keyframes gallery-module__zlwOTG__spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.gallery-module__zlwOTG__Spinner{flex:none;margin:auto;font-size:64px;animation:2s linear infinite gallery-module__zlwOTG__spin}@media (max-width:479px){.gallery-module__zlwOTG__Back .gallery-module__zlwOTG__Label{display:none}}

docs/gallery/index.txt

@@ -2,7 +2,7 @@
 2:I[39756,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-model-skinner/_next/static/chunks/7dd66bdf8a7e5707.js"],"default"]
 3:I[37457,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-model-skinner/_next/static/chunks/7dd66bdf8a7e5707.js"],"default"]
 4:I[47257,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-model-skinner/_next/static/chunks/7dd66bdf8a7e5707.js"],"ClientPageRoot"]
-5:I[25500,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-model-skinner/_next/static/chunks/b12a108b39c3ccf5.js","/t2-model-skinner/_next/static/chunks/c79a3ae78c275630.js"],"default"]
+5:I[25500,["/t2-model-skinner/_next/static/chunks/395c2bae735f87a6.js","/t2-model-skinner/_next/static/chunks/d63fc3798baf75bd.js","/t2-model-skinner/_next/static/chunks/b12a108b39c3ccf5.js","/t2-model-skinner/_next/static/chunks/642c9f483a155826.js"],"default"]
 8:I[97367,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-model-skinner/_next/static/chunks/7dd66bdf8a7e5707.js"],"OutletBoundary"]
 a:I[11533,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-model-skinner/_next/static/chunks/7dd66bdf8a7e5707.js"],"AsyncMetadataOutlet"]
 c:I[97367,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-model-skinner/_next/static/chunks/7dd66bdf8a7e5707.js"],"ViewportBoundary"]
@@ -10,8 +10,8 @@ e:I[97367,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-mode
 f:"$Sreact.suspense"
 11:I[68027,[],"default"]
 :HL["/t2-model-skinner/_next/static/chunks/795c34bef1c92210.css","style"]
-:HL["/t2-model-skinner/_next/static/chunks/be25e0c53b3e76c3.css","style"]
-0:{"P":null,"b":"VUShjGScDRAVMEenNd72_","p":"/t2-model-skinner","c":["","gallery",""],"i":false,"f":[[["",{"children":["gallery",{"children":["__PAGE__",{}]}]},"$undefined","$undefined",true],["",["$","$1","c",{"children":[[["$","link","0",{"rel":"stylesheet","href":"/t2-model-skinner/_next/static/chunks/795c34bef1c92210.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]],["$","html",null,{"lang":"en","children":["$","body",null,{"children":["$","$L2",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L3",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":[[["$","title",null,{"children":"404: This page could not be found."}],["$","div",null,{"style":{"fontFamily":"system-ui,\"Segoe UI\",Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\"","height":"100vh","textAlign":"center","display":"flex","flexDirection":"column","alignItems":"center","justifyContent":"center"},"children":["$","div",null,{"children":[["$","style",null,{"dangerouslySetInnerHTML":{"__html":"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}"}}],["$","h1",null,{"className":"next-error-h1","style":{"display":"inline-block","margin":"0 20px 0 0","padding":"0 23px 0 0","fontSize":24,"fontWeight":500,"verticalAlign":"top","lineHeight":"49px"},"children":404}],["$","div",null,{"style":{"display":"inline-block"},"children":["$","h2",null,{"style":{"fontSize":14,"fontWeight":400,"lineHeight":"49px","margin":0},"children":"This page could not be found."}]}]]}]}]],[]],"forbidden":"$undefined","unauthorized":"$undefined"}]}]}]]}],{"children":["gallery",["$","$1","c",{"children":[null,["$","$L2",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L3",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","forbidden":"$undefined","unauthorized":"$undefined"}]]}],{"children":["__PAGE__",["$","$1","c",{"children":[["$","$L4",null,{"Component":"$5","searchParams":{},"params":{},"promises":["$@6","$@7"]}],[["$","link","0",{"rel":"stylesheet","href":"/t2-model-skinner/_next/static/chunks/be25e0c53b3e76c3.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","script","script-0",{"src":"/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","async":true,"nonce":"$undefined"}],["$","script","script-1",{"src":"/t2-model-skinner/_next/static/chunks/b12a108b39c3ccf5.js","async":true,"nonce":"$undefined"}],["$","script","script-2",{"src":"/t2-model-skinner/_next/static/chunks/c79a3ae78c275630.js","async":true,"nonce":"$undefined"}]],["$","$L8",null,{"children":["$L9",["$","$La",null,{"promise":"$@b"}]]}]]}],{},null,false]},null,false]},null,false],["$","$1","h",{"children":[null,[["$","$Lc",null,{"children":"$Ld"}],null],["$","$Le",null,{"children":["$","div",null,{"hidden":true,"children":["$","$f",null,{"fallback":null,"children":"$L10"}]}]}]]}],false]],"m":"$undefined","G":["$11",[["$","link","0",{"rel":"stylesheet","href":"/t2-model-skinner/_next/static/chunks/795c34bef1c92210.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]]],"s":false,"S":true}
+:HL["/t2-model-skinner/_next/static/chunks/3952d3ec98949fe5.css","style"]
+0:{"P":null,"b":"fFTlXrZYVpcjc_RZhmTtF","p":"/t2-model-skinner","c":["","gallery",""],"i":false,"f":[[["",{"children":["gallery",{"children":["__PAGE__",{}]}]},"$undefined","$undefined",true],["",["$","$1","c",{"children":[[["$","link","0",{"rel":"stylesheet","href":"/t2-model-skinner/_next/static/chunks/795c34bef1c92210.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]],["$","html",null,{"lang":"en","children":["$","body",null,{"children":["$","$L2",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L3",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":[[["$","title",null,{"children":"404: This page could not be found."}],["$","div",null,{"style":{"fontFamily":"system-ui,\"Segoe UI\",Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\"","height":"100vh","textAlign":"center","display":"flex","flexDirection":"column","alignItems":"center","justifyContent":"center"},"children":["$","div",null,{"children":[["$","style",null,{"dangerouslySetInnerHTML":{"__html":"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}"}}],["$","h1",null,{"className":"next-error-h1","style":{"display":"inline-block","margin":"0 20px 0 0","padding":"0 23px 0 0","fontSize":24,"fontWeight":500,"verticalAlign":"top","lineHeight":"49px"},"children":404}],["$","div",null,{"style":{"display":"inline-block"},"children":["$","h2",null,{"style":{"fontSize":14,"fontWeight":400,"lineHeight":"49px","margin":0},"children":"This page could not be found."}]}]]}]}]],[]],"forbidden":"$undefined","unauthorized":"$undefined"}]}]}]]}],{"children":["gallery",["$","$1","c",{"children":[null,["$","$L2",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L3",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","forbidden":"$undefined","unauthorized":"$undefined"}]]}],{"children":["__PAGE__",["$","$1","c",{"children":[["$","$L4",null,{"Component":"$5","searchParams":{},"params":{},"promises":["$@6","$@7"]}],[["$","link","0",{"rel":"stylesheet","href":"/t2-model-skinner/_next/static/chunks/3952d3ec98949fe5.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","script","script-0",{"src":"/t2-model-skinner/_next/static/chunks/395c2bae735f87a6.js","async":true,"nonce":"$undefined"}],["$","script","script-1",{"src":"/t2-model-skinner/_next/static/chunks/d63fc3798baf75bd.js","async":true,"nonce":"$undefined"}],["$","script","script-2",{"src":"/t2-model-skinner/_next/static/chunks/b12a108b39c3ccf5.js","async":true,"nonce":"$undefined"}],["$","script","script-3",{"src":"/t2-model-skinner/_next/static/chunks/642c9f483a155826.js","async":true,"nonce":"$undefined"}]],["$","$L8",null,{"children":["$L9",["$","$La",null,{"promise":"$@b"}]]}]]}],{},null,false]},null,false]},null,false],["$","$1","h",{"children":[null,[["$","$Lc",null,{"children":"$Ld"}],null],["$","$Le",null,{"children":["$","div",null,{"hidden":true,"children":["$","$f",null,{"fallback":null,"children":"$L10"}]}]}]]}],false]],"m":"$undefined","G":["$11",[["$","link","0",{"rel":"stylesheet","href":"/t2-model-skinner/_next/static/chunks/795c34bef1c92210.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]]],"s":false,"S":true}
 6:{}
 7:"$0:f:0:1:2:children:2:children:1:props:children:0:props:params"
 d:[["$","meta","0",{"charSet":"utf-8"}],["$","meta","1",{"name":"viewport","content":"width=device-width, initial-scale=1"}]]

docs/index.txt

@@ -2,7 +2,7 @@
 2:I[39756,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-model-skinner/_next/static/chunks/7dd66bdf8a7e5707.js"],"default"]
 3:I[37457,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-model-skinner/_next/static/chunks/7dd66bdf8a7e5707.js"],"default"]
 4:I[47257,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-model-skinner/_next/static/chunks/7dd66bdf8a7e5707.js"],"ClientPageRoot"]
-5:I[52683,["/t2-model-skinner/_next/static/chunks/00e36f5c4a673582.js","/t2-model-skinner/_next/static/chunks/d63fc3798baf75bd.js","/t2-model-skinner/_next/static/chunks/a55df98dcb3b60ad.js","/t2-model-skinner/_next/static/chunks/9072f9dc67ad2fb2.js","/t2-model-skinner/_next/static/chunks/ec0a6a943ec3891b.js"],"default"]
+5:I[52683,["/t2-model-skinner/_next/static/chunks/7d0d362e234cf43a.js","/t2-model-skinner/_next/static/chunks/d63fc3798baf75bd.js","/t2-model-skinner/_next/static/chunks/a55df98dcb3b60ad.js","/t2-model-skinner/_next/static/chunks/9072f9dc67ad2fb2.js","/t2-model-skinner/_next/static/chunks/ec0a6a943ec3891b.js"],"default"]
 8:I[97367,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-model-skinner/_next/static/chunks/7dd66bdf8a7e5707.js"],"OutletBoundary"]
 a:I[11533,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-model-skinner/_next/static/chunks/7dd66bdf8a7e5707.js"],"AsyncMetadataOutlet"]
 c:I[97367,["/t2-model-skinner/_next/static/chunks/ff1a16fafef87110.js","/t2-model-skinner/_next/static/chunks/7dd66bdf8a7e5707.js"],"ViewportBoundary"]
@@ -11,7 +11,7 @@ f:"$Sreact.suspense"
 11:I[68027,[],"default"]
 :HL["/t2-model-skinner/_next/static/chunks/795c34bef1c92210.css","style"]
 :HL["/t2-model-skinner/_next/static/chunks/df18f9fdc6a3cb7c.css","style"]
-0:{"P":null,"b":"VUShjGScDRAVMEenNd72_","p":"/t2-model-skinner","c":["",""],"i":false,"f":[[["",{"children":["__PAGE__",{}]},"$undefined","$undefined",true],["",["$","$1","c",{"children":[[["$","link","0",{"rel":"stylesheet","href":"/t2-model-skinner/_next/static/chunks/795c34bef1c92210.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]],["$","html",null,{"lang":"en","children":["$","body",null,{"children":["$","$L2",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L3",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":[[["$","title",null,{"children":"404: This page could not be found."}],["$","div",null,{"style":{"fontFamily":"system-ui,\"Segoe UI\",Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\"","height":"100vh","textAlign":"center","display":"flex","flexDirection":"column","alignItems":"center","justifyContent":"center"},"children":["$","div",null,{"children":[["$","style",null,{"dangerouslySetInnerHTML":{"__html":"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}"}}],["$","h1",null,{"className":"next-error-h1","style":{"display":"inline-block","margin":"0 20px 0 0","padding":"0 23px 0 0","fontSize":24,"fontWeight":500,"verticalAlign":"top","lineHeight":"49px"},"children":404}],["$","div",null,{"style":{"display":"inline-block"},"children":["$","h2",null,{"style":{"fontSize":14,"fontWeight":400,"lineHeight":"49px","margin":0},"children":"This page could not be found."}]}]]}]}]],[]],"forbidden":"$undefined","unauthorized":"$undefined"}]}]}]]}],{"children":["__PAGE__",["$","$1","c",{"children":[["$","$L4",null,{"Component":"$5","searchParams":{},"params":{},"promises":["$@6","$@7"]}],[["$","link","0",{"rel":"stylesheet","href":"/t2-model-skinner/_next/static/chunks/df18f9fdc6a3cb7c.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","script","script-0",{"src":"/t2-model-skinner/_next/static/chunks/00e36f5c4a673582.js","async":true,"nonce":"$undefined"}],["$","script","script-1",{"src":"/t2-model-skinner/_next/static/chunks/d63fc3798baf75bd.js","async":true,"nonce":"$undefined"}],["$","script","script-2",{"src":"/t2-model-skinner/_next/static/chunks/a55df98dcb3b60ad.js","async":true,"nonce":"$undefined"}],["$","script","script-3",{"src":"/t2-model-skinner/_next/static/chunks/9072f9dc67ad2fb2.js","async":true,"nonce":"$undefined"}],["$","script","script-4",{"src":"/t2-model-skinner/_next/static/chunks/ec0a6a943ec3891b.js","async":true,"nonce":"$undefined"}]],["$","$L8",null,{"children":["$L9",["$","$La",null,{"promise":"$@b"}]]}]]}],{},null,false]},null,false],["$","$1","h",{"children":[null,[["$","$Lc",null,{"children":"$Ld"}],null],["$","$Le",null,{"children":["$","div",null,{"hidden":true,"children":["$","$f",null,{"fallback":null,"children":"$L10"}]}]}]]}],false]],"m":"$undefined","G":["$11",[["$","link","0",{"rel":"stylesheet","href":"/t2-model-skinner/_next/static/chunks/795c34bef1c92210.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]]],"s":false,"S":true}
+0:{"P":null,"b":"fFTlXrZYVpcjc_RZhmTtF","p":"/t2-model-skinner","c":["",""],"i":false,"f":[[["",{"children":["__PAGE__",{}]},"$undefined","$undefined",true],["",["$","$1","c",{"children":[[["$","link","0",{"rel":"stylesheet","href":"/t2-model-skinner/_next/static/chunks/795c34bef1c92210.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]],["$","html",null,{"lang":"en","children":["$","body",null,{"children":["$","$L2",null,{"parallelRouterKey":"children","error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L3",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":[[["$","title",null,{"children":"404: This page could not be found."}],["$","div",null,{"style":{"fontFamily":"system-ui,\"Segoe UI\",Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\"","height":"100vh","textAlign":"center","display":"flex","flexDirection":"column","alignItems":"center","justifyContent":"center"},"children":["$","div",null,{"children":[["$","style",null,{"dangerouslySetInnerHTML":{"__html":"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}"}}],["$","h1",null,{"className":"next-error-h1","style":{"display":"inline-block","margin":"0 20px 0 0","padding":"0 23px 0 0","fontSize":24,"fontWeight":500,"verticalAlign":"top","lineHeight":"49px"},"children":404}],["$","div",null,{"style":{"display":"inline-block"},"children":["$","h2",null,{"style":{"fontSize":14,"fontWeight":400,"lineHeight":"49px","margin":0},"children":"This page could not be found."}]}]]}]}]],[]],"forbidden":"$undefined","unauthorized":"$undefined"}]}]}]]}],{"children":["__PAGE__",["$","$1","c",{"children":[["$","$L4",null,{"Component":"$5","searchParams":{},"params":{},"promises":["$@6","$@7"]}],[["$","link","0",{"rel":"stylesheet","href":"/t2-model-skinner/_next/static/chunks/df18f9fdc6a3cb7c.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}],["$","script","script-0",{"src":"/t2-model-skinner/_next/static/chunks/7d0d362e234cf43a.js","async":true,"nonce":"$undefined"}],["$","script","script-1",{"src":"/t2-model-skinner/_next/static/chunks/d63fc3798baf75bd.js","async":true,"nonce":"$undefined"}],["$","script","script-2",{"src":"/t2-model-skinner/_next/static/chunks/a55df98dcb3b60ad.js","async":true,"nonce":"$undefined"}],["$","script","script-3",{"src":"/t2-model-skinner/_next/static/chunks/9072f9dc67ad2fb2.js","async":true,"nonce":"$undefined"}],["$","script","script-4",{"src":"/t2-model-skinner/_next/static/chunks/ec0a6a943ec3891b.js","async":true,"nonce":"$undefined"}]],["$","$L8",null,{"children":["$L9",["$","$La",null,{"promise":"$@b"}]]}]]}],{},null,false]},null,false],["$","$1","h",{"children":[null,[["$","$Lc",null,{"children":"$Ld"}],null],["$","$Le",null,{"children":["$","div",null,{"hidden":true,"children":["$","$f",null,{"fallback":null,"children":"$L10"}]}]}]]}],false]],"m":"$undefined","G":["$11",[["$","link","0",{"rel":"stylesheet","href":"/t2-model-skinner/_next/static/chunks/795c34bef1c92210.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]]],"s":false,"S":true}
 6:{}
 7:"$0:f:0:1:2:children:1:props:children:0:props:params"
 d:[["$","meta","0",{"charSet":"utf-8"}],["$","meta","1",{"name":"viewport","content":"width=device-width, initial-scale=1"}]]

src/app/gallery/gallery.module.css

@@ -20,6 +20,45 @@
   box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.5), 0 0 2px 3px rgb(152, 255, 212);
 }
 
+.HeaderEnd {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-left: 10px;
+}
+
+.DownloadSection {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.PackVersion {
+  font-size: 11px;
+  color: rgba(127, 180, 166, 0.6);
+}
+
+.DownloadButton {
+  display: inline-block;
+  border: 0;
+  border-radius: 4px;
+  padding: 4px 8px 5px 8px;
+  background: rgb(14, 114, 98),
+    linear-gradient(to bottom, rgb(67, 167, 130), rgb(15, 89, 87));
+  color: rgb(247, 255, 220);
+  font-size: 13px;
+  font-weight: 500;
+  letter-spacing: -0.03em;
+  text-decoration: none;
+  text-shadow: 0 -1px 0 rgba(25, 39, 34, 0.4);
+  margin-left: 3px;
+  cursor: pointer;
+}
+
+.DownloadButton:active {
+  transform: translate3d(0, 1px, 0);
+}
+
 .Back {
   justify-self: start;
   display: inline-flex;
@@ -31,6 +70,7 @@
 }
 
 .IconLink {
+  margin-left: auto;
   justify-self: end;
   display: grid;
   place-content: center;
@@ -98,8 +138,25 @@
   animation: spin 2s linear infinite;
 }
 
+.DownloadSpinner {
+  flex: 0 0 auto;
+  margin: auto;
+  font-size: 20px;
+  animation: spin 2s linear infinite;
+}
+
 @media (max-width: 479px) {
   .Back .Label {
     display: none;
   }
+
+  .DownloadButton {
+    display: none;
+  }
+}
+
+@media (max-width: 719px) {
+  .PackVersion {
+    display: none;
+  }
 }

src/app/gallery/page.tsx

@@ -8,6 +8,7 @@ import useManifest from "../../useManifest";
 import styles from "./gallery.module.css";
 import Head from "next/head";
 import Link from "next/link";
+import { collectFiles, createZipFile, saveZipFile } from "../../exportUtils";
 
 const baseManifestPath = `https://exogen.github.io/t2-skins`;
 const emptySkins: string[] = [];
@@ -64,11 +65,45 @@ function Gallery() {
   const searchParams = useSearchParams();
   const [manifest, isLoaded] = useManifest();
   const [selectedModel, setSelectedModel] = useState("lmale");
+  const [isPreparingDownload, setPreparingDownload] = useState(false);
   const actualModel = selectedModel === "hfemale" ? "hmale" : selectedModel;
   const customSkins = manifest.customSkins?.[actualModel] ?? emptySkins;
 
   const isNew = selectedModel === "new";
-  const isPack = manifest?.packs?.[selectedModel] != null;
+  const pack = manifest?.packs?.[selectedModel];
+  const isPack = pack != null;
+
+  useEffect(() => {
+    if (pack && isPreparingDownload) {
+      let ignore = false;
+
+      const download = async () => {
+        const files = await collectFiles(pack.files);
+        if (!ignore) {
+          const zip = createZipFile(files);
+          await new Promise((resolve) => setTimeout(resolve, 500));
+          if (!ignore) {
+            await saveZipFile(
+              zip,
+              `zSkinPack-${selectedModel.replace(/ /g, "_")}-v${
+                pack.version
+              }.vl2`
+            );
+          }
+          if (!ignore) {
+            setPreparingDownload(false);
+          }
+        }
+      };
+
+      download();
+
+      return () => {
+        ignore = true;
+        setPreparingDownload(false);
+      };
+    }
+  }, [isPreparingDownload, pack, selectedModel]);
 
   const packList = useMemo(() => {
     return orderBy(
@@ -82,7 +117,7 @@ function Gallery() {
     const skinData = isNew
       ? manifest?.newSkins
       : isPack
-      ? manifest?.packs?.[selectedModel]
+      ? manifest?.packs?.[selectedModel]?.skins
       : null;
     if (skinData) {
       return skinDataToList(skinData);
@@ -96,6 +131,7 @@ function Gallery() {
   const filter = searchParams.get("filter") || "lmale";
 
   useEffect(() => {
+    setPreparingDownload(false);
     setSelectedModel(filter);
   }, [filter]);
 
@@ -163,12 +199,35 @@ function Gallery() {
               <option value="vehicle_air_hapc">HAVOC Gunship Transport</option>
             </optgroup>
           </select>
-          <a
-            href="https://github.com/exogen/t2-model-skinner"
-            className={styles.IconLink}
-          >
-            <FaGithub size={32} />
-          </a>
+          <div className={styles.HeaderEnd}>
+            {isPack ? (
+              <div className={styles.DownloadSection}>
+                <button
+                  type="button"
+                  className={styles.DownloadButton}
+                  onClick={async () => {
+                    setPreparingDownload(true);
+                  }}
+                >
+                  Download
+                </button>{" "}
+                {isPreparingDownload ? (
+                  <CgSpinnerTwo className={styles.DownloadSpinner} />
+                ) : (
+                  <span className={styles.PackVersion}>
+                    v{pack.version} &bull; {pack.files.length.toLocaleString()}{" "}
+                    {pack.files.length === 1 ? "file" : "files"}
+                  </span>
+                )}
+              </div>
+            ) : null}
+            <a
+              href="https://github.com/exogen/t2-model-skinner"
+              className={styles.IconLink}
+            >
+              <FaGithub size={32} />
+            </a>
+          </div>
         </div>
         {isLoaded ? (
           <div className={styles.Gallery}>

src/exportUtils.ts

@@ -1,6 +1,8 @@
 import JSZip from "jszip";
 import { saveAs } from "file-saver";
 
+const basePath = `https://exogen.github.io/t2-skins/skins`;
+
 export function createZipFile(
   files: Array<{ name: string; data: ArrayBuffer }>
 ) {
@@ -19,3 +21,14 @@ export async function saveZipFile(zip: JSZip, name: string) {
 export function savePngFile(imageUrl: string, name: string) {
   saveAs(imageUrl, name);
 }
+
+export async function collectFiles(files: string[]) {
+  return await Promise.all(
+    files.map(async (fileName) => {
+      const url = `${basePath}/${fileName}`;
+      const res = await fetch(url);
+      const arrayBuffer = await res.arrayBuffer();
+      return { name: fileName, data: arrayBuffer };
+    })
+  );
+}

src/useManifest.ts

@@ -3,7 +3,14 @@ import { useState, useEffect } from "react";
 export type Manifest = {
   customSkins: Record<string, string[]>;
   newSkins: Record<string, string[]>;
-  packs: Record<string, Record<string, string[]>>;
+  packs: Record<
+    string,
+    {
+      version: string;
+      skins: Record<string, string[]>;
+      files: string[];
+    }
+  >;
 };
 
 const baseManifestPath = `https://exogen.github.io/t2-skins`;