From 6a4ea0ba0ecf65cd91913f58ad011fb24c0fa468 Mon Sep 17 00:00:00 2001
From: exane <raco0n@gmx.de>
Date: Tue, 30 Jun 2015 14:47:09 +0200
Subject: [PATCH] change notification layout

---
 client/js/client.js                      | 31 +++++++++++++-----------
 client/scss/main.scss                    |  2 ++
 client/templates/notification.handlebars |  2 +-
 server/Battle.js                         | 19 +++++++++++++++
 server/Battleside.js                     |  4 +--
 5 files changed, 41 insertions(+), 17 deletions(-)

diff --git a/client/js/client.js b/client/js/client.js
index 53cba7a..23c265d 100644
--- a/client/js/client.js
+++ b/client/js/client.js
@@ -22,6 +22,16 @@ Handlebars.registerHelper("health", function(lives){
   }
   return out;
 });
+Handlebars.registerHelper("formatMessage", function(msg){
+  let out = "";
+  var lines = msg.split(/\n/g);
+
+  lines.forEach(function(line) {
+    out += line + "<br>";
+  })
+
+  return out;
+});
 
 let App = Backbone.Router.extend({
   routes: {
@@ -807,7 +817,7 @@ let Lobby = Backbone.View.extend({
     "click .note": "debugNote"
   },
   debugNote: function() {
-    new Notification({message: "yoyo TEST"}).render();
+    new Notification({message: "yoyo TEST\nhallo\n\ntest"}).render();
   },
   render: function(){
     this.$el.html(this.template(this.user.attributes));
@@ -878,23 +888,16 @@ let Notification = Backbone.View.extend({
     return this;
   },
   show: function(){
-    this.$el.animate({
-      "height": "60px"
-    }, {
-      duration: 600,
-      complete: this.hide.bind(this)
-    }).delay(2000);
+    let $alert = this.$el.find(".alert");
+    $alert.slideDown(600).delay(2000).queue(this.hide.bind(this));
 
   },
   hide: function(){
-    this.$el.animate({
-      "height": "0"
-    }, {
-      complete: this.remove.bind(this)
-    })
+    let $alert = this.$el.find(".alert");
+    $alert.stop().slideUp().queue(this.remove.bind(this));
   },
-  onClick: function(e) {
-    this.remove();
+  onClick: function() {
+    this.hide();
   }
 });
 
diff --git a/client/scss/main.scss b/client/scss/main.scss
index a82cf99..f7e487b 100644
--- a/client/scss/main.scss
+++ b/client/scss/main.scss
@@ -316,10 +316,12 @@ $game-height: 800px;
 
   .alert {
     margin-bottom: 0;
+    display: none;
     //padding: 0;
   }
 }
 
+
 @keyframes waitForOpponent{
   0% {
     opacity:1;
diff --git a/client/templates/notification.handlebars b/client/templates/notification.handlebars
index 57e69b5..fab0551 100644
--- a/client/templates/notification.handlebars
+++ b/client/templates/notification.handlebars
@@ -1,3 +1,3 @@
 <div class="col-xs-12">
-  <div class="alert alert-success">{{message}}</div>
+  <div class="alert alert-success">{{#formatMessage message}}{{/formatMessage}}</div>
 </div>
\ No newline at end of file
diff --git a/server/Battle.js b/server/Battle.js
index bfae6e2..df21582 100644
--- a/server/Battle.js
+++ b/server/Battle.js
@@ -62,6 +62,25 @@ var Battle = (function(){
     this.p2.draw(10);
 
 
+    /*this.p1.placeCard("ves");
+    this.p2.placeCard("ves");
+    this.p1.placeCard("yarpen_zigrin");
+    this.p2.placeCard("yarpen_zigrin");
+
+    this.p1.hand.add(this.p1.createCard("scorch"));
+    this.p2.hand.add(this.p2.createCard("scorch"));
+    this.p1.hand.add(this.p1.createCard("villentretenmerth"));
+    this.p2.hand.add(this.p2.createCard("villentretenmerth"));
+
+    this.p1.hand.add(this.p1.createCard("impenetrable_fog"));
+    this.p2.hand.add(this.p2.createCard("impenetrable_fog"));
+    this.p1.hand.add(this.p1.createCard("biting_frost"));
+    this.p2.hand.add(this.p2.createCard("biting_frost"));
+    this.p1.hand.add(this.p1.createCard("torrential_rain"));
+    this.p2.hand.add(this.p2.createCard("torrential_rain"));
+    this.p1.hand.add(this.p1.createCard("clear_weather"));
+    this.p2.hand.add(this.p2.createCard("clear_weather"));
+*/
 
     this.update();
 
diff --git a/server/Battleside.js b/server/Battleside.js
index c90f926..2205258 100644
--- a/server/Battleside.js
+++ b/server/Battleside.js
@@ -594,10 +594,10 @@ Battleside = (function(){
 
     this.battle.sendNotification(this.getName() + " played " + card.getName());
 
-    var txt = "Scorch destroyed:\n";
+    var txt = "Scorch destroyed:";
     for (var i = 0; i < removeCards.length; i++) {
       var c = removeCards[i];
-      txt += c.getName() + "\n";
+      txt += "\n" + c.getName();
     }
 
     this.battle.sendNotification(txt);