Posts

This evening, I came across an OSX application called Alfred, which is a tool similar to Spotlight but much more powerful. Not only can you search local programs with it, but by adding “>” before the search content, you can input commands, directly enter calculations, and customize search engines using a format like “google Hello World”. I suddenly wondered if this could be implemented using JavaScript. So, I first implemented the multi-search engine integration feature. I didn’t want to use the old dropdown menu style; instead, I wanted to use an autocomplete format, which took quite a bit of effort, but I managed to get the functionality working. For example, typing “douban The Ordinary World” allows you to search “The Ordinary World” on Douban, and typing “weibo frontend” lets you search for “frontend”-related content on Weibo. You can also type “t” + Enter, then input a keyword to search on Taobao. Currently, I’ve only added a few simple search tools (because my friend AlisterTT, who helped design the interface, only gave me these icons = =!): Weibo, Google, Douban, Taobao, and Amazon. I’ve given it a catchy name, MagicSearch, and it would be even better if it could be developed for mobile clients in the future, as it should be quite useful. There are still many things and details to be modified. Also, the calculator function hasn’t been added yet, and my computer is running out of battery, so I’ll have to wait until tomorrow. Here’s a screenshot for now: ...

In Flash, importing and playing SWF files can be easily done using the loadMovie() function in ActionScript. However, playing them frame by frame is a bit more complex. When playing frame by frame, you either need to set a play time for each frame or manually control it with buttons. Here, we’ll take an example of playing frame by frame based on time, and explain how to control it using ActionScript. ...

A Compass WebApp has been created using JavaScript. The app listens to the DeviceOrientation event, where the device generates three values: alpha, beta, and gamma when it changes orientation. The alpha value represents the current angle. window.addEventListener('deviceorientation', function(event) { target.style.transform = 'rotate(' + event.alpha + ')'; }, false); The alpha value is 0° at true north and increases clockwise to 360°, corresponding to the rotation angle of the compass needle. The CSS3 transform property is used to rotate the needle. ...

You often come across Thunder links starting with thunder:// on the internet, which cannot be downloaded by other software. In fact, Thunder links are the result of base64 encryption. By decrypting them, you can retrieve the original link address. Let’s take the link to the Baidu logo image as an example. The original link is: http://www.baidu.com/img/baidu_sylogo1.gif Thunder adds “AA” at the beginning and “ZZ” at the end of the original link, forming a new string: ...

A web app created using JavaScript, HTML5, and CSS3 that can display the current location and movement path. It utilizes the Baidu Maps API to draw the day’s path with a green line on the map. A marker shows the current location. The circle on the homepage is drawn using canvas, but I haven’t managed to include text in it yet—still working on that. The acquired data is stored in localStorage. Currently, it locates every 3 seconds. I’m unsure about the data volume; if it’s large, localStorage might not be suitable. ...