Develop a compass range picker in JQuery/Raphael.
- or -
Post a project like this3980
$40/hr
- Posted:
- Proposals: 5
- Remote
- #249204
- Completed
Description
Experience Level: Expert
Project: swellcast.com.au - provides surf forecasts for Australia.
Task: Develop a compass range picker in JQuery (important). Also probably Raphael, however I'm open to other suggestions. I would like to avoid using the bloated dogs' breakfast that is JQuery UI.
Context: this code is to be used within a form to provide a simple interface for defining an arc within a circle. The form user will be defining a range for wind direction eg. between SSE and E, as part of an advanced forecast alert.
Deliverables: only JQuery function, with basic HTML demo. No actual form development is required. I will take the function and use it within a Rails app. No CSS style requirements, can be styled any way you like within the demo.
Requirements: The user should be able to define a range start point by clicking within the circle eg. 120 degrees, and a range end point eg. 180 degrees. North is 0 degrees. Some visual feedback is required to show the user the arc they have defined (please see the attached wireframe). Callbacks should be available to pass the numerical values to hidden form fields.
Problems/questions: I'm thinking that mousedrag could be used to draw the arc. eg. with mousedown to define the start point, and mouseup to define end. I'm open to suggestions here.
Haven't quite figured out how to handle the scenario where the arc straddles North, but this is something I will probably handle once the values have been passed, in Ruby.
Definitely potential for more work on this project and others.
EDIT: I have uploaded a rough wireframe to help explain the functionality better.
Task: Develop a compass range picker in JQuery (important). Also probably Raphael, however I'm open to other suggestions. I would like to avoid using the bloated dogs' breakfast that is JQuery UI.
Context: this code is to be used within a form to provide a simple interface for defining an arc within a circle. The form user will be defining a range for wind direction eg. between SSE and E, as part of an advanced forecast alert.
Deliverables: only JQuery function, with basic HTML demo. No actual form development is required. I will take the function and use it within a Rails app. No CSS style requirements, can be styled any way you like within the demo.
Requirements: The user should be able to define a range start point by clicking within the circle eg. 120 degrees, and a range end point eg. 180 degrees. North is 0 degrees. Some visual feedback is required to show the user the arc they have defined (please see the attached wireframe). Callbacks should be available to pass the numerical values to hidden form fields.
Problems/questions: I'm thinking that mousedrag could be used to draw the arc. eg. with mousedown to define the start point, and mouseup to define end. I'm open to suggestions here.
Haven't quite figured out how to handle the scenario where the arc straddles North, but this is something I will probably handle once the values have been passed, in Ruby.
Definitely potential for more work on this project and others.
EDIT: I have uploaded a rough wireframe to help explain the functionality better.
Ray S.
100% (4)Projects Completed
4
Freelancers worked with
4
Projects awarded
67%
Last project
22 May 2014
Australia
New Proposal
Login to your account and send a proposal now to get this project.
Log inClarification Board Ask a Question
-
There are no clarification messages.
We collect cookies to enable the proper functioning and security of our website, and to enhance your experience. By clicking on 'Accept All Cookies', you consent to the use of these cookies. You can change your 'Cookies Settings' at any time. For more information, please read ourCookie Policy
Cookie Settings
Accept All Cookies