The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Image viewer- html, javascript
Pradi01
post May 29 2018, 12:26 AM
Post #1





Group: Members
Posts: 3
Joined: 29-May 18
Member No.: 26,651



Hi

I am trying to develop an image viewer using html. Most of the functionalities has been developed with the help of google search, but I am struck up with few issues.

The design of the current viewer is as follows,
1. It loads images from the directory(using php) and displays the first image from the folder onload.
2. Collects multiple responses (using radio/checkboxes) from the user in the form for each image.
3. On 'next' click it submits the responses and displays the next image in the folder with the form.
4. The responses are registered in the excel file.

The following are the issues (or modifications) I have to fix,

1. Instead of automatically loading the first file, I wish the user to type the file name to open an image from the folder and use the next button to shift to the next image in the folder. This can help the user to choose any image.
2. On using the next button, I want the file name of the image to be displayed on the text box - this can help the user keep track about the images and upon next click it has to display the next image in the folder with the filename displayed .


Any suggestions of your will be much appreciated!

Thanks in advance,

Pradi









User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post May 29 2018, 07:42 AM
Post #2


.
********

Group: WDG Moderators
Posts: 7,919
Joined: 10-August 06
Member No.: 7



I move this to the server-side forum since it involves at least some of that.

QUOTE(Pradi01 @ May 29 2018, 07:26 AM) *

1. Instead of automatically loading the first file, I wish the user to type the file name to open an image from the folder

This might be a bit tedious for the user, but the functionality sounds like a search box. How will the user know what file name to type?

Perhaps the PHP script can make an array of all file names, then compare the user's search string with each array item for (partial) matches. There might be a PHP function for this already. Different spelling can still be a problem though, like in "color" vs "colour", "e" vs "é", "ê" etc.

QUOTE
2. On using the next button, I want the file name of the image to be displayed on the text box - this can help the user keep track about the images and upon next click it has to display the next image in the folder with the filename displayed .

This might work, though it limits you to using human-readable file names --e.g, file named "dog0014.jpg", "dog0015.jpg" etc may be more practical to you, but less elegant in the eyes of the user.


User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Pradi01
post May 29 2018, 07:04 PM
Post #3





Group: Members
Posts: 3
Joined: 29-May 18
Member No.: 26,651



QUOTE(Christian J @ May 29 2018, 07:42 AM) *

I move this to the server-side forum since it involves at least some of that.

QUOTE(Pradi01 @ May 29 2018, 07:26 AM) *

1. Instead of automatically loading the first file, I wish the user to type the file name to open an image from the folder

This might be a bit tedious for the user, but the functionality sounds like a search box. How will the user know what file name to type?

Perhaps the PHP script can make an array of all file names, then compare the user's search string with each array item for (partial) matches. There might be a PHP function for this already. Different spelling can still be a problem though, like in "color" vs "colour", "e" vs "é", "ê" etc.

QUOTE
2. On using the next button, I want the file name of the image to be displayed on the text box - this can help the user keep track about the images and upon next click it has to display the next image in the folder with the filename displayed .

This might work, though it limits you to using human-readable file names --e.g, file named "dog0014.jpg", "dog0015.jpg" etc may be more practical to you, but less elegant in the eyes of the user.



Thank you for your reply.

The files are named with sequential numbers eg. 1.jpg, 2.jpg etc. so the user can know the file name. I wanted this functionality as the user have to enter the response for 1000's of images. This type of functionality can enable them to enter responses as per their conveience- by opening from the files which they have start at every new session.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post May 29 2018, 07:18 PM
Post #4


.
********

Group: WDG Moderators
Posts: 7,919
Joined: 10-August 06
Member No.: 7



In that case maybe you could associate each image with a querystring, say "index.php?image=1" etc, that way the user can bookmark the last viewed image URL. Otherwise the user would have to make notes of the last viewed image number, which seems unpractical.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Pradi01
post Jul 6 2018, 12:50 AM
Post #5





Group: Members
Posts: 3
Joined: 29-May 18
Member No.: 26,651



Hi , I would like to a new feature into the image viewer. Draw a straight line (as in imageJ tool) on the loaded image with the use of mouse and save the length of line (in pixel units) and image with the line drawn. Can anyone suggest how this can be done without the use of canvas. Thanks in advance.

Regards,
Pradi


QUOTE(Pradi01 @ May 29 2018, 07:04 PM) *

QUOTE(Christian J @ May 29 2018, 07:42 AM) *

I move this to the server-side forum since it involves at least some of that.

QUOTE(Pradi01 @ May 29 2018, 07:26 AM) *

1. Instead of automatically loading the first file, I wish the user to type the file name to open an image from the folder

This might be a bit tedious for the user, but the functionality sounds like a search box. How will the user know what file name to type?

Perhaps the PHP script can make an array of all file names, then compare the user's search string with each array item for (partial) matches. There might be a PHP function for this already. Different spelling can still be a problem though, like in "color" vs "colour", "e" vs "é", "ê" etc.

QUOTE
2. On using the next button, I want the file name of the image to be displayed on the text box - this can help the user keep track about the images and upon next click it has to display the next image in the folder with the filename displayed .

This might work, though it limits you to using human-readable file names --e.g, file named "dog0014.jpg", "dog0015.jpg" etc may be more practical to you, but less elegant in the eyes of the user.



Thank you for your reply.

The files are named with sequential numbers eg. 1.jpg, 2.jpg etc. so the user can know the file name. I wanted this functionality as the user have to enter the response for 1000's of images. This type of functionality can enable them to enter responses as per their conveience- by opening from the files which they have start at every new session.

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
3 User(s) are reading this topic (3 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 21st October 2018 - 09:05 AM