Concert spring 2011_presentation_1

716 views

Published on

Published in: Education
  • Be the first to comment

  • Be the first to like this

Concert spring 2011_presentation_1

  1. 1. Initial Presentation February 25, 2010
  2. 2. Progress UI Finished Wireframes Created Mockups Decided on a color schemes Icon Set is going through revisions UI Implementation - translate Photoshop mockup to CSS HTML structure & Django templates REST API Manipulate Tags Manipulate Audio Objects Details on our wiki[1]
  3. 3. Mockup See our blog post on waveform behavior[2]
  4. 4. Representational State Transfer(REST) API Interface for manipulating resources over HTTP
  5. 5. REST HTTP methods Resource GET PUT POST DELETE Replace the entire Collection URI, such as List the collections Create a new entry in Delete the entire collection with another http://example.com/resources/ members. the collection. collection. collection. Replace the addressed Treat the addressed Retrieve addressed Delete the addressed Element URI, such as member of the member as a collection member of the member of the http://example.com/resources/142/ collection, or if it doesnt and create a new entry collection. collection. exist,create it. in it.
  6. 6. REST HTTP methods Resource GET PUT POST DELETE Replace the entire Collection URI, such as List the collections Create a new entry in Delete the entire collection with another http://example.com/resources/ members. the collection. collection. collection. Replace the addressed Treat the addressed Retrieve addressed Delete the addressed Element URI, such as member of the member as a collection member of the member of the http://example.com/resources/142/ collection, or if it doesnt and create a new entry collection. collection. exist,create it. in it.
  7. 7. REST HTTP methods Resource GET PUT POST DELETE Replace the entire Collection URI, such as List the collections Create a new entry in Delete the entire collection with another http://example.com/resources/ members. the collection. collection. collection. Replace the addressed Treat the addressed Retrieve addressed Delete the addressed Element URI, such as member of the member as a collection member of the member of the http://example.com/resources/142/ collection, or if it doesnt and create a new entry collection. collection. exist,create it. in it.
  8. 8. REST in Concert Easily modify Django models from the frontend See our previous presentation on Backbone.js[3]
  9. 9. But what does it all mean? POST http://localhost:8896/api/1/request/ {"collection":"/api/1/collection/1/", "user":"/api/1/user/2/"} { "collection": "/api/1/collection/1/", "id": "1", "resource_uri": "/api/1/request/1/", "status": "p", "user": "/api/1/user/2/" }
  10. 10. But what does it all mean? GET http://localhost:8896/api/1/request/ [ { "collection": "/api/1/collection/1/", "id": "1", "resource_uri": "/api/1/request/1/", "status": "p", "user": "/api/1/user/2/" } ]
  11. 11. How we do it.#### A collection join request. Should be deleted when action is taken.###class Request(models.Model): ... user = models.ForeignKey(User) collection = models.ForeignKey(Collection) status = models.CharField(max_length=1, choices=REQUEST_STATUS_CHOICES, default=p) ...
  12. 12. How we do it.#### A collection join request. Should be deleted when action is taken.###class Request(models.Model): ... user = models.ForeignKey(User) collection = models.ForeignKey(Collection) status = models.CharField(max_length=1, choices=REQUEST_STATUS_CHOICES, default=p) ... tastypie ### # This is the resource that is used for a collection request. ### class RequestResource(MyResource): user = fields.ForeignKey(UserResource, user) collection = fields.ForeignKey(CollectionResource, collection, full=True) status = fields.CharField(status, default=p) ...
  13. 13. How we do it.#### A collection join request. Should be deleted when action is taken.###class Request(models.Model): ... user = models.ForeignKey(User) collection = models.ForeignKey(Collection) status = models.CharField(max_length=1, choices=REQUEST_STATUS_CHOICES, default=p) ... tastypie ### # This is the resource that is used for a collection request. ### class RequestResource(MyResource): user = fields.ForeignKey(UserResource, user) collection = fields.ForeignKey(CollectionResource, collection, full=True) status = fields.CharField(status, default=p) ... /** * A Collection object represents a django Collection object. * @class **/ var Collection = ConcertBackboneModel.extend({ ... /** * When a user wants to join a collection. **/ requestToJoin: function() { var reqs = this.get(requests); reqs.create({ user: com.concertsoundorganizer.page.user.url(), collection: this.url() }); } ...
  14. 14. How we do it.#### A collection join request. Should be deleted when action is taken.###class Request(models.Model): ... user = models.ForeignKey(User) collection = models.ForeignKey(Collection) status = models.CharField(max_length=1, choices=REQUEST_STATUS_CHOICES, default=p) ... tastypie ### # This is the resource that is used for a collection request. ### class RequestResource(MyResource): user = fields.ForeignKey(UserResource, user) collection = fields.ForeignKey(CollectionResource, collection, full=True) status = fields.CharField(status, default=p) ... /** * A Collection object represents a django Collection object. * @class **/ var Collection = ConcertBackboneModel.extend({ ... /** * When a user wants to join a collection. **/ requestToJoin: function() { var reqs = this.get(requests); reqs.create({ user: com.concertsoundorganizer.page.user.url(), POST http://localhost:8896/api/1/request/ collection: this.url() {"collection":"/api/1/collection/1/", "user":"/api/1/user/2/"} }); } ...
  15. 15. Issues Concert Events & Many-To-Many Relationships
  16. 16. Issuesclass Tag(models.Model): segments = models.ManyToManyField(AudioSegment, related_name = "tags") collection = models.ForeignKey(Collection) name = models.CharField(max_length = 100) time = models.DateTimeField(auto_now_add = True) creator = models.ForeignKey(User) Old Way Add URL: /add_segment_to_tag Delete URL: /delete_segment_from_tag
  17. 17. Issuesclass Tag(models.Model): segments = models.ManyToManyField(AudioSegment, related_name = "tags") collection = models.ForeignKey(Collection) name = models.CharField(max_length = 100) time = models.DateTimeField(auto_now_add = True) creator = models.ForeignKey(User) New Way Client send a PUT Request /api/tag/<tag_id>/ Backend UPDATES the tag (Wants to add an audio segment to a given tag) object instance (HOW AND WHAT DID IT UPDATE?)
  18. 18. Solution Custom Nested Resources
  19. 19. Solution /api/tag/<tag_id>
  20. 20. Solution /api/tag/<tag_id> /api/tag/<tag_id>/audio_segment/<audio_seg_id>
  21. 21. Thanks & QuestionsEspecially to Graylin...

×