Idea&Demo

Previously, I developed a Chrome extension that converts URLs into QR codes and wanted to use a similar extension in Safari. After searching, it seemed there wasn’t one available, so I decided to create a Safari extension myself and document the process. Obtaining a Developer Certificate To create a Safari extension, you first need to generate a developer certificate. Visit the Apple Developer Center and join the Safari Developer Program, which is free. Once you’re part of the developer program, you can generate a certificate by visiting Certificates, Identifiers & Profiles, clicking the plus sign in the top right corner, and generating a developer certificate. After successfully creating it, download the certificate to your local machine and import it into Keychain Access. ...

In my work, I needed a global download manager within an application, so I implemented one using AS3. An array is used to store the download list. When a new download item is added to the list, it checks the list. If there are items not yet downloaded, it downloads that item. Once the download is complete, it checks the list again. When there is a download in progress, no new download processes are added to ensure that there is only one download process at a time. GitHub: https://github.com/simpleapples/AS3DownloadManager ...

A JavaScript for browser detection created by me. By importing browser-min.js into the head of your HTML file, it will return a global variable browser, where browser.browser represents the browser, browser.engine represents the browser engine, browser.version represents the browser version, and browser.system represents the operating system. Download the uncompressed version: http://labs.simpleapples.com/browser/browser.js.zip (6.025kb) Download the compressed version: http://labs.simpleapples.com/browser/browser-min.js.zip (1.387kb) Demo: http://labs.simpleapples.com/browser GitHub: http://github.com/simpleapples/browser.js

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: ...

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. ...