Ruby on Rails

Sorry, I should have elaborated a little more Walter...

I implemented Interact.js and used an example from a Drifting Ruby Episode...  https://www.youtube.com/watch?v=fhnHA7PWq0g

Dragging is working but drop doesn't "look" to be firing...

My form code currently is like this

<script>

    var dragMoveListener;

    dragMoveListener = function(event) {

        var target, x, y;

        target = event.target;

        x = (parseFloat(target.getAttribute('data-x')) || 0) + event.dx;

        y = (parseFloat(target.getAttribute('data-y')) || 0) + event.dy;

        target.style.webkitTransform = target.style.transform = 'translate(' + x + 'px, ' + y + 'px)';

        target.setAttribute('data-x', x);

        return target.setAttribute('data-y', y);

    };

    window.dragMoveListener = dragMoveListener;

    interact('*[data-draggable="true"]').draggable({

        inertia: false,

        autoScroll: true,

        onmove: dragMoveListener

    });

    $(document).on('load', function(){

        interact('#meal_items').dropzone({

            accept: '*[data-draggable="true"]',

            overlap: 0.75,

            ondropactivate: function(event) {},

            ondragenter: function(event) {

                event.target.classList.add('drop-target');

                event.relatedTarget.classList.add('can-drop');

                return $.get(event.relatedTarget.attributes['data-url'].value, {

                    favorite: true

                });

            },

            ondragleave: function(event) {

                event.target.classList.remove('drop-target');

                event.relatedTarget.classList.remove('can-drop');

                return $.get(event.relatedTarget.attributes['data-url'].value, {

                    favorite: false

                });

            },

            ondrop: function(event) {},

            ondropdeactivate: function(event) {

                event.target.classList.remove('drop-active');

                return event.target.classList.remove('drop-target');

            }

        });

    });

</script>

<% if action_name == "new" %>

  <div class="page-title">Creating New Meal</div>

<% else %>

  <div class="page-title">Editing Meal</div>

<% end %>

<div>

<div class="col-sm-4 col-md-4">

<%= form_for @meal do |f| %>

<% if @meal.errors.any? %>

<div id="error_explanation">

<h3><%= pluralize(@meal.errors.count, 'error') %> prohibited this meal from being saved:</h3>

<ul>

<% @meal.errors.full_messages.each do |message| %>

<li><%= message %></li>

<% end %>

</ul>

</div>

<% end %>

<div>

<table>

<tr>

<th align='left'>Name:</th>

<td><%= f.text_field(:name) %></td>

</tr>

<tr>

<th align='left'>Description:</th>

<td><%= f.text_area(:description) %></td>

</tr>

<tr>

<th align='left'>Available Daily:</th>

<td><%= f.check_box(:available_daily, 'data-toggle' => "toggle", 'data-size' => "mini", 'data-on' => "Yes", 'data-off' => "No", 'data-style' => "ios") %></td>

</tr>

<tr>

<th align='left'>Not Available:</th>

<td><%= f.check_box(:not_available, 'data-toggle' => "toggle", 'data-size' => "mini", 'data-on' => "Yes", 'data-off' => "No", 'data-style' => "ios") %></td>

</tr>

<tr>

<th align='left'>Meal Items:</th>

<td>

<div id="outer-dropzone">

<div id="meal_items" class="dropzone">

                  <% unless @meal.mitems.nil? %>

                    <% @meal.mitems.each do |mealitem| %>

                      <%= content_tag :div, mealitem.name, class: 'drag-drop can-drop', data: { draggable: true, url: meal_path(mealitem) } %>

                    <% end %>

                  <% end %>

</div>

</div>

</td>

</tr>

</table>

<div class="form-submit-buttons">

<%= f.submit class: 'btn btn-success' %>

<%= link_to 'Cancel', meals_path, class: 'btn btn-danger' %>

</div>

</div>

<% end %>

</div>

<div class="col-sm-2 col-md-2 entrees">

<div class='meal_item_title'>Entrees</div>

<% Mitem.entrees.each do |food| %>

<%= content_tag :div,

                food.name,

                class: 'drag-drop entree_items',

                data: { draggable: true, url: mitem_path(food) } %>

<% end %>

</div>

<div class="col-sm-2 col-md-2 vegetables">

<div class='meal_item_title'>Vegetables</div>

<% Mitem.vegetables.each do |food| %>

<%= content_tag :div,

                food.name,

                class: 'drag-drop vegetable_items',

                data: { draggable: true, url: mitem_path(food) } %>

<% end %>

</div>

<div class="col-sm-2 col-md-2 fruits">

<div class='meal_item_title'>Fruits</div>

<% Mitem.fruits.each do |food| %>

<%= content_tag :div,

                food.name,

                class: 'drag-drop fruit_items',

                data: { draggable: true, url: mitem_path(food) } %>

<% end %>

</div>

<div class="col-sm-2 col-md-2 drinks">

<div class='meal_item_title'>Drinks</div>

<% Mitem.drinks.each do |food| %>

<%= content_tag :div,

                food.name,

                class: 'drag-drop drink_items',

                data: { draggable: true, url: mitem_path(food) } %>

<% end %>

</div>

</div>

--
You received this message because you are subscribed to the Google Groups "Ruby on Rails: Talk" group.
To unsubscribe from this group and stop receiving emails from it, send an email to rubyonrails-talk+unsubscribe@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/rubyonrails-talk/e8d17aa1-5f7f-4a00-ae45-433a2b751724%40googlegroups.com.