Merge branch 'master' into GuillaumeAmat-patch-1

16 files changed, 109 insertions, 24 deletions

diff --git a/core/css/fixes.css b/core/css/fixes.css
index 4ee854addef..a33afd5cf77 100644
--- a/core/css/fixes.css
+++ b/core/css/fixes.css
@@ -54,11 +54,6 @@
 	background-color: #1B314D;
 }
 
-/* in IE9 the nav bar on the left side is too narrow and leave a white area - original width is 80px */
-.ie9 #navigation {
-	width: 100px;
-}
-
 /* IE8 isn't able to display transparent background. So it is specified using a gradient */
 .ie8 #nojavascript {
 	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4c320000', endColorstr='#4c320000'); /* IE */
diff --git a/core/css/mobile.css b/core/css/mobile.css
new file mode 100644
index 00000000000..a63aa902d34
--- /dev/null
+++ b/core/css/mobile.css
@@ -0,0 +1,22 @@
+@media only screen and (max-width: 600px) {
+
+/* compress search box on mobile, expand when focused */
+.searchbox input[type="search"] {
+	width: 15%;
+	-webkit-transition: width 100ms;
+	-moz-transition: width 100ms;
+	-o-transition: width 100ms;
+	transition: width 100ms;
+}
+.searchbox input[type="search"]:focus,
+.searchbox input[type="search"]:active {
+	width: 155px;
+}
+
+/* do not show display name on mobile when profile picture is present */
+#header .avatardiv.avatardiv-shown + #expandDisplayName {
+	display: none;
+}
+
+
+}
diff --git a/core/css/multiselect.css b/core/css/multiselect.css
index 60f2f47e698..8d949e7cdb7 100644
--- a/core/css/multiselect.css
+++ b/core/css/multiselect.css
@@ -48,7 +48,7 @@ ul.multiselectoptions > li input[type='checkbox']:checked+label {
 	font-weight: bold;
 }
 
-div.multiselect {
+div.multiselect, select.multiselect {
 	display: inline-block;
 	max-width: 400px;
 	min-width: 150px;
@@ -58,6 +58,12 @@ div.multiselect {
 	vertical-align: bottom;
 }
 
+/* To make a select look like a multiselect until it's initialized */
+select.multiselect {
+	height: 30px;
+	min-width: 113px;
+}
+
 div.multiselect.active {
 	background-color: #fff;
 	position: relative;
diff --git a/core/css/styles.css b/core/css/styles.css
index bee44785f12..341a507ce37 100644
--- a/core/css/styles.css
+++ b/core/css/styles.css
@@ -37,11 +37,12 @@ body { background:#fefefe; font:normal .8em/1.6em "Helvetica Neue",Helvetica,Ari
 .header-right { float:right; vertical-align:middle; padding:0.5em; }
 .header-right > * { vertical-align:middle; }
 
+/* Profile picture in header */
 #header .avatardiv {
 	float: left;
 	display: inline-block;
+	margin-right: 5px;
 }
-
 #header .avatardiv img {
 	opacity: 1;
 }
@@ -74,6 +75,19 @@ body { background:#fefefe; font:normal .8em/1.6em "Helvetica Neue",Helvetica,Ari
 	color: #aaa;
 }
 
+#header .logo {
+	background-image: url(../img/logo.svg);
+	width: 250px;
+	height: 118px;
+	margin: 0 auto;
+}
+
+#header .logo-wide {
+	background-image: url(../img/logo-wide.svg);
+	width: 147px;
+	height: 32px;
+}
+
 /* INPUTS */
 input[type="text"],
 input[type="password"],
@@ -205,17 +219,19 @@ textarea:disabled {
 		color: #bbb;
 	}
 
-
+/* Searchbox */
 .searchbox input[type="search"] {
+	position: relative;
 	font-size: 1.2em;
-	padding: .2em .5em .2em 1.5em;
+	padding-left: 1.5em;
 	background: #fff url('../img/actions/search.svg') no-repeat .5em center;
 	border: 0;
-	border-radius: 1em;
+	border-radius: 2em;
 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter:alpha(opacity=70); opacity: .7;
-	margin-top: 10px;
+	margin-top: 6px;
 	float: right;
 }
+
 input[type="submit"].enabled {
 	background: #66f866;
 	border: 1px solid #5e5;
@@ -706,12 +722,11 @@ label.infield { cursor:text !important; top:1.05em; left:.85em; }
 /* USER MENU */
 #settings {
 	float: right;
-	margin-top: 7px;
-	margin-left: 10px;
 	color: #bbb;
 }
 #expand {
-	padding: 15px 15px 15px 5px;
+	display: block;
+	padding: 7px 12px 6px 7px;
 	cursor: pointer;
 	font-weight: bold;
 }
@@ -933,3 +948,20 @@ div.crumb:active {
 	opacity:.7;
 }
 
+.appear {
+	opacity: 1;
+	transition: opacity 500ms ease 0s;
+	-moz-transition: opacity 500ms ease 0s;
+	-ms-transition: opacity 500ms ease 0s;
+	-o-transition: opacity 500ms ease 0s;
+	-webkit-transition: opacity 500ms ease 0s;
+}
+.appear.transparent {
+	opacity: 0;
+}
+
+/* for IE10 */
+@-ms-viewport {
+	width: device-width;
+}
+
diff --git a/core/img/filetypes/text-x-javascript.png b/core/img/filetypes/application-javascript.png
index 1e1d3140f63..1e1d3140f63 100644
--- a/core/img/filetypes/text-x-javascript.png
+++ b/core/img/filetypes/application-javascript.png
diff --git a/core/img/filetypes/text-x-javascript.svg b/core/img/filetypes/application-javascript.svg
index 4e9819bb685..4e9819bb685 100644
--- a/core/img/filetypes/text-x-javascript.svg
+++ b/core/img/filetypes/application-javascript.svg
diff --git a/core/img/filetypes/flash.png b/core/img/filetypes/application-x-shockwave-flash.png
index 75424f81d68..75424f81d68 100644
--- a/core/img/filetypes/flash.png
+++ b/core/img/filetypes/application-x-shockwave-flash.png
diff --git a/core/img/filetypes/flash.svg b/core/img/filetypes/application-x-shockwave-flash.svg
index b373fd6512d..b373fd6512d 100644
--- a/core/img/filetypes/flash.svg
+++ b/core/img/filetypes/application-x-shockwave-flash.svg
diff --git a/core/img/filetypes/calendar.png b/core/img/filetypes/text-calendar.png
index d5c666a7695..d5c666a7695 100644
--- a/core/img/filetypes/calendar.png
+++ b/core/img/filetypes/text-calendar.png
diff --git a/core/img/filetypes/calendar.svg b/core/img/filetypes/text-calendar.svg
index 7d62bb8fa12..7d62bb8fa12 100644
--- a/core/img/filetypes/calendar.svg
+++ b/core/img/filetypes/text-calendar.svg
diff --git a/core/js/avatar.js b/core/js/avatar.js
index c54c4068768..67d6b9b7b95 100644
--- a/core/js/avatar.js
+++ b/core/js/avatar.js
@@ -1,6 +1,13 @@
 $(document).ready(function(){
 	if (OC.currentUser) {
-		$('#header .avatardiv').avatar(OC.currentUser, 32, undefined, true);
+		var callback = function() {
+			// do not show display name on mobile when profile picture is present
+			if($('#header .avatardiv').children().length > 0) {
+				$('#header .avatardiv').addClass('avatardiv-shown');
+			}
+		};
+
+		$('#header .avatardiv').avatar(OC.currentUser, 32, undefined, true, callback);
 		// Personal settings
 		$('#avatar .avatardiv').avatar(OC.currentUser, 128);
 	}
diff --git a/core/js/config.php b/core/js/config.php
index e79b4541301..947577eb985 100644
--- a/core/js/config.php
+++ b/core/js/config.php
@@ -27,6 +27,7 @@ foreach(OC_App::getEnabledApps() as $app) {
 
 $array = array(
 	"oc_debug" => (defined('DEBUG') && DEBUG) ? 'true' : 'false',
+	"oc_isadmin" => OC_User::isAdminUser(OC_User::getUser()) ? 'true' : 'false',
 	"oc_webroot" => "\"".OC::$WEBROOT."\"",
 	"oc_appswebroots" =>  str_replace('\\/', '/', json_encode($apps_paths)), // Ugly unescape slashes waiting for better solution
 	"datepickerFormatDate" => json_encode($l->l('jsdate', 'jsdate')),
diff --git a/core/js/jquery.avatar.js b/core/js/jquery.avatar.js
index 6012eccfad6..02a40c088b4 100644
--- a/core/js/jquery.avatar.js
+++ b/core/js/jquery.avatar.js
@@ -39,10 +39,15 @@
  * This will behave like the first example, but it will hide the avatardiv, if
  * it will display the default placeholder. undefined is the ie8fix from
  * example 4 and can be either true, or false/undefined, to be ignored.
+ *
+ * 6. $('.avatardiv').avatar('jdoe', 128, undefined, true, callback);
+ * This will behave like the above example, but it will call the function
+ * defined in callback after the avatar is placed into the DOM.
+ *
  */
 
 (function ($) {
-	$.fn.avatar = function(user, size, ie8fix, hidedefault) {
+	$.fn.avatar = function(user, size, ie8fix, hidedefault, callback) {
 		if (typeof(size) === 'undefined') {
 			if (this.height() > 0) {
 				size = this.height();
@@ -91,6 +96,9 @@
 						$div.html('<img src="'+url+'">');
 					}
 				}
+				if(typeof callback === 'function') {
+					callback();
+				}
 			});
 		});
 	};
diff --git a/core/js/js.js b/core/js/js.js
index d4d2583f1e5..ec890be4541 100644
--- a/core/js/js.js
+++ b/core/js/js.js
@@ -860,6 +860,7 @@ function initCore() {
 	// checkShowCredentials();
 	// $('input#user, input#password').keyup(checkShowCredentials);
 
+	// user menu
 	$('#settings #expand').keydown(function(event) {
 		if (event.which === 13 || event.which === 32) {
 			$('#expand').click()
@@ -872,7 +873,8 @@ function initCore() {
 	$('#settings #expanddiv').click(function(event){
 		event.stopPropagation();
 	});
-	$(document).click(function(){//hide the settings menu when clicking outside it
+	//hide the user menu when clicking outside it
+	$(document).click(function(){
 		$('#settings #expanddiv').slideUp(200);
 	});
 
@@ -987,6 +989,17 @@ OC.set=function(name, value) {
 	context[tail]=value;
 };
 
+// fix device width on windows phone
+(function() {
+	if ("-ms-user-select" in document.documentElement.style && navigator.userAgent.match(/IEMobile\/10\.0/)) {
+		var msViewportStyle = document.createElement("style");
+		msViewportStyle.appendChild(
+			document.createTextNode("@-ms-viewport{width:auto!important}")
+		);
+		document.getElementsByTagName("head")[0].appendChild(msViewportStyle);
+	}
+})();
+
 /**
  * select a range in an input field
  * @link http://stackoverflow.com/questions/499126/jquery-set-cursor-position-in-text-area
diff --git a/core/templates/layout.guest.php b/core/templates/layout.guest.php
index 6a96b17b100..91157b923a5 100644
--- a/core/templates/layout.guest.php
+++ b/core/templates/layout.guest.php
@@ -36,7 +36,7 @@
 	<body id="body-login">
 		<div class="wrapper"><!-- for sticky footer -->
 			<header><div id="header">
-				<img src="<?php print_unescaped(image_path('', 'logo.svg')); ?>" class="svg" alt="<?php p($theme->getName()); ?>" />
+				<div class='logo'></div>
 				<div id="logo-claim" style="display:none;"><?php p($theme->getLogoClaim()); ?></div>
 			</div></header>
 
diff --git a/core/templates/layout.user.php b/core/templates/layout.user.php
index bc1c700402e..3d897503480 100644
--- a/core/templates/layout.user.php
+++ b/core/templates/layout.user.php
@@ -15,7 +15,7 @@
 		</title>
 		<meta charset="utf-8">
 		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-		<meta name="viewport" content="width=device-width, initial-scale=1.0">
+		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=1.0">
 		<meta name="apple-itunes-app" content="app-id=543672169">
 		<link rel="shortcut icon" href="<?php print_unescaped(image_path('', 'favicon.png')); ?>" />
 		<link rel="apple-touch-icon-precomposed" href="<?php print_unescaped(image_path('', 'favicon-touch.png')); ?>" />
@@ -45,17 +45,18 @@
 		<?php endif; ?>
 	</div>
 	<header><div id="header">
-			<a href="<?php print_unescaped(link_to('', 'index.php')); ?>" title="" id="owncloud"><img class="svg"
-				src="<?php print_unescaped(image_path('', 'logo-wide.svg')); ?>" alt="<?php p($theme->getName()); ?>" /></a>
+			<a href="<?php print_unescaped(link_to('', 'index.php')); ?>" title="" id="owncloud">
+				<div class='logo-wide'></div>
+			</a>
 			<div id="logo-claim" style="display:none;"><?php p($theme->getLogoClaim()); ?></div>
 			<div id="settings" class="svg">
 				<span id="expand" tabindex="0" role="link">
+					<?php if ($_['enableAvatars']): ?>
+					<div class="avatardiv"></div>
+					<?php endif; ?>
 					<span id="expandDisplayName"><?php  p(trim($_['user_displayname']) != '' ? $_['user_displayname'] : $_['user_uid']) ?></span>
 					<img class="svg" alt="" src="<?php print_unescaped(image_path('', 'actions/caret.svg')); ?>" />
 				</span>
-				<?php if ($_['enableAvatars']): ?>
-				<div class="avatardiv"></div>
-				<?php endif; ?>
 				<div id="expanddiv">
 				<ul>
 				<?php foreach($_['settingsnavigation'] as $entry):?>