Display setup info in popup

Core/Frameworks/Baikal/Resources/Templates/Page/index.html

@@ -31,22 +31,9 @@
 		================================================== -->
 		<!-- Placed at the end of the document so the pages load faster -->
 		<script src="res/core/TwitterBootstrap/js/jquery-3.1.0.min.js"></script>
+		<script src="res/core/TwitterBootstrap/js/jquery.color-2.2.0.min.js"></script>
 		<script src="res/core/TwitterBootstrap/js/bootstrap.min.js"></script>
-		<script type="text/javascript">
-			$("[rel=tooltip]").tooltip();
-			$(".popover-hover").popover();
-			$(".popover-focus").popover({
-				trigger: 'focus'
-			});
-			$(".popover-focus-top").popover({
-				trigger: 'focus',
-				placement: 'top'
-			});
-			$(".popover-focus-bottom").popover({
-				trigger: 'focus',
-				placement: 'bottom'
-			});
-		</script>
+		<script src="res/core/BaikalAdmin/main.js"></script>
 		{{ javascript }}
 	</body>
 </html>

Core/Frameworks/BaikalAdmin/Controller/User/AddressBooks.php

@@ -275,6 +275,6 @@ class AddressBooks extends \Flake\Core\Controller {
      * @return string AddressBook DAV URI
      */
     protected function getDavUri(\Baikal\Model\AddressBook $addressbook) {
-        return PROJECT_BASEURI . 'dav.php/addressbooks/' . $this->oUser->get('username') . '/' . $addressbook->get('uri') . '/';
+        return PROJECT_URI . 'dav.php/addressbooks/' . $this->oUser->get('username') . '/' . $addressbook->get('uri') . '/';
     }
 }

Core/Frameworks/BaikalAdmin/Controller/User/Calendars.php

@@ -279,6 +279,6 @@ class Calendars extends \Flake\Core\Controller {
      * @return string Calender DAV URI
      */
     protected function getDavUri(\Baikal\Model\Calendar $calendar) {
-        return PROJECT_BASEURI . 'dav.php/calendars/' . $this->oUser->get('username') . '/' . $calendar->get('uri') . '/';
+        return PROJECT_URI . 'dav.php/calendars/' . $this->oUser->get('username') . '/' . $calendar->get('uri') . '/';
     }
 }

Core/Frameworks/BaikalAdmin/Controller/Users.php

@@ -78,6 +78,7 @@ class Users extends \Flake\Core\Controller {
         $oView->setData("users", $aUsers);
         $oView->setData("calendaricon", \Baikal\Model\Calendar::icon());
         $oView->setData("usericon", \Baikal\Model\User::icon());
+        $oView->setData("davUri", PROJECT_URI . 'dav.php');
 
         # Messages
         $sMessages = implode("\n", $this->aMessages);

Core/Frameworks/BaikalAdmin/Resources/Templates/Page/index.html

@@ -31,22 +31,9 @@
 		================================================== -->
 		<!-- Placed at the end of the document so the pages load faster -->
 		<script src="res/core/TwitterBootstrap/js/jquery-3.1.0.min.js"></script>
+		<script src="res/core/TwitterBootstrap/js/jquery.color-2.2.0.min.js"></script>
 		<script src="res/core/TwitterBootstrap/js/bootstrap.min.js"></script>
-		<script type="text/javascript">
-			$("[rel=tooltip]").tooltip();
-			$(".popover-hover").popover();
-			$(".popover-focus").popover({
-				trigger: 'focus'
-			});
-			$(".popover-focus-top").popover({
-				trigger: 'focus',
-				placement: 'top'
-			});
-			$(".popover-focus-bottom").popover({
-				trigger: 'focus',
-				placement: 'bottom'
-			});
-		</script>
+		<script src="res/core/BaikalAdmin/main.js"></script>
 		{{ javascript }}
 	</body>
 </html>

Core/Frameworks/BaikalAdmin/Resources/Templates/Page/style.css

@@ -107,3 +107,20 @@ table.users .col-username { width: 45%;}
     transform: rotate(360deg);
   }
 }
+
+.popover {
+  max-width: 100%;
+}
+
+.copy-to-clipboard {
+  cursor: pointer;
+}
+
+.copy-to-clipboard i {
+  margin-left: 5px;
+  opacity: 1;
+}
+
+.copy-to-clipboard:hover i {
+  opacity: 0.5;
+}

Core/Frameworks/BaikalAdmin/Resources/Templates/User/AddressBooks.html

@@ -18,14 +18,14 @@
 	<tbody>
 		{% for addressbook in addressbooks %}
 		<tr>
-			<td class="col-displayname"><i class="{{ addressbook.icon }}"></i>{{ addressbook.label|escape }}</td>
+			<td class="col-displayname"><i class="{{ addressbook.icon }}"></i> {{ addressbook.label|escape }}</td>
 			<td class="col-contacts">{{ addressbook.contacts|escape }}</td>
 			<td class="col-description">{{ addressbook.description|escape }}</td>
 			<td class="col-actions no-border-left">
 				<p class="pull-right">
+					<nobr><span class="btn popover-hover" data-placement="bottom" data-toggle="popover" title="Setup info" data-content="<b>URI</b><br/><span class='copy-to-clipboard' onclick='copyToClipboard(this);'>{{ addressbook.davuri }}<i class='icon-file'></i></span><br><br><b>User name</b><br/><span class='copy-to-clipboard' onclick='copyToClipboard(this);'>{{ user.username|escape }}<i class='icon-file'></i></span><br><br><b>Password</b><br/><em>(hidden)</em>" data-html="true"><i class="icon-info-sign"></i></span></nobr>
 					<nobr><a class="btn btn-primary" href="{{ addressbook.linkedit }}"><i class="icon-edit icon-white"></i> Edit</a></nobr>
 					<nobr><a class="btn btn-danger" href="{{ addressbook.linkdelete }}"><i class="icon-remove icon-white"></i> Delete</a></nobr>
-					<nobr><a class="btn" href="{{ addressbook.davuri }}"><i class="{{ addressbookicon }}"></i> AddressBook URI</a></nobr>
 				</p>
 			</td>
 		</tr>

Core/Frameworks/BaikalAdmin/Resources/Templates/User/Calendars.html

@@ -18,14 +18,14 @@
 	<tbody>
 		{% for calendar in calendars %}
 		<tr>
-			<td class="col-displayname"><i class="{{ calendar.icon }}"></i>{{ calendar.label|escape }}{%if calendar.instanced%} <span class="label label-info label-intext">Has instances</span>{% endif %}</td>
+			<td class="col-displayname"><i class="{{ calendar.icon }}"></i> {{ calendar.label|escape }}{%if calendar.instanced%} <span class="label label-info label-intext">Has instances</span>{% endif %}</td>
 			<td class="col-events">{{ calendar.events|escape }}</td>
 			<td class="col-description">{{ calendar.description|escape }}</td>
 			<td class="col-actions no-border-left">
 				<p class="pull-right">
+					<nobr><span class="btn popover-hover" data-placement="bottom" data-toggle="popover" title="Setup info" data-content="<b>URI</b><br/><span class='copy-to-clipboard' onclick='copyToClipboard(this);'>{{ calendar.davuri }}<i class='icon-file'></i></span><br><br><b>User name</b><br/><span class='copy-to-clipboard' onclick='copyToClipboard(this);'>{{ user.username|escape }}<i class='icon-file'></i></span><br><br><b>Password</b><br/><em>(hidden)</em>" data-html="true"><i class="icon-info-sign"></i></span></nobr>
 					<nobr><a class="btn btn-primary" href="{{ calendar.linkedit }}"><i class="icon-edit icon-white"></i> Edit</a></nobr>
 					<nobr><a class="btn btn-danger" href="{{ calendar.linkdelete }}"><i class="icon-remove icon-white"></i> Delete</a></nobr>
-					<nobr><a class="btn" href="{{ calendar.davuri }}"><i class="{{ calendaricon }}"></i> Calendar URI</a></nobr>
 				</p>
 			</td>
 		</tr>

Core/Frameworks/BaikalAdmin/Resources/Templates/Users.html

@@ -14,6 +14,7 @@
 		</td>
 		<td class="col-actions no-border-left">
 			<p class="pull-right">
+				<nobr><span class="btn popover-hover" data-placement="bottom" data-toggle="popover" title="Setup info" data-content="<b>URI</b><br/><span class='copy-to-clipboard' onclick='copyToClipboard(this);'>{{ davUri }}<i class='icon-file'></i></span><br><br><b>User name</b><br/><span class='copy-to-clipboard' onclick='copyToClipboard(this);'>{{ user.username|escape }}<i class='icon-file'></i></span><br><br><b>Password</b><br/><em>(hidden)</em>" data-html="true"><i class="icon-info-sign"></i></span></nobr>
 				<nobr><a class="btn" href="{{ user.linkcalendars }}"><i class="{{ calendaricon }}"></i> Calendars</a></nobr>
 				<nobr><a class="btn" href="{{ user.linkaddressbooks }}"><i class="icon-book"></i> Address Books</a></nobr>
 				<nobr><a class="btn btn-primary" href="{{ user.linkedit }}"><i class="icon-edit icon-white"></i>  Edit</a></nobr>
@@ -27,4 +28,4 @@
 <a id='form'></a>
 {{ messages }}
 {{ form }}
-{% endautoescape %}
+{% endautoescape %}

Core/Frameworks/BaikalAdmin/Resources/main.js

@@ -0,0 +1,27 @@
+$(document).ready(function() {
+    $("[rel=tooltip]").tooltip();
+    $(".popover-hover").popover();
+    $(".popover-focus").popover({
+        trigger: 'focus'
+    });
+    $(".popover-focus-top").popover({
+        trigger: 'focus',
+        placement: 'top'
+    });
+    $(".popover-focus-bottom").popover({
+        trigger: 'focus',
+        placement: 'bottom'
+    });
+});
+
+function copyToClipboard(el) {
+    var range = document.createRange();
+    range.selectNodeContents(el);
+    var sel = window.getSelection();
+    sel.removeAllRanges();
+    sel.addRange(range);
+    document.execCommand("copy");
+    sel.removeAllRanges();
+    $(el).css({backgroundColor:"#75c753"});
+    $(el).animate({backgroundColor:"transparent"}, 1500);
+}