I provide to my clients documentations of construction projects. In this stage these documentations are in Html format and provides photos in sync with architectural plans and possibility of front end interaction for viewing the place and direction of each photoshoot by clicking on the picture.
The documentation is built into modules. Each module contain the architectural plan, the photographed image and at the bottom a menu with photo number, "go to top" button, zoom and download buttons. For the purpose of this project I have built two more buttons which must open two customer workspaces on the left side of the screen. One of the buttons, which I called "photo over photo", should open the area where the client will work over the image (img-1), and the second called "photo over plan", must open the area where the client will work over the architectural plan (img-2).
In these left areas, the client must be able to do the following:
1. Upload photos
2. Possibility to drag and drop each uploaded photo over the main image or plan in the place he wants.
3. For each photo, during the upload process, the client must be able to access a block with data fields in which can be recorded some informations about the photographed place: certain tags, categories, dates, description, etc. which will be recorded in the database of each project.
Uploaded photos management:
Each picture, when it is placed in the desired place, must also become a container in which the next image of the same place can be dropped. Thus, the customer can drop more photos of the same place, photos taken at different dates.
Each such container must have a gallery opening button. This gallery will contain the picture or pictures dropped in the same place. Each photo in the gallery will have a delete and zoom button. Next to each picture will be displayed the block with data fields each field with the possibility to be edited and saved (img-3).
- The mobile variant must give the possibility to upload photos from the gallery and also directly, using the camera . The drag, drop and data recording functions must be the same.
- In the mobile variant the two respective areas must be able to be opened as floating window from right to the left.
- In the top menu I have a button "Quick search" which open a quick search popup where the client can find quickly by viewing the plan the desired photographed place and jump to it. I want that when a uploaded picture is placed in the left side areas over the main image or plan, the color of the button corresponding to the right module number to change.
- During upload resizing the images to a certain long size and number of pixels.
- All the photos must be uploaded in a separate folder INSIDE the "container" folder.
THE NEW CODE MUST BE IN SEPARATE FILES AND BUILT IN SO THAT IT CAN BE EASILY MULTIPLIED FOR HOW MANY MODULES ARE NEEDED.
* The images have an explanatory role only. The locations and the design of the elements will be discussed along with the progress of the project according to the functionality of each.
I will provide an ftp with the platform to work on this page: [login to view URL]
According to all these requests, I would be glad to receive a quote.
32 фрилансеров(-а) в среднем готовы выполнить эту работу за $11/час
We are highly expertise and experienced to developed custom eCommerce website and CMS website using WordPress, Woo commerce, Big commerce and Shopify. Please talk to us, we will start work on it straight away.