.sune/meddler.sune

[{"id":"99k0yae","name":"Meddler","pinned":false,"avatar":"","url":"gh://multipleof4/.sune/meddler.sune","updatedAt":1757186667765,"settings":{"model":"openai/gpt-5-chat","temperature":"","top_p":"","top_k":"","frequency_penalty":"","presence_penalty":"","repetition_penalty":"","min_p":"","top_a":"","max_tokens":"","verbosity":"","reasoning_effort":"default","system_prompt":"","html":"<div class=\"relative max-w-md mx-auto my-4 overflow-hidden text-white bg-slate-900/70 backdrop-blur-xl rounded-2xl border border-white/10 shadow-2xl font-sans\">\n  <div class=\"absolute top-1/2 left-1/2 w-[400px] h-[400px] bg-gradient-to-tr from-pink-500 to-rose-500 rounded-full -translate-x-1/2 -translate-y-1/2 opacity-20 blur-3xl animate-pulse\"></div>\n  <div class=\"relative z-10 flex flex-col gap-4 p-4 sm:p-6\">\n    <div class=\"flex justify-between items-baseline\">\n      <h2 class=\"text-xl font-bold tracking-tight text-white\">Image Dissolve</h2>\n      <span class=\"text-xs font-mono text-white/40\">v1.1.0</span>\n    </div>\n    <div class=\"flex justify-center\">\n      <canvas id=\"c_dissolve\" width=\"512\" height=\"512\" class=\"w-full h-auto max-w-xs sm:max-w-sm bg-black rounded-lg shadow-md aspect-square\"></canvas>\n    </div>\n    <p class=\"text-sm text-center text-white/70\">Pixels from the image are progressively swapped with a solid black canvas, creating a fizzle effect.</p>\n  </div>\n</div>\n<script>\n(()=>{\n  const S_ID=window.SUNE.id, W=512, H=512;\n  const IMG_URL='https://raw.githubusercontent.com/multipleof4/sune/refs/heads/master/public/%E2%9C%BA.png';\n  \n  function bitmeddler(max,seed){if(max<2||max>2147483647)throw\"max must be between 2-2147483647\";this.maximum=max;this.start=(seed||1)%max;this.cur=this.start;this.MASK=[3,6,9,29,54,105,166,380,813,1266,3380,4937,9010,26265,53909,76083,182590,365274,743546,1045909,1226300,3039854,5468886,15510030,19637837,57462151,78667635,248460149,441364466,698115563,1985710819,3032230748][this._msb(this.maximum)-2];this.next=this._next}\n  bitmeddler.prototype={_next:function(){do{this.cur=this.cur&1?(this.cur>>1)^this.MASK:this.cur>>=1}while(this.cur>this.maximum);if(this.cur===this.start)this.next=this._done;return this.cur},_done:function(){return null},reset:function(){this.next=this._next;this.cur=this.start},_msb:function(v){let r=0;while(v){v>>=1;r++}return r}};\n\n  const cEl=document.getElementById('c_dissolve');\n  if(!cEl){console.error('Sune canvas not found');return}\n  cEl.id=`c_dissolve_${S_ID}`;\n  const ctxV=cEl.getContext('2d',{willReadFrequently:true});\n\n  const cBlack=document.createElement('canvas');\n  cBlack.width=W; cBlack.height=H;\n  const ctxB=cBlack.getContext('2d',{willReadFrequently:true});\n  ctxB.fillStyle='#000';\n  ctxB.fillRect(0,0,W,H);\n  \n  const bm=new bitmeddler(W*H);\n  let timer=null, dBlack=ctxB.getImageData(0,0,W,H);\n\n  const fizzle=()=>{\n    const dImage=ctxV.getImageData(0,0,W,H);\n    const L=dImage.data, R=dBlack.data;\n    let o;\n    for(let i=0;i<4000;i++){\n      o=bm.next();\n      if(o==null)break;\n      o*=4;\n      [L[o],R[o]]=[R[o],L[o]];\n      [L[o+1],R[o+1]]=[R[o+1],L[o+1]];\n      [L[o+2],R[o+2]]=[R[o+2],L[o+2]];\n      [L[o+3],R[o+3]]=[R[o+3],L[o+3]];\n    }\n    ctxV.putImageData(dImage,0,0);\n    if(o==null){clearInterval(timer);setTimeout(()=>{bm.reset();dBlack=ctxB.getImageData(0,0,W,H);timer=setInterval(fizzle,50)},2000)}\n  };\n  \n  const img=new Image;\n  img.crossOrigin=\"anonymous\";\n  img.onload=()=>{ctxV.drawImage(img,0,0,W,H);timer=setInterval(fizzle,50)};\n  img.onerror=()=>{ctxV.font=\"12px sans-serif\";ctxV.fillStyle=\"red\";ctxV.textAlign=\"center\";ctxV.fillText(\"Image failed to load.\",W/2,H/2);};\n  img.src=IMG_URL;\n})();\n</script>\n","extension_html":"<sune src='https://raw.githubusercontent.com/sune-org/store/refs/heads/main/sync.sune' private />"},"storage":{}}]