Browse files

Enemies: Clean up enemies list and add levels near each.

  • Loading branch information...
1 parent c135d4c commit 3bbe4514c2ea7e888578af0432045fcadc62e172 @tchalvak tchalvak committed Nov 22, 2013
Showing with 121 additions and 80 deletions.
  1. +121 −79 deploy/templates/enemies.tpl
  2. +0 −1 deploy/www/enemies.php
View
200 deploy/templates/enemies.tpl
@@ -1,3 +1,48 @@
+<style>
+{literal}
+#ninja-matches .even{
+ float:right;
+ clear:right;
+}
+#current-enemies-list li em, #peer-chars li em{
+ display:inline-block; border-left:thick solid white; border-right:thick solid white; padding: 0 .2em;text-align:center;width:1.7em;
+}
+#current-enemies-list .enemy-stats-box{
+ display:inline-block;margin-left:1em;width: 6.9em;
+}
+#current-enemies-list li{
+ position:relative;margin-bottom:.2em;
+}
+#current-enemies-list .enemy-action-box{
+ display:inline-block;width: 13em;
+}
+.enemies-lefthalf{
+ width:55%;float:left;margin-left:0;margin-right:0;
+}
+.enemies-righthalf{
+ width:45%;float:right;margin-left:0;margin-right:0;
+}
+#peer-chars .peer{
+ position:relative;margin-bottom:.5em;
+}
+#peer-chars .peer-name, #current-enemies-list .enemy-name{
+ width:10em;display:inline-block;overflow:hidden;text-overflow:ellipsis;
+}
+#peer-chars .peer-name{
+ width:8.5em;
+}
+#peer-chars .stats-block{
+ margin-left:2em;width:6.5em;display:inline-block;
+}
+#npc-list{
+ margin: .5em auto;text-align:center;font-size:1.3em;
+}
+#npc-list .creature-image{
+ max-width:50px;max-height:50px;
+}
+{/literal}
+</style>
+
<h1>Combat</h1>
<div id="ninja-enemy">
@@ -8,72 +53,9 @@
</form>
</div>
-<script type='text/javascript'>
-{literal}
- $(document).ready(function(){
-
- // Function to display the matches.
- NW.displayMatches = function(json_matches){
- var sample = $('#sample-enemy-match');
- var moreMatches = $('#more-matches');
- //NW.debug(json_matches);
- if(typeof(json_matches.char_matches) != 'undefined'){
- // Remove all li's not preceded by an li.
- $('#ninja-matches li+li').remove();
- // Take the matches, extract them into individuals.
- var inc = 0;
- for(var i in json_matches.char_matches){
- if(inc>9){
- break;
- }
- var clone = sample.clone().attr('id', 'enemy-match-'+i);
- if(i%2 == 1){ // Classify the even entries (here 0, 2, 4, etc)
- clone.addClass('even');
- }
- var match = json_matches.char_matches[i];
- //NW.debug(match);
- var link = clone.find('a');
- //NW.debug(sample);
- // For each individual, extend the default link to make an attack link.
- var newlink = link.attr('href')+match.uname;
- // Add the new ones back on after the sample.
- sample.after(link.attr('href',newlink).text(match.uname).end().show());
- inc++;
- }
- if(json_matches.char_matches.length > 9){
- moreMatches.show(); // Show the "with more matches" section.
- } else {
- moreMatches.hide();
- }
- }
- };
-
-
- var searchbox = $('#enemy-match');
- searchbox.keyup(function () {
- NW.typewatch(function () {
- // executed only 500 ms after the last keyup event.
- var term = $('#enemy-match').val();
- var limit = 11; // Limit to 11, and only display 10.
- if(term && term.length>2){
- // Only search after a few characters are typed out
- NW.charMatch(term, limit, NW.displayMatches);
- }
- }, 500);
- });
-
- });
-{/literal}
-</script>
+<!-- Js at bottom -->
+
-<style type='text/css'>
-{literal}
-#ninja-matches .even{
- float:right;
- clear:right;
-}
-{/literal}
-</style>
<div id='ninja-matches' style=''>
@@ -99,9 +81,9 @@
<section class='clearfix'>
{if $enemyCount gt 0}
-<div style='width:55%;float:left;margin-left:0;margin-right:0'>
+<div class='enemies-lefthalf'>
<h3>Enemies</h3>
- <ul>
+ <ul id='current-enemies-list'>
{foreach from=$enemy_list item="loop_enemy"}
{if $loop_enemy.active}
{if $loop_enemy.health gt 0}
@@ -111,10 +93,11 @@
{assign var="status_class" value="enemy-dead"}
{assign var="action" value="View"}
{/if}
- <li class="{$status_class}" style='position:relative;margin-bottom:.2em;'>
+ <li class="{$status_class}">
<a href="enemies.php?remove_enemy={$loop_enemy.player_id|escape}"><img src="{$smarty.const.IMAGE_ROOT}icons/mono/stop32.png" height='16' width='16' alt="remove" title='Remove'></a>
- <span style='display:inline-block;width: 16em;'>{$action} <a href="player.php?player_id={$loop_enemy.player_id|escape}">{$loop_enemy.uname|escape}</a></span>
- <span style='display:inline-block;margin-left:1em;width: 5.9em;'>
+ <span class='enemy-action-box'>{$action} <a class='enemy-name' href="player.php?player_id={$loop_enemy.player_id|escape}">{$loop_enemy.uname|escape}</a></span>
+ <em title='Level {$loop_enemy.level}'>{$loop_enemy.level}</em>
+ <span class='enemy-stats-box'>
{include file="health_bar.tpl" health=$loop_enemy.health health_percent=$loop_enemy.health_percent}
</span>
</li>
@@ -123,18 +106,19 @@
</ul>
</div>
{else}
-<p style='width:55%;float:left;margin-left:0;margin-right:0'>You haven't decided who your enemies are yet, <a href="list.php" target="main">find some</a>.</p>
+<p class='enemies-lefthalf'>You haven't decided who your enemies are yet, <a href="list.php" target="main">find some</a>.</p>
{/if}
{if count($peers) gt 0}
-<div style='width:45%;float:right;margin-left:0;margin-right:0'>
+<div class='enemies-righthalf'>
<h3>Nearby Ninja</h3>
<ul id='peer-chars'>
{foreach from=$peers item="loop_peer"}
- <li style='position:relative;margin-bottom:.5em'>
- <a style='width:10em;display:inline-block;' href='player.php?player_id={$loop_peer.player_id}' target='main'>{$loop_peer.uname}</a>
+ <li class='peer'>
+ <a class='peer-name' href='player.php?player_id={$loop_peer.player_id}' target='main'>{$loop_peer.uname}</a>
+ <em title='Level {$loop_peer.level}'>{$loop_peer.level}</em>
{if $char_info.health}
- <span style='margin-left:2em;width:6.5em;display:inline-block;'>
+ <span class='stats-block'>
{include file="health_bar.tpl" health=$loop_peer.health health_percent=$loop_peer.health_percent}
</span>
<!-- (level {$loop_peer.level}) -->
@@ -144,7 +128,7 @@
</ul>
</div>
{else}
-<p style='width:45%;float:right;margin-left:0;margin-right:0;'>No nearby ninja, <em class='char-name'>{$username|escape}</em>.</p>
+<p class='enemies-righthalf'>No nearby ninja, <em class='char-name'>{$username|escape}</em>.</p>
{/if}
</section><!-- End of clearfix section -->
@@ -155,15 +139,73 @@
<!-- Display recently active ninja -->
{include file="list.active.tpl" active_ninja=$active_ninjas}
-<section id='npc-list'>
+<section id='npc-list-section'>
<h3>Attack a:</h3>
- <ul id='npc-list' style='margin: .5em auto;text-align:center;font-size:1.3em;'>
+ <ul id='npc-list'>
{foreach name="person" from=$npcs key="idx" item="npc"}
<li><a href='npc.php?attacked=1&amp;victim={$npc.identity|escape}' target='main'><img alt='' src='images/characters/{$npc.image|escape:'url'|escape}' style='width:25px;height:46px'> {$npc.name|escape}</a></li>
{/foreach}
{foreach name="creatures" from=$other_npcs key="idx" item="npc"}
- <li><a href='npc.php?attacked=1&amp;victim={$idx|escape}' target='main'>{if $npc.img}<img alt='' src='images/characters/{$npc.img|escape:'url'|escape}' style='max-width:50px;max-height:50px'>{else}<span style='width:25px;height:46px'>&#9733;</span>{/if} {$npc.name|escape}</a></li>
+ <li><a href='npc.php?attacked=1&amp;victim={$idx|escape}' target='main'>{if $npc.img}<img alt='' class='creature-image' src='images/characters/{$npc.img|escape:'url'|escape}'>{else}<span style='width:25px;height:46px'>&#9733;</span>{/if} {$npc.name|escape}</a></li>
{/foreach}
</ul>
</section>
+<script type='text/javascript'>
+{literal}
+ $(document).ready(function(){
+
+ // Function to display the matches.
+ NW.displayMatches = function(json_matches){
+ var sample = $('#sample-enemy-match');
+ var moreMatches = $('#more-matches');
+ //NW.debug(json_matches);
+ if(typeof(json_matches.char_matches) != 'undefined'){
+ // Remove all li's not preceded by an li.
+ $('#ninja-matches li+li').remove();
+ // Take the matches, extract them into individuals.
+ var inc = 0;
+ for(var i in json_matches.char_matches){
+ if(inc>9){
+ break;
+ }
+ var clone = sample.clone().attr('id', 'enemy-match-'+i);
+ if(i%2 == 1){ // Classify the even entries (here 0, 2, 4, etc)
+ clone.addClass('even');
+ }
+ var match = json_matches.char_matches[i];
+ //NW.debug(match);
+ var link = clone.find('a');
+ //NW.debug(sample);
+ // For each individual, extend the default link to make an attack link.
+ var newlink = link.attr('href')+match.uname;
+ // Add the new ones back on after the sample.
+ sample.after(link.attr('href',newlink).text(match.uname).end().show());
+ inc++;
+ }
+ if(json_matches.char_matches.length > 9){
+ moreMatches.show(); // Show the "with more matches" section.
+ } else {
+ moreMatches.hide();
+ }
+ }
+ };
+
+
+ var searchbox = $('#enemy-match');
+ searchbox.keyup(function () {
+ NW.typewatch(function () {
+ // executed only 500 ms after the last keyup event.
+ var term = $('#enemy-match').val();
+ var limit = 11; // Limit to 11, and only display 10.
+ if(term && term.length>2){
+ // Only search after a few characters are typed out
+ NW.charMatch(term, limit, NW.displayMatches);
+ }
+ }, 500);
+ });
+
+ });
+{/literal}
+</script>
+
View
1 deploy/www/enemies.php
@@ -76,4 +76,3 @@
)
);
}
-?>

0 comments on commit 3bbe451

Please sign in to comment.