diff --git a/app/views/groups/edit.html.haml b/app/views/groups/edit.html.haml
index 3b69a93fa..c59157f48 100644
--- a/app/views/groups/edit.html.haml
+++ b/app/views/groups/edit.html.haml
@@ -2,15 +2,18 @@
= javascript_include_tag 'jquery-ui-1.8.4.custom.min.js'
= javascript_include_tag 'group-edit.js'
+- content_for :left_pane do
+ requests
+
%h1{:class => 'big_text', :id => 'group_title'}
- = "Editing Groups"
+ = "Managing Relations"
%ul#group_list
- for group in @groups
%li.group
- %h3= group.name
+ %h3{:contenteditable => true}= group.name
%ul{:id => group.id}
-if group.people.size < 1
@@ -20,8 +23,9 @@
-for person in group.people
%li.person{:id => person.id, :from_group_id => group.id}
- = image_tag(person.profile.image_url(:thumb_small),:size => "30x30") unless person.profile.image_url.nil?
- = person.real_name
+ = image_tag(person.profile.image_url(:thumb_small)) unless person.profile.image_url.nil?
+ .name
+ = person.real_name
%p
%br
= link_to 'Update Groups', '#', :class => 'button', :id => "move_friends_link"
diff --git a/app/views/layouts/application.html.haml b/app/views/layouts/application.html.haml
index dc687861f..d3c7e06fa 100644
--- a/app/views/layouts/application.html.haml
+++ b/app/views/layouts/application.html.haml
@@ -60,7 +60,7 @@
.span-5.last
- if @group == :all
%h1
- = link_to "All Groups", root_path
+ = link_to "All Relations", root_path
- else
%h1
= link_to @group.name, @group
@@ -73,7 +73,6 @@
.container
.span-5.last
-
= yield :left_pane
.span-19.last
diff --git a/app/views/shared/_group_nav.haml b/app/views/shared/_group_nav.haml
index 730672333..5c07b6e83 100644
--- a/app/views/shared/_group_nav.haml
+++ b/app/views/shared/_group_nav.haml
@@ -7,12 +7,12 @@
%li.new_group= link_to("+", "#add_group_pane", :id => "add_group_button")
- #group_edit_button
- = link_to "edit", edit_group_path(Group.first), :class => "edit_group_button", :title => "Manage your facets."
+ #group_manage_button
+ = link_to "manage", edit_group_path(Group.first), :class => "edit_group_button", :title => "Manage your facets."
%ul{ :style => "position:absolute;right:0;bottom:0;"}
%li{:class => ("selected" if @group == :all)}
- = link_to "All Groups", root_url
+ = link_to "All Relations", root_url
.yo{ :style => "display:none;"}
#add_group_pane
diff --git a/public/javascripts/view.js b/public/javascripts/view.js
index fbe84aac8..8b4c44134 100644
--- a/public/javascripts/view.js
+++ b/public/javascripts/view.js
@@ -24,8 +24,35 @@ $(document).ready(function(){
$(".image_cycle img").load( function() {
$(this).fadeIn("slow");
});
+
});//end document ready
+$(".group h3").live( 'click', function() {
+
+ var $this = $(this);
+ var id = $this.closest("li").children("ul").attr("id");
+ var link = "/groups/"+ id;
+
+ $this.keypress(function(e) {
+ if (e.which == 13) {
+ e.preventDefault();
+ $this.blur();
+
+ //save changes
+ $.ajax({
+ type: "PUT",
+ url: link,
+ data: {"group" : {"name" : $this.text() }}
+ });
+ }
+ //update all other group links
+ $this.keyup(function(e) {
+ $("a[href='"+link+"']").text($this.text());
+ });
+ });
+});
+
+
function pane_toggler_button( name ) {
$("#add_" + name + "_button").toggle(
diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
index 1bc9132e6..9e2777f40 100644
--- a/public/stylesheets/application.css
+++ b/public/stylesheets/application.css
@@ -453,11 +453,11 @@ h1.big_text {
#group_nav {
position: relative;
color: black; }
- #group_nav #group_edit_button {
+ #group_nav #group_manage_button {
display: inline;
margin-top: 1px;
font-size: 12px; }
- #group_nav #group_edit_button a {
+ #group_nav #group_manage_button a {
color: #999999; }
#group_nav ul {
margin-bottom: 0;
@@ -588,6 +588,8 @@ h1.big_text {
.group {
list-style: none; }
+ .group h3 {
+ display: inline-block; }
.group ul {
min-height: 20px;
margin: 0;
@@ -598,11 +600,22 @@ h1.big_text {
border-radius: 3px;
list-style: none;
padding: 15px; }
- .group ul li {
+ .group ul li.person {
+ display: inline-block;
margin-left: 0;
padding: 5px;
- cursor: move; }
- .group ul li img {
+ cursor: move;
+ margin: 5px;
+ background-color: #cccccc;
+ -webkit-border-radius: 3px;
+ text-align: center;
+ width: 75px;
+ height: 75px;
+ padding: 5px;
+ border: 1px solid #999999; }
+ .group ul li.person img {
+ height: 50px;
+ width: 50px;
display: inline-block; }
.group ul .grey {
font-style: italic;
diff --git a/public/stylesheets/sass/application.sass b/public/stylesheets/sass/application.sass
index 4b23cecfc..2c6c4be5a 100644
--- a/public/stylesheets/sass/application.sass
+++ b/public/stylesheets/sass/application.sass
@@ -579,7 +579,7 @@ h1.big_text
:color #000
- #group_edit_button
+ #group_manage_button
:display inline
:margin
:top 1px
@@ -770,6 +770,10 @@ h1.big_text
.group
:list
:style none
+
+ h3
+ :display inline-block
+
ul
:min-height 20px
:margin 0
@@ -784,15 +788,33 @@ h1.big_text
:style none
:padding 15px
- li
+ li.person
+ :display inline-block
:margin
:left 0
:padding 5px
:cursor move
+ :margin 5px
+
+ :background
+ :color #ccc
+ :-webkit-border-radius 3px
+
+ :text
+ :align center
+
+ :width 75px
+ :height 75px
+ :padding 5px
+
+ :border 1px solid #999
img
+ :height 50px
+ :width 50px
:display inline-block
+
.grey
:font
:style italic