Skip to content

Commit

Permalink
added adams ui to server
Browse files Browse the repository at this point in the history
  • Loading branch information
hamin committed May 23, 2010
1 parent 908dd77 commit dfee679
Show file tree
Hide file tree
Showing 18 changed files with 1,614 additions and 0 deletions.
166 changes: 166 additions & 0 deletions index.html.erb
Original file line number Diff line number Diff line change
@@ -0,0 +1,166 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Today's Blue Plate Special</title>
<meta name="generator" content="TextMate http://macromates.com/">
<meta name="author" content="Adam Singer">
<!-- Date: 2010-05-22 -->
<link rel="stylesheet" href="/stylesheets/application.css" type="text/css" media="screen" title="no title" charset="utf-8">
<link rel="stylesheet" href="/stylesheets/jquery.tweet.css" type="text/css" media="screen" title="no title" charset="utf-8">

<script src="/javascripts/jquery-1.4.min.js" type="text/javascript" charset="utf-8"></script>
<script src="/javascripts/jquery-ui.js" type="text/javascript" charset="utf-8"></script>
<script src="/javascripts/json2.js" type="text/javascript" charset="utf-8"></script>
<script src="/javascripts/blueplate.jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="/javascripts/md5.js" type="text/javascript" charset="utf-8"></script>
<script src="/javascripts/jquery.tweet.js" type="text/javascript" charset="utf-8"></script>

<script type="text/javascript" charset="utf-8">

$(document).ready(function() {
var user = JSON.parse('{"email":"adam@artforge.com","name":"Adam Singer","location":"New York, NY"}')
var contacts = JSON.parse('[{"email":"adam@artforge.com","name":"Adam Singer","location":"New York, NY","tasks":0},{"email":"aminharis7@gmail.com","name":"Haris Amin","location":"Brooklyn, NY","tasks":0},{"email":"mjording@gmail.com","name":"Matt Jording","location":"Brooklyn, NY","tasks":0},{"email":"nmeersschaert@mac.com","name":"Niels Meersschaert","location":"Brooklyn, NY","tasks":0},{"email":"moishefriedman@gmail.com","name":"Moishe Friedman","location":"New York, NY","tasks":0}]')
var tasks = JSON.parse('[{"id":"GUID1","description":"This is something I need to do!"},{"id":"GUID2","description":"This is another thing I need to do!"},{"id":"GUID1","description":"This is something I need to do!"},{"id":"GUID2","description":"This is another thing I need to do!"},{"id":"GUID1","description":"This is something I need to do!"},{"id":"GUID2","description":"This is another thing I need to do!"}]');

loadUser(user);
populateInbox(tasks)
populateContacts(contacts);

twitterSearch("#hackdisrupt",8);
});

function populateContacts(contacts){
var template = $('#hidden_templates .contact');
$(contacts).each(function(i){
var contact = contacts[i];
elContact = template.clone();
elContact.data("user",contact);
elContact.find(".image").attr("style","background:url(" + gravatar_url(contact.email,60) + ");")

$(elContact).droppable({
hoverClass: 'highlight',
drop: delegate_task
});
$("#contacts").append(elContact).fadeIn();
})
}

function populateInbox(tasks){
var template = $('#hidden_templates .task');
$(tasks).each(function(i){
elTask = $("#inbox").append($('<div>').bp_task(tasks[i],{template: template}).fadeIn());
})
$("#inbox,#tickets,#trash").sortable({
connectWith: '.list_module',
cursor: 'crosshair',
opacity: 0.5,
scroll: true,
update: ticket_task
}).disableSelection();
}

function gravatar_url(email,size){
return "http://www.gravatar.com/avatar/" + MD5(email) + "?s=" + size;
}

function loadUser(user){
$("#avatar").attr("src",gravatar_url(user.email,50));
$("#user .username").html(user.name);
$("#user .location").html(user.location);
}

function twitterSearch(searchTerm, results){
$("#query").tweet({avatar_size: 32,count: results, query: searchTerm,loading_text: "searching twitter..."});
}

function delegate_task(event,ui){
dropped_item = $(ui.draggable).find(".task").parent();
var task = dropped_item.data("task")
var target = event.target;
var contact = $(target).data("user");
console.log("You Dropped task " + task.id + " into " + contact.email);
addTaskIndicator(target);
dropped_item.remove();
}

function addTaskIndicator(elUser){
var contact = $(elUser).data("user");
contact.tasks += 1;

elIndicator = $(elUser).find(".task_indicator");
elIndicator.find("span").html(contact.tasks);
elIndicator.show()
console.log(contact.tasks);
}

function ticket_task(event,ui){
if (ui.sender){
dropped_item = $(ui.item)
target = this
task = dropped_item.data("task")
if (target.id == "trash"){
dropped_item.fadeOut();
}
console.log("You Dropped task " + task.id + " into " + target.id);
}
}

</script>

</head>
<body>

<div id="page">

<div id="header">
<div id="logo"></div>
<h1>Blue Plate</h1>
<div id="user" class="fr">
<img id="avatar" class="fl" src="http://www.gravatar.com/avatar/?s=48" style="vertical-align:top;">
<div class="info fl">
Welcome <span class="username">Anonymous User</span><br/>
From <span class="location">Somewhere secret</span><br/>
<a href="#">Logout</a>
</div>
<div class="clr"></div>
</div>
<div class="clr"></div>
</div>

<div id="inbox" class="fl list_module">

</div>

<div id="tickets" class="fl list_module">

</div>

<div class="fr">
<div id="contacts" class="list_module last">

</div>
<div id="trash" class="list_module last">

</div>
</div>

<!-- <div id="query" class="query list_module fl" style="width:400px;"></div> -->

<div id="hidden_templates" style="display:none;">
<div class="task corner-all-5">
<div class="source_icon"></div>
<div class="subject"></div>
</div>

<div class="contact">
<div class="task_indicator"><span>0</span></div>
<div class="image"></div>
</div>
</div>
</div>

</body>
</html>
Binary file added public/images/blueplate.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/images/trash.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
142 changes: 142 additions & 0 deletions public/javascripts/blueplate.jquery.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,142 @@
(function($) {

$.fn.bp_task = function(task,settings) {
var config = {
id: 0,
template: $("<div>"),
onMouseOver: "",
onMouseOut: ""
};

if (settings) $.extend(config, settings);

var container = this;

render(this);

container.mouseover(function(){
// console.log("mouseout");
});

container.mouseout(function(){
// console.log("mouseout");
});

function update(){
console.log("update");
}

function destroy(){
console.log("destroy");
}

function render(self){
console.log("render",config.template);
container.append(config.template.clone());
container.data("task",task);
// container.data("type","task");
container.find(".subject").html(task.description);
// container.draggable();
}

function initComment(){
if (comment.length > 0){
container.find("div.comment textarea").val(comment);
container.find("span.comment").attr("title",comment + " (Click to Edit)");
} else {
container.find("span.comment").addClass("add");
}
}

function initInsights(){
container.find(".insight_field").autocomplete(available_insights);
if (insights.length > 0){
container.find("div.insights").show();
container.find(".empty_message").hide();
jQuery.each(insights, function() {if (this != ""){renderTag(this.toString())}});
} else {
container.find("span.insights").addClass("add");
}
}

function initToolBox(){
container.find("span.trash").click(function(){destroy()});
container.find("span.comment").click(function(){attachComment()});
container.find("span.insights").click(function(){attachInsights()});
container.find(".insight_button").click(function(){addTags();})
container.find("div.comment input.comment_button").click(function(){submitComment();})
}

function attachInsights(){
container.find(".insight_form").slideToggle();

if (container.find(".insight_form:visible")){
container.find("div.insights").show();
}else{
// When closing the insight form, leave insights list open if populated
(insights && insights.length > 0) ? container.find("div.insights").show() : container.find("div.insights").slideToggle();
}
}

function attachComment(){
container.find("div.comment").slideToggle();
}

function submitComment(){
comment = container.find("div.comment textarea").val();
container.find("span.comment").removeClass("add");
update();
}

function addTags(){
arrNewInsights = container.find(".insight_field").val().split(",");
if (arrNewInsights.length > 0){
container.find("span.insights").removeClass("add");
container.find(".empty_message").hide();
jQuery.each(arrNewInsights, function() {
if (this != ""){addTag(this)}
});
}
container.find(".insight_field").val("");
}

function addTag(strTag){
// strTag = strTag.toLowerCase();
strTag = strTag.toString();
if (insights.indexOf(strTag) < 0){
insights.push(strTag);
renderTag(strTag);
update();
}
}

function renderTag(strTag){
tag = $('<div>').addClass("insight")
tag.click(function(){removeTag(this,strTag)});
tag.append($('<a>').html("*"));
tag.append($('<span>').html(strTag));
container.find("div.insights").prepend(tag)
}

function removeTag(elTag,strTag){
arr_updated = new Array();
jQuery.each(insights, function() {
if (this != strTag){
arr_updated.push(this);
}
});
insights = arr_updated;
if (insights.length < 1){
container.find("span.insights").addClass("add");
container.find(".empty_message").show();
}
$(elTag).hide();
update();
}

return this;

}

})(jQuery);

Loading

0 comments on commit dfee679

Please sign in to comment.