Introduction
In on of the latest Opera builds we've got some new toys to play with. I'm talking about scriptStorage & -o-object-fit. So I was thinking ,what kind of user javascript I can do with that? And my first idea was an image gallery. I'm not sure if there'll be a lot of people that will actually use it, but I think that this is at least a good example of how these new features can be used. I've also used some new technologies from Opera 10.50 like 2DTransforms, Transitions and JSON. (In the new version I also use cross domain messaging.) ...
Installation
- So you've got good build. Now go to the URL given below and save this file into your user javascript folder:
http://files.myopera.com/BS-Harou/files/image_gallery.js - Next you will have to activate you scriptStorage by setting "User JS Storage Quota" in opera:config to higher than zero. For example 50k.
- The last step is to create mouse gesture or keyboard shortcut like this:
Go to page, "javascript:opera.userjs.bsharouGallery()"
(Or you can edit ini files and add this button:
ButtonX, "Open Gallery"="Go to page, "javascript:opera.userjs.bsharouGallery()", 1, "Open Gallery", "Mail Newsgroups"") - Now use the gesture/shortcut and black transparent box should appear on top of the page (note: this won't work on page with https protocol until you enable it in opera:config).
- Now you can simply drag there any images and they will stay there and will be accessible on any other site. If you want to delete some of the pictures, then just drag it out from the black box. You can create folders by right clicking on empty space of gallery and selecting the "Create folder" in the context menu.
- And that's it. First user javascript gallery is installed and working in your Opera.
Remember that this is alpha version so there are definitely going to be some bugs. I would appreciate if you report them in comments below. Wishes and ideas are also welcomed.
New in pre-pre alpha =)
- Opened tabs synchronization
- Folders (you can open folder by double click or in right click context menu)
- Import/Export
- Clear current folder
- Option to create PNG Icon (thumbnail) for each image (if you want to use this, you have to set big User JS Storage Quota, but then you don't have to download the image every time when you open the gallery)
- Description for images
- "Alerting" URL (the easiest one
)New in pre-alpha =)
- Trash
- Moving files from folder to folder (drag the image and hold it on the folder for 1s - when the folder gets lighter border, drop the image - you can move image to parent folder by dragging it to top)
- Double click o image open a new window with the image
- Longer export (>3000 characters) is opened in new window instead of alert box
- Folder names are vertically centered
- If you hold mouse on image/folder for a while it shows a bubble with URL, Size (not for local icons) and description of the image (if there is some description) or in case of folders number of images and folders inside)
- some bug fixes
New in alpha =)
- HTML/BBCode in alert dialog
- Special folder with all images on web page (not synchronized)
- New buttons next to "Hide gallery"
- New folder (folder is created on the last position of current folder)
- Trash (removed from right click context menu of gallery)
- All images on web page
- Arrange bottom/top
- Bug fixes
- Optimization
My ideas:
none
Known bugs:
- There are some Opera redraw issues, mainly when gallery is at bottom. (scrollbar, info bubble)
Originally posted by InDigazzZ:
I wouldn't be surprised if they release it tomorrow. But it won't definitely take more than one week from now
------------------------------
Script has to be started manually - it won't automatically show up when clicking
images.
* Create a bookmark with this address:
javascript:window.navigator.galleryUJS.run();
and run this bookmark (preferably by nickname) whenever you want to invoke the script
Originally posted by InDigazzZ:
Thank you, I will try to find the problem this weekend, right now I'm trying to complete my opera extension before O11 release. And because I don't know when they will release it I have to hurry
Previously, the script works correctly, but now (I assume it's because of Opera Desktop Team - Web Sockets enter the Opera House) have to click on one of the images so they all started to boot ...
2. thnx;
3. I mean, in default view - image is stretched, but when "Use local icon" is turned on - image starts keeping own ratio.
4. If image's size is less than the
size of the window (eg: avatars
on MyOpera or icons), do not stretch it to
the size of the window, and
display in accordance with its
own size. - 4.
Originally posted by InDigazzZ:
you mean with mosuewheel or with draged image on the side?
Originally posted by InDigazzZ:
too complciated, but you can use export/import feature to do that.
Originally posted by InDigazzZ:
Creating local icon is very complex process because of some opera security reasons, so it might really decrease speed.
2. Ability to transfer all images in a folder (like CTRL + A and move into folder).
default
local icon used
There is lots of Opera redraw bugs when gallery is at bottom.
If you want to help then try to convince Opera developers to fix bug DSK-313540. ( http://bit.ly/9Y2viG )
Originally posted by InDigazzZ:
If there won't be too much problems with it I will try to add it =)
Originally posted by InDigazzZ:
This would be probably very difficult.
Originally posted by InDigazzZ:
decisions decisions...
Ability to stretch the area.
What about SlideShow?
Originally posted by InDigazzZ:
Perhaps in the far future
Originally posted by InDigazzZ:
Titles are often very long for folders Names
Originally posted by InDigazzZ:
I will add this in next version =)
2. functional from http://files.myopera.com/d.i.z./userjs/gallery-viewer.js with saving data to Gallery
2.1 Creating folder where name is page's title
3. Alert URL as menu with:
~ Alert URL
~ Alert URL as BB-code
~ Alert URL as HTML-code
Originally posted by BS-Harou:
i can't - double click on image and nothing happens
Wishes:
1. "On/Off local icon" enable turning on/of for folder not only for each image;
2. moving images/folder into another folders
Originally posted by InDigazzZ:
I mean in new version I'm working on. I will probably release this new version this week =)
Originally posted by InDigazzZ:
Working in new (unreleased) version
Originally posted by InDigazzZ:
Good idea =)
Align text in the center and, if possible, transfer lines.
Originally posted by InDigazzZ:
That is in known bugs...
"local icon"'s icon should be more expressive - a little bigger and can yellow or red
Originally posted by InDigazzZ:
I tested a lot of different colors and sizes and this is what I choose after half an hour of testing. On dark images is the white dot visible, and on light images is the black border visible. Any other color might blend in with the image. I agree that the size should be bigger, but then it looks really weird when there is a lots of big dotes)
Anyway you can edit the userJS file and change those lines:
cont.fillStyle = "rgba(255,255,255,0.8)"; // fill color
cont.strokeStyle = "rgba(0,0,0,0.8)"; // border collor
cont.arc(6+l,6+t,2,0,360*(Math.PI/180),false); // the third parameter "2" is the radius of the circle.
1. Open image;
2. Open gallery;
3. Right Click.
2.
Sometimes folders are created only with the second / third time ...
Wish - If you want to delete some of the pictures, then just drag it out from the black box. - It is better to open the image. "Open image" in the context menu too complicated
3. Thumbnails for folders
Originally posted by InDigazzZ:
In new version you can Open the image with double click =)
Originally posted by InDigazzZ:
Sorry, I won't do that - that would make lots of troubles.
Originally posted by InDigazzZ:
Thanks for this one, I'll try to fix it =)
Originally posted by ZAHEK:
Well I don't plan to do much improvement now. There are only few things I will add and then I will focus on bug fixing. And I hope that at least someone will use it =)
Originally posted by InDigazzZ:
I've updated the post and on the URL is the new version =)
If you find any bug that is not in known please let me know
Originally posted by BS-Harou:
i want to try
News:
- Opened tabs synchronization
- Folders
- Import/Export
- Clear current folder
- Option to create PNG Icon (thumbnail) for each image (if you want to use this, you have to set big User JS Storage Quota, but then you don't have to download the image every time when you open the gallery)
- Description for images
- "Alerting" URL
Originally posted by greench:
It actually stores only url of images. Anyway its limited only by the number you set in opera:config
Originally posted by BS-Harou:
The worst bug is the lines that it leaves behind when you close it - the problem is that this is bug of opera :/