From d214935ecb6c8034a4a03f47628d4e834bb537b6 Mon Sep 17 00:00:00 2001
From: Per Ploug <per@umbraco.dk>
Date: Wed, 26 Jun 2013 11:12:06 +0200
Subject: [PATCH] Panel, Tabview, Propertie controls converted

Changed the html to output bootstrap html, masterpages load our belle
css + bootstrap.min.js
---
 .../directives/umbtreeitem.directive.js       |   2 +-
 src/Umbraco.Web.UI.Client/src/less/forms.less |   9 +
 src/Umbraco.Web.UI.Client/src/less/panel.less |  15 +-
 .../config/ClientDependency.config            |   2 +-
 src/Umbraco.Web.UI/umbraco/js/app_dev.js      |  12 +-
 .../umbraco/masterpages/umbracoPage.Master    |  10 +-
 .../umbraco/settings/editTemplate.aspx        |  12 +-
 src/Umbraco.Web/Umbraco.Web.csproj            |   4 +-
 .../developer/DataTypes/editDatatype.aspx.cs  |   1 -
 .../umbraco/settings/editTemplate.aspx.cs     |  49 ++--
 src/umbraco.controls/CodeArea.cs              |  12 +-
 src/umbraco.controls/DataAttributes.cs        |  35 +++
 src/umbraco.controls/MenuButton.cs            |  72 +++++
 src/umbraco.controls/MenuButtonI.cs           |  29 +-
 src/umbraco.controls/MenuSplitButton.cs       |  72 +++++
 src/umbraco.controls/Panel.cs                 | 175 ++++--------
 src/umbraco.controls/Property.cs              |  53 ++--
 src/umbraco.controls/PropertyGroup.cs         |  56 ++++
 src/umbraco.controls/ScrollingMenu.cs         | 258 ++++++++----------
 src/umbraco.controls/TabPage.cs               |  57 +---
 src/umbraco.controls/TabView.cs               | 154 +++++++----
 src/umbraco.controls/pane.cs                  |  84 +++---
 src/umbraco.controls/umbraco.controls.csproj  |   4 +
 23 files changed, 678 insertions(+), 499 deletions(-)
 create mode 100644 src/umbraco.controls/DataAttributes.cs
 create mode 100644 src/umbraco.controls/MenuButton.cs
 create mode 100644 src/umbraco.controls/MenuSplitButton.cs
 create mode 100644 src/umbraco.controls/PropertyGroup.cs

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/umbtreeitem.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/umbtreeitem.directive.js
index 282eb05ff7..e4d1a370d4 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/umbtreeitem.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/umbtreeitem.directive.js
@@ -39,7 +39,7 @@ angular.module("umbraco.directives")
         scope.select = function(e,n,ev){
 
             //here we need to check for some legacy tree code
-            if (n.jsClickCallback && n.jsClickCallback != "") {
+            if (n.jsClickCallback && n.jsClickCallback !== "") {
                 //this is a legacy tree node!                
                 var js;
                 if (n.jsClickCallback.startsWith("javascript:")) {
diff --git a/src/Umbraco.Web.UI.Client/src/less/forms.less b/src/Umbraco.Web.UI.Client/src/less/forms.less
index 75ff5471d3..448b5b61f0 100644
--- a/src/Umbraco.Web.UI.Client/src/less/forms.less
+++ b/src/Umbraco.Web.UI.Client/src/less/forms.less
@@ -2,6 +2,15 @@
 // Forms
 // --------------------------------------------------
 
+// UMBRACO STYLES
+// --------------
+.hideLabel label {
+    display: none;
+}
+
+.hideLabel .controls-row {
+    margin-left: 0px !Important;
+}
 
 // GENERAL STYLES
 // --------------
diff --git a/src/Umbraco.Web.UI.Client/src/less/panel.less b/src/Umbraco.Web.UI.Client/src/less/panel.less
index 8a0dbf2161..d41071dfbf 100644
--- a/src/Umbraco.Web.UI.Client/src/less/panel.less
+++ b/src/Umbraco.Web.UI.Client/src/less/panel.less
@@ -7,7 +7,7 @@
   background: @grayLighter; 
   margin: 0;
   height: 79px;
-  padding: 20px 20px 0px 20px
+  padding: 20px 20px 0px 20px;
 }
 
 .umb-panel-header h1.umb-headline-editor {
@@ -62,8 +62,19 @@
 
 .umb-panel-header i {
   font-size: 14px;
-} 
+}
 
+.umb-panel-header-meta {
+    height: 50px;
+}
+
+.umb-panel-header .umb-btn-toolbar {
+    float: right;
+}
+
+.umb-panel-body {
+    clear: both;
+}
 
 
 /* TABS */
diff --git a/src/Umbraco.Web.UI/config/ClientDependency.config b/src/Umbraco.Web.UI/config/ClientDependency.config
index 87bd6c9da4..9aed0f5518 100644
--- a/src/Umbraco.Web.UI/config/ClientDependency.config
+++ b/src/Umbraco.Web.UI/config/ClientDependency.config
@@ -10,7 +10,7 @@ NOTES:
 * Compression/Combination/Minification is not enabled unless debug="false" is specified on the 'compiliation' element in the web.config
 * A new version will invalidate both client and server cache and create new persisted files
 -->
-<clientDependency version="14" fileDependencyExtensions=".js,.css" loggerType="Umbraco.Web.UI.CdfLogger, umbraco">
+<clientDependency version="15" fileDependencyExtensions=".js,.css" loggerType="Umbraco.Web.UI.CdfLogger, umbraco">
 
   <!-- 
     This section is used for Web Forms only, the enableCompositeFiles="true" is optional and by default is set to true.
diff --git a/src/Umbraco.Web.UI/umbraco/js/app_dev.js b/src/Umbraco.Web.UI/umbraco/js/app_dev.js
index 2d13026719..a743c0881f 100644
--- a/src/Umbraco.Web.UI/umbraco/js/app_dev.js
+++ b/src/Umbraco.Web.UI/umbraco/js/app_dev.js
@@ -1,7 +1,7 @@
-var app = angular.module('umbraco', [
-	'umbraco.filters',
-	'umbraco.directives',
-	'umbraco.mocks.resources',
-	'umbraco.services',
-	'umbraco.security'
+var app = angular.module('umbraco', [
+	'umbraco.filters',
+	'umbraco.directives',
+	'umbraco.mocks.resources',
+	'umbraco.services',
+	'umbraco.security'
 ]);
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI/umbraco/masterpages/umbracoPage.Master b/src/Umbraco.Web.UI/umbraco/masterpages/umbracoPage.Master
index caa5370259..f9c061eb12 100644
--- a/src/Umbraco.Web.UI/umbraco/masterpages/umbracoPage.Master
+++ b/src/Umbraco.Web.UI/umbraco/masterpages/umbracoPage.Master
@@ -8,12 +8,13 @@
 <head runat="server">
     <title></title>
     <cc1:UmbracoClientDependencyLoader runat="server" ID="ClientLoader" />
-    <umb:CssInclude ID="CssInclude1" runat="server" FilePath="ui/default.css" PathNameAlias="UmbracoClient" />
-    <umb:CssInclude ID="CssInclude2" runat="server" FilePath="modal/style.css" PathNameAlias="UmbracoClient" />
+
+    <umb:CssInclude ID="CssInclude1" runat="server" FilePath="assets/css/umbraco.css" PathNameAlias="UmbracoRoot" />
+    
     <umb:JsInclude ID="JsInclude1" runat="server" FilePath="Application/NamespaceManager.js" PathNameAlias="UmbracoClient" Priority="0" />
     <umb:JsInclude ID="JsInclude2" runat="server" FilePath="ui/jquery.js" PathNameAlias="UmbracoClient" Priority="0" />
     <umb:JsInclude ID="JsInclude8" runat="server" FilePath="ui/jqueryui.js" PathNameAlias="UmbracoClient" Priority="1" />
-    <umb:JsInclude ID="JsInclude9" runat="server" FilePath="Application/jQuery/jquery.cookie.js" PathNameAlias="UmbracoClient" Priority="1" />
+<umb:JsInclude ID="JsInclude9" runat="server" FilePath="Application/jQuery/jquery.cookie.js" PathNameAlias="UmbracoClient" Priority="1" />
     <umb:JsInclude ID="JsInclude10" runat="server" FilePath="ui/base2.js" PathNameAlias="UmbracoClient" Priority="1"  /> 
     <umb:JsInclude ID="JsInclude4" runat="server" FilePath="Application/UmbracoApplicationActions.js" PathNameAlias="UmbracoClient" Priority="2" />
     <umb:JsInclude ID="JsInclude5" runat="server" FilePath="Application/UmbracoUtils.js" PathNameAlias="UmbracoClient" Priority="2" />
@@ -23,6 +24,9 @@
     <umb:JsInclude ID="JsInclude7" runat="server" FilePath="modal/modal.js" PathNameAlias="UmbracoClient" Priority="10" />
     <umb:JsInclude ID="JsInclude3" runat="server" FilePath="ui/default.js" PathNameAlias="UmbracoClient" Priority="10" />
     <umb:JsInclude ID="JsIncludeHotkeys" runat="server" FilePath="Application/jQuery/jquery.hotkeys.js" PathNameAlias="UmbracoClient" Priority="10" />
+    
+    <umb:JsInclude runat="server" FilePath="lib/bootstrap/js/bootstrap.min.js" PathNameAlias="UmbracoRoot" Priority="10" />
+
     <asp:ContentPlaceHolder ID="head" runat="server">
     </asp:ContentPlaceHolder>
 </head>
diff --git a/src/Umbraco.Web.UI/umbraco/settings/editTemplate.aspx b/src/Umbraco.Web.UI/umbraco/settings/editTemplate.aspx
index 1308d96298..67b9ab7a61 100644
--- a/src/Umbraco.Web.UI/umbraco/settings/editTemplate.aspx
+++ b/src/Umbraco.Web.UI/umbraco/settings/editTemplate.aspx
@@ -101,9 +101,11 @@
 
     </script>
 </asp:Content>
+
 <asp:Content ID="Content2" ContentPlaceHolderID="body" runat="server">
-    <cc1:UmbracoPanel ID="Panel1" runat="server" Width="608px" Height="336px" hasMenu="true">
-        <cc1:Pane ID="Pane7" runat="server" Height="44px" Width="528px">
+    <cc1:TabView ID="Panel1" runat="server" hasMenu="true">
+        
+        <cc1:Pane ID="Pane7" runat="server">
             <cc1:PropertyPanel ID="pp_name" runat="server">
                 <asp:TextBox ID="NameTxt" Width="350px" runat="server"></asp:TextBox>
             </cc1:PropertyPanel>
@@ -113,12 +115,16 @@
             <cc1:PropertyPanel ID="pp_masterTemplate" runat="server">
                 <asp:DropDownList ID="MasterTemplate" Width="350px" runat="server" />
             </cc1:PropertyPanel>
+        </cc1:Pane>    
+        
+        <cc1:Pane ID="Pane8" runat="server">
             <cc1:PropertyPanel ID="pp_source" runat="server">
                 <cc1:CodeArea ID="editorSource" runat="server" CodeBase="HtmlMixed" EditorMimeType="text/html" ClientSaveMethod="doSubmit"
                     AutoResize="true" OffSetX="37" OffSetY="54"/>
             </cc1:PropertyPanel>
         </cc1:Pane>
-    </cc1:UmbracoPanel>
+
+    </cc1:TabView>
     <div id="splitButton" style="display: inline; height: 23px; vertical-align: top;">
         <a href="#" id="sb" class="sbLink">
             <img alt="Insert Inline Razor Macro" src="../images/editor/insRazorMacro.png" title="Insert Inline Razor Macro"
diff --git a/src/Umbraco.Web/Umbraco.Web.csproj b/src/Umbraco.Web/Umbraco.Web.csproj
index be16cbb25d..a8c092b135 100644
--- a/src/Umbraco.Web/Umbraco.Web.csproj
+++ b/src/Umbraco.Web/Umbraco.Web.csproj
@@ -2011,7 +2011,9 @@
     </Content>
     <Content Include="umbraco.presentation\umbraco\developer\Macros\assemblyBrowser.aspx" />
     <Content Include="umbraco.presentation\umbraco\developer\autoDoc.aspx" />
-    <Content Include="umbraco.presentation\umbraco\developer\DataTypes\editDatatype.aspx" />
+    <Content Include="umbraco.presentation\umbraco\developer\DataTypes\editDatatype.aspx">
+      <SubType>ASPXCodeBehind</SubType>
+    </Content>
     <Content Include="umbraco.presentation\umbraco\developer\Xslt\getXsltStatus.asmx" />
     <Content Include="umbraco.presentation\umbraco\developer\Cache\viewCacheItem.aspx" />
     <Content Include="umbraco.presentation\umbraco\developer\Xslt\xsltChooseExtension.aspx" />
diff --git a/src/Umbraco.Web/umbraco.presentation/umbraco/developer/DataTypes/editDatatype.aspx.cs b/src/Umbraco.Web/umbraco.presentation/umbraco/developer/DataTypes/editDatatype.aspx.cs
index 05a831cdf4..5d7bb8e909 100644
--- a/src/Umbraco.Web/umbraco.presentation/umbraco/developer/DataTypes/editDatatype.aspx.cs
+++ b/src/Umbraco.Web/umbraco.presentation/umbraco/developer/DataTypes/editDatatype.aspx.cs
@@ -120,7 +120,6 @@ namespace umbraco.cms.presentation.developer
             ApplicationContext.Services.DataTypeService.Save(_dataTypeDefinition, UmbracoUser.Id);
 
             ClientTools.ShowSpeechBubble(speechBubbleIcon.save, ui.Text("speechBubbles", "dataTypeSaved", null), "");
-
             ClientTools.SyncTree("-1,init," + _id.ToString(CultureInfo.InvariantCulture), true);
         }
 
diff --git a/src/Umbraco.Web/umbraco.presentation/umbraco/settings/editTemplate.aspx.cs b/src/Umbraco.Web/umbraco.presentation/umbraco/settings/editTemplate.aspx.cs
index d7b9396350..73ae0737fa 100644
--- a/src/Umbraco.Web/umbraco.presentation/umbraco/settings/editTemplate.aspx.cs
+++ b/src/Umbraco.Web/umbraco.presentation/umbraco/settings/editTemplate.aspx.cs
@@ -43,7 +43,6 @@ namespace umbraco.cms.presentation.settings
 		protected void Page_Load(object sender, EventArgs e)
 		{
 			MasterTemplate.Attributes.Add("onchange", "changeMasterPageFile()");
-
 		    TemplateTreeSyncPath = "-1,init," + _template.Path.Replace("-1,", "");
 
 			if (!IsPostBack)
@@ -91,20 +90,28 @@ namespace umbraco.cms.presentation.settings
 			base.OnInit(e);
 			Panel1.hasMenu = true;
 
-			MenuIconI save = Panel1.Menu.NewIcon();
-			save.ImageURL = SystemDirectories.Umbraco + "/images/editor/save.gif";
-			save.OnClickCommand = "doSubmit()";
-			save.AltText = ui.Text("save");
-			save.ID = "save";
+		    var editor = Panel1.NewTabPage(ui.Text("template"));
+            editor.Controls.Add(Pane8);
+
+            var props = Panel1.NewTabPage(ui.Text("properties"));
+            props.Controls.Add(Pane7);
+
+            
+			var save = Panel1.Menu.NewButton();
+		    save.Icon = "save";
+            save.OnClientClick = "doSubmit()";
+            save.Text = ui.Text("save");
+            save.ButtonType = MenuButtonType.Primary;
+            save.ID = "save";
 
 			Panel1.Text = ui.Text("edittemplate");
 			pp_name.Text = ui.Text("name", base.getUser());
 			pp_alias.Text = ui.Text("alias", base.getUser());
 			pp_masterTemplate.Text = ui.Text("mastertemplate", base.getUser());
 
+
 			// Editing buttons
-			Panel1.Menu.InsertSplitter();
-			MenuIconI umbField = Panel1.Menu.NewIcon();
+            MenuIconI umbField = editorSource.Menu.NewIcon();
 			umbField.ImageURL = UmbracoPath + "/images/editor/insField.gif";
 			umbField.OnClickCommand =
 				ClientTools.Scripts.OpenModalWindow(
@@ -112,8 +119,9 @@ namespace umbraco.cms.presentation.settings
 					editorSource.ClientID + "&tagName=UMBRACOGETDATA", ui.Text("template", "insertPageField"), 640, 550);
 			umbField.AltText = ui.Text("template", "insertPageField");
 
+
 			// TODO: Update icon
-			MenuIconI umbDictionary = Panel1.Menu.NewIcon();
+            MenuIconI umbDictionary = editorSource.Menu.NewIcon();
 			umbDictionary.ImageURL = GlobalSettings.Path + "/images/editor/dictionaryItem.gif";
 			umbDictionary.OnClickCommand =
 				ClientTools.Scripts.OpenModalWindow(
@@ -127,13 +135,11 @@ namespace umbraco.cms.presentation.settings
 			//umbMacro.AltText = ui.Text("template", "insertMacro");
 			//umbMacro.OnClickCommand = umbraco.BasePages.ClientTools.Scripts.OpenModalWindow(umbraco.IO.IOHelper.ResolveUrl(umbraco.IO.SystemDirectories.Umbraco) + "/dialogs/editMacro.aspx?objectId=" + editorSource.ClientID, ui.Text("template", "insertMacro"), 470, 530);
 
-			Panel1.Menu.NewElement("div", "splitButtonMacroPlaceHolder", "sbPlaceHolder", 40);
+            editorSource.Menu.NewElement("div", "splitButtonMacroPlaceHolder", "sbPlaceHolder", 40);
 
 			if (UmbracoSettings.UseAspNetMasterPages)
 			{
-				Panel1.Menu.InsertSplitter();
-
-				MenuIconI umbContainer = Panel1.Menu.NewIcon();
+			    MenuIconI umbContainer = editorSource.Menu.NewIcon();
 				umbContainer.ImageURL = UmbracoPath + "/images/editor/masterpagePlaceHolder.gif";
 				umbContainer.AltText = ui.Text("template", "insertContentAreaPlaceHolder");
 				umbContainer.OnClickCommand =
@@ -142,7 +148,7 @@ namespace umbraco.cms.presentation.settings
 						"/dialogs/insertMasterpagePlaceholder.aspx?&id=" + _template.Id,
 						ui.Text("template", "insertContentAreaPlaceHolder"), 470, 320);
 
-				MenuIconI umbContent = Panel1.Menu.NewIcon();
+                MenuIconI umbContent = editorSource.Menu.NewIcon();
 				umbContent.ImageURL = UmbracoPath + "/images/editor/masterpageContent.gif";
 				umbContent.AltText = ui.Text("template", "insertContentArea");
 				umbContent.OnClickCommand =
@@ -153,13 +159,13 @@ namespace umbraco.cms.presentation.settings
 
 
 			//Spit button
-			Panel1.Menu.InsertSplitter();
-			Panel1.Menu.NewElement("div", "splitButtonPlaceHolder", "sbPlaceHolder", 40);
+            editorSource.Menu.InsertSplitter();
+            editorSource.Menu.NewElement("div", "splitButtonPlaceHolder", "sbPlaceHolder", 40);
 
 			if (Skinning.StarterKitGuid(_template.Id).HasValue)
 			{
-				Panel1.Menu.InsertSplitter();
-				MenuIconI umbContainer = Panel1.Menu.NewIcon();
+                editorSource.Menu.InsertSplitter();
+                MenuIconI umbContainer = editorSource.Menu.NewIcon();
 				umbContainer.ImageURL = UmbracoPath + "/images/editor/skin.gif";
 				umbContainer.AltText = ui.Text("template", "modifyTemplateSkin");
 				//umbContainer.OnClickCommand = umbraco.BasePages.ClientTools.Scripts.OpenModalWindow(umbraco.IO.IOHelper.ResolveUrl(umbraco.IO.SystemDirectories.Umbraco) + "/dialogs/TemplateSkinning.aspx?&id=" + _template.Id.ToString(), ui.Text("template", "modifyTemplateSkin"), 570, 420);
@@ -169,9 +175,9 @@ namespace umbraco.cms.presentation.settings
 			}
 
 			// Help
-			Panel1.Menu.InsertSplitter();
+            editorSource.Menu.InsertSplitter();
 
-			MenuIconI helpIcon = Panel1.Menu.NewIcon();
+            MenuIconI helpIcon = editorSource.Menu.NewIcon();
 			helpIcon.OnClickCommand =
 				ClientTools.Scripts.OpenModalWindow(
 					IOHelper.ResolveUrl(SystemDirectories.Umbraco) + "/settings/modals/showumbracotags.aspx?alias=" +
@@ -261,7 +267,7 @@ namespace umbraco.cms.presentation.settings
 		/// Auto-generated field.
 		/// To modify move field declaration from designer file to code-behind file.
 		/// </remarks>
-		protected global::umbraco.uicontrols.UmbracoPanel Panel1;
+		protected global::umbraco.uicontrols.TabView Panel1;
 
 		/// <summary>
 		/// Pane7 control.
@@ -271,6 +277,7 @@ namespace umbraco.cms.presentation.settings
 		/// To modify move field declaration from designer file to code-behind file.
 		/// </remarks>
 		protected global::umbraco.uicontrols.Pane Pane7;
+        protected global::umbraco.uicontrols.Pane Pane8;
 
 		/// <summary>
 		/// pp_name control.
diff --git a/src/umbraco.controls/CodeArea.cs b/src/umbraco.controls/CodeArea.cs
index b3dd048067..ec641693fb 100644
--- a/src/umbraco.controls/CodeArea.cs
+++ b/src/umbraco.controls/CodeArea.cs
@@ -35,6 +35,8 @@ namespace umbraco.uicontrols
         public bool AutoSuggest { get; set; }
         public string EditorMimeType { get; set; }
 
+        public ScrollingMenu Menu = new ScrollingMenu();
+
         public int OffSetX { get; set; }
         public int OffSetY { get; set; }
         public string Text
@@ -102,7 +104,8 @@ namespace umbraco.uicontrols
             }
 
             CodeTextBox.TextMode = TextBoxMode.MultiLine;
-            
+
+            this.Controls.Add(Menu);
             this.Controls.Add(CodeTextBox);
 
         }
@@ -137,9 +140,10 @@ namespace umbraco.uicontrols
             {
                 writer.WriteBeginTag("div");
                 writer.WriteAttribute("id", this.ClientID);
-                writer.WriteAttribute("class", this.CssClass);
+                writer.WriteAttribute("class", "umb-editor umb-codeeditor " + this.CssClass);
                 this.ControlStyle.AddAttributesToRender(writer);
                 writer.Write(HtmlTextWriter.TagRightChar);
+                Menu.RenderControl(writer);
                 CodeTextBox.RenderControl(writer);
                 writer.WriteEndTag("div");
 
@@ -154,6 +158,7 @@ namespace umbraco.uicontrols
                 {
                     //reduce the width if using code mirror because of the line numbers
                     OffSetX += 20;
+                    OffSetY += 50;
                 }
 
                 jsEventCode += @"   
@@ -216,7 +221,8 @@ namespace umbraco.uicontrols
                                                 lineNumbers: true" +
                                                 extraKeys + @"
                                                 });
-                                  
+                                    
+                                    //resizeTextArea(m_textEditor, " + OffSetX.ToString() + "," + OffSetY.ToString() + @");
                                     updateLineInfo(codeEditor);
                                 ";
 
diff --git a/src/umbraco.controls/DataAttributes.cs b/src/umbraco.controls/DataAttributes.cs
new file mode 100644
index 0000000000..e704844f28
--- /dev/null
+++ b/src/umbraco.controls/DataAttributes.cs
@@ -0,0 +1,35 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Web.UI;
+using System.Web.UI.HtmlControls;
+using System.Web.UI.WebControls;
+
+namespace umbraco.uicontrols
+{
+    public class DataAttributes : Dictionary<string,string>
+    {
+        public DataAttributes()
+        {
+            
+        }
+
+        public string Render()
+        {
+            var sb = new StringBuilder();
+            foreach(var keyval in this)
+            {
+                sb.Append("data-" + keyval.Key + "='" + keyval.Value + "' ");
+            }
+
+            return sb.ToString().Trim();
+        }
+
+        public void AppendTo(WebControl c)
+        {
+            foreach (var keyval in this)
+                c.Attributes.Add("data-" + keyval.Key, keyval.Value);
+        }
+    }
+}
diff --git a/src/umbraco.controls/MenuButton.cs b/src/umbraco.controls/MenuButton.cs
new file mode 100644
index 0000000000..72e08c91c3
--- /dev/null
+++ b/src/umbraco.controls/MenuButton.cs
@@ -0,0 +1,72 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+
+namespace umbraco.uicontrols
+{
+    public class MenuButton : System.Web.UI.WebControls.LinkButton
+    {
+        public MenuButtonType ButtonType { get; set; }
+        public DataAttributes Data { get; private set; }
+        public string Hotkey { get; set; }
+
+        public string Icon { get; set; }
+        
+        public MenuButton()
+        {
+            Data = new DataAttributes();
+            CssClass = "btn";
+        }
+
+
+        protected override void Render(System.Web.UI.HtmlTextWriter writer)
+        {
+            //setup a hotkey if present
+            if (ButtonType == MenuButtonType.Primary && String.IsNullOrEmpty(Hotkey))
+                Data.Add("shortcut", "ctrl+" + this.Text.ToLower()[0]);
+            else if (!String.IsNullOrEmpty(Hotkey))
+                Data.Add("shortcut", Hotkey);
+
+            Data.AppendTo(this);
+
+            string cssClass = "btn";
+            
+            if (Icon != null)
+            {
+                cssClass = "btn editorIcon";
+                var i = Icon.Trim('.');
+
+                if (!string.IsNullOrEmpty(i))
+                {
+                    this.ToolTip = this.Text;
+
+                    if (i.Contains("."))
+                        this.Text = "<img src='" + umbraco.IO.IOHelper.ResolveUrl(Icon) + "' alt='" + this.ToolTip + "'/> " + this.ToolTip;
+                    else
+                        this.Text = "<i class='icon icon-" + Icon.Replace("icon-", "") + "'></i> " + this.ToolTip;
+                }
+            }
+
+            cssClass += " btn-" + Enum.GetName(ButtonType.GetType(), ButtonType).ToLower();
+            this.CssClass = cssClass;
+
+
+            base.Render(writer);
+        }
+
+    }
+
+
+    public enum MenuButtonType
+    {
+        Default,
+        Primary,
+        Info,
+        Success,
+        Warning,
+        Danger,
+        Inverse,
+        Link
+    }
+}
diff --git a/src/umbraco.controls/MenuButtonI.cs b/src/umbraco.controls/MenuButtonI.cs
index 887a3d7af0..fac05ac49d 100644
--- a/src/umbraco.controls/MenuButtonI.cs
+++ b/src/umbraco.controls/MenuButtonI.cs
@@ -12,16 +12,9 @@ using ClientDependency.Core;
 
 namespace umbraco.uicontrols {
 
-	[ClientDependency(ClientDependencyType.Css, "menuicon/style.css", "UmbracoClient")]
     public class MenuImageButton : System.Web.UI.WebControls.ImageButton, MenuIconI {
         private string _OnClickCommand = "";
 
-
-        public override string ID {
-            get { return base.ID; }
-            set { base.ID = value; }
-        }
-
         public string AltText {
             get { return this.AlternateText; }
             set {
@@ -49,23 +42,19 @@ namespace umbraco.uicontrols {
             set { _OnClickCommand = value; }
         }
 
-        protected override void OnLoad(System.EventArgs EventArguments) {
+        protected override void CreateChildControls()
+        {
+            this.Width = Unit.Pixel(20);
+            this.Height = Unit.Pixel(20);
+            this.Style.Clear();
+            this.Attributes.Add("class", "btn btn-default editorIcon");
 
 
-            this.Width = Unit.Pixel(22);
-            this.Height = Unit.Pixel(23);
-            this.Style.Add("border", "0px");
-            this.Attributes.Add("class", "editorIcon");
-            this.Attributes.Add("onMouseover", "this.className='editorIconOver'");
-            this.Attributes.Add("onMouseout", "this.className='editorIcon'");
-            this.Attributes.Add("onMouseup", "this.className='editorIconOver'");
-            this.Attributes.Add("onMouseDown", "this.className='editorIconDown'");
-
-            if (_OnClickCommand != "") {
+            if (_OnClickCommand != "")
+            {
                 this.Attributes.Add("onClick", OnClickCommand);
             }
+            base.CreateChildControls();
         }
-
-
     }
 }
\ No newline at end of file
diff --git a/src/umbraco.controls/MenuSplitButton.cs b/src/umbraco.controls/MenuSplitButton.cs
new file mode 100644
index 0000000000..86d871cddf
--- /dev/null
+++ b/src/umbraco.controls/MenuSplitButton.cs
@@ -0,0 +1,72 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Web.UI.HtmlControls;
+using System.Web.UI.WebControls;
+
+namespace umbraco.uicontrols
+{
+    public class MenuSplitButton : Panel
+    {
+
+        public string Text { get; set; }
+        public List<HtmlAnchor> HtmlAnchors { get; set; }
+
+        public string OnClientClick { get; set; }    
+
+        public void AddLink(HtmlAnchor link)
+        {
+            if(HtmlAnchors == null)
+                HtmlAnchors = new List<HtmlAnchor>();
+
+            HtmlAnchors.Add(link);
+        }
+
+        protected override void Render(System.Web.UI.HtmlTextWriter writer)
+        {
+            writer.Write("</div>");
+            base.Render(writer);
+            this.Render(writer);
+            writer.Write("<div class='btn-group>");
+        }
+
+
+        protected override void OnLoad(EventArgs e)
+        {
+ 	        base.OnLoad(e);
+            base.CssClass = "btn-group";
+
+            HtmlButton btn = new HtmlButton();
+            btn.InnerText = Text;
+            btn.Attributes.Add("class", "btn");
+            this.Controls.Add(btn);
+
+            HtmlButton btnToggle = new HtmlButton();
+            btnToggle.InnerHtml = "<span class='caret'></span>";
+            btnToggle.Attributes.Add("class", "btn dropdown-toggl");
+            btnToggle.Attributes.Add("data-toggle", "dropdown");
+            this.Controls.Add(btnToggle);
+
+            Literal list = new Literal();
+            this.Controls.Add(list);
+
+            StringBuilder sb = new StringBuilder();
+            sb.Append("<ul class='dropdown-menu'>");
+
+            foreach (var htmlAnchor in HtmlAnchors)
+            {
+                sb.Append("<li><a ");
+                foreach (var attr in htmlAnchor.Attributes.Keys)
+                {
+                    sb.Append(attr + "='" + htmlAnchor.Attributes[attr.ToString()] + "' ");
+                }
+                sb.Append(">" + htmlAnchor.InnerText + "</a></li>");
+            }
+
+            sb.Append("</ul>");
+            list.Text = sb.ToString();
+        }
+
+    }
+}
diff --git a/src/umbraco.controls/Panel.cs b/src/umbraco.controls/Panel.cs
index 284d39a47f..d0d9607ec1 100644
--- a/src/umbraco.controls/Panel.cs
+++ b/src/umbraco.controls/Panel.cs
@@ -13,53 +13,16 @@ using umbraco.BusinessLogic;
 
 namespace umbraco.uicontrols
 {
-
-
-    [ClientDependency(ClientDependencyType.Javascript, "panel/javascript.js", "UmbracoClient")]
-    [ClientDependency(ClientDependencyType.Css, "panel/style.css", "UmbracoClient")]
-    public class UmbracoPanel : System.Web.UI.WebControls.Panel
+    public class UmbracoPanel : Panel
     {
         private ScrollingMenu _menu = new ScrollingMenu();
-
         public UmbracoPanel()
         {
 
         }
-
-		// do NOT append extension to cookie name, because it is used in umbraco/presentation/umbraco_client/Panel/javascript.js
-		static umbraco.BusinessLogic.StateHelper.Cookies.Cookie panelCookie = new StateHelper.Cookies.Cookie("UMB_PANEL", false); // was umbPanel_pWidth _pHeight
-
-        protected override void OnInit(EventArgs e)
-        {
-            // We can grab the cached window size from cookie values
-            if (AutoResize)
-            {
-				// zb-00004 #29956 : refactor cookies names & handling
-				if (panelCookie.HasValue)
-                {
-                    int pWidth = 0;
-                    int pHeight = 0;
-					string[] wh = panelCookie.GetValue().Split('x');
-
-					if (wh.Length > 0 && int.TryParse(wh[0], out pWidth))
-                        Width = Unit.Pixel(pWidth);
-
-					if (wh.Length > 1 && int.TryParse(wh[1], out pHeight))
-                        Height = Unit.Pixel(pHeight);
-                }
-            }
-
-            setupMenu();
-        }
-
-        protected override void OnLoad(System.EventArgs EventArguments)
+        public UmbracoPanel(object input)
         {
 
-            _menu.Visible = hasMenu;
-
-            if (_autoResize)
-                this.Page.ClientScript.RegisterStartupScript(this.GetType(), "PanelEvents", "jQuery(document).ready(function() {jQuery(window).load(function(){ resizePanel('" + this.ClientID + "', " + this.hasMenu.ToString().ToLower() + ",true); }) });", true);
-            //this.Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "PanelEvents", "<script type='text/javascript'>addEvent(window, \"load\", function(){ resizePanel('" + this.ClientID + "', " + this.hasMenu.ToString().ToLower() + "); }); addEvent(window, \"resize\", function(){ resizePanel('" + this.ClientID + "', " + this.hasMenu.ToString().ToLower() + "); });</script>");
         }
 
         private bool _hasMenu = false;
@@ -84,11 +47,9 @@ namespace umbraco.uicontrols
             get
             {
                 if (_text == "")
-                {
                     _text = "&nbsp;";
-                }
-                return _text;
 
+                return _text;
             }
             set { _text = value; }
         }
@@ -104,88 +65,64 @@ namespace umbraco.uicontrols
             get { return _menu; }
         }
 
-        internal void setupMenu()
+        protected override void OnInit(EventArgs e)
         {
-            _menu.ID = this.ID + "_menu";
-            if (this.Width.Value < 20)
-                this.Width = Unit.Pixel(24);
-            _menu.Width = (int)Unit.Pixel((int)this.Width.Value - 20).Value;
-            this.Controls.Add(_menu);
-
+            base.OnInit(e);
+            EnsureChildControls();
         }
 
-        protected override void Render(System.Web.UI.HtmlTextWriter writer)
+   
+        internal HtmlGenericControl header = new HtmlGenericControl();
+        internal HtmlGenericControl row = new HtmlGenericControl();
+        internal HtmlGenericControl leftcol = new HtmlGenericControl();
+        internal HtmlGenericControl rightcol = new HtmlGenericControl();
+        internal HtmlGenericControl title = new HtmlGenericControl();
+
+        internal HtmlGenericControl body = new HtmlGenericControl();
+
+        protected override void CreateChildControls()
         {
+            CssClass = "umb-panel form-horizontal";
+           ID = base.ClientID + "_container";
+
+            header.TagName = "div";
+            header.ID = base.ClientID + "_header";
+            header.Attributes.Add("class","umb-panel-header");
+            
+            row.TagName = "div";
+            row.Attributes.Add("class", "row-fluid");
+            header.Controls.Add(row);
+
+            leftcol.TagName = "span";
+            leftcol.Attributes.Add("class", "span4 umb-panel-header-meta");
+            title.TagName = "h1";
+            leftcol.Controls.Add(title);
+            
+            row.Controls.Add(leftcol);
+
+            rightcol.TagName = "span";
+            rightcol.Attributes.Add("class", "span8 umb-panel-header-meta");
+            rightcol.Controls.Add(Menu);
+            row.Controls.Add(rightcol);
+
+            body.TagName = "div";
+            body.Attributes.Add("class", "umb-panel-body umb-scrollable row-fluid");
+
+            Width = Unit.Empty;
+            Height = Unit.Empty;
+
+            Controls.AddAt(0,header);
+            
+            
             base.CreateChildControls();
-
-            try
-            {
-                if (System.Web.HttpContext.Current == null)
-                {
-                    writer.WriteLine("Number of child controls : " + this.Controls.Count);
-                }
-
-                //SD:NOTE: Removed any height / width changes because in Belle we don't want these set and there are not auto calculations. 
-                // when these are there the styles get all mucked up for legacy stuff
-                //writer.WriteLine("<div id=\"" + this.ClientID + "\" class=\"panel\" style=\"height:" + this.Height.Value + "px;width:" + this.Width.Value + "px;\">");
-                
-                writer.WriteLine("<div id=\"" + this.ClientID + "\" class=\"panel\" >");
-                writer.WriteLine("<div class=\"boxhead\">");
-                writer.WriteLine("<h2 id=\"" + this.ClientID + "Label\">" + this.Text + "</h2>");
-                writer.WriteLine("</div>");
-                writer.WriteLine("<div class=\"boxbody\">");
-
-                if (this.hasMenu)
-                {
-                    writer.WriteLine("<div id='" + this.ClientID + "_menubackground' class=\"menubar_panel\">");
-                    _menu.RenderControl(writer);
-                    writer.WriteLine("</div>");
-                }
-
-                int upHeight = (int)this.Height.Value - 46;
-                int upWidth = (int)this.Width.Value - 5;
-
-                if (this.hasMenu)
-                    upHeight = upHeight - 34;
-
-                //SD:NOTE: Removed any height / width changes because in Belle we don't want these set and there are not auto calculations. 
-                // when these are there the styles get all mucked up for legacy stuff
-                //writer.WriteLine("<div id=\"" + this.ClientID + "_content\" class=\"content\" style=\"width: auto; height:" + (upHeight) + "px;\">");
-
-                writer.WriteLine("<div id=\"" + this.ClientID + "_content\" class=\"content\" style=\"width: auto;\">");
-
-                string styleString = "";
-
-                foreach (string key in this.Style.Keys)
-                {
-                    styleString += key + ":" + this.Style[key] + ";";
-                }
-
-                writer.WriteLine("<div class=\"innerContent\" id=\"" + this.ClientID + "_innerContent\" style='" + styleString + "'>");
-                foreach (Control c in this.Controls)
-                {
-                    if (!(c.ID == _menu.ID))
-                    {
-                        c.RenderControl(writer);
-                    }
-                }
-
-                writer.WriteLine("</div>");
-                writer.WriteLine("</div>");
-                writer.WriteLine("</div>");
-                writer.WriteLine("<div class=\"boxfooter\"><div class=\"statusBar\"><h2>" + this.StatusBarText + "</h2></div></div>");
-                writer.WriteLine("</div>");
-
-                /*
-                if(_autoResize)
-                    writer.WriteLine("<script type=\"text/javascript\">jQuery(document).ready(function(){ resizePanel('" + this.ClientID + "', " + this.hasMenu.ToString().ToLower() + ");});</script>");
-                */
-
-            }
-            catch (Exception ex)
-            {
-                this.Page.Trace.Warn("Error rendering umbracopanel control" + ex.ToString());
-            }
         }
+        
+
+        protected override void OnLoad(EventArgs e)
+        {
+            base.OnLoad(e);
+            title.InnerHtml = Text;
+        }
+        
     }
 }
\ No newline at end of file
diff --git a/src/umbraco.controls/Property.cs b/src/umbraco.controls/Property.cs
index 06aaecaddb..1e9145c99e 100644
--- a/src/umbraco.controls/Property.cs
+++ b/src/umbraco.controls/Property.cs
@@ -1,10 +1,14 @@
 using System;
 using System.Collections.Generic;
 using System.Text;
+using System.Web.UI;
 
-namespace umbraco.uicontrols {
-    public class PropertyPanel  : System.Web.UI.WebControls.Panel {
-        public PropertyPanel() {
+namespace umbraco.uicontrols
+{
+    public class PropertyPanel : System.Web.UI.WebControls.Panel
+    {
+        public PropertyPanel()
+        {
 
         }
 
@@ -14,39 +18,50 @@ namespace umbraco.uicontrols {
             get { return m_Text; }
             set { m_Text = value; }
         }
-                
 
-        protected override void OnLoad(System.EventArgs EventArguments) {
+        protected override void OnLoad(System.EventArgs EventArguments)
+        {
         }
 
-        protected override void Render(System.Web.UI.HtmlTextWriter writer) {
-
+        protected override void Render(System.Web.UI.HtmlTextWriter writer)
+        {
+            this.ViewStateMode = ViewStateMode.Disabled;
             this.CreateChildControls();
             string styleString = "";
 
-            foreach (string key in this.Style.Keys) {
+            foreach (string key in this.Style.Keys)
+            {
                 styleString += key + ":" + this.Style[key] + ";";
             }
 
-            writer.WriteLine("<div class=\"propertyItem\" style='" + styleString + "'>");
-            if (m_Text != string.Empty) {
-                writer.WriteLine("<div class=\"propertyItemheader\">" + m_Text + "</div>");
-                writer.WriteLine("<div class=\"propertyItemContent\">");
+            var inGroup = this.Parent.GetType() == typeof(PropertyGroup);
+
+            if (string.IsNullOrEmpty(m_Text))
+                CssClass += " hideLabel";
+
+          
+            writer.WriteLine("<div class=\"umb-el-wrap " + CssClass + "\">");
+
+
+            if (m_Text != string.Empty)
+            {
+                writer.WriteLine("<label class=\"control-label\" for=\"inputPassword\">" + m_Text + "</label>");
             }
 
-            try {
+            writer.WriteLine("<div class=\"controls controls-row\">");
+
+            try
+            {
                 this.RenderChildren(writer);
-            } catch (Exception ex) {
+            }
+            catch (Exception ex)
+            {
                 writer.WriteLine("Error creating control <br />");
                 writer.WriteLine(ex.ToString());
             }
 
-            if (m_Text != string.Empty)
-                writer.WriteLine("</div>");
+            writer.WriteLine("</div></div>");
 
-            writer.WriteLine("</div>");
-            
-            
         }
 
     }
diff --git a/src/umbraco.controls/PropertyGroup.cs b/src/umbraco.controls/PropertyGroup.cs
new file mode 100644
index 0000000000..7220e78993
--- /dev/null
+++ b/src/umbraco.controls/PropertyGroup.cs
@@ -0,0 +1,56 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Web.UI;
+
+namespace umbraco.uicontrols
+{
+    public class PropertyGroup : System.Web.UI.WebControls.Panel
+    {
+        protected override void Render(System.Web.UI.HtmlTextWriter writer)
+        {
+            this.ViewStateMode = ViewStateMode.Disabled;
+            this.CreateChildControls();
+            string styleString = "";
+
+            foreach (string key in this.Style.Keys)
+            {
+                styleString += key + ":" + this.Style[key] + ";";
+            }
+
+            writer.WriteLine("<div class=\"control-group umb-control-group\" style='" + styleString + "'>");
+
+            try
+            {
+                this.RenderChildren(writer);
+            }
+            catch (Exception ex)
+            {
+                writer.WriteLine("Error creating control <br />");
+                writer.WriteLine(ex.ToString());
+            }
+
+            writer.WriteLine("</div>");
+        }
+
+        public void addProperty(string Caption, Control C)
+        {
+
+            PropertyPanel pp = new PropertyPanel();
+            pp.Controls.Add(C);
+            pp.Text = Caption;
+
+            this.Controls.Add(pp);
+        }
+
+        public void addProperty(Control ctrl)
+        {
+
+            PropertyPanel pp = new PropertyPanel();
+            pp.Controls.Add(ctrl);
+            this.Controls.Add(pp);
+        }
+
+    }
+}
diff --git a/src/umbraco.controls/ScrollingMenu.cs b/src/umbraco.controls/ScrollingMenu.cs
index 5544001442..e5c21614ef 100644
--- a/src/umbraco.controls/ScrollingMenu.cs
+++ b/src/umbraco.controls/ScrollingMenu.cs
@@ -9,84 +9,103 @@ using System.Web.UI;
 using System.Web.UI.WebControls;
 using System.Web.UI.HtmlControls;
 using ClientDependency.Core;
-using Umbraco.Core.IO;
+using umbraco.IO;
 
 
-namespace umbraco.uicontrols {
+namespace umbraco.uicontrols
+{
 
-    [ToolboxData("<{0}:ScrollingMenu runat=server></{0}:ScrollingMenu>")]    
-	[ClientDependency(ClientDependencyType.Javascript, "scrollingmenu/javascript.js", "UmbracoClient")]
-	[ClientDependency(ClientDependencyType.Css, "scrollingmenu/style.css", "UmbracoClient")]
-	public class ScrollingMenu : System.Web.UI.WebControls.WebControl 
-	{
-        private readonly ArrayList _icons = new ArrayList();
-        private string _iconIds;
-        private int _extraMenuWidth = 0;
-        private readonly string _clientFilesPath = IOHelper.ResolveUrl( SystemDirectories.UmbracoClient) + "/scrollingmenu/";
+    [ToolboxData("<{0}:ScrollingMenu runat=server></{0}:ScrollingMenu>")]
+    public class ScrollingMenu : System.Web.UI.WebControls.PlaceHolder
+    {
+        public ArrayList Icons = new ArrayList();
+        private string iconIds;
+        private int extraMenuWidth = 0;
 
-        public MenuIconI NewIcon(int index) 
-		{
+        public MenuIconI NewIcon(int Index)
+        {
+            MenuIcon Icon = new MenuIcon();
+            Icons.Insert(Index, Icon);
+            return Icon;
+        }
+
+        public MenuIconI NewIcon()
+        {
             MenuIcon icon = new MenuIcon();
-            _icons.Insert(index, icon);
+            Icons.Add(icon);
             return icon;
         }
 
-        public MenuIconI NewIcon() 
-		{
-            MenuIcon icon = new MenuIcon();
-            _icons.Add(icon);
-            return icon;
+        public MenuSplitButton NewSplitButton()
+        {
+            var menu = new MenuSplitButton();
+            Icons.Add(menu);
+            return menu;
         }
 
-        public MenuImageButton NewImageButton() 
-		{
+        public MenuButton NewButton(int index = -1)
+        {
+            MenuButton btn = new MenuButton();
+
+            if (index > -1)
+                Icons.Insert(index, btn);
+            else
+                Icons.Add(btn);
+
+            return btn;
+        }
+
+        public MenuImageButton NewImageButton()
+        {
             MenuImageButton icon = new MenuImageButton();
-            _icons.Add(icon);
+            Icons.Add(icon);
             return icon;
         }
 
-        public MenuImageButton NewImageButton(int index) 
-		{
+        public MenuImageButton NewImageButton(int Index)
+        {
             MenuImageButton icon = new MenuImageButton();
-            _icons.Insert(index, icon);
+            Icons.Insert(Index, icon);
             return icon;
         }
 
-        public DropDownList NewDropDownList() 
-		{
-            DropDownList icon = new DropDownList();
-            _icons.Add(icon);
-            return icon;
-        }
-        
-		public void NewElement(string elementName, string elementId, string elementClass, int extraWidth) 
-		{
-            _icons.Add(new LiteralControl("<" + elementName + " class=\"" + elementClass + "\" id=\"" + elementId + "\"></" + elementName + ">"));
-            _extraMenuWidth = _extraMenuWidth + extraWidth;
+
+        public System.Web.UI.WebControls.DropDownList NewDropDownList()
+        {
+            DropDownList Icon = new DropDownList();
+            Icons.Add(Icon);
+            return Icon;
         }
 
-	    /// <summary>
-	    /// Inserts a new web control into the scrolling menu
-	    /// </summary>
-	    /// <param name="control"></param>
-	    /// <param name="extraWidth">The additional width to extend the scrolling menu by if the control being inserted is wider than the standard</param>
-	    public void InsertNewControl(Control control, int extraWidth = 0)
-		{
-			_icons.Add(control);
-			_extraMenuWidth = _extraMenuWidth + extraWidth;
-		}
+        public void NewElement(string ElementName, string ElementId, string ElementClass, int ExtraWidth)
+        {
+            Icons.Add(new LiteralControl("<" + ElementName + " class=\"" + ElementClass + "\" id=\"" + ElementId + "\"></" + ElementName + ">"));
+            extraMenuWidth = extraMenuWidth + ExtraWidth;
+        }
 
-        public void InsertSplitter() 
-		{
+        public void InsertSplitter()
+        {
             Splitter icon = new Splitter();
-            _icons.Add(icon);
+            Icons.Add(icon);
         }
-        public void InsertSplitter(int index) 
-		{
+        public void InsertSplitter(int Index)
+        {
             Splitter icon = new Splitter();
-            _icons.Insert(index, icon);
+            Icons.Insert(Index, icon);
         }
 
+        /// <summary>
+        /// Inserts a new web control into the scrolling menu
+        /// </summary>
+        /// <param name="control"></param>
+        /// <param name="extraWidth">The additional width to extend the scrolling menu by if the control being inserted is wider than the standard</param>
+        public void InsertNewControl(Control control, int extraWidth = 0)
+        {
+           Icons.Add(control);
+           // _extraMenuWidth = _extraMenuWidth + extraWidth;
+        }
+
+
         /// <summary>
         /// Finds the index of the n-th Splitter in this Menu
         /// </summary>
@@ -95,115 +114,54 @@ namespace umbraco.uicontrols {
         public int FindSplitter(int n)
         {
             var count = 0;
-            for(var i=0; i<_icons.Count; i++)
+            for (var i = 0; i < Icons.Count; i++)
             {
-               if (_icons[i].GetType() == typeof(Splitter))
-               {
-                   count++;
+                if (Icons[i].GetType() == typeof(Splitter))
+                {
+                    count++;
 
-                   if (count == n)
-                       return i;
-               }
+                    if (count == n)
+                        return i;
+                }
             }
 
             return -1;
         }
 
-        protected override void OnLoad(EventArgs e) 
-		{
-			base.OnLoad(e);
-            if (base.Visible)
+
+        private HtmlGenericControl toolbar;
+        private HtmlGenericControl wrap;
+        private HtmlGenericControl group;
+
+        protected override void CreateChildControls()
+        {   
+            toolbar = new HtmlGenericControl { TagName = "div" };
+            toolbar.Attributes.Add("class", "btn-toolbar umb-btn-toolbar");
+            this.Controls.Add(toolbar);
+
+            group = new HtmlGenericControl { TagName = "div", ID = this.ClientID + "_group" };
+            group.Attributes.Add("class", "btn-group");
+            toolbar.Controls.Add(group);
+        }
+
+        protected override void OnLoad(EventArgs e)
+        {
+            foreach (Control item in Icons)
             {
-                SetupMenu();                
+                group.Controls.Add(item);
+                if (item.ID != "")
+                    iconIds = iconIds + item.ID + ",";
             }
+            base.OnLoad(e);
         }
+        
+       
 
-        private static System.Web.UI.WebControls.Image ScrollImage() 
-		{
-            System.Web.UI.WebControls.Image functionReturnValue = null;
-            functionReturnValue = new System.Web.UI.WebControls.Image();
-            functionReturnValue.Width = Unit.Pixel(7);
-            functionReturnValue.Height = Unit.Pixel(20);
-            functionReturnValue.BorderWidth = Unit.Pixel(0);
-            functionReturnValue.Attributes.Add("align", "absMiddle");
-            functionReturnValue.CssClass = "editorArrow";
-            functionReturnValue.Attributes.Add("onMouseOut", "this.className = 'editorArrow'; scrollStop();");
-            return functionReturnValue;
-        }
-
-        private void SetupMenu() 
-		{
-            // Calculate innerlayer max width 32 pixel per icon
-            var scrollingLayerWidth = _icons.Count * 26 + _extraMenuWidth;
-
-            Table container = new Table();
-            container.ID = String.Format("{0}_tableContainer", this.ID);
-            TableRow tr = new TableRow();
-            tr.ID = String.Format("{0}_tableContainerRow", this.ID);
-            container.Rows.Add(tr);
-
-            // // scroll-left image
-            TableCell td = new TableCell();
-            td.ID = String.Format("{0}_tableContainerLeft", this.ID);
-            System.Web.UI.WebControls.Image scrollL = ScrollImage();
-            scrollL.ImageUrl = _clientFilesPath + "images/arrawBack.gif";
-            scrollL.Attributes.Add("onMouseOver", "this.className = 'editorArrowOver'; scrollR('" + this.ClientID + "_sl','" + this.ClientID + "_slh'," + scrollingLayerWidth + ");");
-            td.Controls.Add(scrollL);
-            tr.Cells.Add(td);
-
-            // // Menulayers
-            td = new TableCell();
-            td.ID = String.Format("{0}_tableContainerButtons", this.ID);
-
-            HtmlGenericControl outerLayer = new HtmlGenericControl();
-            outerLayer.TagName = "div";
-            outerLayer.ID = this.ID + "_slh";
-            outerLayer.Attributes.Add("class", "slh");
-            outerLayer.Style.Add("height", "26px");
-            string tmp = this.Width.ToString();
-
-            outerLayer.Style.Add("width", (this.Width.Value - 18).ToString() + "px");
-            td.Controls.Add(outerLayer);
-
-            HtmlGenericControl menuLayer = new HtmlGenericControl();
-            menuLayer.TagName = "div";
-            menuLayer.ID = this.ID + "_sl";
-            menuLayer.Style.Add("top", "0px");
-            menuLayer.Style.Add("left", "0px");
-            menuLayer.Attributes.Add("class", "sl");
-            menuLayer.Style.Add("height", "26px");
-            menuLayer.Style.Add("width", scrollingLayerWidth + "px");
-
-            HtmlGenericControl nobr = new HtmlGenericControl();
-            nobr.TagName = "nobr";
-            nobr.ID = String.Format("{0}_nobr", this.ID);
-            menuLayer.Controls.Add(nobr);
-
-            // // add all icons to the menu layer
-            foreach (Control item in _icons) {
-                menuLayer.Controls.Add(item);
-
-                if (item.ID != "") {
-                    _iconIds = _iconIds + item.ID + ",";
-                }
-            }
-
-            outerLayer.Controls.Add(new LiteralControl("<script>RegisterScrollingMenuButtons('" + this.ClientID + "', '" + _iconIds + "');</script>"));
-
-            outerLayer.Controls.Add(menuLayer);
-
-            tr.Cells.Add(td);
-
-            // // scroll-right image
-            td = new TableCell();
-            td.ID = String.Format("{0}_tableContainerRight", this.ID);
-            System.Web.UI.WebControls.Image scrollR = ScrollImage();
-            scrollR.ImageUrl = _clientFilesPath + "images/arrowForward.gif";
-            scrollR.Attributes.Add("onMouseOver", "this.className = 'editorArrowOver'; scrollL('" + this.ClientID + "_sl','" + this.ClientID + "_slh'," + scrollingLayerWidth + ");");
-            td.Controls.Add(scrollR);
-            tr.Cells.Add(td);
-
-            this.Controls.Add(container);
+        protected override void OnInit(EventArgs e)
+        {
+            
+            EnsureChildControls();
+            base.OnInit(e);
         }
 
     }
diff --git a/src/umbraco.controls/TabPage.cs b/src/umbraco.controls/TabPage.cs
index 3cf43b78ab..117650837d 100644
--- a/src/umbraco.controls/TabPage.cs
+++ b/src/umbraco.controls/TabPage.cs
@@ -20,6 +20,10 @@ namespace umbraco.uicontrols {
         protected LiteralControl ErrorHeaderControl = new LiteralControl();
         private readonly ValidationSummary _vs = new ValidationSummary();
         private readonly Control _tempErr = new Control();
+        internal TabView parent;
+
+
+        public string Text { get; set; }
 
         internal TabPage()
         {
@@ -33,25 +37,17 @@ namespace umbraco.uicontrols {
 
         public string ErrorHeader { get; set; }
         public string CloseCaption { get; set; }
+        public bool Active { get; set; }
 
         public Control ErrorControl
         {
             get { return _tempErr; }
         }
 
-        protected override void OnLoad(EventArgs e)
-        {
-            if (this.HasMenu)
-            {
-                Menu.Width = Unit.Pixel((int) this.Width.Value - 12);
-                _menu.ID = this.ID + "_menu";
-                this.Controls.Add(_menu);
-            }
-        }
-
         protected override void OnInit(EventArgs e)
         {
             base.OnInit(e);
+            
             _vs.ShowSummary = true;
             _vs.Attributes.Remove("style");
             _vs.Style.Clear();
@@ -70,10 +66,9 @@ namespace umbraco.uicontrols {
             this.Controls.Add(_tempErr);
         }
 
-
         public ScrollingMenu Menu
         {
-            get { return _menu; }
+            get { return parent.Menu; }
         }
 
         public bool HasMenu
@@ -82,42 +77,20 @@ namespace umbraco.uicontrols {
             set { _hasMenu = value; }
         }
 
-        protected override void Render(HtmlTextWriter writer)
+        protected override void Render(System.Web.UI.HtmlTextWriter writer)
         {
             ErrorHeaderControl.Text = ErrorHeader;
-            CreateChildControls();
-            writer.WriteLine("<div id='" + this.ClientID + "' class='tabpage'>");
-            if (HasMenu)
-            {
-                writer.WriteLine("<div class='menubar'>");
-                Menu.Width = this.Width;
-                Menu.RenderControl(writer);
-                writer.WriteLine("</div>");
-            }
-            var scrollingLayerHeight = (int) ((WebControl) this.Parent).Height.Value - 22;
-            var scrollingLayerWidth = (int) ((WebControl) this.Parent).Width.Value;
-            if (HasMenu)
-                scrollingLayerHeight = scrollingLayerHeight - 28;
-            writer.WriteLine("<div class='tabpagescrollinglayer' id='" + this.ClientID + "_contentlayer' style='height:" + scrollingLayerHeight + "px;width:" + scrollingLayerWidth + "px'>");
+           
 
-            string styleString = "";
-            foreach (string key in this.Style.Keys)
-            {
-                styleString += key + ":" + this.Style[key] + ";";
-            }
+            var activeClass = "active";
+            if (!Active)
+                activeClass = "";
 
-            writer.WriteLine("<div class=\"tabpageContent\" style='" + styleString + "'>");
+            writer.WriteLine("<div id='" + this.ID + "' class='umb-tab-pane tab-pane form-horizontal " + activeClass + " " + CssClass + "'>");
+            writer.WriteLine("<div class='umb-tab-pane-inner' id='" + this.ClientID + "_contentlayer'>");
 
-            _tempErr.RenderControl(writer);
+            this.RenderChildren(writer);
 
-            foreach (Control C in this.Controls)
-            {
-                if (C.ClientID != _menu.ClientID && C.ClientID != _tempErr.ClientID)
-                {
-                    C.RenderControl(writer);
-                }
-            }
-            writer.WriteLine("</div>");
             writer.WriteLine("</div>");
             writer.WriteLine("</div>");
         }
diff --git a/src/umbraco.controls/TabView.cs b/src/umbraco.controls/TabView.cs
index dfd9b7f9a7..856a327381 100644
--- a/src/umbraco.controls/TabView.cs
+++ b/src/umbraco.controls/TabView.cs
@@ -1,40 +1,110 @@
 using System;
 using System.Collections;
+using System.Collections.Generic;
 using System.ComponentModel;
 using System.Data;
 using System.Drawing;
+using System.Linq;
 using System.Web;
 using System.Web.SessionState;
 using System.Web.UI;
 using System.Web.UI.WebControls;
 using ClientDependency.Core;
+using System.Web.UI.HtmlControls;
 
 namespace umbraco.uicontrols {
 
-	[ClientDependency(ClientDependencyType.Javascript, "tabview/javascript.js", "UmbracoClient")]
-	[ClientDependency(ClientDependencyType.Css, "tabview/style.css", "UmbracoClient")]
-	[ClientDependency(0, ClientDependencyType.Javascript, "Application/NamespaceManager.js", "UmbracoClient")]
-	public class TabView : WebControl
+	public class TabView : umbraco.uicontrols.UmbracoPanel
 	{
-	    private readonly ArrayList _tabs = new ArrayList();
+	    public readonly ArrayList Tabs = new ArrayList();
 		protected ArrayList Panels = new ArrayList();
+        protected Dictionary<string, TabPage> TabPages = new Dictionary<string, TabPage>();
+
 		private string _status = "";
 
+        private HtmlGenericControl _tabList = new HtmlGenericControl();
+        private HtmlGenericControl _body = new HtmlGenericControl();
+        private HtmlGenericControl _tabsHolder = new HtmlGenericControl();
+        
+        protected override void CreateChildControls()
+        {
+            base.CreateChildControls();
+
+            _tabList.TagName = "ul";
+            _tabList.Attributes.Add("class", "nav nav-tabs umb-nav-tabs span12");
+            base.row.Controls.Add(_tabList);
+
+            _body.TagName = "div";
+            _body.Attributes.Add("class", "umb-panel-body umb-scrollable row-fluid");
+            base.Controls.Add(_body);
+
+            _tabsHolder.TagName = "div";
+            _tabsHolder.Attributes.Add("class", "tab-content form-horizontal umb-tab-content");
+            _tabsHolder.ID = this.ID + "_content";
+            _body.Controls.Add(_tabsHolder);
+            
+            for (int i = 0; i < Tabs.Count; i++)
+            {
+                var tabPage = TabPages.ElementAt(i).Value;
+                _tabsHolder.Controls.Add(tabPage);
+            }
+        }
+
+        protected override void OnInit(EventArgs e)
+        {   
+            base.OnInit(e);
+            base.CssClass = "umb-panel tabbable";
+        }
+
+        protected override void OnLoad(EventArgs e)
+        {
+            base.OnLoad(e);
+
+            if (string.IsNullOrEmpty(Text))
+                Text = " ";
+
+            
+            for (int i = 0; i < Tabs.Count; i++)
+            {
+                var tabPage = TabPages.ElementAt(i).Value;
+                string tabPageCaption = tabPage.Text;
+                string tabId = tabPage.ID;
+                
+                HtmlGenericControl li = new HtmlGenericControl();
+                li.TagName = "li";
+                if (tabId == ActiveTabId)
+                    li.Attributes.Add("class", "active");
+                _tabList.Controls.Add(li);
+
+                HtmlGenericControl a = new HtmlGenericControl();
+                a.TagName = "a";
+                a.Attributes.Add("href", "#"+tabId);
+                a.Attributes.Add("data-toggle", "tab");
+                a.InnerText = tabPageCaption;
+                li.Controls.Add(a);
+            }
+        }
+
 	    public ArrayList GetPanels()
 	    {
 	        return Panels;
 	    }
 
-	    public TabPage NewTabPage(string text)
-	    {
-	        _tabs.Add(text);
-	        var tp = new TabPage();
-	        tp.Width = this.Width;
-	        tp.ID = this.ID + "_tab0" + (Panels.Count + 1) + "layer";
-	        Panels.Add(tp);
-	        this.Controls.Add(tp);
-	        return tp;
-	    }
+        public TabPage NewTabPage(string text)
+        {
+            Tabs.Add(text);
+            TabPage tp = new TabPage();
+            tp.Width = this.Width;
+            tp.ID = "tab0" + (TabPages.Count + 1);
+            tp.Text = text;
+            tp.parent = this;
+
+            Panels.Add(tp);
+            TabPages.Add(tp.ID, tp);
+
+            _tabsHolder.Controls.Add(tp);
+            return tp;
+        }
 
 
 	    public string Status
@@ -44,49 +114,25 @@ namespace umbraco.uicontrols {
 	    }
 
 	    private bool _autoResize = true;
-
-	    public bool AutoResize
+        public bool AutoResize
 	    {
 	        get { return _autoResize; }
 	        set { _autoResize = value; }
 	    }
 
-	    private string ActiveTabId
-	    {
-	        get
-	        {
-	            if (this.Parent.Page.IsPostBack)
-	            {
-	                return this.Parent.Page.Request.Form[this.ClientID + "_activetab"];
-	            }
-	            return this.ClientID + "_tab01";
-	        }
-	    }
-
-	    protected override void OnPreRender(EventArgs e)
-	    {
-	        base.OnPreRender(e);
-	        SetupClientScript();
-	    }
-
-	    private void SetupClientScript()
-	    {
-	        string strTmp = "";
-	        for (int i = 1; i <= _tabs.Count; i++)
-	        {
-	            if (i > 1)
-	                strTmp += ",";
-	            strTmp += "\"" + this.ClientID + "_tab0" + i + "\"";
-	        }
-	        this.Page.ClientScript.RegisterStartupScript(
-	            this.GetType(),
-	            this.ClientID + "TabCollection", ";var " + this.ClientID + "_tabs = new Array(" + strTmp + ");setActiveTab('" + this.ClientID + "','" + this.ActiveTabId + "'," + this.ClientID + "_tabs);",
-	            true);
-
-	        if (_autoResize)
-	            this.Page.ClientScript.RegisterStartupScript(this.GetType(), "TabviewEvents", "jQuery(document).ready(function(){resizeTabView(" + this.ClientID + "_tabs, '" + this.ClientID + "'); }); jQuery(window).resize(function(){ resizeTabView(" + this.ClientID + "_tabs, '" + this.ClientID + "'); });", true);
-	    }
-
+        private string ActiveTabId
+        {
+            get
+            {
+                if (this.Parent.Page.IsPostBack)
+                {
+                    return this.Parent.Page.Request.Form[this.ClientID + "_activetab"];
+                }
+                return "tab01";
+            }
+        }
+        
+        /*
 	    protected override void Render(HtmlTextWriter writer)
 	    {
 	        writer.WriteLine("<div id='" + this.ClientID + "' style='height:" + this.Height.Value + "px;width:" + this.Width.Value + "px;'>");
@@ -110,6 +156,6 @@ namespace umbraco.uicontrols {
 	        writer.WriteLine("\t<div class='footer'><div class='status'><h2>" + this._status + "</h2></div></div>");
 	        writer.WriteLine("</div>");
 	        writer.WriteLine("<input type='hidden' name='" + this.ClientID + "_activetab' id='" + this.ClientID + "_activetab' value='" + this.ActiveTabId + "'/>");
-	    }
+	    }*/
 	}
 }
\ No newline at end of file
diff --git a/src/umbraco.controls/pane.cs b/src/umbraco.controls/pane.cs
index c8cead69a5..8c6b46d40b 100644
--- a/src/umbraco.controls/pane.cs
+++ b/src/umbraco.controls/pane.cs
@@ -10,16 +10,15 @@ using System.Web.UI.WebControls;
 using System.Web.UI.HtmlControls;
 using ClientDependency.Core;
 
-namespace umbraco.uicontrols {
+namespace umbraco.uicontrols
+{
 
-	[ClientDependency(ClientDependencyType.Css, "propertypane/style.css", "UmbracoClient")]
-    public class Pane : System.Web.UI.WebControls.Panel {
+    public class Pane : System.Web.UI.WebControls.Panel
+    {
 
-        private TableRow tr = new TableRow();
-        private TableCell td = new TableCell();
-        private Table tbl = new Table();
 
-        public Pane() {
+        public Pane()
+        {
 
         }
 
@@ -31,25 +30,9 @@ namespace umbraco.uicontrols {
         }
 
 
-        public void addProperty(string Caption, Control C) {
-            /*
-            tr = new TableRow();
-            td = new TableCell();
-            td.Text = Caption;
-            td.Attributes.Add("width", "15%");
-            td.Attributes.Add("valign", "top");
-            td.Attributes.Add("class", "propertyHeader");
-            tr.Cells.Add(td);
-                        
-            td = new TableCell();
-            td.Attributes.Add("class", "propertyContent");
-            td.Controls.Add(C);
-            tr.Cells.Add(td);
+        public void addProperty(string Caption, Control C)
+        {
 
-            tbl.Rows.Add(tr);
-            if (!this.Controls.Contains(tbl)) {
-                this.Controls.Add(tbl);
-            }*/
             PropertyPanel pp = new PropertyPanel();
             pp.Controls.Add(C);
             pp.Text = Caption;
@@ -57,55 +40,50 @@ namespace umbraco.uicontrols {
             this.Controls.Add(pp);
         }
 
-        public void addProperty(Control ctrl) {
-            /*
-            tr = new TableRow();
-            td = new TableHeaderCell();
-            td.ColumnSpan = 2;
-            td.Attributes.Add("width", "100%");
-            td.Attributes.Add("valign", "top");
-            td.Attributes.Add("class", "propertyContent");
-            td.Controls.Add(ctrl);
-            tr.Cells.Add(td);
-            tbl.Rows.Add(tr);
-            if (!this.Controls.Contains(tbl)) {
-                this.Controls.Add(tbl);
-            }
-             */
+        public void addProperty(Control ctrl)
+        {
 
             PropertyPanel pp = new PropertyPanel();
             pp.Controls.Add(ctrl);
             this.Controls.Add(pp);
-       }
+        }
 
 
-        protected override void OnLoad(System.EventArgs EventArguments) {
+        protected override void OnLoad(System.EventArgs EventArguments)
+        {
 
         }
 
-        protected override void Render(System.Web.UI.HtmlTextWriter writer) {
-
+        protected override void Render(System.Web.UI.HtmlTextWriter writer)
+        {
+            this.ViewStateMode = ViewStateMode.Disabled;
             this.CreateChildControls();
+
             string styleString = "";
 
-            foreach (string key in this.Style.Keys) {
+            foreach (string key in this.Style.Keys)
+            {
                 styleString += key + ":" + this.Style[key] + ";";
             }
 
-            if (!string.IsNullOrEmpty(m_Text))
-                writer.WriteLine("<h2 class=\"propertypaneTitel\">" + m_Text + "</h2>");
-            
-            writer.WriteLine("<div class=\"propertypane\" style='" + styleString + "'>");
-            writer.WriteLine("<div>");
+            writer.WriteLine("<div class=\"umb-pane\" style='" + styleString + "'>");
+            writer.WriteLine("<div class=\"control-group umb-control-group\" style='" + styleString + "'>");
 
-            try {
+            if (!string.IsNullOrEmpty(m_Text))
+                writer.WriteLine("<p class=\"umb-abstract\">" + m_Text + "</p>");
+
+            try
+            {
                 this.RenderChildren(writer);
-            } catch (Exception ex) {
+            }
+            catch (Exception ex)
+            {
                 writer.WriteLine("Error creating control <br />");
                 writer.WriteLine(ex.ToString());
             }
 
-            writer.WriteLine("<div class='propertyPaneFooter'>-</div></div></div>");
+            writer.WriteLine("</div>");
+            writer.WriteLine("</div>");
 
         }
 
diff --git a/src/umbraco.controls/umbraco.controls.csproj b/src/umbraco.controls/umbraco.controls.csproj
index 45da49cdad..c8ec886edf 100644
--- a/src/umbraco.controls/umbraco.controls.csproj
+++ b/src/umbraco.controls/umbraco.controls.csproj
@@ -89,8 +89,11 @@
     <Compile Include="..\SolutionInfo.cs">
       <Link>Properties\SolutionInfo.cs</Link>
     </Compile>
+    <Compile Include="DataAttributes.cs" />
     <Compile Include="DatePicker\DateTimePicker.cs" />
     <Compile Include="FieldDropDownList.cs" />
+    <Compile Include="MenuButton.cs" />
+    <Compile Include="MenuSplitButton.cs" />
     <Compile Include="ProgressBar.cs" />
     <Compile Include="TreePicker\BaseTreePicker.cs" />
     <Compile Include="TreePicker\BaseTreePickerScripts.Designer.cs">
@@ -141,6 +144,7 @@
     </ProjectReference>
   </ItemGroup>
   <ItemGroup>
+    <Compile Include="PropertyGroup.cs" />
     <Content Include="TreePicker\BaseTreePicker.js" />
   </ItemGroup>
   <ItemGroup>