',
@@ -96,6 +96,14 @@ angular.module("umbraco.directives")
if (node.style) {
element.find("i:first").attr("style", node.style);
}
+
+ // add a unique data element to each tree item so it is easy to navigate with code
+ if(!node.metaData.treeAlias) {
+ node.dataElement = node.name;
+ } else {
+ node.dataElement = node.metaData.treeAlias;
+ }
+
}
//This will deleteAnimations to true after the current digest
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbavatar.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbavatar.directive.js
index 7fad3e8a74..7dd2f0d7a3 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbavatar.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbavatar.directive.js
@@ -66,9 +66,13 @@ Use this directive to render an avatar.
function getNameInitials(name) {
if(name) {
- var initials = name.match(/\b\w/g) || [];
- initials = ((initials.shift() || '') + (initials.pop() || '')).toUpperCase();
- return initials;
+ var names = name.split(' '),
+ initials = names[0].substring(0, 1);
+
+ if (names.length > 1) {
+ initials += names[names.length - 1].substring(0, 1);
+ }
+ return initials.toUpperCase();
}
return null;
}
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbdatetimepicker.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbdatetimepicker.directive.js
index d7e44df113..7047fdb0a2 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbdatetimepicker.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbdatetimepicker.directive.js
@@ -84,7 +84,13 @@ Use this directive to render a date time picker
function link(scope, element, attrs, ctrl) {
+ scope.hasTranscludedContent = false;
+
function onInit() {
+
+ // check for transcluded content so we can hide the defualt markup
+ scope.hasTranscludedContent = element.find('.js-datePicker__transcluded-content')[0].children.length > 0;
+
// load css file for the date picker
assetsService.loadCss('lib/datetimepicker/bootstrap-datetimepicker.min.css');
@@ -148,7 +154,7 @@ Use this directive to render a date time picker
.on("dp.show", onShow)
.on("dp.change", onChange)
.on("dp.error", onError)
- .on("dp.update", onUpdate);
+ .on("dp.update", onUpdate);
}
onInit();
@@ -158,6 +164,7 @@ Use this directive to render a date time picker
var directive = {
restrict: 'E',
replace: true,
+ transclude: true,
templateUrl: 'views/components/umb-date-time-picker.html',
scope: {
options: "=",
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js
index caa79439be..c0be05addf 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js
@@ -489,7 +489,7 @@
scope.editPropertyTypeSettings = function(property, group) {
- if (!property.inherited && !property.locked) {
+ if (!property.inherited) {
scope.propertySettingsDialogModel = {};
scope.propertySettingsDialogModel.title = "Property settings";
@@ -547,6 +547,7 @@
property.validation.pattern = oldModel.property.validation.pattern;
property.showOnMemberProfile = oldModel.property.showOnMemberProfile;
property.memberCanEdit = oldModel.property.memberCanEdit;
+ property.isSensitiveValue = oldModel.property.isSensitiveValue;
// because we set state to active, to show a preview, we have to check if has been filled out
// label is required so if it is not filled we know it is a placeholder
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbmediagrid.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbmediagrid.directive.js
index c0bd7a4eff..12179076cd 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbmediagrid.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbmediagrid.directive.js
@@ -110,7 +110,7 @@ Use this directive to generate a thumbnail grid of media items.
itemMinWidth = scope.itemMinWidth;
}
- if (scope.itemMinWidth) {
+ if (scope.itemMinHeight) {
itemMinHeight = scope.itemMinHeight;
}
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbnodepreview.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbnodepreview.directive.js
index d98246ac42..556019857b 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbnodepreview.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbnodepreview.directive.js
@@ -77,7 +77,7 @@
@param {string} icon (
): Will add a move cursor on the node preview. Can used in combination with ui-sortable.
@param {boolean} allowRemove (
): Show/Hide the remove button.
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbpasswordtoggle.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbpasswordtoggle.directive.js
new file mode 100644
index 0000000000..aac1b8dac1
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbpasswordtoggle.directive.js
@@ -0,0 +1,37 @@
+/**
+@ngdoc directive
+@name umbraco.directives.directive:umbPasswordToggle
+@restrict E
+@scope
+
+@description
+
Use this directive to render a password toggle.
+
+**/
+
+(function () {
+ 'use strict';
+
+ // comes from https://codepen.io/jakob-e/pen/eNBQaP
+ // works fine with Angular 1.6.5 - alas not with 1.1.5 - binding issue
+
+ function PasswordToggleDirective($compile) {
+
+ var directive = {
+ restrict: 'A',
+ scope: {},
+ link: function(scope, elem, attrs) {
+ scope.tgl = function () { elem.attr("type", (elem.attr("type") === "text" ? "password" : "text")); }
+ var lnk = angular.element("
").after(lnk);
+ }
+ };
+
+ return directive;
+
+ }
+
+ angular.module('umbraco.directives').directive('umbPasswordToggle', PasswordToggleDirective);
+
+})();
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbprogresscircle.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbprogresscircle.directive.js
new file mode 100644
index 0000000000..ad79cb2e3b
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbprogresscircle.directive.js
@@ -0,0 +1,88 @@
+/**
+@ngdoc directive
+@name umbraco.directives.directive:umbProgressCircle
+@restrict E
+@scope
+
+@description
+Use this directive to render a circular progressbar.
+
+
Markup example
+
+
+
+
+
+
+
+
+
+@param {string} size (
attribute): This parameter defines the width and the height of the circle in pixels.
+@param {string} percentage (
attribute): Takes a number between 0 and 100 and applies it to the circle's highlight length.
+@param {string} color (
attribute): the color of the highlight (primary, secondary, success, warning, danger). Success by default.
+**/
+
+(function (){
+ 'use strict';
+
+ function ProgressCircleDirective($http, $timeout) {
+
+ function link(scope, element, $filter) {
+
+ function onInit() {
+
+ // making sure we get the right numbers
+ var percent = scope.percentage;
+
+ if (percent > 100) {
+ percent = 100;
+ }
+ else if (percent < 0) {
+ percent = 0;
+ }
+
+ // calculating the circle's highlight
+ var circle = element.find(".umb-progress-circle__highlight");
+ var r = circle.attr('r');
+ var strokeDashArray = (r*Math.PI)*2;
+
+ // Full circle length
+ scope.strokeDashArray = strokeDashArray;
+
+ var strokeDashOffsetDifference = (percent/100)*strokeDashArray;
+ var strokeDashOffset = strokeDashArray - strokeDashOffsetDifference;
+
+ // Distance for the highlight dash's offset
+ scope.strokeDashOffset = strokeDashOffset;
+
+ // set font size
+ scope.percentageSize = (scope.size * 0.3) + "px";
+
+ }
+
+ onInit();
+ }
+
+
+ var directive = {
+ restrict: 'E',
+ replace: true,
+ templateUrl: 'views/components/umb-progress-circle.html',
+ scope: {
+ size: "@?",
+ percentage: "@",
+ color: "@"
+ },
+ link: link
+
+ };
+
+ return directive;
+ }
+
+ angular.module('umbraco.directives').directive('umbProgressCircle', ProgressCircleDirective);
+
+})();
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbtable.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbtable.directive.js
index 17d4dd93ff..c45a9f78e5 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbtable.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbtable.directive.js
@@ -1,3 +1,114 @@
+/**
+@ngdoc directive
+@name umbraco.directives.directive:umbTable
+@restrict E
+@scope
+
+@description
+
Added in Umbraco v. 7.4: Use this directive to render a data table.
+
+
Markup example
+
+
+
+
+
+
+
+
+
+
Controller example
+
+ (function () {
+ "use strict";
+
+ function Controller() {
+
+ var vm = this;
+
+ vm.items = [
+ {
+ "icon": "icon-document",
+ "name": "My node 1",
+ "published": true,
+ "description": "A short description of my node",
+ "author": "Author 1"
+ },
+ {
+ "icon": "icon-document",
+ "name": "My node 2",
+ "published": true,
+ "description": "A short description of my node",
+ "author": "Author 2"
+ }
+ ];
+
+ vm.options = {
+ includeProperties: [
+ { alias: "description", header: "Description" },
+ { alias: "author", header: "Author" }
+ ]
+ };
+
+ vm.selectItem = selectItem;
+ vm.clickItem = clickItem;
+ vm.selectAll = selectAll;
+ vm.isSelectedAll = isSelectedAll;
+ vm.isSortDirection = isSortDirection;
+ vm.sort = sort;
+
+ function selectAll($event) {
+ alert("select all");
+ }
+
+ function isSelectedAll() {
+
+ }
+
+ function clickItem(item) {
+ alert("click node");
+ }
+
+ function selectItem(selectedItem, $index, $event) {
+ alert("select node");
+ }
+
+ function isSortDirection(col, direction) {
+
+ }
+
+ function sort(field, allow, isSystem) {
+
+ }
+
+ }
+
+ angular.module("umbraco").controller("My.TableController", Controller);
+
+ })();
+
+
+@param {string} icon (
binding): The node icon.
+@param {string} name (
binding): The node name.
+@param {string} published (
binding): The node published state.
+@param {function} onSelect (
expression): Callback function when the row is selected.
+@param {function} onClick (
expression): Callback function when the "Name" column link is clicked.
+@param {function} onSelectAll (
expression): Callback function when selecting all items.
+@param {function} onSelectedAll (
expression): Callback function when all items are selected.
+@param {function} onSortingDirection (
expression): Callback function when sorting direction is changed.
+@param {function} onSort (
expression): Callback function when sorting items.
+**/
+
(function () {
'use strict';
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/validation/nodirtycheck.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/validation/nodirtycheck.directive.js
index f027d7a12f..104736530f 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/validation/nodirtycheck.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/validation/nodirtycheck.directive.js
@@ -9,9 +9,14 @@ function noDirtyCheck() {
restrict: 'A',
require: 'ngModel',
link: function (scope, elm, attrs, ctrl) {
- elm.focus(function () {
- ctrl.$pristine = false;
- });
+
+ var alwaysFalse = {
+ get: function () { return false; },
+ set: function () { }
+ };
+ Object.defineProperty(ctrl, '$pristine', alwaysFalse);
+ Object.defineProperty(ctrl, '$dirty', alwaysFalse);
+
}
};
}
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/validation/valemail.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/validation/valemail.directive.js
index 8574d01f5a..273ab07593 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/validation/valemail.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/validation/valemail.directive.js
@@ -47,8 +47,8 @@ function valEmail(valEmailExpression) {
angular.module('umbraco.directives.validation')
.directive("valEmail", valEmail)
.factory('valEmailExpression', function () {
- //NOTE: This is the fixed regex which is part of the newer angular
+ var emailRegex = /^[a-z0-9!#$%&'*+\/=?^_`{|}~.-]+@[a-z0-9]([a-z0-9-]*[a-z0-9])?(\.[a-z0-9]([a-z0-9-]*[a-z0-9])?)*$/i;
return {
- EMAIL_REGEXP: /^[a-z0-9!#$%&'*+\/=?^_`{|}~.-]+@[a-z0-9]([a-z0-9-]*[a-z0-9])?(\.[a-z0-9]([a-z0-9-]*[a-z0-9])?)*$/i
+ EMAIL_REGEXP: emailRegex
};
});
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/common/resources/currentuser.resource.js b/src/Umbraco.Web.UI.Client/src/common/resources/currentuser.resource.js
index 233d510c3e..0a6b3cd6bc 100644
--- a/src/Umbraco.Web.UI.Client/src/common/resources/currentuser.resource.js
+++ b/src/Umbraco.Web.UI.Client/src/common/resources/currentuser.resource.js
@@ -10,6 +10,30 @@ function currentUserResource($q, $http, umbRequestHelper, umbDataFormatter) {
//the factory object returned
return {
+ saveTourStatus: function (tourStatus) {
+
+ if (!tourStatus) {
+ return angularHelper.rejectedPromise({ errorMsg: 'tourStatus cannot be empty' });
+ }
+
+ return umbRequestHelper.resourcePromise(
+ $http.post(
+ umbRequestHelper.getApiUrl(
+ "currentUserApiBaseUrl",
+ "PostSetUserTour"),
+ tourStatus),
+ 'Failed to save tour status');
+ },
+
+ getTours: function () {
+
+ return umbRequestHelper.resourcePromise(
+ $http.get(
+ umbRequestHelper.getApiUrl(
+ "currentUserApiBaseUrl",
+ "GetUserTours")), 'Failed to get tours');
+ },
+
performSetInvitedUserPassword: function (newPassword) {
if (!newPassword) {
diff --git a/src/Umbraco.Web.UI.Client/src/common/resources/entity.resource.js b/src/Umbraco.Web.UI.Client/src/common/resources/entity.resource.js
index f5e2748360..5dd353d9e0 100644
--- a/src/Umbraco.Web.UI.Client/src/common/resources/entity.resource.js
+++ b/src/Umbraco.Web.UI.Client/src/common/resources/entity.resource.js
@@ -41,7 +41,7 @@ function entityResource($q, $http, umbRequestHelper) {
if (!value) {
return "";
}
-
+ value = value.replace("#", "");
return umbRequestHelper.resourcePromise(
$http.get(
umbRequestHelper.getApiUrl(
diff --git a/src/Umbraco.Web.UI.Client/src/common/resources/log.resource.js b/src/Umbraco.Web.UI.Client/src/common/resources/log.resource.js
index a5e8149952..cb676511a5 100644
--- a/src/Umbraco.Web.UI.Client/src/common/resources/log.resource.js
+++ b/src/Umbraco.Web.UI.Client/src/common/resources/log.resource.js
@@ -9,7 +9,73 @@ function logResource($q, $http, umbRequestHelper) {
//the factory object returned
return {
-
+
+ getPagedEntityLog: function (options) {
+
+ var defaults = {
+ pageSize: 10,
+ pageNumber: 1,
+ orderDirection: "Descending"
+ };
+ if (options === undefined) {
+ options = {};
+ }
+ //overwrite the defaults if there are any specified
+ angular.extend(defaults, options);
+ //now copy back to the options we will use
+ options = defaults;
+ //change asc/desct
+ if (options.orderDirection === "asc") {
+ options.orderDirection = "Ascending";
+ }
+ else if (options.orderDirection === "desc") {
+ options.orderDirection = "Descending";
+ }
+
+ if (options.id === undefined || options.id === null) {
+ throw "options.id is required";
+ }
+
+ return umbRequestHelper.resourcePromise(
+ $http.get(
+ umbRequestHelper.getApiUrl(
+ "logApiBaseUrl",
+ "GetPagedEntityLog",
+ options)),
+ 'Failed to retrieve log data for id');
+ },
+
+ getPagedUserLog: function (options) {
+
+ var defaults = {
+ pageSize: 10,
+ pageNumber: 1,
+ orderDirection: "Descending"
+ };
+ if (options === undefined) {
+ options = {};
+ }
+ //overwrite the defaults if there are any specified
+ angular.extend(defaults, options);
+ //now copy back to the options we will use
+ options = defaults;
+ //change asc/desct
+ if (options.orderDirection === "asc") {
+ options.orderDirection = "Ascending";
+ }
+ else if (options.orderDirection === "desc") {
+ options.orderDirection = "Descending";
+ }
+
+ return umbRequestHelper.resourcePromise(
+ $http.get(
+ umbRequestHelper.getApiUrl(
+ "logApiBaseUrl",
+ "GetPagedEntityLog",
+ options)),
+ 'Failed to retrieve log data for id');
+ },
+
/**
* @ngdoc method
* @name umbraco.resources.logResource#getEntityLog
diff --git a/src/Umbraco.Web.UI.Client/src/common/resources/media.resource.js b/src/Umbraco.Web.UI.Client/src/common/resources/media.resource.js
index d1810f56ee..93a92db1ec 100644
--- a/src/Umbraco.Web.UI.Client/src/common/resources/media.resource.js
+++ b/src/Umbraco.Web.UI.Client/src/common/resources/media.resource.js
@@ -493,7 +493,7 @@ function mediaResource($q, $http, umbDataFormatter, umbRequestHelper) {
* @methodOf umbraco.resources.mediaResource
*
* @description
- * Empties the media recycle bin
+ * Paginated search for media items starting on the supplied nodeId
*
* ##usage
*
@@ -506,7 +506,7 @@ function mediaResource($q, $http, umbDataFormatter, umbRequestHelper) {
* @param {string} query The search query
* @param {int} pageNumber The page number
* @param {int} pageSize The number of media items on a page
- * @param {int} searchFrom Id to search from
+ * @param {int} searchFrom NodeId to search from (-1 for root)
* @returns {Promise} resourcePromise object.
*
*/
diff --git a/src/Umbraco.Web.UI.Client/src/common/resources/member.resource.js b/src/Umbraco.Web.UI.Client/src/common/resources/member.resource.js
index 2073307db9..353fe12cb8 100644
--- a/src/Umbraco.Web.UI.Client/src/common/resources/member.resource.js
+++ b/src/Umbraco.Web.UI.Client/src/common/resources/member.resource.js
@@ -10,8 +10,8 @@ function memberResource($q, $http, umbDataFormatter, umbRequestHelper) {
return umbRequestHelper.postSaveContent({
restApiUrl: umbRequestHelper.getApiUrl(
- "memberApiBaseUrl",
- "PostSave"),
+ "memberApiBaseUrl",
+ "PostSave"),
content: content,
action: action,
files: files,
@@ -22,8 +22,7 @@ function memberResource($q, $http, umbDataFormatter, umbRequestHelper) {
}
return {
-
- getPagedResults: function (memberTypeAlias, options) {
+ getPagedResults: function(memberTypeAlias, options) {
if (memberTypeAlias === 'all-members') {
memberTypeAlias = null;
@@ -67,35 +66,35 @@ function memberResource($q, $http, umbDataFormatter, umbRequestHelper) {
}
var params = [
- { pageNumber: options.pageNumber },
- { pageSize: options.pageSize },
- { orderBy: options.orderBy },
- { orderDirection: options.orderDirection },
- { orderBySystemField: toBool(options.orderBySystemField) },
- { filter: options.filter }
+ { pageNumber: options.pageNumber },
+ { pageSize: options.pageSize },
+ { orderBy: options.orderBy },
+ { orderDirection: options.orderDirection },
+ { orderBySystemField: toBool(options.orderBySystemField) },
+ { filter: options.filter }
];
if (memberTypeAlias != null) {
params.push({ memberTypeAlias: memberTypeAlias });
}
return umbRequestHelper.resourcePromise(
- $http.get(
- umbRequestHelper.getApiUrl(
- "memberApiBaseUrl",
- "GetPagedResults",
- params)),
- 'Failed to retrieve member paged result');
+ $http.get(
+ umbRequestHelper.getApiUrl(
+ "memberApiBaseUrl",
+ "GetPagedResults",
+ params)),
+ 'Failed to retrieve member paged result');
},
- getListNode: function (listName) {
+ getListNode: function(listName) {
return umbRequestHelper.resourcePromise(
- $http.get(
- umbRequestHelper.getApiUrl(
- "memberApiBaseUrl",
- "GetListNodeDisplay",
- [{ listName: listName }])),
- 'Failed to retrieve data for member list ' + listName);
+ $http.get(
+ umbRequestHelper.getApiUrl(
+ "memberApiBaseUrl",
+ "GetListNodeDisplay",
+ [{ listName: listName }])),
+ 'Failed to retrieve data for member list ' + listName);
},
/**
@@ -119,15 +118,15 @@ function memberResource($q, $http, umbDataFormatter, umbRequestHelper) {
* @returns {Promise} resourcePromise object containing the member item.
*
*/
- getByKey: function (key) {
+ getByKey: function(key) {
return umbRequestHelper.resourcePromise(
- $http.get(
- umbRequestHelper.getApiUrl(
- "memberApiBaseUrl",
- "GetByKey",
- [{ key: key }])),
- 'Failed to retrieve data for member id ' + key);
+ $http.get(
+ umbRequestHelper.getApiUrl(
+ "memberApiBaseUrl",
+ "GetByKey",
+ [{ key: key }])),
+ 'Failed to retrieve data for member id ' + key);
},
/**
@@ -150,14 +149,14 @@ function memberResource($q, $http, umbDataFormatter, umbRequestHelper) {
* @returns {Promise} resourcePromise object.
*
*/
- deleteByKey: function (key) {
+ deleteByKey: function(key) {
return umbRequestHelper.resourcePromise(
- $http.post(
- umbRequestHelper.getApiUrl(
- "memberApiBaseUrl",
- "DeleteByKey",
- [{ key: key }])),
- 'Failed to delete item ' + key);
+ $http.post(
+ umbRequestHelper.getApiUrl(
+ "memberApiBaseUrl",
+ "DeleteByKey",
+ [{ key: key }])),
+ 'Failed to delete item ' + key);
},
/**
@@ -190,24 +189,24 @@ function memberResource($q, $http, umbDataFormatter, umbRequestHelper) {
* @returns {Promise} resourcePromise object containing the member scaffold.
*
*/
- getScaffold: function (alias) {
+ getScaffold: function(alias) {
if (alias) {
return umbRequestHelper.resourcePromise(
- $http.get(
- umbRequestHelper.getApiUrl(
- "memberApiBaseUrl",
- "GetEmpty",
- [{ contentTypeAlias: alias }])),
- 'Failed to retrieve data for empty member item type ' + alias);
+ $http.get(
+ umbRequestHelper.getApiUrl(
+ "memberApiBaseUrl",
+ "GetEmpty",
+ [{ contentTypeAlias: alias }])),
+ 'Failed to retrieve data for empty member item type ' + alias);
}
else {
return umbRequestHelper.resourcePromise(
- $http.get(
- umbRequestHelper.getApiUrl(
- "memberApiBaseUrl",
- "GetEmpty")),
- 'Failed to retrieve data for empty member item type ' + alias);
+ $http.get(
+ umbRequestHelper.getApiUrl(
+ "memberApiBaseUrl",
+ "GetEmpty")),
+ 'Failed to retrieve data for empty member item type ' + alias);
}
},
@@ -240,7 +239,7 @@ function memberResource($q, $http, umbDataFormatter, umbRequestHelper) {
* @returns {Promise} resourcePromise object containing the saved media item.
*
*/
- save: function (member, isNew, files) {
+ save: function(member, isNew, files) {
return saveMember(member, "save" + (isNew ? "New" : ""), files);
}
};
diff --git a/src/Umbraco.Web.UI.Client/src/common/resources/tour.resource.js b/src/Umbraco.Web.UI.Client/src/common/resources/tour.resource.js
new file mode 100644
index 0000000000..40baf0f389
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/common/resources/tour.resource.js
@@ -0,0 +1,35 @@
+/**
+ * @ngdoc service
+ * @name umbraco.resources.usersResource
+ * @function
+ *
+ * @description
+ * Used by the users section to get users and send requests to create, invite, delete, etc. users.
+ */
+(function () {
+ 'use strict';
+
+ function tourResource($http, umbRequestHelper, $q, umbDataFormatter) {
+
+ function getTours() {
+
+ return umbRequestHelper.resourcePromise(
+ $http.get(
+ umbRequestHelper.getApiUrl(
+ "tourApiBaseUrl",
+ "GetTours")),
+ 'Failed to get tours');
+ }
+
+
+ var resource = {
+ getTours: getTours
+ };
+
+ return resource;
+
+ }
+
+ angular.module('umbraco.resources').factory('tourResource', tourResource);
+
+})();
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/appstate.service.js b/src/Umbraco.Web.UI.Client/src/common/services/appstate.service.js
index e51310f584..2369af54b5 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/appstate.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/appstate.service.js
@@ -74,6 +74,15 @@ function appState(eventsService) {
showMenu: null
};
+ var drawerState = {
+ //this view to show
+ view: null,
+ // bind custom values to the drawer
+ model: null,
+ //Whether the drawer is being shown or not
+ showDrawer: null
+ };
+
/** function to validate and set the state on a state object */
function setState(stateObj, key, value, stateObjName) {
if (!_.has(stateObj, key)) {
@@ -212,6 +221,35 @@ function appState(eventsService) {
setState(menuState, key, value, "menuState");
},
+ /**
+ * @ngdoc function
+ * @name umbraco.services.angularHelper#getDrawerState
+ * @methodOf umbraco.services.appState
+ * @function
+ *
+ * @description
+ * Returns the current drawer state value by key - we do not return an object here - we do NOT want this
+ * to be publicly mutable and allow setting arbitrary values
+ *
+ */
+ getDrawerState: function (key) {
+ return getState(drawerState, key, "drawerState");
+ },
+
+ /**
+ * @ngdoc function
+ * @name umbraco.services.angularHelper#setDrawerState
+ * @methodOf umbraco.services.appState
+ * @function
+ *
+ * @description
+ * Sets a drawer state value by key
+ *
+ */
+ setDrawerState: function (key, value) {
+ setState(drawerState, key, value, "drawerState");
+ }
+
};
}
angular.module('umbraco.services').factory('appState', appState);
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/assets.service.js b/src/Umbraco.Web.UI.Client/src/common/services/assets.service.js
index a84be208ba..16330f5493 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/assets.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/assets.service.js
@@ -2,12 +2,12 @@
* @ngdoc service
* @name umbraco.services.assetsService
*
- * @requires $q
+ * @requires $q
* @requires angularHelper
- *
+ *
* @description
* Promise-based utillity service to lazy-load client-side dependencies inside angular controllers.
- *
+ *
* ##usage
* To use, simply inject the assetsService into any controller that needs it, and make
* sure the umbraco.services module is accesible - which it should be by default.
@@ -18,7 +18,7 @@
* //this code executes when the dependencies are done loading
* });
* });
- *
+ *
*
* You can also load individual files, which gives you greater control over what attibutes are passed to the file, as well as timeout
*
@@ -38,13 +38,14 @@
* //loadcss cannot determine when the css is done loading, so this will trigger instantly
* });
* });
- *
+ *
*/
angular.module('umbraco.services')
.factory('assetsService', function ($q, $log, angularHelper, umbRequestHelper, $rootScope, $http) {
var initAssetsLoaded = false;
- var appendRnd = function (url) {
+
+ function appendRnd (url) {
//if we don't have a global umbraco obj yet, the app is bootstrapping
if (!Umbraco.Sys.ServerVariables.application) {
return url;
@@ -77,7 +78,8 @@ angular.module('umbraco.services')
return this.loadedAssets[path];
}
},
- /**
+
+ /**
Internal method. This is called when the application is loading and the user is already authenticated, or once the user is authenticated.
There's a few assets the need to be loaded for the application to function but these assets require authentication to load.
*/
@@ -108,10 +110,10 @@ angular.module('umbraco.services')
*
* @description
* Injects a file as a stylesheet into the document head
- *
+ *
* @param {String} path path to the css file to load
* @param {Scope} scope optional scope to pass into the loader
- * @param {Object} keyvalue collection of attributes to pass to the stylesheet element
+ * @param {Object} keyvalue collection of attributes to pass to the stylesheet element
* @param {Number} timeout in milliseconds
* @returns {Promise} Promise object which resolves when the file has loaded
*/
@@ -149,10 +151,10 @@ angular.module('umbraco.services')
*
* @description
* Injects a file as a javascript into the document
- *
+ *
* @param {String} path path to the js file to load
* @param {Scope} scope optional scope to pass into the loader
- * @param {Object} keyvalue collection of attributes to pass to the script element
+ * @param {Object} keyvalue collection of attributes to pass to the script element
* @param {Number} timeout in milliseconds
* @returns {Promise} Promise object which resolves when the file has loaded
*/
@@ -192,8 +194,8 @@ angular.module('umbraco.services')
* @methodOf umbraco.services.assetsService
*
* @description
- * Injects a collection of files, this can be ONLY js files
- *
+ * Injects a collection of css and js files
+ *
*
* @param {Array} pathArray string array of paths to the files to load
* @param {Scope} scope optional scope to pass into the loader
@@ -206,61 +208,72 @@ angular.module('umbraco.services')
throw "pathArray must be an array";
}
+ // Check to see if there's anything to load, resolve promise if not
var nonEmpty = _.reject(pathArray, function (item) {
return item === undefined || item === "";
- });
+ });
-
- //don't load anything if there's nothing to load
- if (nonEmpty.length > 0) {
- var promises = [];
- var assets = [];
-
- //compile a list of promises
- //blocking
- _.each(nonEmpty, function (path) {
-
- path = convertVirtualPath(path);
-
- var asset = service._getAssetPromise(path);
- //if not previously loaded, add to list of promises
- if (asset.state !== "loaded") {
- if (asset.state === "new") {
- asset.state = "loading";
- assets.push(asset);
- }
-
- //we need to always push to the promises collection to monitor correct
- //execution
- promises.push(asset.deferred.promise);
- }
- });
-
-
- //gives a central monitoring of all assets to load
- promise = $q.all(promises);
-
- _.each(assets, function (asset) {
- LazyLoad.js(appendRnd(asset.path), function () {
- asset.state = "loaded";
- if (!scope) {
- asset.deferred.resolve(true);
- }
- else {
- angularHelper.safeApply(scope, function () {
- asset.deferred.resolve(true);
- });
- }
- });
- });
- }
- else {
- //return and resolve
+ if (nonEmpty.length === 0) {
var deferred = $q.defer();
promise = deferred.promise;
deferred.resolve(true);
+ return promise;
}
+ //compile a list of promises
+ //blocking
+ var promises = [];
+ var assets = [];
+ _.each(nonEmpty, function (path) {
+ path = convertVirtualPath(path);
+ var asset = service._getAssetPromise(path);
+ //if not previously loaded, add to list of promises
+ if (asset.state !== "loaded") {
+ if (asset.state === "new") {
+ asset.state = "loading";
+ assets.push(asset);
+ }
+
+ //we need to always push to the promises collection to monitor correct
+ //execution
+ promises.push(asset.deferred.promise);
+ }
+ });
+
+ //gives a central monitoring of all assets to load
+ promise = $q.all(promises);
+
+ // Split into css and js asset arrays, and use LazyLoad on each array
+ var cssAssets = _.filter(assets,
+ function (asset) {
+ return asset.path.match(/(\.css$|\.css\?)/ig);
+ });
+ var jsAssets = _.filter(assets,
+ function (asset) {
+ return asset.path.match(/(\.js$|\.js\?)/ig);
+ });
+
+ function assetLoaded(asset) {
+ asset.state = "loaded";
+ if (!scope) {
+ asset.deferred.resolve(true);
+ return;
+ }
+ angularHelper.safeApply(scope,
+ function () {
+ asset.deferred.resolve(true);
+ });
+ }
+
+ if (cssAssets.length > 0) {
+ var cssPaths = _.map(cssAssets, function (asset) { return appendRnd(asset.path) });
+ LazyLoad.css(cssPaths, function() { _.each(cssAssets, assetLoaded); });
+ }
+
+ if (jsAssets.length > 0) {
+ var jsPaths = _.map(jsAssets, function (asset) { return appendRnd(asset.path) });
+ LazyLoad.js(jsPaths, function () { _.each(jsAssets, assetLoaded); });
+ }
return promise;
}
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/backdrop.service.js b/src/Umbraco.Web.UI.Client/src/common/services/backdrop.service.js
new file mode 100644
index 0000000000..e463845a1c
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/common/services/backdrop.service.js
@@ -0,0 +1,106 @@
+/**
+ @ngdoc service
+ * @name umbraco.services.backdropService
+ *
+ * @description
+ *
Added in Umbraco 7.8. Application-wide service for handling backdrops.
+ *
+ */
+
+(function () {
+ "use strict";
+
+ function backdropService(eventsService) {
+
+ var args = {
+ opacity: null,
+ element: null,
+ elementPreventClick: false,
+ disableEventsOnClick: false,
+ show: false
+ };
+
+ /**
+ * @ngdoc method
+ * @name umbraco.services.backdropService#open
+ * @methodOf umbraco.services.backdropService
+ *
+ * @description
+ * Raises an event to open a backdrop
+ * @param {Object} options The backdrop options
+ * @param {Number} options.opacity Sets the opacity on the backdrop (default 0.4)
+ * @param {DomElement} options.element Highlights a DOM-element (HTML-selector)
+ * @param {Boolean} options.elementPreventClick Adds blocking element on top of highligted area to prevent all clicks
+ * @param {Boolean} options.disableEventsOnClick Disables all raised events when the backdrop is clicked
+ */
+ function open(options) {
+
+ if(options && options.element) {
+ args.element = options.element;
+ }
+
+ if(options && options.disableEventsOnClick) {
+ args.disableEventsOnClick = options.disableEventsOnClick;
+ }
+
+ args.show = true;
+
+ eventsService.emit("appState.backdrop", args);
+ }
+
+ /**
+ * @ngdoc method
+ * @name umbraco.services.backdropService#close
+ * @methodOf umbraco.services.backdropService
+ *
+ * @description
+ * Raises an event to close the backdrop
+ *
+ */
+ function close() {
+ args.element = null;
+ args.show = false;
+ eventsService.emit("appState.backdrop", args);
+ }
+
+ /**
+ * @ngdoc method
+ * @name umbraco.services.backdropService#setOpacity
+ * @methodOf umbraco.services.backdropService
+ *
+ * @description
+ * Raises an event which updates the opacity option on the backdrop
+ */
+ function setOpacity(opacity) {
+ args.opacity = opacity;
+ eventsService.emit("appState.backdrop", args);
+ }
+
+ /**
+ * @ngdoc method
+ * @name umbraco.services.backdropService#setHighlight
+ * @methodOf umbraco.services.backdropService
+ *
+ * @description
+ * Raises an event which updates the element option on the backdrop
+ */
+ function setHighlight(element, preventClick) {
+ args.element = element;
+ args.elementPreventClick = preventClick;
+ eventsService.emit("appState.backdrop", args);
+ }
+
+ var service = {
+ open: open,
+ close: close,
+ setOpacity: setOpacity,
+ setHighlight: setHighlight
+ };
+
+ return service;
+
+ }
+
+ angular.module("umbraco.services").factory("backdropService", backdropService);
+
+})();
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/contenteditinghelper.service.js b/src/Umbraco.Web.UI.Client/src/common/services/contenteditinghelper.service.js
index e439eda1ba..6aab9a655c 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/contenteditinghelper.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/contenteditinghelper.service.js
@@ -5,7 +5,7 @@
* @description A helper service for most editors, some methods are specific to content/media/member model types but most are used by
* all editors to share logic and reduce the amount of replicated code among editors.
**/
-function contentEditingHelper(fileManager, $q, $location, $routeParams, notificationsService, serverValidationManager, dialogService, formHelper, appState) {
+function contentEditingHelper(fileManager, $q, $location, $routeParams, notificationsService, localizationService, serverValidationManager, dialogService, formHelper, appState) {
function isValidIdentifier(id){
//empty id <= 0
@@ -28,7 +28,7 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica
return {
- /** Used by the content editor and mini content editor to perform saving operations */
+ /** Used by the content editor and mini content editor to perform saving operations */
//TODO: Make this a more helpful/reusable method for other form operations! we can simplify this form most forms
contentEditorPerformSave: function (args) {
if (!angular.isObject(args)) {
@@ -100,7 +100,35 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica
return deferred.promise;
},
+
+ /** Used by the content editor and media editor to add an info tab to the tabs array (normally known as the properties tab) */
+ addInfoTab: function (tabs) {
+ var infoTab = {
+ "alias": "_umb_infoTab",
+ "id": -1,
+ "label": "Info",
+ "properties": []
+ };
+
+ // first check if tab is already added
+ var foundInfoTab = false;
+
+ angular.forEach(tabs, function (tab) {
+ if (tab.id === infoTab.id && tab.alias === infoTab.alias) {
+ foundInfoTab = true;
+ }
+ });
+
+ // add info tab if is is not found
+ if (!foundInfoTab) {
+ localizationService.localize("general_info").then(function (value) {
+ infoTab.label = value;
+ tabs.push(infoTab);
+ });
+ }
+
+ },
/** Returns the action button definitions based on what permissions the user has.
The content.allowedActions parameter contains a list of chars, each represents a button by permission so
@@ -134,7 +162,8 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica
labelKey: "buttons_saveAndPublish",
handler: args.methods.saveAndPublish,
hotKey: "ctrl+p",
- hotKeyWhenHidden: true
+ hotKeyWhenHidden: true,
+ alias: "saveAndPublish"
};
case "H":
//send to publish
@@ -143,7 +172,8 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica
labelKey: "buttons_saveToPublish",
handler: args.methods.sendToPublish,
hotKey: "ctrl+p",
- hotKeyWhenHidden: true
+ hotKeyWhenHidden: true,
+ alias: "sendToPublish"
};
case "A":
//save
@@ -152,7 +182,8 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica
labelKey: "buttons_save",
handler: args.methods.save,
hotKey: "ctrl+s",
- hotKeyWhenHidden: true
+ hotKeyWhenHidden: true,
+ alias: "save"
};
case "Z":
//unpublish
@@ -161,7 +192,8 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica
labelKey: "content_unPublish",
handler: args.methods.unPublish,
hotKey: "ctrl+u",
- hotKeyWhenHidden: true
+ hotKeyWhenHidden: true,
+ alias: "unpublish"
};
default:
return null;
@@ -176,10 +208,10 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica
var buttonOrder = ["U", "H", "A"];
//Create the first button (primary button)
- //We cannot have the Save or SaveAndPublish buttons if they don't have create permissions when we are creating a new item.
- //Another tricky rule is if they only have Create + Browse permissions but not Save but if it's being created then they will
- // require the Save button in order to create.
- //So this code is going to create the primary button (either Publish, SendToPublish, Save) if we are not in create mode
+ //We cannot have the Save or SaveAndPublish buttons if they don't have create permissions when we are creating a new item.
+ //Another tricky rule is if they only have Create + Browse permissions but not Save but if it's being created then they will
+ // require the Save button in order to create.
+ //So this code is going to create the primary button (either Publish, SendToPublish, Save) if we are not in create mode
// or if the user has access to create.
if (!args.create || _.contains(args.content.allowedActions, "C")) {
for (var b in buttonOrder) {
@@ -187,9 +219,9 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica
buttons.defaultButton = createButtonDefinition(buttonOrder[b]);
break;
}
- }
- //Here's the special check, if the button still isn't set and we are creating and they have create access
- //we need to add the Save button
+ }
+ //Here's the special check, if the button still isn't set and we are creating and they have create access
+ //we need to add the Save button
if (!buttons.defaultButton && args.create && _.contains(args.content.allowedActions, "C")) {
buttons.defaultButton = createButtonDefinition("A");
}
@@ -220,6 +252,40 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica
}
}
+ // If we have a scheduled publish or unpublish date change the default button to
+ // "save" and update the label to "save and schedule
+ if(args.content.releaseDate || args.content.removeDate) {
+
+ // if save button is alread the default don't change it just update the label
+ if (buttons.defaultButton && buttons.defaultButton.letter === "A") {
+ buttons.defaultButton.labelKey = "buttons_saveAndSchedule";
+ return;
+ }
+
+ if(buttons.defaultButton && buttons.subButtons && buttons.subButtons.length > 0) {
+ // save a copy of the default so we can push it to the sub buttons later
+ var defaultButtonCopy = angular.copy(buttons.defaultButton);
+ var newSubButtons = [];
+
+ // if save button is not the default button - find it and make it the default
+ angular.forEach(buttons.subButtons, function (subButton) {
+
+ if (subButton.letter === "A") {
+ buttons.defaultButton = subButton;
+ buttons.defaultButton.labelKey = "buttons_saveAndSchedule";
+ } else {
+ newSubButtons.push(subButton);
+ }
+
+ });
+
+ // push old default button into subbuttons
+ newSubButtons.push(defaultButtonCopy);
+ buttons.subButtons = newSubButtons;
+ }
+
+ }
+
return buttons;
},
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/events.service.js b/src/Umbraco.Web.UI.Client/src/common/services/events.service.js
index 174cc8abe2..e28970336f 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/events.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/events.service.js
@@ -16,52 +16,16 @@ function eventsService($q, $rootScope) {
return {
- /** raise an event with a given name, returns an array of promises for each listener */
- emit: function (name, args) {
+ /** raise an event with a given name */
+ emit: function (name, args) {
//there are no listeners
if (!$rootScope.$$listeners[name]) {
return;
- //return [];
}
//send the event
$rootScope.$emit(name, args);
-
-
- //PP: I've commented out the below, since we currently dont
- // expose the eventsService as a documented api
- // and think we need to figure out our usecases for this
- // since the below modifies the return value of the then on() method
- /*
- //setup a deferred promise for each listener
- var deferred = [];
- for (var i = 0; i < $rootScope.$$listeners[name].length; i++) {
- deferred.push($q.defer());
- }*/
-
- //create a new event args object to pass to the
- // $emit containing methods that will allow listeners
- // to return data in an async if required
- /*
- var eventArgs = {
- args: args,
- reject: function (a) {
- deferred.pop().reject(a);
- },
- resolve: function (a) {
- deferred.pop().resolve(a);
- }
- };*/
-
-
-
- /*
- //return an array of promises
- var promises = _.map(deferred, function(p) {
- return p.promise;
- });
- return promises;*/
},
/** subscribe to a method, or use scope.$on = same thing */
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/help.service.js b/src/Umbraco.Web.UI.Client/src/common/services/help.service.js
index 6d7d341a57..77621eee9c 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/help.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/help.service.js
@@ -1,5 +1,5 @@
angular.module('umbraco.services')
- .factory('helpService', function ($http, $q){
+ .factory('helpService', function ($http, $q, umbRequestHelper) {
var helpTopics = {};
var defaultUrl = "http://our.umbraco.org/rss/help";
@@ -47,8 +47,6 @@ angular.module('umbraco.services')
return deferred.promise;
}
-
-
var service = {
findHelp: function (args) {
var url = service.getUrl(defaultUrl, args);
@@ -60,6 +58,26 @@ angular.module('umbraco.services')
return fetchUrl(url);
},
+ getContextHelpForPage: function (section, tree, baseurl) {
+
+ var qs = "?section=" + section + "&tree=" + tree;
+
+ if (tree) {
+ qs += "&tree=" + tree;
+ }
+
+ if (baseurl) {
+ qs += "&baseurl=" + encodeURIComponent(baseurl);
+ }
+
+ var url = umbRequestHelper.getApiUrl(
+ "helpApiBaseUrl",
+ "GetContextHelpForPage" + qs);
+
+ return umbRequestHelper.resourcePromise(
+ $http.get(url), "Failed to get lessons content");
+ },
+
getUrl: function(url, args){
return url + "?" + $.param(args);
}
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/history.service.js b/src/Umbraco.Web.UI.Client/src/common/services/history.service.js
index 75963112e5..ee02efc4a0 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/history.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/history.service.js
@@ -115,6 +115,27 @@ angular.module('umbraco.services')
*/
getCurrent: function(){
return nArray;
- }
+ },
+
+ /**
+ * @ngdoc method
+ * @name umbraco.services.historyService#getLastAccessedItemForSection
+ * @methodOf umbraco.services.historyService
+ *
+ * @description
+ * Method to return the item that was last accessed in the given section
+ *
+ * @param {string} sectionAlias Alias of the section to return the last accessed item for.
+ */
+ getLastAccessedItemForSection: function (sectionAlias) {
+ for (var i = 0, len = nArray.length; i < len; i++) {
+ var item = nArray[i];
+ if (item.link.indexOf(sectionAlias + "/") === 0) {
+ return item;
+ }
+ }
+
+ return null;
+ }
};
});
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/listviewhelper.service.js b/src/Umbraco.Web.UI.Client/src/common/services/listviewhelper.service.js
index 84bb4333a2..2ffdc3f1dd 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/listviewhelper.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/listviewhelper.service.js
@@ -269,7 +269,8 @@
var isSelected = false;
for (var i = 0; selection.length > i; i++) {
var selectedItem = selection[i];
- if (item.id === selectedItem.id || item.key === selectedItem.key) {
+ // if item.id is 2147483647 (int.MaxValue) use item.key
+ if ((item.id !== 2147483647 && item.id === selectedItem.id) || item.key === selectedItem.key) {
isSelected = true;
}
}
@@ -294,7 +295,8 @@
function deselectItem(item, selection) {
for (var i = 0; selection.length > i; i++) {
var selectedItem = selection[i];
- if (item.id === selectedItem.id) {
+ // if item.id is 2147483647 (int.MaxValue) use item.key
+ if ((item.id !== 2147483647 && item.id === selectedItem.id) || item.key === selectedItem.key) {
selection.splice(i, 1);
item.selected = false;
}
@@ -366,7 +368,7 @@
var item = items[i];
if (checkbox.checked) {
- selection.push({ id: item.id });
+ selection.push({ id: item.id, key: item.key });
} else {
clearSelection = true;
}
@@ -405,7 +407,8 @@
for (var selectedIndex = 0; selection.length > selectedIndex; selectedIndex++) {
var selectedItem = selection[selectedIndex];
- if (item.id === selectedItem.id) {
+ // if item.id is 2147483647 (int.MaxValue) use item.key
+ if ((item.id !== 2147483647 && item.id === selectedItem.id) || item.key === selectedItem.key) {
numberOfSelectedItem++;
}
}
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/menuactions.service.js b/src/Umbraco.Web.UI.Client/src/common/services/menuactions.service.js
index c7438a1c47..7200e1f6f8 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/menuactions.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/menuactions.service.js
@@ -8,9 +8,27 @@
* @description
* Defines the methods that are called when menu items declare only an action to execute
*/
-function umbracoMenuActions($q, treeService, $location, navigationService, appState, localizationService, userResource) {
+function umbracoMenuActions($q, treeService, $location, navigationService, appState, localizationService, userResource, umbRequestHelper, notificationsService) {
return {
+
+ "ExportMember": function(args) {
+ var url = umbRequestHelper.getApiUrl(
+ "memberApiBaseUrl",
+ "ExportMemberData",
+ [{ key: args.entity.id }]);
+
+ umbRequestHelper.downloadFile(url).then(function() {
+ localizationService.localize("speechBubbles_memberExportedSuccess").then(function (value) {
+ notificationsService.success(value);
+ })
+ }, function(data) {
+ localizationService.localize("speechBubbles_memberExportedError").then(function (value) {
+ notificationsService.error(value);
+ })
+ });
+
+ },
"DisableUser": function(args) {
localizationService.localize("defaultdialogs_confirmdisable").then(function (txtConfirmDisable) {
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/navigation.service.js b/src/Umbraco.Web.UI.Client/src/common/services/navigation.service.js
index 9687e5c40d..20e73f9e06 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/navigation.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/navigation.service.js
@@ -524,37 +524,6 @@ function navigationService($rootScope, $routeParams, $log, $location, $q, $timeo
return service.userDialog;
},
- /**
- * @ngdoc method
- * @name umbraco.services.navigationService#showUserDialog
- * @methodOf umbraco.services.navigationService
- *
- * @description
- * Opens the user dialog, next to the sections navigation
- * template is located in views/common/dialogs/user.html
- */
- showHelpDialog: function () {
- // hide tray and close user dialog
- service.hideTray();
- if (service.userDialog) {
- service.userDialog.close();
- }
-
- if(service.helpDialog){
- service.helpDialog.close();
- service.helpDialog = undefined;
- }
-
- service.helpDialog = dialogService.open(
- {
- template: "views/common/dialogs/help.html",
- modalClass: "umb-modal-left",
- show: true
- });
-
- return service.helpDialog;
- },
-
/**
* @ngdoc method
* @name umbraco.services.navigationService#showDialog
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/tour.service.js b/src/Umbraco.Web.UI.Client/src/common/services/tour.service.js
new file mode 100644
index 0000000000..28ac7f6485
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/common/services/tour.service.js
@@ -0,0 +1,281 @@
+/**
+ @ngdoc service
+ * @name umbraco.services.tourService
+ *
+ * @description
+ *
Added in Umbraco 7.8. Application-wide service for handling tours.
+ */
+(function () {
+ 'use strict';
+
+ function tourService(eventsService, currentUserResource, $q, tourResource) {
+
+ var tours = [];
+ var currentTour = null;
+
+ /**
+ * Registers all tours from the server and returns a promise
+ */
+ function registerAllTours() {
+ tours = [];
+ return tourResource.getTours().then(function(tourFiles) {
+ angular.forEach(tourFiles, function (tourFile) {
+ angular.forEach(tourFile.tours, function(newTour) {
+ validateTour(newTour);
+ validateTourRegistration(newTour);
+ tours.push(newTour);
+ });
+ });
+ eventsService.emit("appState.tour.updatedTours", tours);
+ });
+ }
+
+ /**
+ * Method to return all of the tours as a new instance
+ */
+ function getTours() {
+ return tours;
+ }
+
+ /**
+ * @ngdoc method
+ * @name umbraco.services.tourService#startTour
+ * @methodOf umbraco.services.tourService
+ *
+ * @description
+ * Raises an event to start a tour
+ * @param {Object} tour The tour which should be started
+ */
+ function startTour(tour) {
+ validateTour(tour);
+ eventsService.emit("appState.tour.start", tour);
+ currentTour = tour;
+ }
+
+ /**
+ * @ngdoc method
+ * @name umbraco.services.tourService#endTour
+ * @methodOf umbraco.services.tourService
+ *
+ * @description
+ * Raises an event to end the current tour
+ */
+ function endTour(tour) {
+ eventsService.emit("appState.tour.end", tour);
+ currentTour = null;
+ }
+
+ /**
+ * Disables a tour for the user, raises an event and returns a promise
+ * @param {any} tour
+ */
+ function disableTour(tour) {
+ var deferred = $q.defer();
+ tour.disabled = true;
+ currentUserResource
+ .saveTourStatus({ alias: tour.alias, disabled: tour.disabled, completed: tour.completed }).then(
+ function() {
+ eventsService.emit("appState.tour.end", tour);
+ currentTour = null;
+ deferred.resolve(tour);
+ });
+ return deferred.promise;
+ }
+
+ /**
+ * @ngdoc method
+ * @name umbraco.services.tourService#completeTour
+ * @methodOf umbraco.services.tourService
+ *
+ * @description
+ * Completes a tour for the user, raises an event and returns a promise
+ * @param {Object} tour The tour which should be completed
+ */
+ function completeTour(tour) {
+ var deferred = $q.defer();
+ tour.completed = true;
+ currentUserResource
+ .saveTourStatus({ alias: tour.alias, disabled: tour.disabled, completed: tour.completed }).then(
+ function() {
+ eventsService.emit("appState.tour.complete", tour);
+ currentTour = null;
+ deferred.resolve(tour);
+ });
+ return deferred.promise;
+ }
+
+ /**
+ * @ngdoc method
+ * @name umbraco.services.tourService#getCurrentTour
+ * @methodOf umbraco.services.tourService
+ *
+ * @description
+ * Returns the current tour
+ * @returns {Object} Returns the current tour
+ */
+ function getCurrentTour() {
+ //TODO: This should be reset if a new user logs in
+ return currentTour;
+ }
+
+ /**
+ * @ngdoc method
+ * @name umbraco.services.tourService#getGroupedTours
+ * @methodOf umbraco.services.tourService
+ *
+ * @description
+ * Returns a promise of grouped tours with the current user statuses
+ * @returns {Array} All registered tours grouped by tour group
+ */
+ function getGroupedTours() {
+ var deferred = $q.defer();
+ var tours = getTours();
+ setTourStatuses(tours).then(function() {
+ var groupedTours = [];
+ tours.forEach(function (item) {
+
+ var groupExists = false;
+ var newGroup = {
+ "group": "",
+ "tours": []
+ };
+
+ groupedTours.forEach(function(group){
+ // extend existing group if it is already added
+ if(group.group === item.group) {
+ if(item.groupOrder) {
+ group.groupOrder = item.groupOrder
+ }
+ groupExists = true;
+ group.tours.push(item)
+ }
+ });
+
+ // push new group to array if it doesn't exist
+ if(!groupExists) {
+ newGroup.group = item.group;
+ if(item.groupOrder) {
+ newGroup.groupOrder = item.groupOrder
+ }
+ newGroup.tours.push(item);
+ groupedTours.push(newGroup);
+ }
+
+ });
+
+ deferred.resolve(groupedTours);
+ });
+ return deferred.promise;
+ }
+
+ /**
+ * @ngdoc method
+ * @name umbraco.services.tourService#getTourByAlias
+ * @methodOf umbraco.services.tourService
+ *
+ * @description
+ * Returns a promise of the tour found by alias with the current user statuses
+ * @param {Object} tourAlias The tour alias of the tour which should be returned
+ * @returns {Object} Tour object
+ */
+ function getTourByAlias(tourAlias) {
+ var deferred = $q.defer();
+ var tours = getTours();
+ setTourStatuses(tours).then(function () {
+ var tour = _.findWhere(tours, { alias: tourAlias });
+ deferred.resolve(tour);
+ });
+ return deferred.promise;
+ }
+
+ ///////////
+
+ /**
+ * Validates a tour object and makes sure it consists of the correct properties needed to start a tour
+ * @param {any} tour
+ */
+ function validateTour(tour) {
+
+ if (!tour) {
+ throw "A tour is not specified";
+ }
+
+ if (!tour.alias) {
+ throw "A tour alias is required";
+ }
+
+ if (!tour.steps) {
+ throw "Tour " + tour.alias + " is missing tour steps";
+ }
+
+ if (tour.steps && tour.steps.length === 0) {
+ throw "Tour " + tour.alias + " is missing tour steps";
+ }
+
+ if (tour.requiredSections.length === 0) {
+ throw "Tour " + tour.alias + " is missing the required sections";
+ }
+ }
+
+ /**
+ * Validates a tour before it gets registered in the service
+ * @param {any} tour
+ */
+ function validateTourRegistration(tour) {
+ // check for existing tours with the same alias
+ angular.forEach(tours, function (existingTour) {
+ if (existingTour.alias === tour.alias) {
+ throw "A tour with the alias " + tour.alias + " is already registered";
+ }
+ });
+ }
+
+ /**
+ * Based on the tours given, this will set each of the tour statuses (disabled/completed) based on what is stored against the current user
+ * @param {any} tours
+ */
+ function setTourStatuses(tours) {
+
+ var deferred = $q.defer();
+ currentUserResource.getTours().then(function (storedTours) {
+
+ angular.forEach(storedTours, function (storedTour) {
+ if (storedTour.completed === true) {
+ angular.forEach(tours, function (tour) {
+ if (storedTour.alias === tour.alias) {
+ tour.completed = true;
+ }
+ });
+ }
+ if (storedTour.disabled === true) {
+ angular.forEach(tours, function (tour) {
+ if (storedTour.alias === tour.alias) {
+ tour.disabled = true;
+ }
+ });
+ }
+ });
+
+ deferred.resolve(tours);
+ });
+ return deferred.promise;
+ }
+
+ var service = {
+ registerAllTours: registerAllTours,
+ startTour: startTour,
+ endTour: endTour,
+ disableTour: disableTour,
+ completeTour: completeTour,
+ getCurrentTour: getCurrentTour,
+ getGroupedTours: getGroupedTours,
+ getTourByAlias: getTourByAlias
+ };
+
+ return service;
+
+ }
+
+ angular.module("umbraco.services").factory("tourService", tourService);
+
+})();
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/umbdataformatter.service.js b/src/Umbraco.Web.UI.Client/src/common/services/umbdataformatter.service.js
index 5fc2416927..78dec2f065 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/umbdataformatter.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/umbdataformatter.service.js
@@ -14,7 +14,7 @@
if (!model) {
return null;
}
- var trimmed = _.omit(model, ["confirm", "generatedPassword"])
+ var trimmed = _.omit(model, ["confirm", "generatedPassword"]);
//ensure that the pass value is null if all child properties are null
var allNull = true;
@@ -56,7 +56,7 @@
});
var saveProperties = _.map(realProperties, function (p) {
- var saveProperty = _.pick(p, 'id', 'alias', 'description', 'validation', 'label', 'sortOrder', 'dataTypeId', 'groupId', 'memberCanEdit', 'showOnMemberProfile');
+ var saveProperty = _.pick(p, 'id', 'alias', 'description', 'validation', 'label', 'sortOrder', 'dataTypeId', 'groupId', 'memberCanEdit', 'showOnMemberProfile', 'isSensitiveData');
return saveProperty;
});
@@ -242,8 +242,8 @@
var propGroups = _.find(genericTab.properties, function (item) {
return item.alias === "_umb_membergroup";
});
- saveModel.email = propEmail.value;
- saveModel.username = propLogin.value;
+ saveModel.email = propEmail.value.trim();
+ saveModel.username = propLogin.value.trim();
saveModel.password = this.formatChangePasswordModel(propPass.value);
@@ -267,10 +267,10 @@
// by looking at the key
switch (foundAlias[0]) {
case "umbracoMemberLockedOut":
- saveModel.isLockedOut = prop.value.toString() === "1" ? true : false;
+ saveModel.isLockedOut = prop.value ? (prop.value.toString() === "1" ? true : false) : false;
break;
case "umbracoMemberApproved":
- saveModel.isApproved = prop.value.toString() === "1" ? true : false;
+ saveModel.isApproved = prop.value ? (prop.value.toString() === "1" ? true : false) : true;
break;
case "umbracoMemberComments":
saveModel.comments = prop.value;
@@ -304,14 +304,14 @@
_.each(tab.properties, function (prop) {
//don't include the custom generic tab properties
- if (!prop.alias.startsWith("_umb_")) {
+ //don't include a property that is marked readonly
+ if (!prop.alias.startsWith("_umb_") && !prop.readonly) {
saveModel.properties.push({
id: prop.id,
alias: prop.alias,
value: prop.value
});
}
-
});
});
@@ -324,22 +324,13 @@
//this is basically the same as for media but we need to explicitly add some extra properties
var saveModel = this.formatMediaPostData(displayModel, action);
- var genericTab = _.find(displayModel.tabs, function (item) {
- return item.id === 0;
- });
-
- var propExpireDate = _.find(genericTab.properties, function (item) {
- return item.alias === "_umb_expiredate";
- });
- var propReleaseDate = _.find(genericTab.properties, function (item) {
- return item.alias === "_umb_releasedate";
- });
- var propTemplate = _.find(genericTab.properties, function (item) {
- return item.alias === "_umb_template";
- });
- saveModel.expireDate = propExpireDate ? propExpireDate.value : null;
- saveModel.releaseDate = propReleaseDate ? propReleaseDate.value : null;
- saveModel.templateAlias = propTemplate ? propTemplate.value : null;
+ var propExpireDate = displayModel.removeDate;
+ var propReleaseDate = displayModel.releaseDate;
+ var propTemplate = displayModel.template;
+
+ saveModel.expireDate = propExpireDate ? propExpireDate : null;
+ saveModel.releaseDate = propReleaseDate ? propReleaseDate : null;
+ saveModel.templateAlias = propTemplate ? propTemplate : null;
return saveModel;
}
@@ -347,4 +338,4 @@
}
angular.module('umbraco.services').factory('umbDataFormatter', umbDataFormatter);
-})();
\ No newline at end of file
+})();
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/umbrequesthelper.service.js b/src/Umbraco.Web.UI.Client/src/common/services/umbrequesthelper.service.js
index 3732e25403..d950d39619 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/umbrequesthelper.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/umbrequesthelper.service.js
@@ -230,10 +230,12 @@ function umbRequestHelper($http, $q, umbDataFormatter, angularHelper, dialogServ
//success callback
//reset the tabs and set the active one
- _.each(data.tabs, function (item) {
- item.active = false;
- });
- data.tabs[activeTabIndex].active = true;
+ if(data.tabs && data.tabs.length > 0) {
+ _.each(data.tabs, function (item) {
+ item.active = false;
+ });
+ data.tabs[activeTabIndex].active = true;
+ }
//the data returned is the up-to-date data so the UI will refresh
deferred.resolve(data);
@@ -331,6 +333,122 @@ function umbRequestHelper($http, $q, umbDataFormatter, angularHelper, dialogServ
failureCallback.apply(this, [data, status, headers, config]);
}
});
+ },
+
+ /**
+ * Downloads a file to the client using AJAX/XHR
+ * Based on an implementation here: web.student.tuwien.ac.at/~e0427417/jsdownload.html
+ * See https://stackoverflow.com/a/24129082/694494
+ */
+ downloadFile : function (httpPath) {
+
+ var deferred = $q.defer();
+
+ // Use an arraybuffer
+ $http.get(httpPath, { responseType: 'arraybuffer' })
+ .success(function (data, status, headers) {
+
+ var octetStreamMime = 'application/octet-stream';
+ var success = false;
+
+ // Get the headers
+ headers = headers();
+
+ // Get the filename from the x-filename header or default to "download.bin"
+ var filename = headers['x-filename'] || 'download.bin';
+
+ // Determine the content type from the header or default to "application/octet-stream"
+ var contentType = headers['content-type'] || octetStreamMime;
+
+ try {
+ // Try using msSaveBlob if supported
+ console.log("Trying saveBlob method ...");
+ var blob = new Blob([data], { type: contentType });
+ if (navigator.msSaveBlob)
+ navigator.msSaveBlob(blob, filename);
+ else {
+ // Try using other saveBlob implementations, if available
+ var saveBlob = navigator.webkitSaveBlob || navigator.mozSaveBlob || navigator.saveBlob;
+ if (saveBlob === undefined) throw "Not supported";
+ saveBlob(blob, filename);
+ }
+ console.log("saveBlob succeeded");
+ success = true;
+ } catch (ex) {
+ console.log("saveBlob method failed with the following exception:");
+ console.log(ex);
+ }
+
+ if (!success) {
+ // Get the blob url creator
+ var urlCreator = window.URL || window.webkitURL || window.mozURL || window.msURL;
+ if (urlCreator) {
+ // Try to use a download link
+ var link = document.createElement('a');
+ if ('download' in link) {
+ // Try to simulate a click
+ try {
+ // Prepare a blob URL
+ console.log("Trying download link method with simulated click ...");
+ var blob = new Blob([data], { type: contentType });
+ var url = urlCreator.createObjectURL(blob);
+ link.setAttribute('href', url);
+
+ // Set the download attribute (Supported in Chrome 14+ / Firefox 20+)
+ link.setAttribute("download", filename);
+
+ // Simulate clicking the download link
+ var event = document.createEvent('MouseEvents');
+ event.initMouseEvent('click', true, true, window, 1, 0, 0, 0, 0, false, false, false, false, 0, null);
+ link.dispatchEvent(event);
+ console.log("Download link method with simulated click succeeded");
+ success = true;
+
+ } catch (ex) {
+ console.log("Download link method with simulated click failed with the following exception:");
+ console.log(ex);
+ }
+ }
+
+ if (!success) {
+ // Fallback to window.location method
+ try {
+ // Prepare a blob URL
+ // Use application/octet-stream when using window.location to force download
+ console.log("Trying download link method with window.location ...");
+ var blob = new Blob([data], { type: octetStreamMime });
+ var url = urlCreator.createObjectURL(blob);
+ window.location = url;
+ console.log("Download link method with window.location succeeded");
+ success = true;
+ } catch (ex) {
+ console.log("Download link method with window.location failed with the following exception:");
+ console.log(ex);
+ }
+ }
+
+ }
+ }
+
+ if (!success) {
+ // Fallback to window.open method
+ console.log("No methods worked for saving the arraybuffer, using last resort window.open");
+ window.open(httpPath, '_blank', '');
+ }
+
+ deferred.resolve();
+ })
+ .error(function (data, status) {
+ console.log("Request failed with status: " + status);
+
+ deferred.reject({
+ errorMsg: "An error occurred downloading the file",
+ data: data,
+ status: status
+ });
+ });
+
+ return deferred.promise;
}
};
}
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/usershelper.service.js b/src/Umbraco.Web.UI.Client/src/common/services/usershelper.service.js
index 7d96e17d1f..3d6ad8b265 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/usershelper.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/usershelper.service.js
@@ -11,6 +11,18 @@
{ "value": 3, "name": "Invited", "key": "Invited", "color": "warning" }
];
+ angular.forEach(userStates, function (userState) {
+ var key = "user_state" + userState.key;
+ localizationService.localize(key).then(function (value) {
+ var reg = /^\[[\S\s]*]$/g;
+ var result = reg.test(value);
+ if (result === false) {
+ // Only translate if key exists
+ userState.name = value;
+ }
+ });
+ });
+
function getUserStateFromValue(value) {
var foundUserState;
angular.forEach(userStates, function (userState) {
diff --git a/src/Umbraco.Web.UI.Client/src/common/services/util.service.js b/src/Umbraco.Web.UI.Client/src/common/services/util.service.js
index 067ef60492..11444ff65b 100644
--- a/src/Umbraco.Web.UI.Client/src/common/services/util.service.js
+++ b/src/Umbraco.Web.UI.Client/src/common/services/util.service.js
@@ -1,420 +1,444 @@
/*Contains multiple services for various helper tasks */
function versionHelper() {
- return {
+ return {
- //see: https://gist.github.com/TheDistantSea/8021359
- versionCompare: function (v1, v2, options) {
- var lexicographical = options && options.lexicographical,
- zeroExtend = options && options.zeroExtend,
- v1parts = v1.split('.'),
- v2parts = v2.split('.');
+ //see: https://gist.github.com/TheDistantSea/8021359
+ versionCompare: function (v1, v2, options) {
+ var lexicographical = options && options.lexicographical,
+ zeroExtend = options && options.zeroExtend,
+ v1parts = v1.split('.'),
+ v2parts = v2.split('.');
- function isValidPart(x) {
- return (lexicographical ? /^\d+[A-Za-z]*$/ : /^\d+$/).test(x);
- }
+ function isValidPart(x) {
+ return (lexicographical ? /^\d+[A-Za-z]*$/ : /^\d+$/).test(x);
+ }
- if (!v1parts.every(isValidPart) || !v2parts.every(isValidPart)) {
- return NaN;
- }
+ if (!v1parts.every(isValidPart) || !v2parts.every(isValidPart)) {
+ return NaN;
+ }
- if (zeroExtend) {
- while (v1parts.length < v2parts.length) {
- v1parts.push("0");
+ if (zeroExtend) {
+ while (v1parts.length < v2parts.length) {
+ v1parts.push("0");
+ }
+ while (v2parts.length < v1parts.length) {
+ v2parts.push("0");
+ }
+ }
+
+ if (!lexicographical) {
+ v1parts = v1parts.map(Number);
+ v2parts = v2parts.map(Number);
+ }
+
+ for (var i = 0; i < v1parts.length; ++i) {
+ if (v2parts.length === i) {
+ return 1;
+ }
+
+ if (v1parts[i] === v2parts[i]) {
+ continue;
+ }
+ else if (v1parts[i] > v2parts[i]) {
+ return 1;
+ }
+ else {
+ return -1;
+ }
+ }
+
+ if (v1parts.length !== v2parts.length) {
+ return -1;
+ }
+
+ return 0;
}
- while (v2parts.length < v1parts.length) {
- v2parts.push("0");
- }
- }
-
- if (!lexicographical) {
- v1parts = v1parts.map(Number);
- v2parts = v2parts.map(Number);
- }
-
- for (var i = 0; i < v1parts.length; ++i) {
- if (v2parts.length === i) {
- return 1;
- }
-
- if (v1parts[i] === v2parts[i]) {
- continue;
- }
- else if (v1parts[i] > v2parts[i]) {
- return 1;
- }
- else {
- return -1;
- }
- }
-
- if (v1parts.length !== v2parts.length) {
- return -1;
- }
-
- return 0;
- }
- };
+ };
}
angular.module('umbraco.services').factory('versionHelper', versionHelper);
function dateHelper() {
- return {
+ return {
- convertToServerStringTime: function (momentLocal, serverOffsetMinutes, format) {
+ convertToServerStringTime: function (momentLocal, serverOffsetMinutes, format) {
- //get the formatted offset time in HH:mm (server time offset is in minutes)
- var formattedOffset = (serverOffsetMinutes > 0 ? "+" : "-") +
- moment()
- .startOf('day')
- .minutes(Math.abs(serverOffsetMinutes))
- .format('HH:mm');
+ //get the formatted offset time in HH:mm (server time offset is in minutes)
+ var formattedOffset = (serverOffsetMinutes > 0 ? "+" : "-") +
+ moment()
+ .startOf('day')
+ .minutes(Math.abs(serverOffsetMinutes))
+ .format('HH:mm');
- var server = moment.utc(momentLocal).utcOffset(formattedOffset);
- return server.format(format ? format : "YYYY-MM-DD HH:mm:ss");
- },
+ var server = moment.utc(momentLocal).utcOffset(formattedOffset);
+ return server.format(format ? format : "YYYY-MM-DD HH:mm:ss");
+ },
- convertToLocalMomentTime: function (strVal, serverOffsetMinutes) {
+ convertToLocalMomentTime: function (strVal, serverOffsetMinutes) {
- //get the formatted offset time in HH:mm (server time offset is in minutes)
- var formattedOffset = (serverOffsetMinutes > 0 ? "+" : "-") +
- moment()
- .startOf('day')
- .minutes(Math.abs(serverOffsetMinutes))
- .format('HH:mm');
+ //get the formatted offset time in HH:mm (server time offset is in minutes)
+ var formattedOffset = (serverOffsetMinutes > 0 ? "+" : "-") +
+ moment()
+ .startOf('day')
+ .minutes(Math.abs(serverOffsetMinutes))
+ .format('HH:mm');
- //convert to the iso string format
- var isoFormat = moment(strVal).format("YYYY-MM-DDTHH:mm:ss") + formattedOffset;
+ //if the string format already denotes that it's in "Roundtrip UTC" format (i.e. "2018-02-07T00:20:38.173Z")
+ //otherwise known as https://en.wikipedia.org/wiki/ISO_8601. This is the default format returned from the server
+ //since that is the default formatter for newtonsoft.json. When it is in this format, we need to tell moment
+ //to load the date as UTC so it's not changed, otherwise load it normally
+ var isoFormat;
+ if (strVal.indexOf("T") > -1 && strVal.endsWith("Z")) {
+ isoFormat = moment.utc(strVal).format("YYYY-MM-DDTHH:mm:ss") + formattedOffset;
+ }
+ else {
+ isoFormat = moment(strVal).format("YYYY-MM-DDTHH:mm:ss") + formattedOffset;
+ }
- //create a moment with the iso format which will include the offset with the correct time
- // then convert it to local time
- return moment.parseZone(isoFormat).local();
- }
+ //create a moment with the iso format which will include the offset with the correct time
+ // then convert it to local time
+ return moment.parseZone(isoFormat).local();
+ },
- };
+ getLocalDate: function (date, culture, format) {
+ if (date) {
+ var dateVal;
+ var serverOffset = Umbraco.Sys.ServerVariables.application.serverTimeOffset;
+ var localOffset = new Date().getTimezoneOffset();
+ var serverTimeNeedsOffsetting = -serverOffset !== localOffset;
+ if (serverTimeNeedsOffsetting) {
+ dateVal = this.convertToLocalMomentTime(date, serverOffset);
+ } else {
+ dateVal = moment(date, 'YYYY-MM-DD HH:mm:ss');
+ }
+ return dateVal.locale(culture).format(format);
+ }
+ }
+
+ };
}
angular.module('umbraco.services').factory('dateHelper', dateHelper);
function packageHelper(assetsService, treeService, eventsService, $templateCache) {
- return {
+ return {
- /** Called when a package is installed, this resets a bunch of data and ensures the new package assets are loaded in */
- packageInstalled: function () {
+ /** Called when a package is installed, this resets a bunch of data and ensures the new package assets are loaded in */
+ packageInstalled: function () {
- //clears the tree
- treeService.clearCache();
+ //clears the tree
+ treeService.clearCache();
- //clears the template cache
- $templateCache.removeAll();
+ //clears the template cache
+ $templateCache.removeAll();
- //emit event to notify anything else
- eventsService.emit("app.reInitialize");
- }
+ //emit event to notify anything else
+ eventsService.emit("app.reInitialize");
+ }
- };
+ };
}
angular.module('umbraco.services').factory('packageHelper', packageHelper);
//TODO: I believe this is obsolete
function umbPhotoFolderHelper($compile, $log, $timeout, $filter, imageHelper, mediaHelper, umbRequestHelper) {
- return {
- /** sets the image's url, thumbnail and if its a folder */
- setImageData: function (img) {
+ return {
+ /** sets the image's url, thumbnail and if its a folder */
+ setImageData: function (img) {
- img.isFolder = !mediaHelper.hasFilePropertyType(img);
+ img.isFolder = !mediaHelper.hasFilePropertyType(img);
- if (!img.isFolder) {
- img.thumbnail = mediaHelper.resolveFile(img, true);
- img.image = mediaHelper.resolveFile(img, false);
- }
- },
+ if (!img.isFolder) {
+ img.thumbnail = mediaHelper.resolveFile(img, true);
+ img.image = mediaHelper.resolveFile(img, false);
+ }
+ },
- /** sets the images original size properties - will check if it is a folder and if so will just make it square */
- setOriginalSize: function (img, maxHeight) {
- //set to a square by default
- img.originalWidth = maxHeight;
- img.originalHeight = maxHeight;
+ /** sets the images original size properties - will check if it is a folder and if so will just make it square */
+ setOriginalSize: function (img, maxHeight) {
+ //set to a square by default
+ img.originalWidth = maxHeight;
+ img.originalHeight = maxHeight;
- var widthProp = _.find(img.properties, function (v) { return (v.alias === "umbracoWidth"); });
- if (widthProp && widthProp.value) {
- img.originalWidth = parseInt(widthProp.value, 10);
- if (isNaN(img.originalWidth)) {
- img.originalWidth = maxHeight;
+ var widthProp = _.find(img.properties, function (v) { return (v.alias === "umbracoWidth"); });
+ if (widthProp && widthProp.value) {
+ img.originalWidth = parseInt(widthProp.value, 10);
+ if (isNaN(img.originalWidth)) {
+ img.originalWidth = maxHeight;
+ }
+ }
+ var heightProp = _.find(img.properties, function (v) { return (v.alias === "umbracoHeight"); });
+ if (heightProp && heightProp.value) {
+ img.originalHeight = parseInt(heightProp.value, 10);
+ if (isNaN(img.originalHeight)) {
+ img.originalHeight = maxHeight;
+ }
+ }
+ },
+
+ /** sets the image style which get's used in the angular markup */
+ setImageStyle: function (img, width, height, rightMargin, bottomMargin) {
+ img.style = { width: width + "px", height: height + "px", "margin-right": rightMargin + "px", "margin-bottom": bottomMargin + "px" };
+ img.thumbStyle = {
+ "background-image": "url('" + img.thumbnail + "')",
+ "background-repeat": "no-repeat",
+ "background-position": "center",
+ "background-size": Math.min(width, img.originalWidth) + "px " + Math.min(height, img.originalHeight) + "px"
+ };
+ },
+
+ /** gets the image's scaled wdith based on the max row height */
+ getScaledWidth: function (img, maxHeight) {
+ var scaled = img.originalWidth * maxHeight / img.originalHeight;
+ return scaled;
+ //round down, we don't want it too big even by half a pixel otherwise it'll drop to the next row
+ //return Math.floor(scaled);
+ },
+
+ /** returns the target row width taking into account how many images will be in the row and removing what the margin is */
+ getTargetWidth: function (imgsPerRow, maxRowWidth, margin) {
+ //take into account the margin, we will have 1 less margin item than we have total images
+ return (maxRowWidth - ((imgsPerRow - 1) * margin));
+ },
+
+ /**
+ This will determine the row/image height for the next collection of images which takes into account the
+ ideal image count per row. It will check if a row can be filled with this ideal count and if not - if there
+ are additional images available to fill the row it will keep calculating until they fit.
+
+ It will return the calculated height and the number of images for the row.
+
+ targetHeight = optional;
+ */
+ getRowHeightForImages: function (imgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow, margin, targetHeight) {
+
+ var idealImages = imgs.slice(0, idealImgPerRow);
+ //get the target row width without margin
+ var targetRowWidth = this.getTargetWidth(idealImages.length, maxRowWidth, margin);
+ //this gets the image with the smallest height which equals the maximum we can scale up for this image block
+ var maxScaleableHeight = this.getMaxScaleableHeight(idealImages, maxRowHeight);
+ //if the max scale height is smaller than the min display height, we'll use the min display height
+ targetHeight = targetHeight !== undefined ? targetHeight : Math.max(maxScaleableHeight, minDisplayHeight);
+
+ var attemptedRowHeight = this.performGetRowHeight(idealImages, targetRowWidth, minDisplayHeight, targetHeight);
+
+ if (attemptedRowHeight != null) {
+
+ //if this is smaller than the min display then we need to use the min display,
+ // which means we'll need to remove one from the row so we can scale up to fill the row
+ if (attemptedRowHeight < minDisplayHeight) {
+
+ if (idealImages.length > 1) {
+
+ //we'll generate a new targetHeight that is halfway between the max and the current and recurse, passing in a new targetHeight
+ targetHeight += Math.floor((maxRowHeight - targetHeight) / 2);
+ return this.getRowHeightForImages(imgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow - 1, margin, targetHeight);
+ }
+ else {
+ //this will occur when we only have one image remaining in the row but it's still going to be too wide even when
+ // using the minimum display height specified. In this case we're going to have to just crop the image in it's center
+ // using the minimum display height and the full row width
+ return { height: minDisplayHeight, imgCount: 1 };
+ }
+ }
+ else {
+ //success!
+ return { height: attemptedRowHeight, imgCount: idealImages.length };
+ }
+ }
+
+ //we know the width will fit in a row, but we now need to figure out if we can fill
+ // the entire row in the case that we have more images remaining than the idealImgPerRow.
+
+ if (idealImages.length === imgs.length) {
+ //we have no more remaining images to fill the space, so we'll just use the calc height
+ return { height: targetHeight, imgCount: idealImages.length };
+ }
+ else if (idealImages.length === 1) {
+ //this will occur when we only have one image remaining in the row to process but it's not really going to fit ideally
+ // in the row.
+ return { height: minDisplayHeight, imgCount: 1 };
+ }
+ else if (idealImages.length === idealImgPerRow && targetHeight < maxRowHeight) {
+
+ //if we're already dealing with the ideal images per row and it's not quite wide enough, we can scale up a little bit so
+ // long as the targetHeight is currently less than the maxRowHeight. The scale up will be half-way between our current
+ // target height and the maxRowHeight (we won't loop forever though - if there's a difference of 5 px we'll just quit)
+
+ while (targetHeight < maxRowHeight && (maxRowHeight - targetHeight) > 5) {
+ targetHeight += Math.floor((maxRowHeight - targetHeight) / 2);
+ attemptedRowHeight = this.performGetRowHeight(idealImages, targetRowWidth, minDisplayHeight, targetHeight);
+ if (attemptedRowHeight != null) {
+ //success!
+ return { height: attemptedRowHeight, imgCount: idealImages.length };
+ }
+ }
+
+ //Ok, we couldn't actually scale it up with the ideal row count we'll just recurse with a lesser image count.
+ return this.getRowHeightForImages(imgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow - 1, margin);
+ }
+ else if (targetHeight === maxRowHeight) {
+
+ //This is going to happen when:
+ // * We can fit a list of images in a row, but they come up too short (based on minDisplayHeight)
+ // * Then we'll try to remove an image, but when we try to scale to fit, the width comes up too narrow but the images are already at their
+ // maximum height (maxRowHeight)
+ // * So we're stuck, we cannot precicely fit the current list of images, so we'll render a row that will be max height but won't be wide enough
+ // which is better than rendering a row that is shorter than the minimum since that could be quite small.
+
+ return { height: targetHeight, imgCount: idealImages.length };
+ }
+ else {
+
+ //we have additional images so we'll recurse and add 1 to the idealImgPerRow until it fits
+ return this.getRowHeightForImages(imgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow + 1, margin);
+ }
+
+ },
+
+ performGetRowHeight: function (idealImages, targetRowWidth, minDisplayHeight, targetHeight) {
+
+ var currRowWidth = 0;
+
+ for (var i = 0; i < idealImages.length; i++) {
+ var scaledW = this.getScaledWidth(idealImages[i], targetHeight);
+ currRowWidth += scaledW;
+ }
+
+ if (currRowWidth > targetRowWidth) {
+ //get the new scaled height to fit
+ var newHeight = targetRowWidth * targetHeight / currRowWidth;
+
+ return newHeight;
+ }
+ else if (idealImages.length === 1 && (currRowWidth <= targetRowWidth) && !idealImages[0].isFolder) {
+ //if there is only one image, then return the target height
+ return targetHeight;
+ }
+ else if (currRowWidth / targetRowWidth > 0.90) {
+ //it's close enough, it's at least 90% of the width so we'll accept it with the target height
+ return targetHeight;
+ }
+ else {
+ //if it's not successful, return null
+ return null;
+ }
+ },
+
+ /** builds an image grid row */
+ buildRow: function (imgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow, margin, totalRemaining) {
+ var currRowWidth = 0;
+ var row = { images: [] };
+
+ var imageRowHeight = this.getRowHeightForImages(imgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow, margin);
+ var targetWidth = this.getTargetWidth(imageRowHeight.imgCount, maxRowWidth, margin);
+
+ var sizes = [];
+ //loop through the images we know fit into the height
+ for (var i = 0; i < imageRowHeight.imgCount; i++) {
+ //get the lower width to ensure it always fits
+ var scaledWidth = Math.floor(this.getScaledWidth(imgs[i], imageRowHeight.height));
+
+ if (currRowWidth + scaledWidth <= targetWidth) {
+ currRowWidth += scaledWidth;
+ sizes.push({
+ width: scaledWidth,
+ //ensure that the height is rounded
+ height: Math.round(imageRowHeight.height)
+ });
+ row.images.push(imgs[i]);
+ }
+ else if (imageRowHeight.imgCount === 1 && row.images.length === 0) {
+ //the image is simply too wide, we'll crop/center it
+ sizes.push({
+ width: maxRowWidth,
+ //ensure that the height is rounded
+ height: Math.round(imageRowHeight.height)
+ });
+ row.images.push(imgs[i]);
+ }
+ else {
+ //the max width has been reached
+ break;
+ }
+ }
+
+ //loop through the images for the row and apply the styles
+ for (var j = 0; j < row.images.length; j++) {
+ var bottomMargin = margin;
+ //make the margin 0 for the last one
+ if (j === (row.images.length - 1)) {
+ margin = 0;
+ }
+ this.setImageStyle(row.images[j], sizes[j].width, sizes[j].height, margin, bottomMargin);
+ }
+
+ if (row.images.length === 1 && totalRemaining > 1) {
+ //if there's only one image on the row and there are more images remaining, set the container to max width
+ row.images[0].style.width = maxRowWidth + "px";
+ }
+
+
+ return row;
+ },
+
+ /** Returns the maximum image scaling height for the current image collection */
+ getMaxScaleableHeight: function (imgs, maxRowHeight) {
+
+ var smallestHeight = _.min(imgs, function (item) { return item.originalHeight; }).originalHeight;
+
+ //adjust the smallestHeight if it is larger than the static max row height
+ if (smallestHeight > maxRowHeight) {
+ smallestHeight = maxRowHeight;
+ }
+ return smallestHeight;
+ },
+
+ /** Creates the image grid with calculated widths/heights for images to fill the grid nicely */
+ buildGrid: function (images, maxRowWidth, maxRowHeight, startingIndex, minDisplayHeight, idealImgPerRow, margin, imagesOnly) {
+
+ var rows = [];
+ var imagesProcessed = 0;
+
+ //first fill in all of the original image sizes and URLs
+ for (var i = startingIndex; i < images.length; i++) {
+ var item = images[i];
+
+ this.setImageData(item);
+ this.setOriginalSize(item, maxRowHeight);
+
+ if (imagesOnly && !item.isFolder && !item.thumbnail) {
+ images.splice(i, 1);
+ i--;
+ }
+ }
+
+ while ((imagesProcessed + startingIndex) < images.length) {
+ //get the maxHeight for the current un-processed images
+ var currImgs = images.slice(imagesProcessed);
+
+ //build the row
+ var remaining = images.length - imagesProcessed;
+ var row = this.buildRow(currImgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow, margin, remaining);
+ if (row.images.length > 0) {
+ rows.push(row);
+ imagesProcessed += row.images.length;
+ }
+ else {
+
+ if (currImgs.length > 0) {
+ throw "Could not fill grid with all images, images remaining: " + currImgs.length;
+ }
+
+ //if there was nothing processed, exit
+ break;
+ }
+ }
+
+ return rows;
}
- }
- var heightProp = _.find(img.properties, function (v) { return (v.alias === "umbracoHeight"); });
- if (heightProp && heightProp.value) {
- img.originalHeight = parseInt(heightProp.value, 10);
- if (isNaN(img.originalHeight)) {
- img.originalHeight = maxHeight;
- }
- }
- },
-
- /** sets the image style which get's used in the angular markup */
- setImageStyle: function (img, width, height, rightMargin, bottomMargin) {
- img.style = { width: width + "px", height: height + "px", "margin-right": rightMargin + "px", "margin-bottom": bottomMargin + "px" };
- img.thumbStyle = {
- "background-image": "url('" + img.thumbnail + "')",
- "background-repeat": "no-repeat",
- "background-position": "center",
- "background-size": Math.min(width, img.originalWidth) + "px " + Math.min(height, img.originalHeight) + "px"
- };
- },
-
- /** gets the image's scaled wdith based on the max row height */
- getScaledWidth: function (img, maxHeight) {
- var scaled = img.originalWidth * maxHeight / img.originalHeight;
- return scaled;
- //round down, we don't want it too big even by half a pixel otherwise it'll drop to the next row
- //return Math.floor(scaled);
- },
-
- /** returns the target row width taking into account how many images will be in the row and removing what the margin is */
- getTargetWidth: function (imgsPerRow, maxRowWidth, margin) {
- //take into account the margin, we will have 1 less margin item than we have total images
- return (maxRowWidth - ((imgsPerRow - 1) * margin));
- },
-
- /**
- This will determine the row/image height for the next collection of images which takes into account the
- ideal image count per row. It will check if a row can be filled with this ideal count and if not - if there
- are additional images available to fill the row it will keep calculating until they fit.
-
- It will return the calculated height and the number of images for the row.
-
- targetHeight = optional;
- */
- getRowHeightForImages: function (imgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow, margin, targetHeight) {
-
- var idealImages = imgs.slice(0, idealImgPerRow);
- //get the target row width without margin
- var targetRowWidth = this.getTargetWidth(idealImages.length, maxRowWidth, margin);
- //this gets the image with the smallest height which equals the maximum we can scale up for this image block
- var maxScaleableHeight = this.getMaxScaleableHeight(idealImages, maxRowHeight);
- //if the max scale height is smaller than the min display height, we'll use the min display height
- targetHeight = targetHeight !== undefined ? targetHeight : Math.max(maxScaleableHeight, minDisplayHeight);
-
- var attemptedRowHeight = this.performGetRowHeight(idealImages, targetRowWidth, minDisplayHeight, targetHeight);
-
- if (attemptedRowHeight != null) {
-
- //if this is smaller than the min display then we need to use the min display,
- // which means we'll need to remove one from the row so we can scale up to fill the row
- if (attemptedRowHeight < minDisplayHeight) {
-
- if (idealImages.length > 1) {
-
- //we'll generate a new targetHeight that is halfway between the max and the current and recurse, passing in a new targetHeight
- targetHeight += Math.floor((maxRowHeight - targetHeight) / 2);
- return this.getRowHeightForImages(imgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow - 1, margin, targetHeight);
- }
- else {
- //this will occur when we only have one image remaining in the row but it's still going to be too wide even when
- // using the minimum display height specified. In this case we're going to have to just crop the image in it's center
- // using the minimum display height and the full row width
- return { height: minDisplayHeight, imgCount: 1 };
- }
- }
- else {
- //success!
- return { height: attemptedRowHeight, imgCount: idealImages.length };
- }
- }
-
- //we know the width will fit in a row, but we now need to figure out if we can fill
- // the entire row in the case that we have more images remaining than the idealImgPerRow.
-
- if (idealImages.length === imgs.length) {
- //we have no more remaining images to fill the space, so we'll just use the calc height
- return { height: targetHeight, imgCount: idealImages.length };
- }
- else if (idealImages.length === 1) {
- //this will occur when we only have one image remaining in the row to process but it's not really going to fit ideally
- // in the row.
- return { height: minDisplayHeight, imgCount: 1 };
- }
- else if (idealImages.length === idealImgPerRow && targetHeight < maxRowHeight) {
-
- //if we're already dealing with the ideal images per row and it's not quite wide enough, we can scale up a little bit so
- // long as the targetHeight is currently less than the maxRowHeight. The scale up will be half-way between our current
- // target height and the maxRowHeight (we won't loop forever though - if there's a difference of 5 px we'll just quit)
-
- while (targetHeight < maxRowHeight && (maxRowHeight - targetHeight) > 5) {
- targetHeight += Math.floor((maxRowHeight - targetHeight) / 2);
- attemptedRowHeight = this.performGetRowHeight(idealImages, targetRowWidth, minDisplayHeight, targetHeight);
- if (attemptedRowHeight != null) {
- //success!
- return { height: attemptedRowHeight, imgCount: idealImages.length };
- }
- }
-
- //Ok, we couldn't actually scale it up with the ideal row count we'll just recurse with a lesser image count.
- return this.getRowHeightForImages(imgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow - 1, margin);
- }
- else if (targetHeight === maxRowHeight) {
-
- //This is going to happen when:
- // * We can fit a list of images in a row, but they come up too short (based on minDisplayHeight)
- // * Then we'll try to remove an image, but when we try to scale to fit, the width comes up too narrow but the images are already at their
- // maximum height (maxRowHeight)
- // * So we're stuck, we cannot precicely fit the current list of images, so we'll render a row that will be max height but won't be wide enough
- // which is better than rendering a row that is shorter than the minimum since that could be quite small.
-
- return { height: targetHeight, imgCount: idealImages.length };
- }
- else {
-
- //we have additional images so we'll recurse and add 1 to the idealImgPerRow until it fits
- return this.getRowHeightForImages(imgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow + 1, margin);
- }
-
- },
-
- performGetRowHeight: function (idealImages, targetRowWidth, minDisplayHeight, targetHeight) {
-
- var currRowWidth = 0;
-
- for (var i = 0; i < idealImages.length; i++) {
- var scaledW = this.getScaledWidth(idealImages[i], targetHeight);
- currRowWidth += scaledW;
- }
-
- if (currRowWidth > targetRowWidth) {
- //get the new scaled height to fit
- var newHeight = targetRowWidth * targetHeight / currRowWidth;
-
- return newHeight;
- }
- else if (idealImages.length === 1 && (currRowWidth <= targetRowWidth) && !idealImages[0].isFolder) {
- //if there is only one image, then return the target height
- return targetHeight;
- }
- else if (currRowWidth / targetRowWidth > 0.90) {
- //it's close enough, it's at least 90% of the width so we'll accept it with the target height
- return targetHeight;
- }
- else {
- //if it's not successful, return null
- return null;
- }
- },
-
- /** builds an image grid row */
- buildRow: function (imgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow, margin, totalRemaining) {
- var currRowWidth = 0;
- var row = { images: [] };
-
- var imageRowHeight = this.getRowHeightForImages(imgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow, margin);
- var targetWidth = this.getTargetWidth(imageRowHeight.imgCount, maxRowWidth, margin);
-
- var sizes = [];
- //loop through the images we know fit into the height
- for (var i = 0; i < imageRowHeight.imgCount; i++) {
- //get the lower width to ensure it always fits
- var scaledWidth = Math.floor(this.getScaledWidth(imgs[i], imageRowHeight.height));
-
- if (currRowWidth + scaledWidth <= targetWidth) {
- currRowWidth += scaledWidth;
- sizes.push({
- width: scaledWidth,
- //ensure that the height is rounded
- height: Math.round(imageRowHeight.height)
- });
- row.images.push(imgs[i]);
- }
- else if (imageRowHeight.imgCount === 1 && row.images.length === 0) {
- //the image is simply too wide, we'll crop/center it
- sizes.push({
- width: maxRowWidth,
- //ensure that the height is rounded
- height: Math.round(imageRowHeight.height)
- });
- row.images.push(imgs[i]);
- }
- else {
- //the max width has been reached
- break;
- }
- }
-
- //loop through the images for the row and apply the styles
- for (var j = 0; j < row.images.length; j++) {
- var bottomMargin = margin;
- //make the margin 0 for the last one
- if (j === (row.images.length - 1)) {
- margin = 0;
- }
- this.setImageStyle(row.images[j], sizes[j].width, sizes[j].height, margin, bottomMargin);
- }
-
- if (row.images.length === 1 && totalRemaining > 1) {
- //if there's only one image on the row and there are more images remaining, set the container to max width
- row.images[0].style.width = maxRowWidth + "px";
- }
-
-
- return row;
- },
-
- /** Returns the maximum image scaling height for the current image collection */
- getMaxScaleableHeight: function (imgs, maxRowHeight) {
-
- var smallestHeight = _.min(imgs, function (item) { return item.originalHeight; }).originalHeight;
-
- //adjust the smallestHeight if it is larger than the static max row height
- if (smallestHeight > maxRowHeight) {
- smallestHeight = maxRowHeight;
- }
- return smallestHeight;
- },
-
- /** Creates the image grid with calculated widths/heights for images to fill the grid nicely */
- buildGrid: function (images, maxRowWidth, maxRowHeight, startingIndex, minDisplayHeight, idealImgPerRow, margin, imagesOnly) {
-
- var rows = [];
- var imagesProcessed = 0;
-
- //first fill in all of the original image sizes and URLs
- for (var i = startingIndex; i < images.length; i++) {
- var item = images[i];
-
- this.setImageData(item);
- this.setOriginalSize(item, maxRowHeight);
-
- if (imagesOnly && !item.isFolder && !item.thumbnail) {
- images.splice(i, 1);
- i--;
- }
- }
-
- while ((imagesProcessed + startingIndex) < images.length) {
- //get the maxHeight for the current un-processed images
- var currImgs = images.slice(imagesProcessed);
-
- //build the row
- var remaining = images.length - imagesProcessed;
- var row = this.buildRow(currImgs, maxRowHeight, minDisplayHeight, maxRowWidth, idealImgPerRow, margin, remaining);
- if (row.images.length > 0) {
- rows.push(row);
- imagesProcessed += row.images.length;
- }
- else {
-
- if (currImgs.length > 0) {
- throw "Could not fill grid with all images, images remaining: " + currImgs.length;
- }
-
- //if there was nothing processed, exit
- break;
- }
- }
-
- return rows;
- }
- };
+ };
}
angular.module("umbraco.services").factory("umbPhotoFolderHelper", umbPhotoFolderHelper);
@@ -428,40 +452,40 @@ angular.module("umbraco.services").factory("umbPhotoFolderHelper", umbPhotoFolde
*/
function umbModelMapper() {
- return {
+ return {
- /**
- * @ngdoc function
- * @name umbraco.services.umbModelMapper#convertToEntityBasic
- * @methodOf umbraco.services.umbModelMapper
- * @function
- *
- * @description
- * Converts the source model to a basic entity model, it will throw an exception if there isn't enough data to create the model.
- * @param {Object} source The source model
- * @param {Number} source.id The node id of the model
- * @param {String} source.name The node name
- * @param {String} source.icon The models icon as a css class (.icon-doc)
- * @param {Number} source.parentId The parentID, if no parent, set to -1
- * @param {path} source.path comma-separated string of ancestor IDs (-1,1234,1782,1234)
- */
+ /**
+ * @ngdoc function
+ * @name umbraco.services.umbModelMapper#convertToEntityBasic
+ * @methodOf umbraco.services.umbModelMapper
+ * @function
+ *
+ * @description
+ * Converts the source model to a basic entity model, it will throw an exception if there isn't enough data to create the model.
+ * @param {Object} source The source model
+ * @param {Number} source.id The node id of the model
+ * @param {String} source.name The node name
+ * @param {String} source.icon The models icon as a css class (.icon-doc)
+ * @param {Number} source.parentId The parentID, if no parent, set to -1
+ * @param {path} source.path comma-separated string of ancestor IDs (-1,1234,1782,1234)
+ */
- /** This converts the source model to a basic entity model, it will throw an exception if there isn't enough data to create the model */
- convertToEntityBasic: function (source) {
- var required = ["id", "name", "icon", "parentId", "path"];
- _.each(required, function (k) {
- if (!_.has(source, k)) {
- throw "The source object does not contain the property " + k;
+ /** This converts the source model to a basic entity model, it will throw an exception if there isn't enough data to create the model */
+ convertToEntityBasic: function (source) {
+ var required = ["id", "name", "icon", "parentId", "path"];
+ _.each(required, function (k) {
+ if (!_.has(source, k)) {
+ throw "The source object does not contain the property " + k;
+ }
+ });
+ var optional = ["metaData", "key", "alias"];
+ //now get the basic object
+ var result = _.pick(source, required.concat(optional));
+ return result;
}
- });
- var optional = ["metaData", "key", "alias"];
- //now get the basic object
- var result = _.pick(source, required.concat(optional));
- return result;
- }
- };
+ };
}
angular.module('umbraco.services').factory('umbModelMapper', umbModelMapper);
@@ -476,21 +500,21 @@ angular.module('umbraco.services').factory('umbModelMapper', umbModelMapper);
*/
function umbSessionStorage($window) {
- //gets the sessionStorage object if available, otherwise just uses a normal object
- // - required for unit tests.
- var storage = $window['sessionStorage'] ? $window['sessionStorage'] : {};
+ //gets the sessionStorage object if available, otherwise just uses a normal object
+ // - required for unit tests.
+ var storage = $window['sessionStorage'] ? $window['sessionStorage'] : {};
- return {
+ return {
- get: function (key) {
- return angular.fromJson(storage["umb_" + key]);
- },
+ get: function (key) {
+ return angular.fromJson(storage["umb_" + key]);
+ },
- set: function (key, value) {
- storage["umb_" + key] = angular.toJson(value);
- }
+ set: function (key, value) {
+ storage["umb_" + key] = angular.toJson(value);
+ }
- };
+ };
}
angular.module('umbraco.services').factory('umbSessionStorage', umbSessionStorage);
@@ -503,28 +527,28 @@ angular.module('umbraco.services').factory('umbSessionStorage', umbSessionStorag
* used to check for updates and display a notifcation
*/
function updateChecker($http, umbRequestHelper) {
- return {
+ return {
- /**
- * @ngdoc function
- * @name umbraco.services.updateChecker#check
- * @methodOf umbraco.services.updateChecker
- * @function
- *
- * @description
- * Called to load in the legacy tree js which is required on startup if a user is logged in or
- * after login, but cannot be called until they are authenticated which is why it needs to be lazy loaded.
- */
- check: function () {
+ /**
+ * @ngdoc function
+ * @name umbraco.services.updateChecker#check
+ * @methodOf umbraco.services.updateChecker
+ * @function
+ *
+ * @description
+ * Called to load in the legacy tree js which is required on startup if a user is logged in or
+ * after login, but cannot be called until they are authenticated which is why it needs to be lazy loaded.
+ */
+ check: function () {
- return umbRequestHelper.resourcePromise(
- $http.get(
- umbRequestHelper.getApiUrl(
- "updateCheckApiBaseUrl",
- "GetCheck")),
- 'Failed to retrieve update status');
- }
- };
+ return umbRequestHelper.resourcePromise(
+ $http.get(
+ umbRequestHelper.getApiUrl(
+ "updateCheckApiBaseUrl",
+ "GetCheck")),
+ 'Failed to retrieve update status');
+ }
+ };
}
angular.module('umbraco.services').factory('updateChecker', updateChecker);
@@ -534,43 +558,43 @@ angular.module('umbraco.services').factory('updateChecker', updateChecker);
* @description A helper object used for property editors
**/
function umbPropEditorHelper() {
- return {
- /**
- * @ngdoc function
- * @name getImagePropertyValue
- * @methodOf umbraco.services.umbPropertyEditorHelper
- * @function
- *
- * @description
- * Returns the correct view path for a property editor, it will detect if it is a full virtual path but if not then default to the internal umbraco one
- *
- * @param {string} input the view path currently stored for the property editor
- */
- getViewPath: function (input, isPreValue) {
- var path = String(input);
+ return {
+ /**
+ * @ngdoc function
+ * @name getImagePropertyValue
+ * @methodOf umbraco.services.umbPropertyEditorHelper
+ * @function
+ *
+ * @description
+ * Returns the correct view path for a property editor, it will detect if it is a full virtual path but if not then default to the internal umbraco one
+ *
+ * @param {string} input the view path currently stored for the property editor
+ */
+ getViewPath: function (input, isPreValue) {
+ var path = String(input);
- if (path.startsWith('/')) {
+ if (path.startsWith('/')) {
- //This is an absolute path, so just leave it
- return path;
- } else {
+ //This is an absolute path, so just leave it
+ return path;
+ } else {
- if (path.indexOf("/") >= 0) {
- //This is a relative path, so just leave it
- return path;
- } else {
- if (!isPreValue) {
- //i.e. views/propertyeditors/fileupload/fileupload.html
- return "views/propertyeditors/" + path + "/" + path + ".html";
- } else {
- //i.e. views/prevalueeditors/requiredfield.html
- return "views/prevalueeditors/" + path + ".html";
- }
+ if (path.indexOf("/") >= 0) {
+ //This is a relative path, so just leave it
+ return path;
+ } else {
+ if (!isPreValue) {
+ //i.e. views/propertyeditors/fileupload/fileupload.html
+ return "views/propertyeditors/" + path + "/" + path + ".html";
+ } else {
+ //i.e. views/prevalueeditors/requiredfield.html
+ return "views/prevalueeditors/" + path + ".html";
+ }
+ }
+
+ }
}
-
- }
- }
- };
+ };
}
angular.module('umbraco.services').factory('umbPropEditorHelper', umbPropEditorHelper);
@@ -581,24 +605,24 @@ angular.module('umbraco.services').factory('umbPropEditorHelper', umbPropEditorH
**/
function queryStrings($window) {
- var pl = /\+/g; // Regex for replacing addition symbol with a space
- var search = /([^&=]+)=?([^&]*)/g;
- var decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); };
+ var pl = /\+/g; // Regex for replacing addition symbol with a space
+ var search = /([^&=]+)=?([^&]*)/g;
+ var decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); };
- return {
-
- getParams: function () {
- var match;
- var query = $window.location.search.substring(1);
+ return {
- var urlParams = {};
- while (match = search.exec(query)) {
- urlParams[decode(match[1])] = decode(match[2]);
- }
+ getParams: function () {
+ var match;
+ var query = $window.location.search.substring(1);
- return urlParams;
- }
- };
+ var urlParams = {};
+ while (match = search.exec(query)) {
+ urlParams[decode(match[1])] = decode(match[2]);
+ }
+
+ return urlParams;
+ }
+ };
}
angular.module('umbraco.services').factory('queryStrings', queryStrings);
diff --git a/src/Umbraco.Web.UI.Client/src/controllers/main.controller.js b/src/Umbraco.Web.UI.Client/src/controllers/main.controller.js
index dc39678a2f..b4536f0e35 100644
--- a/src/Umbraco.Web.UI.Client/src/controllers/main.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/controllers/main.controller.js
@@ -8,7 +8,7 @@
* The main application controller
*
*/
-function MainController($scope, $rootScope, $location, $routeParams, $timeout, $http, $log, appState, treeService, notificationsService, userService, navigationService, historyService, updateChecker, assetsService, eventsService, umbRequestHelper, tmhDynamicLocale, localStorageService) {
+function MainController($scope, $rootScope, $location, $routeParams, $timeout, $http, $log, appState, treeService, notificationsService, userService, navigationService, historyService, updateChecker, assetsService, eventsService, umbRequestHelper, tmhDynamicLocale, localStorageService, tourService) {
//the null is important because we do an explicit bool check on this in the view
//the avatar is by default the umbraco logo
@@ -136,6 +136,40 @@ function MainController($scope, $rootScope, $location, $routeParams, $timeout, $
};
}));
+ // manage the help dialog by subscribing to the showHelp appState
+ $scope.drawer = {};
+ evts.push(eventsService.on("appState.drawerState.changed", function (e, args) {
+ // set view
+ if (args.key === "view") {
+ $scope.drawer.view = args.value;
+ }
+ // set custom model
+ if (args.key === "model") {
+ $scope.drawer.model = args.value;
+ }
+ // show / hide drawer
+ if (args.key === "showDrawer") {
+ $scope.drawer.show = args.value;
+ }
+ }));
+
+ evts.push(eventsService.on("appState.tour.start", function (name, args) {
+ $scope.tour = args;
+ $scope.tour.show = true;
+ }));
+
+ evts.push(eventsService.on("appState.tour.end", function () {
+ $scope.tour = null;
+ }));
+
+ evts.push(eventsService.on("appState.tour.complete", function () {
+ $scope.tour = null;
+ }));
+
+ evts.push(eventsService.on("appState.backdrop", function (name, args) {
+ $scope.backdrop = args;
+ }));
+
//ensure to unregister from all events!
$scope.$on('$destroy', function () {
for (var e in evts) {
diff --git a/src/Umbraco.Web.UI.Client/src/controllers/search.controller.js b/src/Umbraco.Web.UI.Client/src/controllers/search.controller.js
index 57ddb6babd..fe1148d6a8 100644
--- a/src/Umbraco.Web.UI.Client/src/controllers/search.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/controllers/search.controller.js
@@ -14,7 +14,6 @@ function SearchController($scope, searchService, $log, $location, navigationServ
$scope.isSearching = false;
$scope.selectedResult = -1;
-
$scope.navigateResults = function (ev) {
//38: up 40: down, 13: enter
@@ -34,24 +33,37 @@ function SearchController($scope, searchService, $log, $location, navigationServ
}
};
-
var group = undefined;
+ var groupNames = [];
var groupIndex = -1;
var itemIndex = -1;
$scope.selectedItem = undefined;
-
+ $scope.clearSearch = function () {
+ $scope.searchTerm = null;
+ };
function iterateResults(up) {
//default group
if (!group) {
- group = $scope.groups[0];
+
+ for (var g in $scope.groups) {
+ if ($scope.groups.hasOwnProperty(g)) {
+ groupNames.push(g);
+
+ }
+ }
+
+ //Sorting to match the groups order
+ groupNames.sort();
+
+ group = $scope.groups[groupNames[0]];
groupIndex = 0;
}
if (up) {
if (itemIndex === 0) {
if (groupIndex === 0) {
- gotoGroup($scope.groups.length - 1, true);
+ gotoGroup(Object.keys($scope.groups).length - 1, true);
} else {
gotoGroup(groupIndex - 1, true);
}
@@ -62,7 +74,7 @@ function SearchController($scope, searchService, $log, $location, navigationServ
if (itemIndex < group.results.length - 1) {
gotoItem(itemIndex + 1);
} else {
- if (groupIndex === $scope.groups.length - 1) {
+ if (groupIndex === Object.keys($scope.groups).length - 1) {
gotoGroup(0);
} else {
gotoGroup(groupIndex + 1);
@@ -73,7 +85,7 @@ function SearchController($scope, searchService, $log, $location, navigationServ
function gotoGroup(index, up) {
groupIndex = index;
- group = $scope.groups[groupIndex];
+ group = $scope.groups[groupNames[groupIndex]];
if (up) {
gotoItem(group.results.length - 1);
@@ -95,6 +107,13 @@ function SearchController($scope, searchService, $log, $location, navigationServ
$scope.hasResults = false;
if ($scope.searchTerm) {
if (newVal !== null && newVal !== undefined && newVal !== oldVal) {
+
+ //Resetting for brand new search
+ group = undefined;
+ groupNames = [];
+ groupIndex = -1;
+ itemIndex = -1;
+
$scope.isSearching = true;
navigationService.showSearch();
$scope.selectedItem = undefined;
@@ -114,7 +133,7 @@ function SearchController($scope, searchService, $log, $location, navigationServ
var filtered = {};
_.each(result, function (value, key) {
if (value.results.length > 0) {
- filtered[key] = value;
+ filtered[key] = value;
}
});
$scope.groups = filtered;
diff --git a/src/Umbraco.Web.UI.Client/src/init.js b/src/Umbraco.Web.UI.Client/src/init.js
index 631e38657b..e86fa25c42 100644
--- a/src/Umbraco.Web.UI.Client/src/init.js
+++ b/src/Umbraco.Web.UI.Client/src/init.js
@@ -1,7 +1,7 @@
/** Executed when the application starts, binds to events and set global state */
-app.run(['userService', '$log', '$rootScope', '$location', 'queryStrings', 'navigationService', 'appState', 'editorState', 'fileManager', 'assetsService', 'eventsService', '$cookies', '$templateCache', 'localStorageService',
- function (userService, $log, $rootScope, $location, queryStrings, navigationService, appState, editorState, fileManager, assetsService, eventsService, $cookies, $templateCache, localStorageService) {
-
+app.run(['userService', '$log', '$rootScope', '$location', 'queryStrings', 'navigationService', 'appState', 'editorState', 'fileManager', 'assetsService', 'eventsService', '$cookies', '$templateCache', 'localStorageService', 'tourService', 'dashboardResource',
+ function (userService, $log, $rootScope, $location, queryStrings, navigationService, appState, editorState, fileManager, assetsService, eventsService, $cookies, $templateCache, localStorageService, tourService, dashboardResource) {
+
//This sets the default jquery ajax headers to include our csrf token, we
// need to user the beforeSend method because our token changes per user/login so
// it cannot be static
@@ -18,14 +18,34 @@ app.run(['userService', '$log', '$rootScope', '$location', 'queryStrings', 'navi
eventsService.on("app.authenticated", function(evt, data) {
assetsService._loadInitAssets().then(function() {
- appState.setGlobalState("isReady", true);
+
+ //Register all of the tours on the server
+ tourService.registerAllTours().then(function () {
+ appReady(data);
+
+ // Auto start intro tour
+ tourService.getTourByAlias("umbIntroIntroduction").then(function (introTour) {
+ // start intro tour if it hasn't been completed or disabled
+ if (introTour && introTour.disabled !== true && introTour.completed !== true) {
+ tourService.startTour(introTour);
+ }
+ });
+
+ }, function(){
+ appReady(data);
+ });
- //send the ready event with the included returnToPath,returnToSearch data
- eventsService.emit("app.ready", data);
- returnToPath = null, returnToSearch = null;
});
+
});
+ function appReady(data) {
+ appState.setGlobalState("isReady", true);
+ //send the ready event with the included returnToPath,returnToSearch data
+ eventsService.emit("app.ready", data);
+ returnToPath = null, returnToSearch = null;
+ }
+
/** execute code on each successful route */
$rootScope.$on('$routeChangeSuccess', function(event, current, previous) {
@@ -96,4 +116,5 @@ app.run(['userService', '$log', '$rootScope', '$location', 'queryStrings', 'navi
//var touchDevice = ("ontouchstart" in window || window.touch || window.navigator.msMaxTouchPoints === 5 || window.DocumentTouch && document instanceof DocumentTouch);
var touchDevice = /android|webos|iphone|ipad|ipod|blackberry|iemobile|touch/i.test(navigator.userAgent.toLowerCase());
appState.setGlobalState("touchDevice", touchDevice);
+
}]);
diff --git a/src/Umbraco.Web.UI.Client/src/installer/installer.service.js b/src/Umbraco.Web.UI.Client/src/installer/installer.service.js
index 54b4733529..7d586cae82 100644
--- a/src/Umbraco.Web.UI.Client/src/installer/installer.service.js
+++ b/src/Umbraco.Web.UI.Client/src/installer/installer.service.js
@@ -17,7 +17,7 @@ angular.module("umbraco.install").factory('installerService', function($rootScop
//add to umbraco installer facts here
var facts = ['Umbraco helped millions of people watch a man jump from the edge of space',
- 'Over 420 000 websites are currently powered by Umbraco',
+ 'Over 440 000 websites are currently powered by Umbraco',
"At least 2 people have named their cat 'Umbraco'",
'On an average day, more than 1000 people download Umbraco',
'
umbraco.tv is the premier source of Umbraco video tutorials to get you started',
@@ -31,10 +31,10 @@ angular.module("umbraco.install").factory('installerService', function($rootScop
"At least 4 people have the Umbraco logo tattooed on them",
"'Umbraco' is the danish name for an allen key",
"Umbraco has been around since 2005, that's a looong time in IT",
- "More than 550 people from all over the world meet each year in Denmark in June for our annual conference
CodeGarden",
+ "More than 600 people from all over the world meet each year in Denmark in June for our annual conference
CodeGarden",
"While you are installing Umbraco someone else on the other side of the planet is probably doing it too",
"You can extend Umbraco without modifying the source code using either JavaScript or C#",
- "Umbraco was installed in more than 165 countries in 2015"
+ "Umbraco has been installed in more than 198 countries"
];
/**
diff --git a/src/Umbraco.Web.UI.Client/src/installer/steps/user.controller.js b/src/Umbraco.Web.UI.Client/src/installer/steps/user.controller.js
index 297db6ac4a..10c0d596eb 100644
--- a/src/Umbraco.Web.UI.Client/src/installer/steps/user.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/installer/steps/user.controller.js
@@ -1,7 +1,7 @@
angular.module("umbraco.install").controller("Umbraco.Install.UserController", function($scope, installerService) {
$scope.passwordPattern = /.*/;
- $scope.installer.current.model.subscribeToNewsLetter = true;
+ $scope.installer.current.model.subscribeToNewsLetter = false;
if ($scope.installer.current.model.minNonAlphaNumericLength > 0) {
var exp = "";
diff --git a/src/Umbraco.Web.UI.Client/src/installer/steps/user.html b/src/Umbraco.Web.UI.Client/src/installer/steps/user.html
index 8c0989457d..8fbe4263e8 100644
--- a/src/Umbraco.Web.UI.Client/src/installer/steps/user.html
+++ b/src/Umbraco.Web.UI.Client/src/installer/steps/user.html
@@ -18,7 +18,7 @@
diff --git a/src/Umbraco.Web.UI.Client/src/less/application/grid.less b/src/Umbraco.Web.UI.Client/src/less/application/grid.less
index f6879bb679..2671adba32 100644
--- a/src/Umbraco.Web.UI.Client/src/less/application/grid.less
+++ b/src/Umbraco.Web.UI.Client/src/less/application/grid.less
@@ -40,11 +40,15 @@ body {
}
#mainwrapper {
- height: 100%;
- width: 100%;
+ position: absolute;
+ top: 0; left: 0; right: 0; bottom: 0;
margin: 0;
}
+body.umb-drawer-is-visible #mainwrapper{
+ left: @drawerWidth;
+}
+
#contentwrapper, #contentcolumn {
position: absolute;
top: 0px; bottom: 0px; right: 0px; left: 80px;
@@ -83,7 +87,8 @@ body {
top: 0;
bottom: 0;
position: absolute;
- text-align: center
+ text-align: center;
+ box-shadow: -10px 0px 25px rgba(0, 0, 0, 0.3)
}
#applications-tray {
diff --git a/src/Umbraco.Web.UI.Client/src/less/belle.less b/src/Umbraco.Web.UI.Client/src/less/belle.less
index 44365b95e7..d2a80d93aa 100644
--- a/src/Umbraco.Web.UI.Client/src/less/belle.less
+++ b/src/Umbraco.Web.UI.Client/src/less/belle.less
@@ -81,6 +81,10 @@
@import "forms/umb-validation-label.less";
// Umbraco Components
+@import "components/application/umb-tour.less";
+@import "components/application/umb-backdrop.less";
+@import "components/application/umb-drawer.less";
+
@import "components/editor.less";
@import "components/overlays.less";
@import "components/card.less";
@@ -125,6 +129,8 @@
@import "components/umb-checkmark.less";
@import "components/umb-list.less";
@import "components/umb-box.less";
+@import "components/umb-number-badge.less";
+@import "components/umb-progress-circle.less";
@import "components/buttons/umb-button.less";
@import "components/buttons/umb-button-group.less";
@@ -167,3 +173,6 @@
@import "hacks.less";
@import "healthcheck.less";
+
+// cleanup properties.less when it is done
+@import "properties.less";
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/less/buttons.less b/src/Umbraco.Web.UI.Client/src/less/buttons.less
index e76ffc682c..1eaf285119 100644
--- a/src/Umbraco.Web.UI.Client/src/less/buttons.less
+++ b/src/Umbraco.Web.UI.Client/src/less/buttons.less
@@ -261,6 +261,9 @@ input[type="submit"].btn {
*padding-top: 1px;
*padding-bottom: 1px;
}
+
+ // Safari defaults to 1px for input. Ref U4-7721.
+ margin: 0px;
}
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/application/umb-backdrop.less b/src/Umbraco.Web.UI.Client/src/less/components/application/umb-backdrop.less
new file mode 100644
index 0000000000..45e73df6da
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/less/components/application/umb-backdrop.less
@@ -0,0 +1,30 @@
+.umb-backdrop {
+ height: 100%;
+ width: 100%;
+ position: fixed;
+ z-index: 9999;
+ top: 0;
+ left: 0;
+ pointer-events: none;
+}
+
+.umb-backdrop__backdrop {
+ height: 100%;
+ width: 100%;
+}
+
+.umb-backdrop__rect {
+ position: absolute;
+ pointer-events: all;
+ margin: 0;
+ width: 100%;
+ height: 100%;
+ background: @black;
+ opacity: 0.4;
+ transition: 200ms opacity ease-in-out;
+}
+
+.umb-backdrop__highlight-prevent-click {
+ position: absolute;
+ pointer-events: all;
+}
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/application/umb-drawer.less b/src/Umbraco.Web.UI.Client/src/less/components/application/umb-drawer.less
new file mode 100644
index 0000000000..0fae291e72
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/less/components/application/umb-drawer.less
@@ -0,0 +1,194 @@
+.umb-drawer {
+ position: fixed;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ z-index: 10;
+ width: @drawerWidth;
+ box-shadow: 0 0 20px rgba(0,0,0,0.19), 0 0 6px rgba(0,0,0,0.23);
+ background: @gray-9;
+}
+
+.umb-drawer-view {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ overflow: hidden;
+}
+
+/* Header */
+
+.umb-drawer-header {
+ flex: 0 0 100px;
+ padding: 20px 30px;
+ box-sizing: border-box;
+}
+
+.umb-drawer-header__title {
+ font-size: @fontSizeLarge;
+ font-weight: bold;
+ margin-top: 7px;
+ margin-bottom: 7px;
+}
+
+.umb-drawer-header__subtitle {
+ font-size: @fontSizeSmall;
+}
+
+/* Content */
+
+.umb-drawer-content {
+ flex: 1 1 auto;
+ overflow-y: auto;
+ overflow-x: hidden;
+ padding: 0 30px 20px 30px;
+}
+
+/* Footer */
+.umb-drawer-footer {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 31px;
+ padding: 15px 30px;
+}
+
+/* Our badge - should be moved */
+
+.umb-help-badge {
+ padding: 10px 20px 10px 35px;
+ background: @white;
+ position: relative;
+ overflow: hidden;
+ border-radius: 3px;
+ display: block;
+}
+
+.umb-help-badge:hover,
+.umb-help-badge:active,
+.umb-help-badge:focus {
+ text-decoration: none;
+
+ .umb-help-badge__title {
+ text-decoration: underline !important;
+ }
+}
+
+.umb-help-badge__icon {
+ font-size: 40px;
+ transform: translate(0,-50%);
+ position: absolute;
+ left: -15px;
+ top: 50%;
+ color: @red-l3;
+}
+
+.umb-help-badge__title {
+ font-size: 15px;
+ font-weight: bold;
+ color: @black;
+}
+
+/* Help article */
+
+.umb-help-article {
+ background: @white;
+ padding: 20px;
+ line-height: 1.4em;
+}
+
+/* Make sure typography looks good */
+.umb-help-article h1,
+.umb-help-article h2,
+.umb-help-article h3,
+.umb-help-article h4 {
+ line-height: 1.3em;
+ font-weight: bold;
+}
+
+.umb-help-article h1 { font-size: 20px; }
+.umb-help-article h2 { font-size: 16px; margin-top: 20px; }
+.umb-help-article h3 { font-size: 15px; }
+.umb-help-article h4 { font-size: 14px; }
+
+.umb-help-article ol li,
+.umb-help-article ul li {
+ line-height: 1.4em;
+ margin-bottom: 8px;
+}
+
+.umb-help-article code {
+ white-space: pre-wrap;
+ word-break: break-word;
+}
+
+.umb-help-article-navigation {
+ margin-top: 25px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+}
+
+
+/* Help list */
+
+.umb-help-list {
+ list-style: none;
+ margin-left: 0;
+ margin-bottom: 0;
+ background: @white;
+ border-radius: 3px;
+}
+
+.umb-help-list:last-child {
+ border-bottom: none;
+}
+
+.umb-help-list-item {
+ margin-bottom: 1px;
+ border-radius: 0;
+ border-bottom: 1px solid @gray-9;
+}
+
+.umb-help-list-item > a,
+.umb-help-list-item__content {
+ display: flex;
+ align-items: center;
+ padding: 10px 20px;
+}
+
+.umb-help-list-item > a:hover,
+.umb-help-list-item > a:focus,
+.umb-help-list-item > a:active {
+ text-decoration: none;
+
+ .umb-help-list-item__title {
+ text-decoration: underline !important;
+ }
+}
+
+.umb-help-list-item__title {
+ font-size: 14px;
+ display: block;
+}
+
+.umb-help-list-item__description {
+ margin-top: 5px;
+ display: block;
+ font-size: 14px;
+}
+
+.umb-help-list-item__icon {
+ margin-right: 8px;
+ color: @gray-4;
+ font-size: 18px;
+}
+
+.umb-help-list-item__open-icon {
+ font-size: 14px;
+ color: @gray-6;
+ margin-left: auto;
+}
+
+.umb-help-list-item:hover .umb-help-list-item__group-title {
+ text-decoration: underline;
+}
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/application/umb-tour.less b/src/Umbraco.Web.UI.Client/src/less/components/application/umb-tour.less
new file mode 100644
index 0000000000..a97c700935
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/less/components/application/umb-tour.less
@@ -0,0 +1,102 @@
+.umb-tour__loader {
+ background: @white;
+ z-index: 10000;
+ position: fixed;
+ height: 5px;
+}
+
+.umb-tour__pulse {
+ position: fixed;
+ z-index: 10000;
+ display: none;
+ background: transparent;
+ box-shadow: 0 0 0 @green inset;
+ animation: pulse 2s infinite;
+ pointer-events: none;
+}
+
+@keyframes pulse {
+ 0% {
+ box-shadow: 0 0 0 0 @green inset;
+ }
+ 70% {
+ box-shadow: 0 0 0 5px fade(@green, 80%) inset;
+ }
+ 100% {
+ box-shadow: 0 0 0 0 @green inset;
+ }
+}
+
+.umb-tour__popover {
+ position: fixed;
+ background: @white;
+ border-radius: @baseBorderRadius;
+ z-index: 10000;
+ width: 320px;
+ max-width: 100%;
+ box-sizing: border-box;
+ padding: 15px;
+
+ h1, h2, h3, h4, h5 {
+ font-weight: bold;
+ color: @black;
+ }
+}
+
+.umb-tour__popover--l {
+ padding: 30px;
+ width: 500px;
+
+ .umb-tour-step__header {
+ margin-bottom: 30px;
+ margin-top: 10px;
+ }
+
+ .umb-tour-step__title {
+ font-size: 20px;
+ }
+
+ .umb-tour-step__content {
+ margin-bottom: 25px;
+ font-size: 15px;
+ }
+}
+
+.umb-tour-step__counter {
+ font-size: 13px;
+ color: @gray-5;
+}
+
+.umb-tour-step__close {
+ position: absolute;
+ top: 15px;
+ right: 15px;
+ font-size: 19px;
+ color: @gray-7;
+ cursor: pointer;
+}
+
+.umb-tour-step__close:hover,
+.umb-tour-step__close:active {
+ color: @gray-4;
+ text-decoration: none;
+}
+
+.umb-tour-step__header {
+ margin-bottom: 10px;
+ margin-top: 10px;
+}
+
+.umb-tour-step__title {
+ font-weight: bold;
+ color: @black;
+ font-size: 15px;
+ line-height: 1.3em;
+ width: calc(~"100% - 35px");
+}
+
+.umb-tour-step__content {
+ margin-bottom: 15px;
+ font-size: 14px;
+ line-height: 1.6em;
+}
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button-group.less b/src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button-group.less
index 1bd896022c..9762eaf058 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button-group.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button-group.less
@@ -1,6 +1,7 @@
.umb-button-group__toggle {
padding-left: 8px;
padding-right: 8px;
+ float: none;
}
.umb-button-group__sub-buttons.-align-right {
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button.less b/src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button.less
index 82e3afbb83..ab8b6b0671 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button.less
@@ -1,7 +1,6 @@
.umb-button {
position: relative;
- overflow: hidden;
- display: inline;
+ display: inline-block;
}
.umb-button__button:focus {
@@ -100,6 +99,11 @@
}
/* Sizes */
+.umb-button--xxs {
+ padding: 2px 10px;
+ font-size: 13px;
+}
+
.umb-button--xs {
padding: 5px 16px;
font-size: 14px;
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/overlays.less b/src/Umbraco.Web.UI.Client/src/less/components/overlays.less
index 68d3b20cab..0906b513a6 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/overlays.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/overlays.less
@@ -2,7 +2,7 @@
position: fixed;
overflow: hidden;
background: @white;
- z-index: 7500;
+ z-index: @zindexUmbOverlay;
animation: fadeIn 0.2s;
box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}
@@ -136,6 +136,11 @@
margin-left: 81px;
}
+// push left overlay when drawer is open
+.umb-drawer-is-visible .umb-overlay.umb-overlay-left {
+ left: @drawerWidth;
+}
+
.umb-overlay.umb-overlay-left .umb-overlay-header {
flex-basis: 100px;
padding: 20px;
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/overlays/umb-overlay-backdrop.less b/src/Umbraco.Web.UI.Client/src/less/components/overlays/umb-overlay-backdrop.less
index a05e9c8f95..65b3f34c2d 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/overlays/umb-overlay-backdrop.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/overlays/umb-overlay-backdrop.less
@@ -3,8 +3,12 @@
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, 0.50);
- z-index: 2000;
+ z-index: @zindexOverlayBackdrop;
top: 0;
left: 0;
animation: fadeIn 0.2s;
}
+
+.umb-drawer-is-visible .umb-overlay-backdrop {
+ left: @drawerWidth;
+}
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-avatar.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-avatar.less
index 2807c2d427..de746090b9 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-avatar.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-avatar.less
@@ -6,6 +6,7 @@
display: flex;
align-items: center;
justify-content: center;
+ margin: 0 auto;
color: @black;
font-weight: bold;
font-size: 16px;
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-badge.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-badge.less
index 522b7564c1..015aa607c9 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-badge.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-badge.less
@@ -17,11 +17,16 @@
border-color: @turquoise;
}
-.umb-badge--seconday {
+.umb-badge--secondary {
background-color: @purple-washed;
border-color: @purple;
}
+.umb-badge--gray {
+ background-color: @gray-10;
+ border-color: @gray-8;
+}
+
.umb-badge--danger {
background-color: @red-washed;
border-color: @red;
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-breadcrumbs.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-breadcrumbs.less
index d25744a108..47ed97fde2 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-breadcrumbs.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-breadcrumbs.less
@@ -35,3 +35,10 @@
margin-right: 5px;
color: @gray-7;
}
+
+input.umb-breadcrumbs__add-ancestor {
+ height: 25px;
+ margin-top: -2px;
+ margin-left: 3px;
+ width: 100px;
+}
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-editor-navigation.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-editor-navigation.less
index b9f2731e51..9c7eb7d7b2 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-editor-navigation.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-editor-navigation.less
@@ -6,9 +6,10 @@
.umb-sub-views-nav-item {
text-align: center;
- margin-left: 20px;
+ //margin-left: 20px;
cursor: pointer;
display: block;
+ padding: 5px 10px;
}
.umb-sub-views-nav-item:focus {
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-empty-state.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-empty-state.less
index a9ded358fa..9173344112 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-empty-state.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-empty-state.less
@@ -6,7 +6,7 @@
}
.umb-empty-state.-small {
- font-size: @fontSizeSmall;
+ font-size: 14px;
}
.umb-empty-state.-large {
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-grid.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-grid.less
index 3551d9d31a..5cc4817142 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-grid.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-grid.less
@@ -280,7 +280,6 @@
.umb-grid .umb-control {
position: relative;
display: block;
- overflow: hidden;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 10px;
@@ -535,7 +534,7 @@
color: @gray-3;
}
-.umb-grid .umb-cell-rte textarea {
+.umb-grid .umb-cell-rte textarea.mceNoEditor {
display: none !important;
}
@@ -636,9 +635,19 @@
clear: both;
}
-.umb-grid .mce-btn button {
- padding: 8px 6px;
- line-height: inherit;
+.umb-grid .mce-btn {
+ button {
+ padding-top: 8px;
+ padding-bottom: 8px;
+ padding-left: 6px;
+ line-height: inherit;
+ }
+
+ &:not(.mce-menubtn) {
+ button {
+ padding-right: 6px;
+ }
+ }
}
.umb-grid .mce-toolbar {
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less
index dfd2761643..eecbf51ec5 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less
@@ -11,7 +11,6 @@
margin: 50px 0 0 0;
border: 2px solid @gray-7;
border-radius: 0 10px 10px 10px;
- position: relative;
padding: 10px 10px 5px 10px;
box-sizing: border-box;
}
@@ -34,6 +33,7 @@
border: 1px dashed @gray-8;
color: @turquoise-d1;
font-weight: bold;
+ position: relative;
}
.umb-group-builder__group.-sortable {
@@ -67,16 +67,18 @@
}
.umb-group-builder__group-title-wrapper {
- position: absolute;
- left: -2px;
- top: -45px;
display: flex;
align-items: center;
+ margin-left: -12px;
+ margin-top: -55px;
}
.umb-group-builder__group-title-wrapper.-placeholder {
+ position: absolute;
left: -1px;
top: -44px;
+ margin-left: 0;
+ margin-top: 0;
}
.umb-group-builder__group-title {
@@ -424,103 +426,114 @@ input.umb-group-builder__group-title-input {
.content-type-editor-dialog.edit-property-settings {
- .validation-wrapper {
- position: relative;
- }
-
- .validation-label {
- position: absolute;
- top: 50%;
- right: 0;
- font-size: 12px;
- color: @red;
- transform: translate(0, -50%);
- }
-
- textarea.editor-label {
- border-color:transparent;
- box-shadow: none;
- width: 100%;
- box-sizing: border-box;
- margin-bottom: 0;
- font-size: 16px;
- font-weight: bold;
- resize: none;
- line-height: 1.5em;
- padding-left: 0;
- border: none;
- &:focus {
- outline: none;
- box-shadow: none !important;
+ .validation-wrapper {
+ position: relative;
}
- }
- .editor-placeholder {
- border: 1px dashed @gray-8;
- width: 100%;
- height: 80px;
- line-height: 80px;
- text-align: center;
- display: block;
- border-radius: 5px;
- color: @gray-3;
- font-weight: bold;
- font-size: 14px;
- color: @turquoise-d1;
- &:hover {
- text-decoration: none;
- }
- }
-
- .editor {
- margin-bottom: 10px;
- .editor-icon-wrapper {
- border: 1px solid @gray-8;
- width: 60px;
- height: 60px;
- text-align: center;
- line-height: 60px;
- border-radius: 5px;
- float: left;
- margin-right: 20px;
- .icon {
- font-size: 26px;
- }
- }
- .editor-details {
- float: left;
- margin-top: 10px;
- .editor-name {
- display: block;
- font-weight: bold;
- }
- .editor-editor {
- display: block;
+ .validation-label {
+ position: absolute;
+ top: 50%;
+ right: 0;
font-size: 12px;
- }
+ color: @red;
+ transform: translate(0, -50%);
}
- .editor-settings-icon {
- font-size: 18px;
- margin-top: 8px;
- }
- }
- .checkbox {
- margin-bottom: 20px;
- }
+ textarea.editor-label {
+ border-color: transparent;
+ box-shadow: none;
+ width: 100%;
+ box-sizing: border-box;
+ margin-bottom: 0;
+ font-size: 16px;
+ font-weight: bold;
+ resize: none;
+ line-height: 1.5em;
+ padding-left: 0;
+ border: none;
- .editor-description,
- .editor-validation-pattern {
- min-width: 100%;
- min-height: 25px;
- resize: none;
- box-sizing: border-box;
- border: none;
- overflow: hidden;
- }
+ &:focus {
+ outline: none;
+ box-shadow: none !important;
+ }
+ }
- .umb-dropdown {
- width: 100%;
- }
+ .editor-placeholder {
+ border: 1px dashed @gray-8;
+ width: 100%;
+ height: 80px;
+ line-height: 80px;
+ text-align: center;
+ display: block;
+ border-radius: 5px;
+ color: @gray-3;
+ font-weight: bold;
+ font-size: 14px;
+ color: @turquoise-d1;
+ &:hover {
+ text-decoration: none;
+ }
+ }
+
+ .editor {
+ margin-bottom: 10px;
+
+ .editor-icon-wrapper {
+ border: 1px solid @gray-8;
+ width: 60px;
+ height: 60px;
+ text-align: center;
+ line-height: 60px;
+ border-radius: 5px;
+ float: left;
+ margin-right: 20px;
+
+ .icon {
+ font-size: 26px;
+ }
+ }
+
+ .editor-details {
+ float: left;
+ margin-top: 10px;
+
+ .editor-name {
+ display: block;
+ font-weight: bold;
+ }
+
+ .editor-editor {
+ display: block;
+ font-size: 12px;
+ }
+ }
+
+ .editor-settings-icon {
+ font-size: 18px;
+ margin-top: 8px;
+ }
+ }
+
+ .checkbox {
+ margin-bottom: 20px;
+ }
+
+ .editor-description,
+ .editor-validation-pattern {
+ min-width: 100%;
+ min-height: 25px;
+ resize: none;
+ box-sizing: border-box;
+ border: none;
+ overflow: hidden;
+ }
+
+ .umb-dropdown {
+ width: 100%;
+ }
+
+ label.checkbox.no-indent {
+ width: 100%;
+ }
}
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-lightbox.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-lightbox.less
index 6fe68ff490..dca263ea0c 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-lightbox.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-lightbox.less
@@ -13,6 +13,11 @@
flex-direction: column;
}
+.umb-drawer-is-visible .umb-lightbox {
+ width: calc(~'100%' - ~'@{drawerWidth}');
+ left: @drawerWidth;
+}
+
.umb-lightbox__backdrop {
position: absolute;
top: 0;
@@ -40,16 +45,13 @@
.umb-lightbox__images {
position: relative;
z-index: 1000;
+ max-width: calc(~'100%' - 200px); // subtract the width of the two arrow buttons
}
.umb-lightbox__image {
background: @white;
border-radius: 3px;
padding: 10px;
- img {
- max-width: 80vw;
- max-height: 80vh;
- }
}
.umb-lightbox__control {
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-node-preview.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-node-preview.less
index 65d34ba693..9e038bd571 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-node-preview.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-node-preview.less
@@ -1,5 +1,5 @@
.umb-node-preview {
- padding: 7px 0;
+ padding: 5px 0;
display: flex;
max-width: 66.6%;
box-sizing: border-box;
@@ -8,7 +8,6 @@
.umb-node-preview:last-of-type {
border-bottom: none;
- margin-bottom: 7px;
}
.umb-node-preview--sortable {
@@ -37,6 +36,7 @@
.umb-node-preview__content {
flex: 1 1 auto;
margin-right: 25px;
+ overflow: hidden;
}
.umb-node-preview__name {
@@ -50,6 +50,13 @@
color: @gray-3;
}
+.umb-node-preview__name,
+.umb-node-preview__description {
+ /*text-overflow: ellipsis;
+ overflow: hidden;*/
+ word-wrap: break-word;
+}
+
.umb-node-preview__actions {
flex: 0 0 auto;
display: flex;
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-number-badge.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-number-badge.less
new file mode 100644
index 0000000000..3c2dbbdf20
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-number-badge.less
@@ -0,0 +1,39 @@
+.umb-number-badge {
+ border: 1px solid @gray-6;
+ width: 25px;
+ height: 25px;
+ border-radius: 50%;
+ box-sizing: border-box;
+ display: flex;
+ justify-content: center;
+ color: @black;
+ font-size: 15px;
+}
+
+.umb-number-badge--xs {
+ width: 20px;
+ height: 20px;
+ font-size: 13px;
+}
+
+.umb-number-badge--s {
+ width: 25px;
+ height: 25px;
+}
+
+.umb-number-badge--m {
+ width: 30px;
+ height: 30px;
+}
+
+.umb-number-badge--l {
+ width: 40px;
+ height: 40px;
+ font-size: 18px;
+}
+
+.umb-number-badge--xl {
+ width: 50px;
+ height: 50px;
+ font-size: 20px;
+}
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-progress-circle.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-progress-circle.less
new file mode 100644
index 0000000000..348d7bb5db
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-progress-circle.less
@@ -0,0 +1,49 @@
+.umb-progress-circle {
+ position: relative;
+}
+
+.umb-progress-circle__view-box {
+ position: absolute;
+ -webkit-transform: rotate(-90deg);
+ -moz-transform: rotate(-90deg);
+ -o-transform: rotate(-90deg);
+ -ms-transform: rotate(-90deg);
+ transform: rotate(-90deg);
+}
+
+// circle highlight on progressbar
+.umb-progress-circle__highlight {
+ stroke: @green;
+}
+
+.umb-progress-circle__highlight--primary {
+ stroke: @turquoise;
+}
+
+.umb-progress-circle__highlight--secondary {
+ stroke: @purple;
+}
+
+.umb-progress-circle__highlight--success {
+ stroke: @green;
+}
+
+.umb-progress-circle__highlight--warning {
+ stroke: @yellow;
+}
+
+.umb-progress-circle__highlight--danger {
+ stroke: @red;
+}
+
+// circle progressbar bg
+.umb-progress-circle__bg {
+ stroke: @gray-8;
+}
+
+// the text in the center
+.umb-progress-circle__percentage {
+ font-size: 16px;
+ font-weight: bold;
+ text-align: center;
+}
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/users/umb-user-cards.less b/src/Umbraco.Web.UI.Client/src/less/components/users/umb-user-cards.less
index 40a85bec71..e79e474935 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/users/umb-user-cards.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/users/umb-user-cards.less
@@ -11,6 +11,8 @@
flex: 0 0 100%;
max-width: 100%;
display: flex;
+ flex-wrap: wrap;
+ flex-direction: column;
}
.umb-user-card:hover,
diff --git a/src/Umbraco.Web.UI.Client/src/less/dashboards.less b/src/Umbraco.Web.UI.Client/src/less/dashboards.less
index 9d1f9cf39d..5fd0e25be1 100644
--- a/src/Umbraco.Web.UI.Client/src/less/dashboards.less
+++ b/src/Umbraco.Web.UI.Client/src/less/dashboards.less
@@ -5,21 +5,20 @@
top: -30px;
padding-top: 30px;
box-shadow: inset 0px -40px 30px 25px rgba(255,255,255,1);
- border-radius: 0px 0px 200px 200px;
- -moz-border-radius: 0px 0px 200px 200px;
+ -moz-border-radius: 0px 0px 200px 200px;
-webkit-border-radius: 0px 0px 200px 200px;
+ border-radius: 0px 0px 200px 200px;
small {
font-size: 14px;
opacity: .5;
}
- .umb-loader{
+ .umb-loader {
width: 640px;
height: 4px;
}
-
.video_player{
video {
width: 100%;
@@ -27,8 +26,8 @@
border: 1px solid @gray-9;
border-left: none;
border-bottom: none;
+ -moz-box-sizing:border-box;
box-sizing:border-box;
- -moz-box-sizing:border-box;
}
input[type="range"] {
@@ -67,8 +66,8 @@
.progress-bar {
display: block;
- box-sizing: border-box;
- -moz-box-sizing:border-box;
+ -moz-box-sizing:border-box;
+ box-sizing: border-box;
max-width: 100%;
width: 200px;
height: 100%;
@@ -112,26 +111,25 @@
line-height: 80px;
text-align: center;
position: relative;
+ display: flex;
+ justify-content: center;
- i, h3 {
+ .icon, h3 {
display: inline-block;
}
- i {
- position: absolute;
- top: 50%;
- margin-top: -40px;
+ .icon {
+ font-size: 80px;
}
h3 {
- margin: 0;
+ margin: 0 0 0 20px;
line-height: 80px;
font-weight: 700;
- margin-left: 100px;
font-size: 36px;
letter-spacing: -1px;
}
}
-}
+}
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/less/forms.less b/src/Umbraco.Web.UI.Client/src/less/forms.less
index b0557954e6..1a1f3bb93e 100644
--- a/src/Umbraco.Web.UI.Client/src/less/forms.less
+++ b/src/Umbraco.Web.UI.Client/src/less/forms.less
@@ -775,6 +775,8 @@ legend + .control-group {
*padding-left: @horizontalComponentOffset;
}
}
+
+
// Remove bottom margin on block level help text since that's accounted for on .control-group
.help-block {
margin-bottom: 0;
@@ -795,6 +797,14 @@ legend + .control-group {
padding-left: @horizontalComponentOffset;
}
}
+
+// adjustments for properties tab
+.form-horizontal .block-form .control-label {
+ display: block;
+ float: none;
+ width: 100%;
+}
+
//make sure buttons are always on top
.umb-panel-buttons .umb-btn-toolbar .btn {
position: relative;
diff --git a/src/Umbraco.Web.UI.Client/src/less/hacks.less b/src/Umbraco.Web.UI.Client/src/less/hacks.less
index ddba4387a3..29035213a2 100644
--- a/src/Umbraco.Web.UI.Client/src/less/hacks.less
+++ b/src/Umbraco.Web.UI.Client/src/less/hacks.less
@@ -193,8 +193,8 @@ pre {
display: block;
padding: (@baseLineHeight - 1) / 2;
margin: 0 0 @baseLineHeight / 2;
- #font > #family > .monospace;
- font-size: @baseFontSize - 1; // 14px to 13px
+ font-family: @sansFontFamily;
+ //font-size: @baseFontSize - 1; // 14px to 13px
color: @gray-2;
line-height: @baseLineHeight;
white-space: pre-line; // 1
diff --git a/src/Umbraco.Web.UI.Client/src/less/healthcheck.less b/src/Umbraco.Web.UI.Client/src/less/healthcheck.less
index 24660396d6..9a8c55d08b 100644
--- a/src/Umbraco.Web.UI.Client/src/less/healthcheck.less
+++ b/src/Umbraco.Web.UI.Client/src/less/healthcheck.less
@@ -29,12 +29,12 @@
padding: 15px 10px;
box-sizing: border-box;
text-align: center;
- border: 2px solid transparent;
+ border: 1px solid @gray-8;
height: 100%;
}
.umb-healthcheck-group:hover {
- border: 2px solid @turquoise;
+ border: 1px solid @turquoise;
cursor: pointer;
}
diff --git a/src/Umbraco.Web.UI.Client/src/less/main.less b/src/Umbraco.Web.UI.Client/src/less/main.less
index 699deb9b18..210af19355 100644
--- a/src/Umbraco.Web.UI.Client/src/less/main.less
+++ b/src/Umbraco.Web.UI.Client/src/less/main.less
@@ -131,7 +131,6 @@ h5.-black {
/* BLOCK MODE */
.block-form .umb-control-group {
border-bottom: none;
- margin-bottom: 10px !important;
padding-bottom: 0;
}
diff --git a/src/Umbraco.Web.UI.Client/src/less/modals.less b/src/Umbraco.Web.UI.Client/src/less/modals.less
index 702f80a67f..d4552c3ac5 100644
--- a/src/Umbraco.Web.UI.Client/src/less/modals.less
+++ b/src/Umbraco.Web.UI.Client/src/less/modals.less
@@ -181,7 +181,7 @@
width: 640px !important;
}
.umb-modal i {
- font-size: 14px;
+ font-size: 20px;
}
.umb-modal .breadcrumb {
background: none;
diff --git a/src/Umbraco.Web.UI.Client/src/less/navs.less b/src/Umbraco.Web.UI.Client/src/less/navs.less
index da0dfc0110..c6fd3dde01 100644
--- a/src/Umbraco.Web.UI.Client/src/less/navs.less
+++ b/src/Umbraco.Web.UI.Client/src/less/navs.less
@@ -249,6 +249,11 @@
border-radius: 0;
}
+// fix dropdown with checkbox + long text in label
+.dropdown-menu > li > .flex > label {
+ flex: 1 1 0;
+}
+
.dropdown-menu > li > a {
padding: 8px 20px;
}
diff --git a/src/Umbraco.Web.UI.Client/src/less/pages/login.less b/src/Umbraco.Web.UI.Client/src/less/pages/login.less
index 924f9b20bb..5443134dd2 100644
--- a/src/Umbraco.Web.UI.Client/src/less/pages/login.less
+++ b/src/Umbraco.Web.UI.Client/src/less/pages/login.less
@@ -66,7 +66,7 @@
margin-bottom: auto;
}
-.login-overlay .form input[type="text"],
+.login-overlay .form input[type="text"],
.login-overlay .form input[type="password"],
.login-overlay .form input[type="email"] {
height: 36px;
@@ -74,10 +74,6 @@
padding-right: 10px;
}
-.login-overlay .btn-success {
- padding: 12px 24px;
-}
-
.login-overlay .form label {
font-weight: bold;
}
@@ -114,8 +110,44 @@
line-height: 36px;
}
-.login-overlay .text-error,
-.login-overlay .text-info
+.login-overlay .text-error,
+.login-overlay .text-info
{
font-weight:bold;
-}
+}
+
+.password-toggle {
+ position: relative;
+ display: block;
+ user-select: none;
+
+ input::-ms-clear, input::-ms-reveal {
+ display: none;
+ }
+
+ a {
+ opacity: .5;
+ cursor: pointer;
+ display: inline-block;
+ position: absolute;
+ height: 1px;
+ width: 45px;
+ height: 75%;
+ font-size: 0;
+ background-repeat: no-repeat;
+ background-size: 50%;
+ background-position: center;
+ top: 0;
+ margin-left: -45px;
+ z-index: 1;
+ -webkit-tap-highlight-color: transparent;
+ }
+
+ [type="text"] + a {
+ background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath fill='%23444' d='M29.6.4C29 0 28 0 27.4.4L21 6.8c-1.4-.5-3-.8-5-.8C9 6 3 10 0 16c1.3 2.6 3 4.8 5.4 6.5l-5 5c-.5.5-.5 1.5 0 2 .3.4.7.5 1 .5s1 0 1.2-.4l27-27C30 2 30 1 29.6.4zM13 10c1.3 0 2.4 1 2.8 2L12 15.8c-1-.4-2-1.5-2-2.8 0-1.7 1.3-3 3-3zm-9.6 6c1.2-2 2.8-3.5 4.7-4.7l.7-.2c-.4 1-.6 2-.6 3 0 1.8.6 3.4 1.6 4.7l-2 2c-1.6-1.2-3-2.7-4-4.4zM24 13.8c0-.8 0-1.7-.4-2.4l-10 10c.7.3 1.6.4 2.4.4 4.4 0 8-3.6 8-8z'/%3E%3Cpath fill='%23444' d='M26 9l-2.2 2.2c2 1.3 3.6 3 4.8 4.8-1.2 2-2.8 3.5-4.7 4.7-2.7 1.5-5.4 2.3-8 2.3-1.4 0-2.6 0-3.8-.4L10 25c2 .6 4 1 6 1 7 0 13-4 16-10-1.4-2.8-3.5-5.2-6-7z'/%3E%3C/svg%3E");
+ }
+
+ [type="password"] + a {
+ background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath fill='%23444' d='M16 6C9 6 3 10 0 16c3 6 9 10 16 10s13-4 16-10c-3-6-9-10-16-10zm8 5.3c1.8 1.2 3.4 2.8 4.6 4.7-1.2 2-2.8 3.5-4.7 4.7-3 1.5-6 2.3-8 2.3s-6-.8-8-2.3C6 19.5 4 18 3 16c1.5-2 3-3.5 5-4.7l.6-.2C8 12 8 13 8 14c0 4.5 3.5 8 8 8s8-3.5 8-8c0-1-.3-2-.6-2.6l.4.3zM16 13c0 1.7-1.3 3-3 3s-3-1.3-3-3 1.3-3 3-3 3 1.3 3 3z'/%3E%3C/svg%3E");
+ }
+}
diff --git a/src/Umbraco.Web.UI.Client/src/less/properties.less b/src/Umbraco.Web.UI.Client/src/less/properties.less
new file mode 100644
index 0000000000..57edbd7266
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/less/properties.less
@@ -0,0 +1,114 @@
+//----- SCHEDULED PUBLISH ------
+
+.place-holder {
+ height: 60px;
+ width: 60px;
+ margin: 15px auto;
+ background-color: @gray-8;
+}
+
+.date-wrapper {
+ display: flex;
+ justify-content: space-around;
+ flex-direction: row;
+}
+
+.date-container {
+ text-align: center;
+}
+
+.date-wrapper__number{
+ font-size: 40px;
+ line-height: 50px;
+ color: @gray-2;
+ font-weight: 900;
+}
+
+.date-container__title {
+ font-size: 16px;
+ font-weight: bold;
+ color: @gray-3;
+ margin-bottom: 5px;
+}
+
+.date-container__date {
+ padding: 0 10px;
+}
+.date-container__date:hover {
+ background-color: @gray-10;
+ cursor: pointer;
+}
+
+.date-wrapper__date{
+ font-size: 13px;
+ color: @gray-6;
+ margin: 0;
+}
+
+.data-wrapper__add{
+ font-size: 18px;
+ line-height: 10px;
+ color: @gray-8;
+ font-weight: 900;
+ margin: 0;
+}
+
+.date-separate {
+ width: 1px;
+ background-color: @gray-8;
+}
+
+//------------------- HISTORY ------------------
+
+.history {
+ position: relative;
+}
+
+.history-line {
+ width: 2px;
+ height: 100%;
+ margin: 0 0 0 14px;
+ background-color: @gray-8;
+ position: absolute;
+ z-index: 0;
+}
+
+.history-item {
+ display: flex;
+ align-items: center;
+ margin-bottom: 24px;
+ position: relative;
+ z-index: 1;
+}
+
+.history-item__avatar {
+ margin-right: 7px;
+}
+
+.history-item__date {
+ font-size: 13px;
+ color: @gray-5;
+}
+
+.history-item__break {
+ display: flex;
+ align-items: center;
+ min-width: 230px;
+ font-size: 14px;
+}
+
+/* RESPONSIVE */
+@media (min-width: 1101px) and (max-width: 1365px), (max-width: 979px) {
+
+ .history-item {
+ display: block;
+ }
+
+ .history-item__break {
+ padding: 7px 0;
+ }
+
+ .history-line {
+ display: none;
+ }
+}
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/less/property-editors.less b/src/Umbraco.Web.UI.Client/src/less/property-editors.less
index 2388aae2b2..2d317fa4a0 100644
--- a/src/Umbraco.Web.UI.Client/src/less/property-editors.less
+++ b/src/Umbraco.Web.UI.Client/src/less/property-editors.less
@@ -40,6 +40,16 @@
padding: 10px;
}
+.umb-contentpicker__min-max-help {
+ font-size: 13px;
+ margin-top: 5px;
+ color: @gray-4;
+}
+
+.show-validation .umb-contentpicker__min-max-help {
+ display: none;
+}
+
.umb-contentpicker small {
&:not(:last-child) {
@@ -109,16 +119,48 @@ ul.color-picker li a {
}
/* pre-value editor */
+/*.control-group.color-picker-preval:before {
+ content: "";
+ display: inline-block;
+ vertical-align: middle;
+ height: 100%;
+}*/
+
+/*.control-group.color-picker-preval div.thumbnail {
+ display: inline-block;
+ vertical-align: middle;
+}*/
+.control-group.color-picker-preval div.color-picker-prediv {
+ display: inline-block;
+ width: 60%;
+}
.control-group.color-picker-preval pre {
display: inline;
margin-right: 20px;
margin-left: 10px;
+ width: 50%;
+ white-space: nowrap;
+ overflow: hidden;
+ margin-bottom: 0;
+ vertical-align: middle;
+}
+
+.control-group.color-picker-preval btn {
+ //vertical-align: middle;
+}
+
+.control-group.color-picker-preval input[type="text"] {
+ min-width: 40%;
+ width: 40%;
+ display: inline-block;
+ margin-right: 20px;
+ margin-top: 1px;
}
.control-group.color-picker-preval label {
- border:solid @white 1px;
- padding:6px;
+ border: solid @white 1px;
+ padding: 6px;
}
@@ -126,21 +168,21 @@ ul.color-picker li a {
// Media picker
// --------------------------------------------------
.umb-mediapicker .add-link {
- display: inline-block;
- height: 120px;
- width: 120px;
- text-align: center;
- color: @gray-8;
- border: 2px @gray-8 dashed;
- line-height: 120px;
- text-decoration: none;
+ display: flex;
+ justify-content:center;
+ align-items:center;
+ width: 120px;
+ text-align: center;
+ color: @gray-8;
+ border: 2px @gray-8 dashed;
+ text-decoration: none;
- transition: all 150ms ease-in-out;
+ transition: all 150ms ease-in-out;
- &:hover {
- color: @turquoise-d1;
- border-color: @turquoise;
- }
+ &:hover {
+ color: @turquoise-d1;
+ border-color: @turquoise;
+ }
}
.umb-mediapicker .picked-image {
@@ -165,13 +207,29 @@ ul.color-picker li a {
text-decoration: none;
}
-
-
-.umb-thumbnails{
- position: relative;
+.umb-mediapicker .add-link-square {
+ height: 120px;
}
+
+.umb-thumbnails {
+ position: relative;
+ display: flex;
+ -ms-flex-direction: row;
+ -webkit-flex-direction: row;
+ flex-direction: row;
+ -ms-flex-wrap: wrap;
+ -webkit-flex-wrap: wrap;
+ flex-wrap: wrap;
+ justify-content: flex-start;
+}
+
+.umb-thumbnails > li.icon {
+ width: 14%;
+ text-align: center;
+}
+
.umb-thumbnails i{margin: auto;}
.umb-thumbnails a{
outline: none;
@@ -207,11 +265,10 @@ ul.color-picker li a {
.umb-mediapicker .umb-sortable-thumbnails li {
flex-direction: column;
- margin: 0;
+ margin: 0 5px 5px 0;
padding: 5px;
}
-
.umb-sortable-thumbnails li:hover a {
display: flex;
justify-content: center;
@@ -219,16 +276,20 @@ ul.color-picker li a {
}
.umb-sortable-thumbnails li img {
- max-width:100%;
- max-height:100%;
- margin:auto;
- display:block;
- background-image: url(../img/checkered-background.png);
+ max-width:100%;
+ max-height:100%;
+ margin:auto;
+ display:block;
+ background-image: url(../img/checkered-background.png);
}
-.umb-sortable-thumbnails li img.noScale{
- max-width: none !important;
- max-height: none !important;
+.umb-sortable-thumbnails li img.trashed {
+ opacity:0.3;
+}
+
+.umb-sortable-thumbnails li img.noScale {
+ max-width: none !important;
+ max-height: none !important;
}
.umb-sortable-thumbnails .umb-icon-holder {
@@ -242,6 +303,12 @@ ul.color-picker li a {
display: block;
}
+.umb-sortable-thumbnails .umb-sortable-thumbnails__wrapper {
+ width: 124px;
+ height: 124px;
+ overflow: hidden;
+}
+
.umb-sortable-thumbnails .umb-sortable-thumbnails__actions {
position: absolute;
bottom: 10px;
@@ -253,9 +320,15 @@ ul.color-picker li a {
visibility: hidden;
}
+.umb-sortable-thumbnails.ui-sortable:not(.ui-sortable-disabled) {
+ > li:not(.unsortable) {
+ cursor: move;
+ }
+}
+
.umb-sortable-thumbnails li:hover .umb-sortable-thumbnails__actions {
- opacity: 1;
- visibility: visible;
+ opacity: 1;
+ visibility: visible;
}
.umb-sortable-thumbnails .umb-sortable-thumbnails__action {
@@ -269,6 +342,7 @@ ul.color-picker li a {
justify-content: center;
align-items: center;
margin-left: 5px;
+ text-decoration: none;
}
.umb-sortable-thumbnails .umb-sortable-thumbnails__action.-red {
@@ -285,27 +359,27 @@ ul.color-picker li a {
// -------------------------------------------------
.umb-cropper{
- position: relative;
+ position: relative;
}
.umb-cropper img, .umb-cropper-gravity img{
- position: relative;
- max-width: 100%;
- height: auto;
- top: 0;
- left: 0;
+ position: relative;
+ max-width: 100%;
+ height: auto;
+ top: 0;
+ left: 0;
}
.umb-cropper img {
- max-width: none;
+ max-width: none;
}
.umb-cropper .overlay, .umb-cropper-gravity .overlay {
- top: 0;
- left: 0;
- cursor: move;
- z-index: 6001;
- position: absolute;
+ top: 0;
+ left: 0;
+ cursor: move;
+ z-index: @zindexCropperOverlay;
+ position: absolute;
}
.umb-cropper .viewport{
@@ -317,43 +391,43 @@ ul.color-picker li a {
}
.umb-cropper-gravity .viewport{
- overflow: hidden;
- position: relative;
- width: 100%;
- height: 100%;
+ overflow: hidden;
+ position: relative;
+ width: 100%;
+ height: 100%;
}
.umb-cropper .viewport:after {
- content: "";
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- z-index: 5999;
- -moz-opacity: .75;
- opacity: .75;
- filter: alpha(opacity=7);
- -webkit-box-shadow: inset 0 0 0 20px white,inset 0 0 0 21px rgba(0,0,0,.1),inset 0 0 20px 21px rgba(0,0,0,.2);
- -moz-box-shadow: inset 0 0 0 20px white,inset 0 0 0 21px rgba(0,0,0,.1),inset 0 0 20px 21px rgba(0,0,0,.2);
- box-shadow: inset 0 0 0 20px white,inset 0 0 0 21px rgba(0,0,0,.1),inset 0 0 20px 21px rgba(0,0,0,.2);
+ content: "";
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ z-index: @zindexCropperOverlay - 1;
+ -moz-opacity: .75;
+ opacity: .75;
+ filter: alpha(opacity=7);
+ -webkit-box-shadow: inset 0 0 0 20px white,inset 0 0 0 21px rgba(0,0,0,.1),inset 0 0 20px 21px rgba(0,0,0,.2);
+ -moz-box-shadow: inset 0 0 0 20px white,inset 0 0 0 21px rgba(0,0,0,.1),inset 0 0 20px 21px rgba(0,0,0,.2);
+ box-shadow: inset 0 0 0 20px white,inset 0 0 0 21px rgba(0,0,0,.1),inset 0 0 20px 21px rgba(0,0,0,.2);
}
.umb-cropper-gravity .overlay{
- width: 14px;
- height: 14px;
- text-align: center;
- border-radius: 20px;
- background: @turquoise;
- border: 3px solid @white;
- opacity: 0.8;
+ width: 14px;
+ height: 14px;
+ text-align: center;
+ border-radius: 20px;
+ background: @turquoise;
+ border: 3px solid @white;
+ opacity: 0.8;
}
.umb-cropper-gravity .overlay i {
- font-size: 26px;
- line-height: 26px;
- opacity: 0.8 !important;
+ font-size: 26px;
+ line-height: 26px;
+ opacity: 0.8 !important;
}
.umb-cropper .crop-container {
@@ -361,16 +435,16 @@ ul.color-picker li a {
}
.umb-cropper .crop-slider {
- padding: 10px;
- border-top: 1px solid @gray-10;
- margin-top: 10px;
- display: flex;
- align-items: center;
- justify-content: center;
- flex-wrap: wrap;
- @media (min-width: 769px) {
+ padding: 10px;
+ border-top: 1px solid @gray-10;
+ margin-top: 10px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-wrap: wrap;
+ @media (min-width: 769px) {
padding: 10px 50px 10px 50px;
- }
+ }
}
.umb-cropper .crop-slider i {
@@ -438,6 +512,7 @@ ul.color-picker li a {
top: 3px;
right: 3px;
cursor: pointer;
+ z-index: 1;
}
.umb-close-cropper:hover {
diff --git a/src/Umbraco.Web.UI.Client/src/less/sections.less b/src/Umbraco.Web.UI.Client/src/less/sections.less
index 03d25a78f5..b4e4e2ffbc 100644
--- a/src/Umbraco.Web.UI.Client/src/less/sections.less
+++ b/src/Umbraco.Web.UI.Client/src/less/sections.less
@@ -75,15 +75,11 @@ ul.sections li.avatar {
height: 75px;
padding: 22px 0 2px 0;
text-align: center;
- margin: 0 0 0 -4px;
border-bottom: 1px solid @purple-d1;
}
ul.sections li.avatar a {
- margin: 0 auto;
padding: 0;
- width: 40px;
- height: 40px;
border: none
}
diff --git a/src/Umbraco.Web.UI.Client/src/less/tree.less b/src/Umbraco.Web.UI.Client/src/less/tree.less
index c859fae991..c9ab44ea21 100644
--- a/src/Umbraco.Web.UI.Client/src/less/tree.less
+++ b/src/Umbraco.Web.UI.Client/src/less/tree.less
@@ -119,6 +119,7 @@
.umb-tree div > a.umb-options {
visibility: hidden;
+ flex: 1 0 auto;
}
.umb-tree div:hover > a.umb-options {
visibility: visible;
@@ -156,8 +157,8 @@
.umb-tree li > div a:not(.umb-options) {
padding: 6px 0;
- width: 100%;
display: flex;
+ flex: 1 1 100%;
}
.umb-tree li > div:hover a:not(.umb-options) {
@@ -239,6 +240,7 @@
.umb-tree .umb-tree-node-checked i:before {
/*check box*/
content: "\e165" !important;
+ font-family: inherit;
}
a.umb-options {
diff --git a/src/Umbraco.Web.UI.Client/src/less/variables.less b/src/Umbraco.Web.UI.Client/src/less/variables.less
index 635d75d895..d72a9085ec 100644
--- a/src/Umbraco.Web.UI.Client/src/less/variables.less
+++ b/src/Umbraco.Web.UI.Client/src/less/variables.less
@@ -100,6 +100,27 @@
.color-green, .color-green i{color: @green-d1 !important;}
.color-yellow, .color-yellow i{color: @yellow-d1 !important;}
+/* Colors based on http://zavoloklom.github.io/material-design-color-palette/colors.html */
+.color-black, .color-black i { color: #000 !important; }
+.color-blue-grey, .color-blue-grey i { color: #607d8b !important; }
+.color-grey, .color-grey i { color: #9e9e9e !important; }
+.color-brown, .color-brown i { color: #795548 !important; }
+.color-blue, .color-blue i { color: #2196f3 !important; }
+.color-light-blue, .color-light-blue i {color: #03a9f4 !important; }
+.color-cyan, .color-cyan i { color: #00bcd4 !important; }
+.color-green, .color-green i { color: #4caf50 !important; }
+.color-light-green, .color-light-green i {color: #8bc34a !important; }
+.color-lime, .color-lime i { color: #cddc39 !important; }
+.color-yellow, .color-yellow i { color: #ffeb3b !important; }
+.color-amber, .color-amber i { color: #ffc107 !important; }
+.color-orange, .color-orange i { color: #ff9800 !important; }
+.color-deep-orange, .color-deep-orange i { color: #ff5722 !important; }
+.color-red, .color-red i { color: #f44336 !important; }
+.color-pink, .color-pink i { color: #e91e63 !important; }
+.color-purple,.color-purple i { color: #9c27b0 !important; }
+.color-deep-purple, .color-deep-purple i { color: #673ab7 !important; }
+.color-indigo, .color-indigo i { color: #3f51b5 !important; }
+
// Scaffolding
// -------------------------
@@ -218,6 +239,9 @@
// COMPONENT VARIABLES
// --------------------------------------------------
+// Drawer
+@drawerWidth: 400px;
+
// Z-index master list
// -------------------------
@@ -230,6 +254,12 @@
@zindexModalBackdrop: 1040;
@zindexModal: 1050;
+@zindexUmbOverlay: 7500;
+@zindexOverlayBackdrop: 2000;
+
+// Sticky bar has a z-index of "500", which is set from javascript in directive
+// so set z-index of cropper should be lower to be behind sticky bar.
+@zindexCropperOverlay: 499;
// Sprite icons path
// -------------------------
diff --git a/src/Umbraco.Web.UI.Client/src/routes.js b/src/Umbraco.Web.UI.Client/src/routes.js
index 2fb5f9beee..3fc4d3f78e 100644
--- a/src/Umbraco.Web.UI.Client/src/routes.js
+++ b/src/Umbraco.Web.UI.Client/src/routes.js
@@ -31,6 +31,12 @@ app.config(function ($routeProvider) {
userService.getCurrentUser({ broadcastEvent: broadcast }).then(function (user) {
//is auth, check if we allow or reject
if (isRequired) {
+
+ //This checks the current section and will force a redirect to 'content' as the default
+ if ($route.current.params.section.toLowerCase() === "default" || $route.current.params.section.toLowerCase() === "umbraco" || $route.current.params.section === "") {
+ $route.current.params.section = "content";
+ }
+
// U4-5430, Benjamin Howarth
// We need to change the current route params if the user only has access to a single section
// To do this we need to grab the current user's allowed sections, then reject the promise with the correct path.
@@ -98,26 +104,24 @@ app.config(function ($routeProvider) {
resolve: doLogout()
})
.when('/:section', {
+
//This allows us to dynamically change the template for this route since you cannot inject services into the templateUrl method.
template: "
",
//This controller will execute for this route, then we can execute some code in order to set the template Url
controller: function ($scope, $route, $routeParams, $location, sectionService) {
- if ($routeParams.section.toLowerCase() === "default" || $routeParams.section.toLowerCase() === "umbraco" || $routeParams.section === "") {
- $routeParams.section = "content";
- }
-
- //We are going to check the currently loaded sections for the user and if the section we are navigating
+
+ //We are going to check the currently loaded sections for the user and if the section we are navigating
//to has a custom route path we'll use that
sectionService.getSectionsForUser().then(function(sections) {
- //find the one we're requesting
+ //find the one we're requesting
var found = _.find(sections, function(s) {
return s.alias === $routeParams.section;
- })
+ })
if (found && found.routePath) {
//there's a custom route path so redirect
$location.path(found.routePath);
}
- else {
+ else {
//there's no custom route path so continue as normal
$routeParams.url = "dashboard.aspx?app=" + $routeParams.section;
$scope.templateUrl = 'views/common/dashboard.html';
@@ -138,8 +142,8 @@ app.config(function ($routeProvider) {
})
.when('/:section/:tree/:method', {
templateUrl: function (rp) {
-
- //if there is no method registered for this then show the dashboard
+
+ //if there is no method registered for this then show the dashboard
if (!rp.method)
return "views/common/dashboard.html";
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/iconpicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/iconpicker.controller.js
index ec1ad6e663..7f7eed8e4c 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/iconpicker.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/iconpicker.controller.js
@@ -7,14 +7,13 @@ angular.module("umbraco")
$scope.icons = icons;
});
- $scope.submitClass = function (icon) {
+ $scope.submitClass = function(icon){
if($scope.color) {
$scope.submit(icon + " " + $scope.color);
}
- else {
- $scope.submit(icon);
+ else {
+ $scope.submit(icon);
}
};
-
}
);
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/iconpicker.html b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/iconpicker.html
index 4e482c26b1..f21fdf0b06 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/iconpicker.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/iconpicker.html
@@ -1,7 +1,7 @@
-
-
+
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/insertmacro.html b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/insertmacro.html
index c71b70faf8..70889f2cd7 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/dialogs/insertmacro.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/dialogs/insertmacro.html
@@ -1,4 +1,4 @@
-