OOP1: What is prototype?

Prototype is a property that will be automatically created once you create a new function. And this property points to an object that contains shared properties and methods. And in this object, a property named constructor will be automatically added and points to the new function which is important for checking object type. Person.prototype.constructor//points to Person… Continue reading OOP1: What is prototype?


When to use link or @import?

DIFFERENCE: Loading Order: 1.Link adds css file first and then compile, while @import will wait until html structure loaded which might influence visual effect. 2.Link parallel downloads css files while @import downloads one by one DOM Supportability: when using DOM changing styles, linked css is OK but imported doesn’t work. Restriction: Link can link JS file… Continue reading When to use link or @import?

Msc Final Project

RegExp escapes ubbcode (php)

Having been tortured by php for already two weeks…The RegExp(Perl) functions between JS and PHP are slightly different: str.match(pattern);—–preg_match($pattern,$str,$arr);…Below escapes ubbcode into html format by PHP RegExp, it’s just like the text editor. <?php $str=”[b]I am bold[/b], [i]I am italic[/i], [b]I am the second bold[/b], [color=red]I am color[/color], [size=7]I am size[/size], [align=center]I am center[/align]”.'<br>’; $ubbcodes=array(‘/\[b\](.*?)\[\/b\]/’,… Continue reading RegExp escapes ubbcode (php)

Msc Final Project

Download your canvas as an image (canvas)

As my website badly needs an online texture generator, downloading canvas becomes a must… The core of code below is “toDataURL()”. <html> <meta http-equiv=”X-UA-Compatible” content=”chrome=1″> <head> window.onload = function() { draw(); var dlButton = document.getElementById(“downloadImageBtn”); bindButtonEvent(dlButton, “click”, saveAsLocalImage); }; function draw(){ var canvas = document.getElementById(“thecanvas”); var ctx = canvas.getContext(“2d”); ctx.fillStyle = “rgba(125, 46, 138, 0.5)”;… Continue reading Download your canvas as an image (canvas)

Msc Final Project

Mouseover to set the image as background (js)

I was trapped in this tiny little bug for several hours: a href=”#” is a must or it will refresh the whole site, then you will never change the background image, never! <!doctype html> <html lang=”en”> <head> <meta charset=”UTF-8″> <title>Document</title> <style>/*this should be an independent CSS*/ body{background:#b8c2f8} img{width:300px;height:300px;} </style> </head> <body> function basename(url){ var loc… Continue reading Mouseover to set the image as background (js)