public/javascripts/application.js

   1 Lyrix = {}; // Our own little namespace.
   2
   3 // We can pass values from the server this way
   4 // I like this syntax better
   5 $P = function(element) {
   6   return $(element).innerHTML;
   7 }
   8
   9 // ===============================================
  10 // = Behavior proxies to Script.aculo.us objects =
  11 // ===============================================
  12 Lyrix.Draggable = Behavior.create({
  13   initialize: function(options) {
  14     this.options = Object.extend({
  15       revert : true
  16     }, options || {});
  17     this.draggable = new Draggable(this.element, this.options);
  18   }
  19 });
  20
  21 Lyrix.Droppable = Behavior.create({
  22   initialize: function(options) {
  23     this.options = (options || {});
  24     Droppables.add(this.element, this.options);
  25   }
  26 });
  27
  28 Lyrix.Sortable = Behavior.create({
  29   initialize: function(options) {
  30     this.options = Object.extend({
  31       constraint: false
  32     }, options || {});
  33     Sortable.create(this.element, this.options);
  34   }
  35 });
  36
  37 Lyrix.InPlaceEditor = Behavior.create({
  38   initialize: function(options) {
  39     this.options = Object.extend({
  40       urlBuilder: this._makeRequestURL,
  41       ajaxOptions: {method: 'put'}
  42     }, options || {});
  43
  44     this.url = this.options.urlBuilder(this.element);
  45     this.options.urlBuilder = null;
  46
  47     new Ajax.InPlaceEditor(this.element, this.url, this.options);
  48   },
  49   // Builds a default
  50   _makeRequestURL: function(element) {
  51     split_id = element.id.split('_');
  52
  53     params = {object: split_id[0], method: split_id[1], id: split_id[2]};
  54     return '/' + params.object + 's/set_' + params.object + '_' + params.method + '/' + params.id;
  55   }
  56 });
  57
  58 // ====================
  59 // = Custom behaviors =
  60 // ====================
  61 Lyrix.DeleteLink = Behavior.create({
  62   initialize: function() {
  63     this.form = $form({
  64       style: 'display:none',
  65       method: 'post',
  66       action: this.element.href
  67     }, $input({
  68       type: 'hidden',
  69       name: '_method',
  70       value: 'delete'
  71     }));
  72
  73     this.element.appendChild(this.form);
  74   },
  75   onclick: function(e) {
  76     this.form.submit();
  77     Event.stop(e);
  78   }
  79 });
  80
  81 Lyrix.FadingMessage = Behavior.create({
  82   onclick: function(e) {
  83     new Effect.Fade(this.element);
  84   }
  85 })
  86
  87 // =================================
  88 // = Behaviors for the application =
  89 // =================================
  90 Event.addBehavior({
  91   // Add some magical in-place-editors
  92   'span.in_place_editor_field': Lyrix.InPlaceEditor,
  93
  94   // Delete things using a hidden form
  95   'a.deletable': Lyrix.DeleteLink,
  96
  97   // Notices should fade out when clicked
  98   '#notice': Lyrix.FadingMessage,
  99
 100   // Allow songs to be dragged back and forth
 101   '.song, .usage': Lyrix.Draggable({handle: 'draggable'}),
 102
 103   // Make the songs in a show sortable and
 104   // allow songs from the sidebar to be dropped in
 105   '#songs_list': function() {
 106     sortableOptions = {
 107       constraint: false,
 108       handle: 'draggable',
 109       onUpdate: function(element) {
 110         new Ajax.Request('/shows/' + $P('show_id') + '/reorder', {
 111           method: 'put',
 112           parameters: Sortable.serialize(element)
 113         });
 114       }
 115     };
 116
 117     Lyrix.Droppable.attach(this, {
 118       accept: 'song',
 119       onDrop: function(element) {
 120         new Ajax.Request('/usages?show_id=' + $P('show_id'), {
 121           parameters: 'id=' + encodeURIComponent(element.id.gsub('song_', '')),
 122           onComplete: function() {
 123             // Make sure the sortable works for new elements
 124             Sortable.create('songs_list', sortableOptions);
 125           }
 126         });
 127       }
 128     });
 129
 130     Lyrix.Sortable.attach(this, sortableOptions);
 131   },
 132
 133   // Allow songs from a show to be dropped out of the show
 134   '#side_songs_list': Lyrix.Droppable({
 135     accept: 'usage',
 136     onDrop: function(element) {
 137       id = encodeURIComponent(element.id.gsub('usage_', ''));
 138       new Ajax.Request('/usages/' + id, {
 139         method: 'delete'
 140       });
 141     }
 142   })
 143 });