yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/7.0.0' into 7.0.0

Browse Source
This commit is contained in:
Shannon
2013-09-25 19:04:12 +10:00
parent e02dddc747 3dd583b1d3
commit 5fd25e26f5
15 changed files with 384 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

158
src/Umbraco.Web.UI.Client/src/common/directives/html/umbphotofolder.directive.js Normal file
View File

@@ -0,0 +1,158 @@
/**
* @ngdoc directive
* @name umbraco.directives.directive:umbPhotoFolder
* @restrict E
**/
angular.module("umbraco.directives.html")
.directive('umbPhotoFolder', function ($compile, $log, $timeout, imageHelper) {
return {
restrict: 'E',
replace: true,
require: '?ngModel',
terminate: true,
templateUrl: 'views/directives/html/umb-photo-folder.html',
link: function(scope, element, attrs, ngModel) {
element.ready(function(){
var wat = 1;
});
ngModel.$render = function() {
if(ngModel.$modelValue){
$timeout(function(){
var photos = ngModel.$modelValue;
var rows = [];
scope.baseline = element.attr('baseline') ? parseInt(element.attr('baseline'),10) : 0;
scope.minWidth = element.attr('min-width') ? parseInt(element.attr('min-width'),10) : 420;
scope.minHeight = element.attr('min-height') ? parseInt(element.attr('min-height'),10) : 200;
scope.border = element.attr('border') ? parseInt(element.attr('border'),10) : 5;
scope.clickHandler = scope.$eval(element.attr('on-click'));
scope.lastWidth = Math.max(element.width(), scope.minWidth);
// get row width - this is fixed.
var w = scope.lastWidth;
// initial height - effectively the maximum height +/- 10%;
var h = Math.max(scope.minHeight,Math.floor(w / 5));
// store relative widths of all images (scaled to match estimate height above)
var ws = [];
$.each(photos, function(key, val) {
val.width_n = $.grep(val.properties, function(val, index) {return (val.alias === "umbracoWidth");})[0];
val.height_n = $.grep(val.properties, function(val, index) {return (val.alias === "umbracoHeight");})[0];
//val.url_n = imageHelper.getThumbnail({ imageModel: val, scope: scope });
if(val.width_n && val.height_n){
var wt = parseInt(val.width_n.value, 10);
var ht = parseInt(val.height_n.value, 10);
if( ht !== h ) {
wt = Math.floor(wt * (h / ht));
}
ws.push(wt);
}else{
//if its files or folders, we make them square
ws.push(scope.minHeight);
}
});
var rowNum = 0;
var limit = photos.length;
while(scope.baseline < limit)
{
rowNum++;
// number of images appearing in this row
var c = 0;
// total width of images in this row - including margins
var tw = 0;
// calculate width of images and number of images to view in this row.
while( (tw * 1.1 < w) && (scope.baseline + c < limit))
{
tw += ws[scope.baseline + c++] + scope.border * 2;
}
// Ratio of actual width of row to total width of images to be used.
var r = w / tw;
// image number being processed
var i = 0;
// reset total width to be total width of processed images
tw = 0;
// new height is not original height * ratio
var ht = Math.floor(h * r);
var row = {};
row.photos = [];
row.style = {};
row.style = {"height": ht + scope.border * 2, "width": scope.lastWidth};
rows.push(row);
while( i < c )
{
var photo = photos[scope.baseline + i];
// Calculate new width based on ratio
var wt = Math.floor(ws[scope.baseline + i] * r);
// add to total width with margins
tw += wt + scope.border * 2;
// Create image, set src, width, height and margin
//var purl = photo.url_n;
photo.thumbnail = imageHelper.getThumbnail({ imageModel: photo, scope: scope });
if(!photo.thumbnail){
photo.thumbnail = "none";
}
photo.style = {"width": wt, "height": ht, "margin": scope.border+"px", "cursor": "pointer"};
row.photos.push(photo);
i++;
}
// set row height to actual height + margins
scope.baseline += c;
// if total width is slightly smaller than
// actual div width then add 1 to each
// photo width till they match
i = 0;
while( tw < w )
{
row.photos[i].style.width++;
i = (i + 1) % c;
tw++;
}
// if total width is slightly bigger than
// actual div width then subtract 1 from each
// photo width till they match
i = 0;
while( tw > w )
{
row.photos[i].style.width--;
i = (i + 1) % c;
tw--;
}
}
//populate the scope
scope.rows = rows;
}, 500); //end timeout
} //end if modelValue
}; //end $render
}
};
});

31
src/Umbraco.Web.UI.Client/src/common/resources/media.resource.js
View File

@@ -88,6 +88,37 @@ function mediaResource($q, $http, umbDataFormatter, umbRequestHelper) {
[{ id: id }])),
'Failed to retreive data for media id ' + id);
},
/**
* @ngdoc method
* @name umbraco.resources.mediaResource#deleteById
* @methodOf umbraco.resources.mediaResource
*
* @description
* Deletes a media item with a given id
*
* ##usage
* <pre>
* mediaResource.deleteById(1234)
* .then(function() {
* alert('its gone!');
* });
* </pre>
*
* @param {Int} id id of media item to delete
* @returns {Promise} resourcePromise object.
*
*/
deleteById: function(id) {
return umbRequestHelper.resourcePromise(
$http.delete(
umbRequestHelper.getApiUrl(
"mediaApiBaseUrl",
"DeleteById",
[{ id: id }])),
'Failed to delete item ' + id);
},
/**
* @ngdoc method
* @name umbraco.resources.mediaResource#getByIds

2
src/Umbraco.Web.UI.Client/src/less/dragdrop.less
View File

@@ -2,7 +2,7 @@ body.dragging, body.dragging * {
cursor: move !important;
}
.dragged {
li.dragged {
position: absolute;
opacity: 0.5;
z-index: 2000;

44
src/Umbraco.Web.UI.Client/src/less/property-editors.less
View File

@@ -32,14 +32,52 @@ ul.color-picker li a {
border:none;
}
//
// Media picker
// --------------------------------------------------
.umb-mediapicker .add-link{
display: inline-block;
height: 100px;
width: 100px;
height: 120px;
width: 120px;
text-align: center;
color: @grayLight;
border: 2px @grayLight dashed !important;
line-height: 120px;
}
//
// folder-browser
// --------------------------------------------------
.umb-folderbrowser .add-link{
display: inline-block;
height: 120px;
width: 120px;
text-align: center;
border: 1px @grayLight dashed;
line-height: 100px
line-height: 120px
}
//
// Photo folder styling
// --------------------------------------------------
.umb-photo-folder .umb-non-thumbnail{
text-align: center;
color: @gray;
font-size: 12px;
}
.umb-photo-folder .umb-non-thumbnail i{
color: @grayLight;
font-size: 60px;
line-height: 80px;
display: block
}
.umb-photo-folder .selected img{
opacity:0.5;
}

16
src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.controller.js
View File

@@ -55,6 +55,22 @@ angular.module("umbraco")
$scope.gotoFolder($scope.options.formData.currentFolder);
});
$scope.clickHandler = function(image, ev){
if (image.contentTypeAlias.toLowerCase() == 'folder') {
$scope.options.formData.currentFolder = image.id;
$scope.gotoFolder(image.id);
}else if (image.contentTypeAlias.toLowerCase() == 'image') {
eventsService.publish("Umbraco.Dialogs.MediaPickerController.Select", image).then(function(image){
if(dialogOptions && dialogOptions.multipicker){
$scope.select(image);
image.cssclass = ($scope.dialogData.selection.indexOf(image) > -1) ? "selected" : "";
}else{
$scope.submit(image);
}
});
}
};
$scope.selectMediaItem = function(image) {
if (image.contentTypeAlias.toLowerCase() == 'folder') {
$scope.options.formData.currentFolder = image.id;

9
src/Umbraco.Web.UI.Client/src/views/common/dialogs/mediapicker.html
View File

@@ -57,6 +57,14 @@ data-file-upload="options" data-file-upload-progress="" data-ng-class="{'fileupl
<div style="height: 10px; margin: 10px 0px 10px 0px" class="umb-loader"
ng-hide="active() == 0"></div>
<umb-photo-folder
min-height="100"
min-width="220"
on-click="clickHandler"
ng-model="images"
/>
<!--
<ul class="umb-thumbnails thumbnails">
<li class="span2 folder" ng-repeat="image in images | orderBy:'contentTypeAlias' | filter:searchTerm">
<a href="#" class="thumbnail" ng-class="{selected: dialogData.selection.indexOf(image) > -1}"
@@ -76,6 +84,7 @@ data-file-upload="options" data-file-upload-progress="" data-ng-class="{'fileupl
</a>
</li>
</ul>
-->
</div>
<div class="umb-panel-footer">

4
src/Umbraco.Web.UI.Client/src/views/content/delete.html
View File

@@ -1,6 +1,10 @@
<div class="umb-dialog umb-pane" ng-controller="Umbraco.Editors.Content.DeleteController">
<div class="umb-dialog-body" auto-scale="90">
<p class="umb-abstract">
Are you sure you want to delete <strong>{{currentNode.name}}</strong> ?
</p>
<umb-confirm on-confirm="performDelete" on-cancel="cancel">
</umb-confirm>

28
src/Umbraco.Web.UI.Client/src/views/directives/html/umb-photo-folder.html Normal file
View File

@@ -0,0 +1,28 @@
<div class="umb-photo-folder">
<div class="picrow" ng-repeat="row in rows">
<a
href
ng-click="clickHandler(img, $event)"
ng-switch="img.thumbnail"
ng-repeat="img in row.photos"
style="margin: 0px; padding: 0px; border: none; display: inline-block"
ng-class="img.cssclass"
title="{{img.name}}">
<div ng-style="img.style" class="umb-non-thumbnail" ng-switch-when="none">
<i class="icon large icon-folder"></i>
{{img.name}}
</div>
<img class="umb-photo"
ng-switch-default
ng-src="{{img.thumbnail}}"
ng-style="img.style"
alt="{{img.name}}"/>
</a>
</div>
</div>

13
src/Umbraco.Web.UI.Client/src/views/directives/umb-confirm.html
View File

@@ -1,13 +1,6 @@
<div>
<p ng-hide="!caption" class="umb-abstract">{{caption}}</p>
<ul class="nav nav-pills">
<li class="active">
<a href="" ng-click="onConfirm()">Ok</a>
</li>
<li>
<a href="" ng-click="onCancel()">Cancel</a>
</li>
</ul>
<a href class="btn btn-link" ng-click="onCancel()">Cancel</a>
<a href class="btn btn-primary" ng-click="onConfirm()">Ok</a>
</div>

10
src/Umbraco.Web.UI.Client/src/views/media/delete.html Normal file
View File

@@ -0,0 +1,10 @@
<div class="umb-dialog umb-pane" ng-controller="Umbraco.Editors.Media.DeleteController">
<div class="umb-dialog-body" auto-scale="90">
<p class="umb-abstract">
Are you sure you want to delete <strong>{{currentNode.name}}</strong> ?
</p>
<umb-confirm on-confirm="performDelete" on-cancel="cancel"></umb-confirm>
</div>
</div>

43
src/Umbraco.Web.UI.Client/src/views/media/media.delete.controller.js Normal file
View File

@@ -0,0 +1,43 @@
/**
* @ngdoc controller
* @name Umbraco.Editors.ContentDeleteController
* @function
*
* @description
* The controller for deleting content
*/
function MediaDeleteController($scope, mediaResource, treeService, navigationService) {
$scope.performDelete = function() {
//mark it for deletion (used in the UI)
$scope.currentNode.loading = true;
mediaResource.deleteById($scope.currentNode.id).then(function () {
$scope.currentNode.loading = false;
//get the root node before we remove it
var rootNode = treeService.getTreeRoot($scope.currentNode);
//TODO: Need to sync tree, etc...
treeService.removeNode($scope.currentNode);
//ensure the recycle bin has child nodes now
var recycleBin = treeService.getDescendantNode(rootNode, -21);
if(recycleBin){
recycleBin.hasChildren = true;
}
navigationService.hideMenu();
},function() {
$scope.currentNode.loading = false;
});
};
$scope.cancel = function() {
navigationService.hideDialog();
};
}
angular.module("umbraco").controller("Umbraco.Editors.Media.DeleteController", MediaDeleteController);

2
src/Umbraco.Web.UI.Client/src/views/propertyeditors/folderbrowser/folderbrowser.controller.js
View File

@@ -40,7 +40,7 @@ angular.module("umbraco")
$scope.images = data;
//update the thumbnail property
_.each($scope.images, function(img) {
img.thumbnail = imageHelper.getThumbnail({ imageModel: img, scope: $scope });
//img.thumbnail = imageHelper.getThumbnail({ imageModel: img, scope: $scope });
});
// prettify the look and feel

2
src/Umbraco.Web.UI.Client/src/views/propertyeditors/mediapicker/mediapicker.html
View File

@@ -1,7 +1,7 @@
<div class="umb-editor umb-mediapicker" ng-controller="Umbraco.Editors.MediaPickerController">
<ul class="thumbnails umb-thumbnails">
<li class="umb-thumbnail thumbnail span2" ng-repeat="image in images">
<li class="umb-thumbnail thumbnail span3" ng-repeat="image in images">
<a href ng-click="remove($index)">
<img ng-src="{{image.src}}" alt="">
</a>

8
src/Umbraco.Web.UI.Client/test/unit/common/services/umb-image-helper.spec.js
View File

@@ -1,4 +1,4 @@
describe('icon helper tests', function () {
describe('image helper tests', function () {
var umbImageHelper;
beforeEach(module('umbraco.services'));
@@ -29,9 +29,9 @@ describe('icon helper tests', function () {
var image2 = "a-png.png";
var image3 = "thisisagif.blah.gif";
expect(umbImageHelper.getThumbnailFromPath(image1)).toBe("a-jpeg_thumb.jpg");
expect(umbImageHelper.getThumbnailFromPath(image2)).toBe("a-png_thumb.jpg");
expect(umbImageHelper.getThumbnailFromPath(image3)).toBe("thisisagif.blah_thumb.jpg");
expect(umbImageHelper.getThumbnailFromPath(image1)).toBe("a-jpeg_big-thumb.jpg");
expect(umbImageHelper.getThumbnailFromPath(image2)).toBe("a-png_big-thumb.jpg");
expect(umbImageHelper.getThumbnailFromPath(image3)).toBe("thisisagif.blah_big-thumb.jpg");
});
});