diff --git a/app/views/aspects/manage.html.haml b/app/views/aspects/manage.html.haml
index 6f6c267fb4ee0ea20761bd2e00c9e7e2e9b793f7..c0fdacc892001e8a27e0613efa71fbe6a3e541fe 100644
--- a/app/views/aspects/manage.html.haml
+++ b/app/views/aspects/manage.html.haml
@@ -10,7 +10,7 @@
%h2
Manage aspects
.right
- = link_to(t('.add_a_new_aspect'), "#add_aspect_pane", :class => "new_aspect add_aspect_button button", :title => t('.add_a_new_aspect'))
+ = link_to("+ #{t('.add_a_new_aspect')}", "#add_aspect_pane", :class => "new_aspect add_aspect_button button", :title => t('.add_a_new_aspect'))
.span-4.append-1.last
%h3=t('.requests')
@@ -21,10 +21,8 @@
%li.grey No new requests
- else
- for request in @remote_requests
- %li.requested_person{:id => request.person.id, :request_id => request.id}
+ %li.person.request{:data=>{:guid=>request.id, :person_id=>request.person.id}}
= person_image_tag(request.person)
- .name
- = request.person.real_name
%h3 Remove from Aspect
.aspect_remove
@@ -36,32 +34,34 @@
.span-19.last
%ul#aspect_list
- for aspect in @aspects
- %li.aspect
+ %li.aspect{:data=>{:guid=>aspect.id}}
.aspect_name
%span.edit_name_field
- %h3{:contenteditable => true}= aspect.name
+ %h3{:contenteditable=>true}
+ = aspect.name
%span.tip click to edit
%ul.tools
%li= link_to t('.add_a_new_friend'), "#add_request_pane_#{aspect.id}", :class => 'add_request_button'
%li!= remove_link(aspect)
- %ul.dropzone{:id => aspect.id}
+ %ul.dropzone{:data=>{:aspect_id=>aspect.id}}
-if aspect.people.size < 1
%li.grey Drag to add people
-else
-for person in aspect.people
-
- %li.person{:id => person.id, :class => person.id, :from_aspect_id => aspect.id}
+ %li.person{:data=>{:guid=>person.id, :aspect_id=>aspect.id}}
.delete
.x
X
.circle
= person_image_tag(person)
+
+
.fancybox_content
%div{:id => "add_request_pane_#{aspect.id}"}
= render "requests/new_request", :aspect => aspect
diff --git a/public/javascripts/aspect-edit.js b/public/javascripts/aspect-edit.js
index e8f8d43529318f6178dad95fd261927856fdc981..177701ed35a2dcb97f64ea9d642cba9a78c5b862 100644
--- a/public/javascripts/aspect-edit.js
+++ b/public/javascripts/aspect-edit.js
@@ -4,9 +4,9 @@
*/
function decrementRequestsCounter() {
- var $new_requests = $(".new_requests"),
- request_html = $new_requests.html(),
- old_request_count = request_html.match(/\d+/);
+ var $new_requests = $(".new_requests");
+ var request_html = $new_requests.html();
+ var old_request_count = request_html.match(/\d+/);
if( old_request_count == 1 ) {
$new_requests.html(
@@ -19,112 +19,84 @@ function decrementRequestsCounter() {
}
}
+// Dragging person between aspects
$(function() {
- // Multiple classes here won't work
- $("ul .person").draggable({
- revert: true
- });
-
- $("ul .requested_person").draggable({
- revert: true
- });
+ $("ul .person").draggable({ revert: true });
+ $("ul .requested_person").draggable({ revert: true });
- $(".aspect ul").droppable({
+ $(".aspect ul.dropzone").droppable({
hoverClass: 'active',
drop: function(event, ui) {
- if ($(ui.draggable[0]).hasClass('requested_person')){
+ var dropzone = $(this);
+ var person = ui.draggable;
+
+ if( person.hasClass('request') ){
$.ajax({
type: "DELETE",
- url: "/requests/" + ui.draggable[0].getAttribute('request_id') ,
- data: {"accept" : true , "aspect_id" : $(this)[0].id },
+ url: "/requests/" + person.attr('data-guid'),
+ data: {"accept" : true, "aspect_id" : dropzone.attr('data-aspect_id') },
success: function(data){
decrementRequestsCounter();
}
});
-
};
- var dropzone = $(this)[0];
-
- if ($(this)[0].id == ui.draggable[0].getAttribute('from_aspect_id')){
- ui.draggable.css('background','none');
- } else {
- ui.draggable.css('background','none');
- $.ajax({
- url: "/aspects/move_friend/",
- data: {"friend_id" : ui.draggable[0].id,
- "from" : ui.draggable[0].getAttribute('from_aspect_id'),
- "to" : { "to" : dropzone.id }},
- success: function(data){
- ui.draggable.attr('from_aspect_id', dropzone.id);
- ui.draggable.css('background','none');
- }});
+ if( dropzone.attr('data-aspect_id') != person.attr('data-aspect_id' )){
+ $.ajax({
+ url: "/aspects/move_friend/",
+ data: {"friend_id" : person.attr('data-guid'),
+ "from" : person.attr('data-aspect_id'),
+ "to" : { "to" : dropzone.attr('data-aspect_id') }},
+ success: function(data){
+ person.attr('data-aspect_id', dropzone.attr('data-aspect_id'));
+ }});
}
- $(this).closest("ul").append(ui.draggable);
+
+ $(this).closest("ul").append(person);
}
});
+
$(".aspect_remove ul").droppable({
hoverClass: 'active',
drop: function(event, ui) {
- if ($( "." + ui.draggable[0].id).length == 1) {
+
+ var person = ui.draggable;
+
+ if ( person.attr('data-guid').length == 1 ) {
alert("You can not remove the person from the last aspect");
+
} else {
- if (!$(ui.draggable[0]).hasClass('requested_person')){
- var aspect = ui.draggable[0].getAttribute('from_aspect_id')
- var person_id = ui.draggable[0].id
+ if( !person.hasClass('request') ){
+
$.ajax({
type: "POST",
url: "/aspects/remove_from_aspect",
data:{
- 'friend_id' : person_id,
- 'aspect_id' : aspect
- }
+ 'friend_id' : person.attr('data-guid'),
+ 'aspect_id' : person.attr('data-aspect_id') }
});
}
- $(ui.draggable[0]).fadeOut('slow');
- $(ui.draggable[0]).remove();
+ person.fadeOut('slow', $(this).remove());
}
}
});
- $(".aspect h3").live( 'focus', function() {
-
- var $this = $(this),
- id = $this.closest("li").children("ul").attr("id"),
- link = "/aspects/"+ id;
-
- $this.keypress(function(e) {
- if (e.which == 13) {
- e.preventDefault();
- $this.blur();
-
- //save changes
- $.ajax({
- type: "PUT",
- url: link,
- data: {"aspect" : {"name" : $this.text() }}
- });
- }
- //update all other aspect links
- $this.keyup(function(e) {
- $("#aspect_nav a[href='"+link+"']").text($this.text());
- });
- });
- });
});
-//deletion
+// Person deletion
$(".delete").live("click", function() {
var person = $(this).closest("li.person");
- request_id = person.attr("request_id");
- if (request_id){
- if( confirm("Remove this person from all aspects?") ){
+ if (person.hasClass('request')){
+
+ if( confirm("Ignore request?") ){
+ var request_id = person.attr("data-guid");
+
$.ajax({
type: "DELETE",
url: "/requests/" + request_id,
@@ -135,9 +107,9 @@ $(".delete").live("click", function() {
}
} else {
- if( confirm("Remove this person from all aspects?") ){
- var person_id = $(this).closest("li.person").attr('id');
+ if( confirm("Remove this person from all aspects?") ){
+ var person_id = $(this).closest("li.person").attr('data-guid');
$.ajax({
type: "DELETE",
@@ -150,3 +122,29 @@ $(".delete").live("click", function() {
}
});
+
+// Editing aspect name
+$(".aspect h3").live('focus', function() {
+
+ var $this = $(this);
+ var id = $this.closest("li.aspect").attr("data-guid");
+ var link = "/aspects/"+ id;
+
+ $this.keypress(function(e) {
+ if (e.which == 13) {
+ e.preventDefault();
+ $this.blur();
+
+ //save changes
+ $.ajax({
+ type: "PUT",
+ url: link,
+ data: {"aspect" : {"name" : $this.text() }}
+ });
+ }
+ //update all other aspect links
+ $this.keyup(function(e) {
+ $("#aspect_nav a[href='"+link+"']").text($this.text());
+ });
+ });
+});
diff --git a/public/stylesheets/sass/application.sass b/public/stylesheets/sass/application.sass
index e0b89a23eda222dc2ae22eb19f4c726b27bcb873..b6d6516d1ac64dc51ceb9f8f4f679dad5340bc16 100644
--- a/public/stylesheets/sass/application.sass
+++ b/public/stylesheets/sass/application.sass
@@ -903,13 +903,7 @@ h1.big_text
:padding 2px
-.aspect,
-.requests,
-.remove,
-.aspect_remove
- :list
- :style none
-
+.aspect
h3
:display inline-block
@@ -944,7 +938,11 @@ h1.big_text
&:last-child
:margin
:right 0
-
+.aspect,
+.requests,
+.aspect_remove
+ :list
+ :style none
.grey
:color #999
:cursor default
@@ -954,25 +952,27 @@ h1.big_text
:min-height 20px
:margin 0
:bottom 25px
- :background
- :color #efefef
- :border 1px solid #ccc
+
+ :-webkit-border-radius 10px
+ :-moz-border-radius 10px
+ :border-radius 10px
+
:list
:style none
:padding 15px
+ :border 2px dashed #ccc
&.active
:background
- :color #fafafa
+ :color rgba(255,252,127,0.2)
- .person,
- .requested_person
+ .person
:display inline-block
:cursor move
:z-index 10
:position relative
:padding 0
- :margin 0
+ :margin 5px
:color #eee
@@ -980,6 +980,7 @@ h1.big_text
:height 70px
:width 70px
:border-radius 5px
+ :-webkit-box-shadow 0 1px 2px #999
&:hover
.delete
@@ -1034,6 +1035,10 @@ h1.big_text
:color rgba(208,49,43,1)
+.requests
+ ul.dropzone
+ :border 2px solid #ccc
+
ul#settings_nav
:display inline
:list
@@ -1152,6 +1157,10 @@ header
h2
:display inline
+
+ .right
+ :margin
+ :top 10px
.modal_title_bar
:width 100%