From bac61cf596c143a15a430b5ba15d9f3a8dfe21e5 Mon Sep 17 00:00:00 2001
From: rabuzarus <>
Date: Sun, 25 Oct 2015 16:49:45 +0100
Subject: [PATCH] manage-selector: some cleanup and css work

---
 mod/manage.php                    |  9 +++---
 view/global.css                   | 45 ++++++++++++++++++++++++++++++
 view/templates/manage.tpl         | 35 +++++++++++------------
 view/theme/frost-mobile/style.css | 46 ++++++++++++++++++++++++++-----
 view/theme/frost/style.css        | 46 ++++++++++++++++++++++++++-----
 5 files changed, 144 insertions(+), 37 deletions(-)

diff --git a/mod/manage.php b/mod/manage.php
index 236a3fb05..3f553dfa6 100644
--- a/mod/manage.php
+++ b/mod/manage.php
@@ -99,16 +99,17 @@ function manage_content(&$a) {
 
 	$identities = $a->identities;
 
-	//getting profile pics for delegates
+	//getting additinal information for each identity
 	foreach ($identities as $key=>$id) {
-		$thumb = q("SELECT `thumb` FROM `contact` WHERE `uid` = %d AND `name` = '%s' AND `nick` = '%s' AND (network = 'dfrn' OR self = 1)",
+		$thumb = q("SELECT `thumb` FROM `contact` WHERE `uid` = %d AND `name` = '%s' AND `nick` = '%s' AND (`network` = '%s' OR `self` = 1)",
 			intval($a->user['uid']),
 			dbesc($id['username']),
-			dbesc($id['nickname'])
+			dbesc($id['nickname']),
+			dbesc(NETWORK_DFRN)
 			);
 		$identities[$key][thumb] = $thumb[0][thumb];
 
-		$identities[$key]['selected'] = (($id['nickname'] === $a->user['nickname']) ? ' selected="selected" ' : '');
+		$identities[$key]['selected'] = (($id['nickname'] === $a->user['nickname']) ? true : false);
 	}
 
 	$o = replace_macros(get_markup_template('manage.tpl'), array(
diff --git a/view/global.css b/view/global.css
index c2f584003..d1c07d60a 100644
--- a/view/global.css
+++ b/view/global.css
@@ -212,3 +212,48 @@ a {
   clip: rect(0,0,0,0);
   border: 0;
 }
+
+.itentity-match-wrapper {
+  float: left;
+  padding: 10px;
+  width: 120px;
+  height: 140px;
+  margin-bottom: 20px;
+}
+
+.identity-match-photo {
+  float: left;
+  text-align: center;
+  width: 120px;
+}
+
+.identity-match-name {
+  text-align: center;
+}
+
+.identity-match-details {
+  float: left;
+  text-align: center;
+  width: 120px;
+  overflow: hidden;
+  font-size: 10px;
+  font-weight: 500;
+  color: #999999;
+}
+
+.identity-match-break, .identity-match-end {
+  clear: both;
+}
+
+.identity-match-photo button {
+  border: none;
+  padding: 0;
+  margin: 0;
+  background: none;
+  height: 80px;
+  width: 80px;
+}
+
+.selected-identity img {
+  border: 2px solid #ff0000;
+}
\ No newline at end of file
diff --git a/view/templates/manage.tpl b/view/templates/manage.tpl
index d82ddb6d7..8a7922d7b 100644
--- a/view/templates/manage.tpl
+++ b/view/templates/manage.tpl
@@ -2,32 +2,29 @@
 <h3>{{$title}}</h3>
 <div id="identity-manage-desc">{{$desc}}</div>
 <div id="identity-manage-choose">{{$choose}}</div>
-{{*<div id="identity-selector-wrapper">
-	<form action="manage" method="post" >
-	<select name="identity" size="10" onchange="this.form.submit();" >
-
-	{{foreach $identities as $id}}
-		<option {{$id.selected}} value="{{$id.uid}}">{{$id.username}} ({{$id.nickname}})</option>
-	{{/foreach}}
-
-	</select>
-	<div id="identity-select-break"></div>
-
-	
-	</form>
-</div>*}}
 
 <div id="identity-selector-wrapper">
 	<form action="manage" method="post" >
-	
 
 	{{foreach $identities as $id}}
-		<button  name="identity" value="{{$id.uid}}" onclick="this.form.submit();" class="id-selection-photo-link" title="{{$id.username}}"><img class="channel-photo" src="{{$id.thumb}}" alt="{{$id.username}}" /></button>
+		<div class="itentity-match-wrapper {{if $id.selected}}selected-identity{{/if}}" id="identity-match-{{$id.uid}}">
+			<div class="identity-match-photo" id="identity-match-photo-{{$id.uid}}">
+				<button name="identity" value="{{$id.uid}}" onclick="this.form.submit();" title="{{$id.username}}">
+					<img src="{{$id.thumb}}" alt="{{$id.username}}" />
+				</button>
+			</div>
+
+			<div class="identity-match-break"></div>
+
+			<div class="identity-match-desc">
+				<div class="identity-match-name" id="identity-match-name-{{$id.uid}}">{{$id.username}}</div>
+				<div class="identity-match-details" id="identity-match-nick-{{$id.uid}}">({{$id.nickname}})</div>
+			</div>
+
+			<div class="identity-match-end"></div>
+		</div>
 	{{/foreach}}
 
-
-
-	{{*<!--<input id="identity-submit" type="submit" name="submit" value="{{$submit}}" />-->*}}
 	</form>
 </div>
 	
diff --git a/view/theme/frost-mobile/style.css b/view/theme/frost-mobile/style.css
index f4b46fed8..7d47c0b98 100644
--- a/view/theme/frost-mobile/style.css
+++ b/view/theme/frost-mobile/style.css
@@ -3234,17 +3234,49 @@ aside input[type='text'] {
 	margin: 10px;
 }
 
-#identity-manage-desc {
-	margin-top:15px;
-	margin-bottom: 15px;
+.itentity-match-wrapper {
+	float: left;
+	padding: 10px;
+	width: 120px;
+	height: 140px;
+	margin-bottom: 20px;
 }
 
-#identity-manage-choose {
-	margin-bottom: 15px;
+.identity-match-photo {
+	float: left;
+	text-align: center;
+	width: 120px;
 }
 
-#identity-submit {
-	margin-top: 20px;
+.identity-match-name {
+	text-align: center;
+}
+
+.identity-match-details {
+	float: left;
+	text-align: center;
+	width: 120px;
+	overflow: hidden;
+	font-size: 10px;
+	font-weight: 500;
+	color: #999999;
+}
+
+.identity-match-break, .identity-match-end {
+	clear: both;
+}
+
+.identity-match-photo button {
+	border: none;
+	padding: 0;
+	margin: 0;
+	background: none;
+	height: 80px;
+	width: 80px;
+}
+
+.selected-identity img {
+	border: 2px solid #ff0000;
 }
 
 #photo-nav {
diff --git a/view/theme/frost/style.css b/view/theme/frost/style.css
index 8b87c3bd4..5f3ea646e 100644
--- a/view/theme/frost/style.css
+++ b/view/theme/frost/style.css
@@ -3006,17 +3006,49 @@ aside input[type='text'] {
 	margin: 10px;
 }
 
-#identity-manage-desc {
-	margin-top:15px;
-	margin-bottom: 15px;
+.itentity-match-wrapper {
+	float: left;
+	padding: 10px;
+	width: 120px;
+	height: 140px;
+	margin-bottom: 20px;
 }
 
-#identity-manage-choose {
-	margin-bottom: 15px;
+.identity-match-photo {
+	float: left;
+	text-align: center;
+	width: 120px;
 }
 
-#identity-submit {
-	margin-top: 20px;
+.identity-match-name {
+	text-align: center;
+}
+
+.identity-match-details {
+	float: left;
+	text-align: center;
+	width: 120px;
+	overflow: hidden;
+	font-size: 10px;
+	font-weight: 500;
+	color: #999999;
+}
+
+.identity-match-break, .identity-match-end {
+	clear: both;
+}
+
+.identity-match-photo button {
+	border: none;
+	padding: 0;
+	margin: 0;
+	background: none;
+	height: 80px;
+	width: 80px;
+}
+
+.selected-identity img {
+	border: 2px solid #ff0000;
 }
 
 #photo-prev-link, #photo-next-link {