Skip navigation.

Posts tagged with "Opera"

Ripple effect by Canvas

, , , ...

Here is a demo I made today.

http://atsushi-takayama.com/junk/ripple/



I tested it on Safari, Opera, Firefox. But Opera 9.64 has a bug about transparency of the canvas, so the color is worng. Opera 10 alpha works fine.


You can also copy the JavaScript source (link below) and paste it in the address bar to run as a bookmarklet, on any page you like.

http://gist.github.com/105217

Flashblock and iframe-block for Opera by CSS

Do you love Lex1's Flash-block script?

I certainly do.

I love the fact that, with that script, I was released from an enormous number of irritating "moving ads".

However, a while ago, I stopped using it, simply because I found an equivalent to it.

It's not a User JS, but it's a User CSS.


So here is the full source code and the author's explanation. It's only some 30 lines of CSS or so including iframe-block functionality.

Amazing, isn't it?

For those of you who can't read Japanese. I'm going to tell you how to use it.


  1. First, go to the above page and copy the code.
  2. Then create a file in your Local CSS Files Directory, paste the code, and save it.
  3. Restart Opera so that the style file appears as "Flash block by CSS" in your [View]->[Style] menu.
  4. Tick the above menu, and boon! All Flash is gone.


You'll notice you can still watch YouTube video even with the CSS turned on.

That's because YouTube Videos are whitelisted.

These parts of the code below are how you can whitelist certain kinds of Flash and/or iframes.

embed[src]:not(.ucContent):not([src*="nicovideo"]):not([src*="ytimg.com"])

iframe[src]:not(.ucContent)



If you want to unblock a Flash file that has "src" attribute containing "example.com", then just add :not([src*="example.com"]) at the end of the above line.


Note: each time you change. You have to restart Opera if you have followed the direction above. (or use "Reload stylesheets" action that Opera hasn't assigned to any key/menu by default...) If you are doing with "Site preferences" you don't need to restart Opera. Changes are reflected right away.

Can we change the replacement icon? Or remove the Flash/iframe source URLs shown? Yes we can!

Change the below part for example.

content: -o-skin("Window Document Icon") attr(src);


This -o-skin icons are listed here and you can change by putting another icon's name. Or set by a URL (you can even wirte a data: scheme URL just like Lex1's script does).

The "attr(src)" part is for the source URL, remove it if you like.


Of course you can just delete the Flashblock part or iframe-block part of the script, which should be quite obvious if you look at the source, to enable only one of the features.

The very good thing about it is that Opera does not load images, Flash, etc. in "display:none;" parts. So you can save some bandwidth! (It apparently still downloads source HTML files for the blocked iframes).

Improved Hit-a-Hint Bookmarklet With Your Keybind

, ,

I wrote a post (link below) about 3 month ago about a Hit-a-Hint bookmarklet.

Improvement to Hit-a-Hint bookmarklet for Opera

Today I made it even nicer with integrated ability to focus on text areas, select buttons, click javascript-executing links.

I also made a page where you can customize your own keybind.

Here it is Hit-a-Hint Generator for Opera

Feel free to tell me if you found a bug. Most of the time when hints are not drawn, it comes from Opera's bug with getClientRects...

Opera 9.60's bug on getBoundingClientRect and getClientRects

,

Opera has getBoundingClientRect and getClientRects methods just like IE and Firefox.

But the implementation seems a bit poor. Usually they work fine, but in certain conditions they either return weird results or don't work at all.

I made a test page that should hopefully show you when this bug occurs. Here you go and see what's going wrong.

Opera's getBoundingClientRect() and getClientRects() bug test page

I'm going to report this to Opera. Hopefully they fix it soon...

Improvement to Hit-a-Hint bookmarklet for Opera

, , ,

The Hit-a-Hint bookmarklet created by Blazeix is absolutely fabulous.
Vimperator for Opera - Blazeix's Blog - by Blazeix

I made a change to the original script so that I can have any letters I want for hints.

Here it is.

javascript:(function(){var hintkeys='asdfghjkl';var maxdigit=4;function createText(m){var ret='';var l=hintkeys.length;var d=maxdigit*l;while(m>=0){while(m-l*d<0){d--;}ret=hintkeys.charAt(m-l*d)+ret;m=d-1;}return ret;}function retrieveNumber(w){var ret=0;var wlen=w.length;for(var i=0;i<wlen;i++){var fix=(i==0)?0:1;var t=w.charAt(wlen-i-1);ret+=(hintkeys.indexOf(t)+fix)*Math.pow(hintkeys.length,i);}return ret;}var bgcolor = '#FF0';var bghighlight = '#0F0';var color = '#000';var hintlist = new Array();var hintedlinks = new Array();var map = new Array();var choices = new Array();var mapindex = 0;var choice = '';var keycodemapping = {'13':'Enter','27':'Esc','8':'Bkspc','44':','};for(var i=0;i<hintkeys.length;i++){var ithkey=hintkeys[i];keycodemapping[ithkey.charCodeAt(0)]=ithkey;}var originalTitle = document.title;function drawHints(){document.addEventListener('keypress',interpretKeyStroke,true);document.title+=' - ';var allLinks = document.getElementsByTagName('a');var viewportStart = window.pageYOffset - 5;var viewportEnd = viewportStart + window.innerHeight + 10;for (var i = 0;i<allLinks.length;i++){linkYcoord = getAbsoluteY(allLinks[i]);if(linkYcoord > viewportStart && linkYcoord < viewportEnd && allLinks[i].href != '') {hintedlinks.push(allLinks[i]);}}for (var i = 0;i<allLinks.length;i++){var hint = document.createElement('span');hintlist.push(hint);hint.style.backgroundColor=bgcolor;hint.style.color=color;hint.style.position='absolute';hint.innerHTML = createText(mapindex);map[createText(mapindex)]=hintedlinks[i].href;mapindex++;hintedlinks[i].appendChild(hint,hintedlinks[i]);}}function getAbsoluteY(element){var y = 0;while (element) {y += element.offsetTop;element = element.offsetParent;}return y;}function removeHints(){for (var i=0;i<hintedlinks.length;i++){hintedlinks[i].removeChild(hintlist[i],hintedlinks[i]);}choice='';document.title=originalTitle;document.removeEventListener('keypress',interpretKeyStroke,true);delete map;delete hintlist;delete hintedlinks;delete choices;}function interpretKeyStroke(e){e.preventDefault();var key=keycodemapping[(typeof event!='undefined')?window.event.keyCode:e.keyCode];if(key=='Enter'){choices.push(choice);for (var i=0;i<choices.length;i++) {if(map[choices[i]]!=undefined){window.open(map[choices[i]]);}}removeHints();}else if(key==','){if(choice!=''){choices.push(choice);hintlist[retrieveNumber(choice)].style.backgroundColor=bghighlight;choice = '';document.title+=',';}}else if(key=='Esc'){removeHints();}else if(key=='Bkspc'){if(choices.length){if(choice!=''){choice='';}else{hintlist[retrieveNumber(choices.pop())].style.backgroundColor=bgcolor;document.title=originalTitle+' - '+choices.join(',');}}}else if(key == undefined){removeHints();}else{choice+=key;var choicestring = (choices.length) ? choices.join(',')+','+choice : choice;document.title=originalTitle+' - '+choicestring;}}drawHints();})();


It's only for the extended hints mode (see Blazeix's post).
It doesn't work on firefox (Hints disappear when you start typing them in).

You can set any hint letters by changing
var hintkeys='asdfghjkl';


The following
var maxdigit=4;
is the maximum number of hints it can deal with. If you have too few letters for hints, you'd better change this. By default it's capable of showing (9 letters)^(4 digits)=6561 hints.

The main change is the next two functions.
function createText(m){var ret='';var l=hintkeys.length;var d=maxdigit*l;while(m>=0){while(m-l*d<0){d--;}ret=hintkeys.charAt(m-l*d)+ret;m=d-1;}return ret;}
function retrieveNumber(w){var ret=0;var wlen=w.length;for(var i=0;i<wlen;i++){var fix=(i==0)?0:1;var t=w.charAt(wlen-i-1);ret+=(hintkeys.indexOf(t)+fix)*Math.pow(hintkeys.length,i);}return ret;}

The first one is to convert the a number (1,2,3,...) to a hint (a,s,d,...aa,as,ad,...), and the second one does exactly the opposite. I inserted them in the code.

Then I changed keycode mapping as the following so that your added letters will be reflected.
var keycodemapping = {'13':'Enter','27':'Esc','8':'Bkspc','44':','};for(var i=0;i<hintkeys.length;i++){var ithkey=hintkeys[i];keycodemapping[ithkey.charCodeAt(0)]=ithkey;}


That's it. Enjoy!


[Update 2008-10-21]

I made a new version, which is almost complete rewrite from this one.

Improved Hit-a-Hint Bookmarklet With Your Keybind

Update Twitter Status From Opera Address Bar

,

Just add a new search engine to your Opera and configure as below.



Then type
tw blah_blah_your_status_blah_blah

into your address bar.


*Tips*

1. According to the twitter API documentation, the posting status has to be encoded with UTF-8, but I can do it with iso-8859-15, which Opera writes to search.ini by default.
There was a slight change on the API, apparently. You have to do the above with UTF-8. Since there is no GUI way to do it on Opera, the easiest way is to right click on Twitter's Status update field and choose "Create Search...", then input the above!

2. The callback will be an XML data, which will be shown ugly-ly in your Opera. But if you set the default view as "mobile" (or go to http://m.twitter.com once) then the xml page will be directed automatically to your friends' timeline!

**UPDATE 2008-12-19**

Try this UserJS to redirect the XML page to twitter home.

// ==UserScript==
// @include http://twitter.com/statuses/update.xml
// ==/UserScript==
location.href='http://twitter.com/'

But you need to enable opera:config#opera:config#Always Load User JavaScript

**TILL HERE**

3. OperaAddressBar is now officially supported as a Twitter client.

Enhanced Copy for Opera - Copy URL, Title & Selection

, ,

Firefox has a niche addon called "CopyURL+", which enables you to copy URL+PageTitle, URL+Selection, URL+Selection+PageTitle, etc. Well, I want that on Opera.

Yaske made opera_ex (link Japanese) a small Windows application that does exactly that (and more apparently), which you can call as an external program from Opera.

Later, higeorange rewrote it for Linux (Gtk2-Perl version & Ruby-Gnome version).

Both links are in Japanese. I could translate them if on high demand, but I don't think it's needed. Here is a sort-of description: opera_ex on Linux


Anyway, I'm neither on Windows nor Linux, and I don't want to use an external program for Opera. I want a browser to be stand alone.

Owing to the "Delay" action introduced at Opera9.50beta, it is now possible to copy URL+PageTitle+Selection and so on using Opera internal actions and JavaScript.

Here is how you do.

If you want to copy with a format like this,

<p>SelectedText<a href="URL">PageTitle</a></p>

Write this for your keyboard shortcut or rightclick menu.

Go to page, "javascript:window.prompt('','<p>'+window.getSelection()+'<a href=\x22'+location.href+'\x22>'+document.title+'</a></p>');" & Delay, 10 & Copy & Cancel


If you want an myOpera blog style like,

[URL=URL]PageTitle[/URL]*LineBreak*
SelectedText(if exists)

Then add this to your shortcut

Go to page, "javascript:var s=window.getSelection(),t='[URL='+location.href+']'+document.title+'[/URL]',t=s?t+'\r\n'+s:t;window.prompt('',t);" & Delay, 10 & Copy & Cancel


Or you can create your own.

What they are doing is, call JavaScript alert, paste URL etc. with the format, Delay, Copy and Close the alert. Without Delay this doesn't work (which means it doesn't work on Opera9.25 or before, so you have to copy and close the alert by hand if you really want).

The only thing that might bother you is that it brings up an alert for a little moment and erases. I first didn't like it, but now I don't mind. I even like it because it tells me I am copying what I want for sure.

You Can Use Google Web History with Opera

, ,

It was long thought that Google's another killer web service Google Web History cannot be used in Opera.

If you go to their page you will find that to enable Google Web History you have to install Google Toolbar, which means, like many other Google services, only IE and Firefox users are able to access this service. But it was not the case. Google Web History stores the websites you visited according to the request for Google PageRank. So even if you don't have Google Toolbar installed on your Firefox, you can get Google Web History with an extension like PageRank Checker.

It's a good news. You didn't need Google Toolbar at all to use Google Web History. All you have to do is to send a request to get Google PageRank for every page you open. In fact, you don't even need to display the PageRank on a page.

Here is a UserJS to enable Google Web History in Opera, written by mallowlabs (his blog entry in Japanese). He says it's distributed under public domain, so I copy and paste it here.


enablegooglewebhistory.user.js
// ==UserScript==
// @name EnableGoogleWebHistory
// @author mallowlabs
// @namespace http://mallowlabs.s206.xrea.com/
// @version 0.0.2
// @license public domain
// @description : Enable Google Web History
// @published 2007-01-05
// @modified 2006-01-05
// @include *
// ==/UserScript==

// see also
// http://www.scss.com.au/family/andrew/opera/panels/pagerank/
// http://d.hatena.ne.jp/amatanoyo/20080104/1199450996
// =========================================
(function(){

    // avoid frame
    if (window.self != window.parent) return;

    var r=function(x,y){
        return Math.floor((x/y-Math.floor(x/y))*y+.1);
    },
    ch=function(url){
        url='info:'+url;
        var c=[0x9E3779B9,0x9E3779B9,0xE6359A60],i,j,k=0,l,f=Math.floor,
        m=function(c){
            var i,j,s=[13,8,13,12,16,5,3,10,15];
            for(i=0;i<9;i+=1){
                j=c[r(i+2,3)];
                c[r(i,3)]=(c[r(i,3)]-c[r(i+1,3)]-j)^(r(i,3)==1?j<<s[i]:j>>>s[i]);
            }
        };
        for(l=url.length;l>=12;l-=12){
            for(i=0;i<16;i+=1){
                j=k+i;c[f(i/4)]+=url.charCodeAt(j)<<(r(j,4)*8);
            }
            m(c);
            k+=12;
        }
        c[2]+=url.length;
        for(i=l;i>0;i--)
            c[f((i-1)/4)]+=url.charCodeAt(k+i-1)<<(r(i-1,4)+(i>8?1:0))*8;
        m(c);
        return'6'+c[2];
    };
    var url=document.location;

    /* create image element */
    new Image().src = 'http://www.google.com/search?client=navclient-auto&ch='+ch(url)+'&features=Rank&q=info:'+escape(url);
})();


(Thanks to Google PageRank Button for the request URL computation)

All you need to do is install the above, go to Google Web History, login and enable it! Enjoy web browsing 10 times more!


Having used Google Web History myself for a day now, I think it's awesome! I was using Opera9.50beta's Search History for a while, but it's search function is pretty poor so far. I couldn't even do an AND search. I also like the fact that Google stores my web history forever, not only up to the limit of my browser cache.


Added 2008-1-10

This entry was featured in Use Google Web History Without Installing Google Toolbar. Thanks for visiting!

The original creater has put the script up to UserScript.org. To keep up with current version, please go there (although I don't think there will be further updates).

Why I use Opera

,

This is my new blog. Before going anywhere let me introduce myself briefly.

I am a student in Montreal, Canada. I decided to make this blog to share some ideas about Opera with all of you who can read English.

To date, Opera is not the most popular desktop browser in Japan, even though they sell literally tons of Nintendo Wii and cell phones that run Opera Mini. Yet, the user group there is known to be very skilled and equipped with full of passion for Opera.

It is pretty unfortunate that most of you can't read Japanese, just like I can't read Russian. (Actually I speak a bit of German, Spanish and French but that's another thing). I'm quite curious to get some feedback from you on the ideas I will scratch down in this blog. They should be mainly about customizing Opera. Some are my own opinion, some are things I am inspired by the Japanese Opera blogsphere. Anyway I started it today on a whim, I will see how it goes. What I'm certain is that I will not write this with the best frequency all the time, but I am always looking for things to write in here and FEEDBACKS ARE WELCOME!

Oh, last thing, my id "edvakf" doesn't mean anything. I used it many many years ago just because I liked the sound.



To start I write why I use Opera.

I was a Firefox user about half a year ago. Some add-ons I was using with Firefox were really nifty and I didn't even think I could live without them. One problem was my PC at that time was quite an antique one, so I didn't want to push him hard. Firefox was sometimes eating more than half of his RAM. Then I was recommended to use Opera and I did (it's free anyway, and it worked on Xubuntu).

I was impreassed by its speed, the look, the fact that most of my must-have Firefox add-ons' functions were alread there for me to use by default, and most importantly, the keyboard was fully customizable!

I'm a lazy boy. When I browse, I don't want to use a mouse, I don't want to use two hands, I don't want to move my hand from the home position... That's how I'm lazy. So I customized Opera so that I can browse using only my right hand. Now I sometimes browse hours and hours almost with one hand, and with minimum motion.

Two month ago, I bought a macBook Pro with 2GB RAM. I don't worry too much about the speed loss and using up memory by using Firefox. But I haven't installed it on here. I don't know how it is now. I used Mozilla Prism once, it was damn slow. I think I keep loving Opera for a few more years.