#2916 Media picker searches entire media archive (#3061)

src/Umbraco.Web.UI.Client/src/common/directives/components/umbmediagrid.directive.js

@@ -125,6 +125,14 @@ Use this directive to generate a thumbnail grid of media items.
                         i--;
                     }
 
+                    if (scope.includeSubFolders !== 'true') {
+                        if (item.parentId !== parseInt(scope.currentFolderId)) {
+                            scope.items.splice(i, 1);
+                            i--;
+                        }
+                    }
+                    
+
                 }
 
                 if (scope.items.length > 0) {
@@ -307,7 +315,9 @@ Use this directive to generate a thumbnail grid of media items.
                 itemMaxHeight: "@",
                 itemMinWidth: "@",
                 itemMinHeight: "@",
-                onlyImages: "@"
+                onlyImages: "@",
+                includeSubFolders: "@",
+                currentFolderId: "@"
             },
             link: link
         };

src/Umbraco.Web.UI.Client/src/views/common/overlays/mediaPicker/mediapicker.controller.js

@@ -314,7 +314,7 @@ angular.module("umbraco")
 
             function searchMedia() {
                 $scope.loading = true;
-                entityResource.getPagedDescendants($scope.startNodeId, "Media", $scope.searchOptions)
+                entityResource.getPagedDescendants($scope.currentFolder.id, "Media", $scope.searchOptions)
                     .then(function(data) {
                         // update image data to work with image grid
                         angular.forEach(data.items,

src/Umbraco.Web.UI.Client/src/views/common/overlays/mediaPicker/mediapicker.html

@@ -11,7 +11,6 @@
 
             <umb-load-indicator ng-if="loading">
             </umb-load-indicator>
-
             <div class="form-search">
                 <i class="icon-search"></i>
                 <input class="umb-search-field search-query -full-width-input"
@@ -21,6 +20,12 @@
                        ng-change="changeSearch()"
                        type="text"
                        no-dirty-check />
+                <br />
+                <label>
+                    <localize key="general_includeFromsubFolders">Include subfolders in search</localize>
+                    <input type="checkbox" ng-model="showChilds"
+                           ng-change="changeSearch()">
+                </label>
             </div>
 
             <div class="upload-button">
@@ -83,7 +88,9 @@
                         item-max-height="150"
                         item-min-width="100"
                         item-min-height="100"
-                        only-images={{onlyImages}}>
+                        only-images={{onlyImages}}
+                        include-sub-folders={{showChilds}}
+                        current-Folder-id="{{currentFolder.id}}">
         </umb-media-grid>
 
         <div class="flex justify-center">

src/Umbraco.Web.UI/umbraco/config/lang/en.xml

@@ -684,6 +684,7 @@
         <key alias="embed">Embed</key>
         <key alias="retrieve">Retrieve</key>
         <key alias="selected">selected</key>
+		<key alias="includeFromsubFolders">Include subfolders in search</key>
     </area>
 
     <area alias="colors">

src/Umbraco.Web.UI/umbraco/config/lang/en_us.xml

@@ -684,6 +684,7 @@
         <key alias="embed">Embed</key>
         <key alias="retrieve">Retrieve</key>
         <key alias="selected">selected</key>
+		<key alias="includeFromsubFolders">Include subfolders in search</key>
     </area>
     <area alias="colors">
         <key alias="black">Black</key>