Exclusively for Vikranat G. (vikrant12112) Develop html5 based page with 3 separate containers - do not bid 2 - 13/12/2017 13:23 EST

Completed Posted 6 years ago Paid on delivery
Completed Paid on delivery

Javascript based, no special libraries.

Need simple area with 3 containers.

Initiate with all sections expanded. (See [url removed, login to view])

Three sections as follows:

Left container needs to be a functioning Explorer

Both right and bottom/right containers are empty

Right container will be tab based and will open tabs as selected from explorer

All containers can be adjusted by dragging “channel” separating them, which would increase/decrease area and decrease/adjoining area. (See [url removed, login to view])

All containers need to have elevators to scroll to show full different parts of container

Minimize buttons will minimize container to a ribbon ([url removed, login to view])

Maximize button will take the full space, minimizing the area containers (See [url removed, login to view])

Restore button will open container without impacting whatever size the other containers are

————————————

For explorer container

Each element will have two icons

- for folder items, the first icon will be either a triangle pointing right or pointing down, depending on state of folder, the second icon will be a closed or open folder depending on state of folder

- for chart items, the first icon is a spacer icon, and the second icon is a simple icon.

(I should be able to specify what icons to put in all places)

Click on arrow once click to expand folder and changes arrow from pointing to the right to pointing down.

Click on text of folder two clicks to expand folder and changes arrow from pointing to the right to pointing down.

Double Click on Chart to open

If Open, activate tab for that selected item

Hover over tab text shows entire path (No image)

Explorer container is populated with Ajax calls that will return json as follows:

Uri: http://domain/api/map/explorer?path=

{“”:[

{“name”:”amcolumn”,”type”:”folder”},

{“name”:”amline”,”type”:”folder”}

]

}

Uri: http://domain/api/map/explorer?path=amline

{“amline”:[

{“name”:”amcolumn”,”type”:”folder”},

{“name”:”amline”,”type”:”folder”},

{“name”:”ampie”,”type”:”folder”},

{“name”:”amxy”,”type”:”folder”},

{“name”:”amxy”,”type”:”folder”},

{“name”:”amcolumn”,”type”:”folder”},

{“name”:”amline”,”type”:”folder”},

{“name”:”ampie”,”type”:”folder”},

{“name”:”amxy”,”type”:”folder”},

{“name”:”amxy”,”type”:”folder”},

{“name”:”amcolumn”,”type”:”folder”},

{“name”:”amline”,”type”:”folder”},

{“name”:”Chart 9”,”type”:”folder”}

]

Uri: http://domain/api/map/explorer?path=amline|amxy|pdci|amchart

{“amline|amxy|pdci|amchart”:[

{“name”:”amcolumn”,”type”:”folder”},

{“name”:”amline”,”type”:”folder”},

{“name”:”amxy”,”type”:”folder”},

{“name”:”amxy”,”type”:”folder”},

{“name”:”Chart”,”type”:”folder”}

{“name”:”Chart 2”,”type”:”folder”}

{“name”:”Chart 3”,”type”:”folder”}

{“name”:”Chart 4”,”type”:”folder”}

{“name”:”Chart 5”,”type”:”folder”}

{“name”:”Chart 6”,”type”:”folder”}

{“name”:”Chart 7”,”type”:”folder”}

]

}

——————————

For second container will contain tabs for opened items:

When Too Many open tabs an >> icon is added a counter is kept of items not visible

(see [url removed, login to view])

When Too Many tabs open and >> icons clicked, dropdown appears (See [url removed, login to view])

——————————

Must be responsive (I should be able to view this through a mobile device)

We agreed to $300 total for projecdt

$150 with first prototype

$150 with completion to my satisfaction

4 days to complete project

Vikranat G. understands that I am very specific about my deliverables. I spent a good amount of time getting it ready. I need to make sure it looks as good as what I provided, and work as I provided in my requirements. If it does not, I will not accept it.

AJAX HTML5 JavaScript JSON

Project ID: #15867525

About the project

2 proposals Remote project Active 6 years ago

Awarded to:

$150 USD in 4 days
(32 Reviews)
4.7

2 freelancers are bidding on average $103 for this job

qualityhelp

A proposal has not yet been provided

$55 USD in 3 days
(7 Reviews)
2.9