From c1278674c38851e8f63278f2ef08db8f29f2f5aa Mon Sep 17 00:00:00 2001
From: "Matt@MBP13-PC" <unknown@kiln.example.com>
Date: Tue, 21 Aug 2012 08:17:07 -0100
Subject: [PATCH] Added throbber to library to show progress whilst loading
 media items

---
 .../umbraco_client/FolderBrowser/Css/folderbrowser.css        | 4 ++++
 src/Umbraco.Web/UI/Controls/FolderBrowser.cs                  | 3 +++
 2 files changed, 7 insertions(+)

diff --git a/src/Umbraco.Web.UI/umbraco_client/FolderBrowser/Css/folderbrowser.css b/src/Umbraco.Web.UI/umbraco_client/FolderBrowser/Css/folderbrowser.css
index d49fa4065c..2e962fb222 100644
--- a/src/Umbraco.Web.UI/umbraco_client/FolderBrowser/Css/folderbrowser.css
+++ b/src/Umbraco.Web.UI/umbraco_client/FolderBrowser/Css/folderbrowser.css
@@ -142,6 +142,10 @@
     width: 200px;
 }
 
+.umbFolderBrowser .throbber {
+    margin: 0 20px;
+}
+
 .umbFolderBrowser .items {
     margin: 5px 15px;
     padding: 0;
diff --git a/src/Umbraco.Web/UI/Controls/FolderBrowser.cs b/src/Umbraco.Web/UI/Controls/FolderBrowser.cs
index 3e8b84be38..b6361393ad 100644
--- a/src/Umbraco.Web/UI/Controls/FolderBrowser.cs
+++ b/src/Umbraco.Web/UI/Controls/FolderBrowser.cs
@@ -115,6 +115,9 @@ namespace Umbraco.Web.UI.Controls
             // Create the filter input
             sb.Append("<div class='filter'>Filter: <input type='text' data-bind=\"value: filterTerm, valueUpdate: 'afterkeydown'\" /></div>");
 
+            // Create throbber to display whilst loading items
+            sb.Append("<img src='images/throbber.gif' alt='' class='throbber' data-bind=\"visible: filtered().length == 0\" />");
+
             // Create thumbnails container
             sb.Append("<ul class='items' data-bind='foreach: filtered'>" +
                       "<li data-bind=\"attr: { 'data-id': Id, 'data-order': $index() }, css: { selected: selected() }, event: { mousedown: toggleSelected, contextmenu: toggleSelected, dblclick: edit }\"><div><span class='img'><img data-bind='attr: { src: ThumbnailUrl }' /></span><span data-bind='text: Name'></span></div></li>" +