Lively Kernel canvas
//
DraftMiniMapandWorldScrolling40
Wouldn'titbenicetohavealittleMiniMapofaWikiPagethatgivesandoverviewandhelpsnavigation?201
RelatedWork:-MinimapinSelf201
Einsicht:DasProblemist,dasssichbeimScrollenderWeltdieHANDauchmitbewegt...201
//enableLayer(ScrollLayer)//disableLayer(ScrollLayer)cop.create("ScrollLayer").refineObject(this.world().firstHand(),{setPosition:function(proceed,pos){proceed(pos);//if(this.submorphs.length>0)//this.scrollDuringDrag()},scrollDuringDrag:function(proceed,counter){varwb=this.world().windowBounds();varpos=this.getPosition();//returncounter=counter||1;varscrollSpeed=0.3;varworld=this.world();varworldScale=world.getScale();varsteps=counter*scrollSpeed*worldScale;varmaxSteps=30;steps=Math.min(steps,maxSteps);varanimate=false;varscroll=function(delta){//console.log("a"+(pos.y+offset)+"b"+wb.top())//console.log("scroll"+delta)varoldPos=pt(Global.scrollX,Global.scrollY)Global.scrollBy(delta.x,delta.y);varnewPos=pt(Global.scrollX,Global.scrollY)varscrollDelta=newPos.subPt(oldPos).scaleBy(1/worldScale);world.firstHand().moveBy(scrollDelta.scaleBy(1))animate=true;};varoffset=50if(pos.x+offset>wb.right())scroll(pt(steps,0));if(pos.x-offset<wb.left())scroll(pt(-steps,0));if(pos.y-offset<wb.top())scroll(pt(0,-steps));if(pos.y+offset>wb.bottom())scroll(pt(0,steps))if(animate){varself=this;(function(){self.scrollDuringDrag(counter+1)}).delay()}}}) 0)\n\t\t//\tthis.scrollDuringDrag()\n\t},\n\n\tscrollDuringDrag: function(proceed, counter) {\n\t\tvar wb = this.world().windowBounds();\n\t\tvar pos = this.getPosition();\n\t\t// return\n\n\t\tcounter = counter || 1;\n\t\tvar scrollSpeed = 0.3;\n\t\tvar world = this.world();\n\t\tvar worldScale = world.getScale();\n\t\tvar steps = counter * scrollSpeed * worldScale;\n\t\tvar maxSteps = 30;\n\t\tsteps = Math.min(steps, maxSteps);\n\t\tvar animate = false;\n\t\tvar scroll = function(delta) {\n\t\t\t// console.log(\"a \" + (pos.y + offset) + \" b \" + wb.top())\n\t\t\t// console.log(\"scroll \" + delta)\n\t\t\tvar oldPos = pt(Global.scrollX, Global.scrollY)\n\t\t\tGlobal.scrollBy(delta.x, delta.y);\n\t\t\tvar newPos = pt(Global.scrollX, Global.scrollY)\n\t\t\tvar scrollDelta = newPos.subPt(oldPos).scaleBy(1 / worldScale);\n\t\t\tworld.firstHand().moveBy(scrollDelta.scaleBy(1))\n\t\t\tanimate = true;\n\t\t};\n\t\tvar offset = 50\n\t\tif (pos.x + offset > wb.right()) scroll(pt(steps,0));\n\t\tif (pos.x - offset < wb.left()) scroll(pt(-steps,0));\n\t\tif (pos.y - offset < wb.top()) scroll(pt(0, - steps));\n\t\tif (pos.y + offset > wb.bottom()) scroll(pt(0, steps))\n\t\tif (animate) {\n\t\t\tvar self = this;\n\t\t\t(function(){self.scrollDuringDrag( counter + 1)}).delay()\t\n\t\t}\n\t}\n\n})\n\n\n\n"]]>47 0)\n\t\t//\tthis.scrollDuringDrag()\n\t},\n\n\tscrollDuringDrag: function(proceed, counter) {\n\t\tvar wb = this.world().windowBounds();\n\t\tvar pos = this.getPosition();\n\t\t// return\n\n\t\tcounter = counter || 1;\n\t\tvar scrollSpeed = 0.3;\n\t\tvar world = this.world();\n\t\tvar worldScale = world.getScale();\n\t\tvar steps = counter * scrollSpeed * worldScale;\n\t\tvar maxSteps = 30;\n\t\tsteps = Math.min(steps, maxSteps);\n\t\tvar animate = false;\n\t\tvar scroll = function(delta) {\n\t\t\t// console.log(\"a \" + (pos.y + offset) + \" b \" + wb.top())\n\t\t\t// console.log(\"scroll \" + delta)\n\t\t\tvar oldPos = pt(Global.scrollX, Global.scrollY)\n\t\t\tGlobal.scrollBy(delta.x, delta.y);\n\t\t\tvar newPos = pt(Global.scrollX, Global.scrollY)\n\t\t\tvar scrollDelta = newPos.subPt(oldPos).scaleBy(1 / worldScale);\n\t\t\tworld.firstHand().moveBy(scrollDelta.scaleBy(1))\n\t\t\tanimate = true;\n\t\t};\n\t\tvar offset = 50\n\t\tif (pos.x + offset > wb.right()) scroll(pt(steps,0));\n\t\tif (pos.x - offset < wb.left()) scroll(pt(-steps,0));\n\t\tif (pos.y - offset < wb.top()) scroll(pt(0, - steps));\n\t\tif (pos.y + offset > wb.bottom()) scroll(pt(0, steps))\n\t\tif (animate) {\n\t\t\tvar self = this;\n\t\t\t(function(){self.scrollDuringDrag( counter + 1)}).delay()\t\n\t\t}\n\t}\n\n})\n\n\n\n"]]>
$morph('blue').scrollWindowOnDrag=function(pos,counter){if(!(this.ownerinstanceofHandMorph))return//console.log("scroll"+counter)vartfm=this.owner.getGlobalTransform()//.createInverse()varr1=rect(this.bounds().topLeft().matrixTransform(tfm),this.bounds().bottomRight().matrixTransform(tfm))varr2=this.world().windowBounds();varinter=r1.intersection(r2);vardelta1=r1.topLeft().subPt(inter.topLeft());vardelta2=r1.bottomRight().subPt(inter.bottomRight());vardelta=pt(delta1.x||delta2.x,delta1.y||delta2.y);counter=counter||1;varscrollSpeed=0.9;varworld=this.world();varworldScale=world.getScale();varsteps=counter*scrollSpeed*worldScale;varanimate=false;varscroll=function(delta){varoldPos=pt(Global.scrollX,Global.scrollY)//this.world().firstHand().moveBy(delta);Global.scrollBy(delta.x,delta.y);varnewPos=pt(Global.scrollX,Global.scrollY)varscrollDelta=newPos.subPt(oldPos).scaleBy(1/worldScale);//console.log("scrolldelta"+scrollDelta)world.firstHand().moveBy(scrollDelta.scaleBy(1))animate=true;};if(delta.x>0)scroll(pt(steps,0));if(delta.x<0)scroll(pt(-steps,0));if(delta.y>0)scroll(pt(0,steps))if(delta.y<0)scroll(pt(0,-steps))if(animate){varself=this;(function(){self.scrollWindowOnDrag(pos,counter+1)}).delay()$morph('MiniMap').updatePosition()}//console.log("delta1"+delta1+"delta2"+delta2);}this.getGlobalTransform()this.world().firstHand()hand=WorldMorph.current().hands[0]$morph('MiniMap').updatePosition()//connect(hand,'origin',$morph('blue'),'scrollWindowOnDrag') 0) scroll(pt(steps,0));\n\tif (delta.x < 0) scroll(pt(-steps,0));\n\tif (delta.y > 0) scroll(pt(0, steps))\n\tif (delta.y < 0) scroll(pt(0, -steps))\n\tif (animate) {\n\t\tvar self = this;\n\t\t(function(){self.scrollWindowOnDrag(pos, counter + 1)}).delay()\t\n\t\t$morph('MiniMap').updatePosition()\n\t}\n\t// console.log(\"delta1 \" + delta1 + \"delta2 \" + delta2);\n}\n\nthis.getGlobalTransform()\nthis.world().firstHand()\nhand = WorldMorph.current().hands[0]\n\n$morph('MiniMap').updatePosition()\n\n//connect(hand, 'origin', $morph('blue'), 'scrollWindowOnDrag')\n\n\n\n"]]>55truetruefalse 0) scroll(pt(steps,0));\n\tif (delta.x < 0) scroll(pt(-steps,0));\n\tif (delta.y > 0) scroll(pt(0, steps))\n\tif (delta.y < 0) scroll(pt(0, -steps))\n\tif (animate) {\n\t\tvar self = this;\n\t\t(function(){self.scrollWindowOnDrag(pos, counter + 1)}).delay()\t\n\t\t$morph('MiniMap').updatePosition()\n\t}\n\t// console.log(\"delta1 \" + delta1 + \"delta2 \" + delta2);\n}\n\nthis.getGlobalTransform()\nthis.world().firstHand()\nhand = WorldMorph.current().hands[0]\n\n$morph('MiniMap').updatePosition()\n\n//connect(hand, 'origin', $morph('blue'), 'scrollWindowOnDrag')\n\n\n\n"]]>truetruefalse
false00.11truefalsetruetruefalse
nullfalsetruenullfalse
Workspacefalsenulltruefalse
false
false
falsenullfalsefalsenullnullnullnullfalse
if(m=$morph('MiniMap'))m.remove();this.getGlobalTransform()this.world().getScale()this.world().getTransform()miniMap=newMiniMapMorph();miniMap.name='MiniMap'miniMap.openInWorld()miniMap.setPosition(pt(0,0))miniMap.startSteppingScripts()//this.world().getTransform().createInverse().matrixTransform(//this.world().getTransform().createInverse());pt(106.0,1160.2)this.world().windowBounds=function(){varcanvas=this.canvas();varscale=1/this.world().getScale();vartopLeft=pt(Global.pageXOffset-canvas.offsetLeft,Global.pageYOffset-canvas.offsetTop);varwidth=Math.min(Global.document.documentElement.clientWidth*scale,WorldMorph.current().getExtent().x);varheight=Math.min(Global.document.documentElement.clientHeight*scale,WorldMorph.current().getExtent().y)returntopLeft.scaleBy(scale).extent(pt(width,height));}//r=Morph.makeRectangle(this.world().windowBounds2().insetBy(10))//r.openInWorld()41truetruefalsetruetrue
false00.11truefalsetruetrue
nullfalsetruenull
Workspacefalsenulltruefalse
false
false
falsenullfalsefalsenullnullnullnullfalse
Wikicontroltruetrue
1000144.29114537356566
WorkspacesduringPrototyping42
TheMinMapisnowavailableunderWorldMenu>Tools>MiniMap20 Tools > MiniMap"]]>
null81