Update selectors for modal forms.

kmollee · Apr 24, 2014 · f669ed7 · f669ed7
1 parent 8f7a8b6
commit f669ed7
Show file tree

Hide file tree

Showing 8 changed files with 33 additions and 44 deletions.
diff --git a/gallery/static/js/base.js b/gallery/static/js/base.js
@@ -21,16 +21,16 @@ $(function() {
     });
 
     // Enabling the modal window shows the wrapper and enables the cancel button.
-    function enableModalWindow(selector) {
+    function enableModalWindow() {
         $("#modal-wrapper").show();
         $("#modal .cancel").click(function(event){
-            disableModalWindow(selector);
+            disableModalWindow();
         });
         $("#modal select").chosen();
     }
 
     // Disabling the modal window clears the html and hides the  wrapper.
-    function disableModalWindow(selector) {
+    function disableModalWindow() {
         $("#modal").html("");
         $("#modal-wrapper").hide();
     }
@@ -45,7 +45,7 @@ $(function() {
     // and will catch the form resposne and re-populate the div with the
     // results of the form if status is "ERROR". If status is "OK" then the
     // page will be refreshed with the URL that was sent from the server.
-    function initializeModalForm(selector) {
+    function initializeModalForm() {
         // Change the form in the modal window to an AJAX form.
         $("#modal form").submit(function(event){
             event.preventDefault();
@@ -75,7 +75,7 @@ $(function() {
     }
 
     // Send an AJAX request when Rotate is clicked.
-    $("#toolbar .photo-actions .rotate").click(function(event){
+    $("[data-modal='rotate']").click(function(event){
         event.preventDefault();
         $.ajax({
             method: "POST",
@@ -93,30 +93,19 @@ $(function() {
         });
     });
 
-    // Open the AJAX form when any of the following links are clicked.
-    selector_arry = [
-        "#toolbar .photo-actions .move",
-        "#toolbar .photo-actions .tag",
-        "#toolbar .album-actions .merge",
-        "#toolbar .actions .rename",
-        "#toolbar .actions .delete",
-        "#toolbar .actions .create"
-    ]
-
-    $.each(selector_arry, function(index, value){
-        $(value).click(function(event){
-            event.preventDefault();
-            $.getJSON($(this).attr("href"), function(data) {
-                if (data.html) {
-                    $("#modal").html(data.html)
-                    enableModalWindow(value);
-                    initializeModalForm(value);
-                    $("#modal input[type='text']:enabled:first").focus();
-                }
-                else {
-                    errorProcessing(data);
-                }
-            });
+    // Display the form when any modal form links are clicked.
+    $("[data-modal='form']").click(function(event){
+        event.preventDefault();
+        $.getJSON($(this).attr("href"), function(data) {
+            if (data.html) {
+                $("#modal").html(data.html)
+                enableModalWindow();
+                initializeModalForm();
+                $("#modal input[type='text']:enabled:first").focus();
+            }
+            else {
+                errorProcessing(data);
+            }
         });
     });
 

diff --git a/photos/templates/photos/album_detail.html b/photos/templates/photos/album_detail.html
@@ -8,11 +8,11 @@
 {% block actions %}
     <div class="actions album-actions">
         {% if perms.photos.change_album %}
-            <a href="{% url 'album_edit' album.pk %}" class="rename">{% trans 'Edit' %}</a>
-            <a href="{% url 'album_merge' album.pk %}" class="merge">{% trans 'Merge' %}</a>
+            <a href="{% url 'album_edit' album.pk %}" data-modal="form">{% trans 'Edit' %}</a>
+            <a href="{% url 'album_merge' album.pk %}" data-modal="form">{% trans 'Merge' %}</a>
         {% endif %}
         {% if perms.photos.delete_album %}
-            <a href="{% url 'album_delete' album.pk %}" class="delete">{% trans 'Delete' %}</a>
+            <a href="{% url 'album_delete' album.pk %}" data-modal="form">{% trans 'Delete' %}</a>
         {% endif %}
         <a href="{% url 'album_download' album.pk %}">{% trans 'Download' %}</a>
     </div>

diff --git a/photos/templates/photos/album_list.html b/photos/templates/photos/album_list.html
@@ -9,7 +9,7 @@
 {% block actions %}
     <span class="actions album-actions">
         {% if perms.photos.add_album %}
-            <a href="{% url 'album_create' %}" class="create">{% trans 'Create Album' %}</a>
+            <a href="{% url 'album_create' %}" data-modal="form">{% trans 'Create Album' %}</a>
         {% endif %}
     </span>
 {% endblock %}

diff --git a/photos/templates/photos/location_detail.html b/photos/templates/photos/location_detail.html
@@ -9,10 +9,10 @@
 {% block actions %}
     <div class="actions location-actions">
         {% if perms.photos.change_location %}
-            <a href="{% url 'location_rename' location.pk %}" class="rename">{% trans 'Rename' %}</a>
+            <a href="{% url 'location_rename' location.pk %}" data-modal="form">{% trans 'Rename' %}</a>
         {% endif %}
         {% if perms.photos.delete_location %}
-            <a href="{% url 'location_delete' location.pk %}" class="delete">{% trans 'Delete' %}</a>
+            <a href="{% url 'location_delete' location.pk %}" data-modal="form">{% trans 'Delete' %}</a>
         {% endif %}
     </div>
 {% endblock %}

diff --git a/photos/templates/photos/location_list.html b/photos/templates/photos/location_list.html
@@ -9,7 +9,7 @@
 {% block actions %}
     <span class="actions location-actions">
         {% if perms.photos.add_location %}
-            <a href="{% url 'location_create' %}" class="create">{% trans 'Create Location' %}</a>
+            <a href="{% url 'location_create' %}" data-modal="form">{% trans 'Create Location' %}</a>
         {% endif %}
     </span>
 {% endblock %}

diff --git a/photos/templates/photos/person_detail.html b/photos/templates/photos/person_detail.html
@@ -8,10 +8,10 @@
 {% block actions %}
     <div class="actions person-actions">
         {% if perms.photos.change_person %}
-            <a href="{% url 'person_rename' person.pk %}" class="rename">{% trans 'Rename' %}</a>
+            <a href="{% url 'person_rename' person.pk %}" data-modal="form">{% trans 'Rename' %}</a>
         {% endif %}
         {% if perms.photos.delete_person %}
-            <a href="{% url 'person_delete' person.pk %}" class="delete">{% trans 'Delete' %}</a>
+            <a href="{% url 'person_delete' person.pk %}" data-modal="form">{% trans 'Delete' %}</a>
         {% endif %}
     </div>
 {% endblock %}

diff --git a/photos/templates/photos/person_list.html b/photos/templates/photos/person_list.html
@@ -9,7 +9,7 @@
 {% block actions %}
     <span class="actions person-actions">
         {% if perms.photos.add_person %}
-            <a href="{% url 'person_create' %}" class="create">{% trans 'Create Person' %}</a>
+            <a href="{% url 'person_create' %}" data-modal="form">{% trans 'Create Person' %}</a>
         {% endif %}
     </span>
 {% endblock %}

diff --git a/photos/templates/photos/photo_detail.html b/photos/templates/photos/photo_detail.html
@@ -28,13 +28,13 @@
 {% block actions %}
     <div class="actions photo-actions">
         {% if perms.photos.change_photo %}
-            <a href="{% url 'photo_rotate' photo.pk %}" class="rotate">{% trans 'Rotate' %}</a>
-            <a href="{% url 'photo_rename' photo.pk %}" class="rename">{% trans 'Rename' %}</a>
-            <a href="{% url 'photo_move' photo.pk %}" class="move">{% trans 'Move' %}</a>
-            <a href="{% url 'photo_tag' photo.pk %}" class="tag">{% trans 'Tag' %}</a>
+            <a href="{% url 'photo_rotate' photo.pk %}" data-modal="rotate">{% trans 'Rotate' %}</a>
+            <a href="{% url 'photo_rename' photo.pk %}" data-modal="form">{% trans 'Rename' %}</a>
+            <a href="{% url 'photo_move' photo.pk %}" data-modal="form">{% trans 'Move' %}</a>
+            <a href="{% url 'photo_tag' photo.pk %}" data-modal="form">{% trans 'Tag' %}</a>
         {% endif %}
         {% if perms.photos.delete_photo %}
-            <a href="{% url 'photo_delete' photo.pk %}" class="delete">{% trans 'Delete' %}</a>
+            <a href="{% url 'photo_delete' photo.pk %}" data-modal="form">{% trans 'Delete' %}</a>
         {% endif %}
         <a href="{% url 'photo_download' photo.pk %}">{% trans 'Download' %}</a>
     </div>