From 03408f3e39bbb0b407b2949721090dd6b07913ac Mon Sep 17 00:00:00 2001 From: Tim Almdal Date: Thu, 5 Nov 2009 12:55:06 -0800 Subject: Refactor the in place editting in tags admin out into a separate widget as part ofthe gallery module. Create the jQuery widget, form template and library to support generalized in place editting. Part of the fix for ticket #750. --- lib/gallery.in_place_edit.js | 62 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 62 insertions(+) create mode 100644 lib/gallery.in_place_edit.js (limited to 'lib/gallery.in_place_edit.js') diff --git a/lib/gallery.in_place_edit.js b/lib/gallery.in_place_edit.js new file mode 100644 index 00000000..38c4efb1 --- /dev/null +++ b/lib/gallery.in_place_edit.js @@ -0,0 +1,62 @@ +(function($) { + $.widget("ui.gallery_in_place_edit", { + _init: function() { + var self = this; + $(self).data("parent", self.element.parent()); + this.element.click(function(event) { + event.preventDefault(); + self._show(event.currentTarget); + return false; + }); + }, + + _show: function(target) { + var self = this; + var tag_width = $(target).width(); + $(self).data("tag_width", tag_width); + + $.get(self.options.form_url.replace("__ID__", $(target).attr('rel')), function(data) { + var parent = $(target).parent(); + parent.children().hide(); + parent.append(data); + parent.find("form :text") + .width(tag_width) + .focus(); + $(".g-short-form").gallery_short_form(); + parent.find("form .g-cancel").click(function(event) { + parent.find("form").remove(); + parent.children().show(); + event.preventDefault(); + return false; + }); + self._ajaxify_edit(); + }); + + }, + + _ajaxify_edit: function() { + var self = this; + var form = $($(self).data("parent")).find("form"); + $(form).ajaxForm({ + dataType: "json", + success: function(data) { + if (data.result == "success") { + window.location.reload(); + } else { + $(form).replaceWith(data.form); + var width = $(self).data("tag_width"); + $($(self).data("parent")).find("form :text") + .width(width) + .focus(); + $(".g-short-form").gallery_short_form(); + self._ajaxify_edit(); + } + } + }); + } + }); + + $.extend($.ui.gallery_in_place_edit, { + defaults: {} + }); +})(jQuery); -- cgit v1.2.3 From beb63a83804e57050a23b3a90ebed93be41b6769 Mon Sep 17 00:00:00 2001 From: Tim Almdal Date: Fri, 6 Nov 2009 23:05:20 -0800 Subject: Clean up the In place edit api: 1) Only allow 1 in place edit to be active at a time (gets around the issue of using an id to identify the form 2) remove the add_ prefix from some of the api methods 3) clean up inconsistent naming --- lib/gallery.in_place_edit.js | 7 +++++++ modules/gallery/libraries/InPlaceEdit.php | 8 ++++---- modules/tag/controllers/admin_tags.php | 18 +++++++++--------- modules/tag/css/tag.css | 4 ++-- 4 files changed, 22 insertions(+), 15 deletions(-) (limited to 'lib/gallery.in_place_edit.js') diff --git a/lib/gallery.in_place_edit.js b/lib/gallery.in_place_edit.js index 38c4efb1..4a90581b 100644 --- a/lib/gallery.in_place_edit.js +++ b/lib/gallery.in_place_edit.js @@ -15,6 +15,13 @@ var tag_width = $(target).width(); $(self).data("tag_width", tag_width); + var form = $("#g-inplace-edit-form"); + if (form.length > 0) { + var parent = form.parent(); + form.remove(); + parent.children().show(); + } + $.get(self.options.form_url.replace("__ID__", $(target).attr('rel')), function(data) { var parent = $(target).parent(); parent.children().hide(); diff --git a/modules/gallery/libraries/InPlaceEdit.php b/modules/gallery/libraries/InPlaceEdit.php index 057874e3..67ab3805 100644 --- a/modules/gallery/libraries/InPlaceEdit.php +++ b/modules/gallery/libraries/InPlaceEdit.php @@ -35,22 +35,22 @@ class InPlaceEdit_Core { return $instance; } - public function add_action($action) { + public function action($action) { $this->action = $action; return $this; } - public function add_rules($rules) { + public function rules($rules) { $this->rules += $rules; return $this; } - public function add_messages($messages) { + public function messages($messages) { $this->messages += $messages; return $this; } - public function add_callback($callback) { + public function callback($callback) { $this->callback = $callback; return $this; } diff --git a/modules/tag/controllers/admin_tags.php b/modules/tag/controllers/admin_tags.php index d79f697c..67587c2e 100644 --- a/modules/tag/controllers/admin_tags.php +++ b/modules/tag/controllers/admin_tags.php @@ -70,7 +70,7 @@ class Admin_Tags_Controller extends Admin_Controller { $tag = ORM::factory("tag", $id); if ($tag->loaded) { print InPlaceEdit::factory($tag->name) - ->add_action("admin/tags/rename/$id") + ->action("admin/tags/rename/$id") ->render(); } } @@ -83,15 +83,15 @@ class Admin_Tags_Controller extends Admin_Controller { kohana::show_404(); } - $inplaceedit = InPlaceEdit::factory($tag->name) - ->add_action("admin/tags/rename/$tag->id") - ->add_rules(array("required", "length[1,64]")) - ->add_messages(array("in_use" => t("There is already a tag with that name"))) - ->add_callback(array($this, "check_for_duplicate")); + $in_place_edit = InPlaceEdit::factory($tag->name) + ->action("admin/tags/rename/$tag->id") + ->rules(array("required", "length[1,64]")) + ->messages(array("in_use" => t("There is already a tag with that name"))) + ->callback(array($this, "check_for_duplicate")); - if ($inplaceedit->validate()) { + if ($in_place_edit->validate()) { $old_name = $tag->name; - $tag->name = $inplaceedit->value(); + $tag->name = $in_place_edit->value(); $tag->save(); $message = t("Renamed tag %old_name to %new_name", @@ -101,7 +101,7 @@ class Admin_Tags_Controller extends Admin_Controller { print json_encode(array("result" => "success")); } else { - print json_encode(array("result" => "error", "form" => $inplaceedit->render())); + print json_encode(array("result" => "error", "form" => $in_place_edit->render())); } } diff --git a/modules/tag/css/tag.css b/modules/tag/css/tag.css index 03ed444b..6d6438e3 100644 --- a/modules/tag/css/tag.css +++ b/modules/tag/css/tag.css @@ -91,6 +91,6 @@ padding: .1em 0 .2em 0; } -#g-rename-tag-form ul { +#g-tag-admin form ul { margin-bottom: 0; -} \ No newline at end of file +} -- cgit v1.2.3 From e300ede3d8311bf236594480355f710b39aaa451 Mon Sep 17 00:00:00 2001 From: Tim Almdal Date: Sat, 7 Nov 2009 00:05:49 -0800 Subject: 1) Change the name of the form and message to g-in-place-edit-form and g-in-place-edit-message. 2) Make sure the cancel button works and cleans up the dom appropriately. --- lib/gallery.in_place_edit.js | 27 ++++++++++++++++++--------- modules/gallery/css/gallery.css | 2 +- modules/gallery/views/in_place_edit.html.php | 4 ++-- themes/admin_wind/css/screen.css | 2 +- themes/night_wind/css/screen.css | 2 +- themes/wind/css/screen.css | 2 +- 6 files changed, 24 insertions(+), 15 deletions(-) (limited to 'lib/gallery.in_place_edit.js') diff --git a/lib/gallery.in_place_edit.js b/lib/gallery.in_place_edit.js index 4a90581b..681688e5 100644 --- a/lib/gallery.in_place_edit.js +++ b/lib/gallery.in_place_edit.js @@ -2,7 +2,6 @@ $.widget("ui.gallery_in_place_edit", { _init: function() { var self = this; - $(self).data("parent", self.element.parent()); this.element.click(function(event) { event.preventDefault(); self._show(event.currentTarget); @@ -15,11 +14,9 @@ var tag_width = $(target).width(); $(self).data("tag_width", tag_width); - var form = $("#g-inplace-edit-form"); + var form = $("#g-in-place-edit-form"); if (form.length > 0) { - var parent = form.parent(); - form.remove(); - parent.children().show(); + self._cancel(); } $.get(self.options.form_url.replace("__ID__", $(target).attr('rel')), function(data) { @@ -31,8 +28,7 @@ .focus(); $(".g-short-form").gallery_short_form(); parent.find("form .g-cancel").click(function(event) { - parent.find("form").remove(); - parent.children().show(); + self._cancel(); event.preventDefault(); return false; }); @@ -41,21 +37,34 @@ }, + _cancel: function() { + var parent = $("#g-in-place-edit-form").parent(); + $(parent).find("form").remove(); + $(parent).children().show(); + $("#g-in-place-edit-message").remove(); + }, + _ajaxify_edit: function() { var self = this; - var form = $($(self).data("parent")).find("form"); + var form = $("#g-in-place-edit-form"); $(form).ajaxForm({ dataType: "json", success: function(data) { if (data.result == "success") { window.location.reload(); } else { + var parent = $(form).parent(); $(form).replaceWith(data.form); var width = $(self).data("tag_width"); - $($(self).data("parent")).find("form :text") + $(parent).find("form :text") .width(width) .focus(); $(".g-short-form").gallery_short_form(); + $(parent).find("form .g-cancel").click(function(event) { + self._cancel(); + event.preventDefault(); + return false; + }); self._ajaxify_edit(); } } diff --git a/modules/gallery/css/gallery.css b/modules/gallery/css/gallery.css index 18d9a522..3262dee2 100644 --- a/modules/gallery/css/gallery.css +++ b/modules/gallery/css/gallery.css @@ -50,7 +50,7 @@ /* In-place edit ~~~~~~~~~~~~~~~~~~~~~~~~~ */ -#g-inplace-edit-form ul { +#g-in-place-edit-form ul { margin: 0; } diff --git a/modules/gallery/views/in_place_edit.html.php b/modules/gallery/views/in_place_edit.html.php index 64671d57..03cbdc69 100644 --- a/modules/gallery/views/in_place_edit.html.php +++ b/modules/gallery/views/in_place_edit.html.php @@ -1,5 +1,5 @@ - "post", "id" => "g-inplace-edit-form", "class" => "g-short-form"), $hidden) ?> + "post", "id" => "g-in-place-edit-form", "class" => "g-short-form"), $hidden) ?>
  • class="g-error"> @@ -11,6 +11,6 @@
-
+
diff --git a/themes/admin_wind/css/screen.css b/themes/admin_wind/css/screen.css index 5fe47d76..3342bd83 100644 --- a/themes/admin_wind/css/screen.css +++ b/themes/admin_wind/css/screen.css @@ -383,7 +383,7 @@ th { } /* In-line editing ~~~~~~~~~~~~~~~~~~~~~~ */ -#g-inplace-edit-message { +#g-in-place-edit-message { background-color: #FFF; } diff --git a/themes/night_wind/css/screen.css b/themes/night_wind/css/screen.css index 1d5e5e2b..cd1824d1 100644 --- a/themes/night_wind/css/screen.css +++ b/themes/night_wind/css/screen.css @@ -456,7 +456,7 @@ li.g-error select { } /* In-line editing ~~~~~~~~~~~~~~~~~~~~~~ */ -#g-inplace-edit-message { +#g-in-place-edit-message { background-color: #FFF; } diff --git a/themes/wind/css/screen.css b/themes/wind/css/screen.css index 2ac37fb6..74771e07 100644 --- a/themes/wind/css/screen.css +++ b/themes/wind/css/screen.css @@ -300,7 +300,7 @@ td { } /* In-line editing ~~~~~~~~~~~~~~~~~~~~~~ */ -#g-inplace-edit-message { +#g-in-place-edit-message { background-color: #FFF; } -- cgit v1.2.3