The Steampunk Forum at Brass Goggles
December 16, 2017, 02:36:00 am *
Welcome, Guest. Please login or register.
Did you miss your activation email?

Login with username, password and session length
News: Support BrassGoggles! Donate once or $3/mo.
 See details here.
 
   Home   Blog Help Rules Login Register  
Pages: [1]   Go Down
  Print  
Author Topic: Steamish Image Magnifier  (Read 200 times)
yereverluvinunclebert
Zeppelin Captain
*****
United Kingdom United Kingdom



WWW
« on: November 18, 2017, 11:39:02 am »

This is a steamish image magnifier tool that uses one of my steampunk icons a magnifying glass to magnify any image you choose to upload. The web-page is actually a test of HTML5 technology using ctx. image drag/drop to see how easy or difficult it is to convert one of our previous widgets to a web widget. The coding was entirely done by Harry Whitfield.

What is happening here is that an underlying image is displayed and then an image taken directly from the lower image at a defined spot. The image is smaller in size and is scaled upward. The second image is then cropped into a circle and placed exactly over the original along with the magnifying glass image. Every time the magnifying glass moved this process occurs again. The fact that it works so smoothly is a credit to the designers of the implementation of HTML5 in all the main browsers.

You can try it for yourself here:
http://g6auc.me.uk/Display_Image/index.html



Modifiying it to function on tablet devices, their handling of onMouse event is weird and so the tool will only currently work with mouse-equipped devices.
« Last Edit: November 18, 2017, 05:29:38 pm by yereverluvinunclebert » Logged

Lightquick - Steampunk Widgets and Icons of Some Worldwide Repute
Banfili
Zeppelin Captain
*****
Australia Australia



« Reply #1 on: November 18, 2017, 01:06:14 pm »

Very nice, unclebert, very nice, indeed!
 Grin
Logged
Miranda.T
Zeppelin Captain
*****
United Kingdom United Kingdom



« Reply #2 on: November 18, 2017, 02:40:25 pm »

It works well with a WebKit based browser. Good job!

Yours,
Miranda.
Logged
yereverluvinunclebert
Zeppelin Captain
*****
United Kingdom United Kingdom



WWW
« Reply #3 on: November 18, 2017, 05:27:01 pm »

Thanks everyone. The trouble is that browser-based software needs to be written to support all different device types. The latest version may well work on tablet devices as changes have been made to support touch events. We don't have all types to test so feel free to respond telling which of yours it fails to operate on.

The default image is that of Oxford, some of the dreaming spires. You can upload your own of course.

« Last Edit: November 18, 2017, 05:28:34 pm by yereverluvinunclebert » Logged
yereverluvinunclebert
Zeppelin Captain
*****
United Kingdom United Kingdom



WWW
« Reply #4 on: November 22, 2017, 01:37:18 pm »

New version with sliders to control the size of the magnifying glass and the magnification.

The web-page does not work on Internet Explorer, not even 11 as the latest HTML5 technology is not being retrofitted into IE11. It may well work on Edge but it has not been tested. If you have the time and the opportunity please try it in Microsoft's Edge browser and let me know.

You can try it for yourself here:
http://g6auc.me.uk/Display_Image/index.html

Edge - What a stupid name for a browser, doesn't exactly roll off the tongue does it? Careful you might fall off the Edge, the Edge is not a good place to be, don't go near the Edge... What were they thinking?

The Edge browser works quite well as long as you avoid touch based devices, the edge browser generates spurious events when dragging so it doesn't work very well on Windows based tablets.

« Last Edit: November 27, 2017, 10:56:49 am by yereverluvinunclebert » Logged
yereverluvinunclebert
Zeppelin Captain
*****
United Kingdom United Kingdom



WWW
« Reply #5 on: November 27, 2017, 10:54:21 am »

Latest version with sliders pictured:


Look at the latest version here:
http://g6auc.me.uk/Display_Image/index.html
« Last Edit: November 27, 2017, 10:57:13 am by yereverluvinunclebert » Logged
Pages: [1]   Go Up
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.20 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!
Page created in 0.148 seconds with 16 queries.