
function packBlocks(fontSize,packerdiv,wordarray,boxHeight,boxWidth,fontfamily,binPackingMargin){var svgTexts=new Array(wordarray.length);var blocks=new Array(wordarray.length);var svgns="http://www.w3.org/2000/svg";var bbox;for(var i=0;i<wordarray.length;i++){var textbox=document.createElementNS(svgns,'text');textbox.setAttributeNS(null,"font-size",fontSize+"px");textbox.setAttributeNS(null,"font-family",fontfamily);svgTexts[i]=textbox;var text=document.createTextNode(wordarray[i].Word);svgTexts[i].appendChild(text);var svg=document.createElementNS(svgns,'svg');packerdiv.appendChild(svg)
svg.appendChild(svgTexts[i]);var bbox=svgTexts[i].getBBox();wordarray[i].width=bbox.width*(wordarray[i].Percentage)+7;wordarray[i].height=bbox.height*(wordarray[i].Percentage)*0.8;packerdiv.removeChild(packerdiv.lastChild);}
wordarray.sort(function(a,b){return(b.width*b.height)-(a.width*a.height);})
var j=0;for(var i=0;i<wordarray.length;i++){var factor1=1;var factor2=1;if(wordarray[i].width>boxWidth){factor1=boxWidth/(wordarray[i].width);}
if(wordarray[i].height>boxHeight){factor2=boxHeight/(wordarray[i].height);}
blocks[i]={w:wordarray[i].width*factor1,h:wordarray[i].height*factor2};}
var packer=new Packer(boxWidth,boxHeight);packer.fit(blocks);var allFit=true;for(var n=0;n<blocks.length;n++){var block=blocks[n];if(!block.fit){allFit=false;break;}}
if(allFit)
{for(var n=0;n<blocks.length;n++){var block=blocks[n];if(block.fit){if(document.createElement){newdiv=document.createElement("div");newdiv.style.position="absolute";newdiv.style.left=block.fit.x+"px";newdiv.style.top=block.fit.y+"px";newdiv.style.width=block.w+"px";newdiv.style.height=block.h+"px";newdiv.style.margin=binPackingMargin;newdiv.style.background="transparent";packerdiv.appendChild(newdiv);var svgns="http://www.w3.org/2000/svg";var svg=document.createElementNS(svgns,'svg');newdiv.appendChild(svg);var newHight=block.h-(block.h/8);svg.setAttribute('viewBox','0 '+-((wordarray[n].height/(wordarray[n].Percentage))*0.95)+' '+(wordarray[n].width/(wordarray[n].Percentage))+' '+(wordarray[n].height/(wordarray[n].Percentage))*1.2);svg.setAttribute("preserveAspectRatio","none");var textBlock=document.createElementNS(svgns,'text');textBlock.setAttribute('style','margin-top:'+newHight+'px');var text=document.createTextNode(wordarray[n].Word);svg.appendChild(textBlock);textBlock.appendChild(text);textBlock.setAttribute('style','fill:rgba(255, 255, 255, '+wordarray[n].opacity+')');textBlock.setAttributeNS(null,"font-size",fontSize+"px");textBlock.setAttributeNS(null,"font-family",fontfamily);}}}}
else
packBlocks(fontSize-5,packerdiv,wordarray,boxHeight,boxWidth,fontfamily,binPackingMargin);}
Packer=function(w,h){this.init(w,h);};Packer.prototype={init:function(w,h){this.root={x:0,y:0,w:w,h:h};},fit:function(blocks){var n,node,block;for(n=0;n<blocks.length;n++){block=blocks[n];if(node=this.findNode(this.root,block.w,block.h))
block.fit=this.splitNode(node,block.w,block.h);}},findNode:function(root,w,h){if(root.used)
return this.findNode(root.right,w,h)||this.findNode(root.down,w,h)
else if((w<=root.w)&&(h<=root.h))
return root;else
return null;},splitNode:function(node,w,h){node.used=true;node.down={x:node.x,y:node.y+h,w:node.w,h:node.h-h};node.right={x:node.x+w,y:node.y,w:node.w-w,h:h};return node;}}
