From fd2b9ce67dadb1383d987b02d8a51ff186b34c92 Mon Sep 17 00:00:00 2001
From: antoine <antoine@lecoati.com>
Date: Tue, 27 May 2014 12:37:43 +0200
Subject: [PATCH 1/4] /umbraco/dialogs/tuning.aspx removed

---
 src/Umbraco.Web.UI/Umbraco.Web.UI.csproj | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj b/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj
index 40ddecb06f..9660654391 100644
--- a/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj
+++ b/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj
@@ -537,7 +537,6 @@
     <Compile Include="Umbraco\TreeInit.aspx.designer.cs">
       <DependentUpon>treeInit.aspx</DependentUpon>
     </Compile>
-    <Content Include="Umbraco\Dialogs\tuning.aspx" />
     <Content Include="Umbraco\Install\Legacy\loadStarterKits.ascx" />
     <Content Include="Umbraco\ClientRedirect.aspx" />
     <Content Include="Umbraco\create.aspx" />

From 6382515258e63a57082a849c74ed05944ce044e3 Mon Sep 17 00:00:00 2001
From: antoine <antoine@lecoati.com>
Date: Wed, 28 May 2014 11:29:08 +0200
Subject: [PATCH 2/4] Device preview always enable

---
 src/Umbraco.Web.UI/Umbraco/js/tuning.panel.js | 64 ++++++++++---------
 src/Umbraco.Web.UI/Umbraco/preview/index.html |  8 +--
 2 files changed, 39 insertions(+), 33 deletions(-)

diff --git a/src/Umbraco.Web.UI/Umbraco/js/tuning.panel.js b/src/Umbraco.Web.UI/Umbraco/js/tuning.panel.js
index 618a3b3a81..5181956345 100644
--- a/src/Umbraco.Web.UI/Umbraco/js/tuning.panel.js
+++ b/src/Umbraco.Web.UI/Umbraco/js/tuning.panel.js
@@ -44,7 +44,7 @@ var setFrameIsLoaded = function (tuningParameterUrl) {
     console.info("iframe id loaded " + tuningParameterUrl);
     var scope = angular.element($("#tuningPanel")).scope();
     scope.tuningParameterUrl = tuningParameterUrl;
-    scope.frameLoaded++;
+    scope.enableTuning++;
     scope.frameFirstLoaded = true;
     scope.$apply();
 }
@@ -60,8 +60,12 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
 .controller("Umbraco.tuningController", function ($scope, $modal, $http, $window, $timeout, $location) {
 
     $scope.isOpen = false;
-    $scope.frameLoaded = 0;
+
+    $scope.frameLoaded = false;
+    $scope.enableTuning = 0;
     $scope.frameFirstLoaded = false;
+
+
     $scope.tuningParameterUrl = "";
     $scope.schemaFocus = "body";
     $scope.settingIsOpen = 'previewDevice';
@@ -128,28 +132,31 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
     // Refresh all less parameters for every changes watching tuningModel 
     var refreshtuning = function () {
         var parameters = [];
-        $.each($scope.tuningModel.categories, function (indexCategory, category) {
-            $.each(category.sections, function (indexSection, section) {
-                $.each(section.subSections, function (indexSubSection, subSection) {
-                    $.each(subSection.fields, function (indexField, field) {
 
-                        // value
-                        parameters.splice(parameters.length + 1, 0, "'@" + field.alias + "':'" + field.value + "'");
+        if ($scope.tuningModel) {
+            $.each($scope.tuningModel.categories, function (indexCategory, category) {
+                $.each(category.sections, function (indexSection, section) {
+                    $.each(section.subSections, function (indexSubSection, subSection) {
+                        $.each(subSection.fields, function (indexField, field) {
 
-                        // special init for font family picker
-                        if (field.type == "fontFamilyPicker") {
-                            parameters.splice(parameters.length + 1, 0, "'@" + field.alias + "_weight':'" + field.fontWeight + "'");
-                            parameters.splice(parameters.length + 1, 0, "'@" + field.alias + "_Style':'" + field.fontStyle + "'");
-                        }
+                            // value
+                            parameters.splice(parameters.length + 1, 0, "'@" + field.alias + "':'" + field.value + "'");
 
+                            // special init for font family picker
+                            if (field.type == "fontFamilyPicker") {
+                                parameters.splice(parameters.length + 1, 0, "'@" + field.alias + "_weight':'" + field.fontWeight + "'");
+                                parameters.splice(parameters.length + 1, 0, "'@" + field.alias + "_Style':'" + field.fontStyle + "'");
+                            }
+
+                        })
                     })
                 })
-            })
-        });
-
-        // Refrech page style
-        document.getElementById("resultFrame").contentWindow.refrechLayout(parameters);
+            });
 
+            // Refrech page style
+            if (document.getElementById("resultFrame").contentWindow.refrechLayout)
+                document.getElementById("resultFrame").contentWindow.refrechLayout(parameters);
+        }
     }
 
     var openIntelTuning = function () {
@@ -243,15 +250,13 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
 
     // Delete current page tuning
     $scope.deleteTuning = function () {
-
         $('.btn-default-delete').attr("disabled", true);
         $http.get('/Umbraco/Api/tuning/Delete', { params: { pageId: $location.search().id } })
         .success(function (data) {
-            $scope.frameLoaded++;
+            $scope.enableTuning++;
             $scope.pageId = $scope.pageId + "&n=123456";
             $('.btn-default-delete').attr("disabled", false);
         })
-
     }
 
     // Toggle panel
@@ -353,9 +358,9 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
         $scope.googleFontFamilies = data;
     })
 
-    // watch framLoaded
-    $scope.$watch("frameLoaded", function () {
-        if ($scope.frameLoaded > 0) {
+    // watch framLoaded, only if iframe page have EnableTuning()
+    $scope.$watch("enableTuning", function () {
+        if ($scope.enableTuning > 0) {
             initTuning();
             $scope.$watch('tuningModel', function () {
                 refreshtuning();
@@ -363,11 +368,12 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
         }
     }, true)
 
-    // first panel init
-    initTuning();
-
-    // toggle panel
-    $scope.togglePanel();
+    // First default load
+    $timeout(function () {
+        // toggle panel
+        $scope.frameLoaded = true;
+        $timeout(function () { 1000, $scope.togglePanel(); });
+    }, 1000);
 
 })
 
diff --git a/src/Umbraco.Web.UI/Umbraco/preview/index.html b/src/Umbraco.Web.UI/Umbraco/preview/index.html
index fe726c661f..cf5210cffe 100644
--- a/src/Umbraco.Web.UI/Umbraco/preview/index.html
+++ b/src/Umbraco.Web.UI/Umbraco/preview/index.html
@@ -16,7 +16,7 @@
         <iframe id="resultFrame" ng-src="{{pageId}}" frameborder="0"></iframe>
     </div>
 
-    <div class="tuning" style="display:none" ng-class="{show:frameFirstLoaded}">
+    <div class="tuning">
 
         <div id="TuningBg" ng-class="{open:isOpen}" style="display: block;">
 
@@ -27,15 +27,15 @@
                     <i ng-if="!isOpen" class="icon icon-right-double-arrow"></i>
                 </div>
 
-                <div ng-if="isOpen" ng-click="settingOpen('previewDevice')" ng-class="{selected:settingIsOpen=='previewDevice'}">
+                <div ng-if="isOpen" ng-click="settingOpen('previewDevice')" ng-class="{selected:settingIsOpen=='previewDevice', show:frameLoaded}" style="display:none">
                     <i class="icon icon-display"></i>
                 </div>
 
-                <div ng-if="isOpen" ng-click="settingOpen('setting')" ng-class="{selected:settingIsOpen=='setting'}">
+                <div ng-if="isOpen" ng-click="settingOpen('setting')" ng-class="{selected:settingIsOpen=='setting',show:frameFirstLoaded}" style="display:none">
                     <i class="icon icon-paint-roller"></i>
                 </div>
 
-                <div ng-if="isOpen" ng-click="settingOpen('presetColors')" ng-class="{selected:settingIsOpen=='presetColors'}">
+                <div ng-if="isOpen" ng-click="settingOpen('presetColors')" ng-class="{selected:settingIsOpen=='presetColors',show:frameFirstLoaded}" style="display:none">
                     <i class="icon icon-palette"></i>
                 </div>
 

From 7cfd2d6593759041408a27c6882ed947110abe8e Mon Sep 17 00:00:00 2001
From: antoine <antoine@lecoati.com>
Date: Wed, 28 May 2014 15:06:16 +0200
Subject: [PATCH 3/4] schema's selector improved

---
 .../src/tuning/config/tuning.config.js        | 14 ++++
 .../src/tuning/index.html                     | 10 +--
 .../src/tuning/lib/slider.directive.js        |  8 ++-
 .../src/tuning/lib/spectrum.directive.js      |  5 ++
 .../src/tuning/tuning.baseStyles.less         |  5 ++
 .../src/tuning/tuning.controller.js           | 70 ++++++++++--------
 .../src/tuning/tuning.defaultStyle.less       |  4 ++
 .../src/tuning/tuning.front.js                | 20 +++---
 .../src/tuning/tuning.global.js               | 52 +++++++-------
 .../Umbraco/js/tuning.config.js               |  8 +++
 src/Umbraco.Web.UI/Umbraco/js/tuning.front.js | 16 ++---
 src/Umbraco.Web.UI/Umbraco/js/tuning.panel.js | 71 +++++++++++--------
 src/Umbraco.Web.UI/Umbraco/preview/index.html |  2 +-
 13 files changed, 172 insertions(+), 113 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/tuning/config/tuning.config.js b/src/Umbraco.Web.UI.Client/src/tuning/config/tuning.config.js
index 3db7899b10..06bc76ddd2 100644
--- a/src/Umbraco.Web.UI.Client/src/tuning/config/tuning.config.js
+++ b/src/Umbraco.Web.UI.Client/src/tuning/config/tuning.config.js
@@ -240,6 +240,7 @@ var tuningConfig = {
             name: "General",
             subSections: [{
                 name: "Main",
+                schema: ".content",
                 fields: [{
                     name: "Layout",
                     alias: "stylingMainColumnBoxed",
@@ -304,6 +305,7 @@ var tuningConfig = {
             },
             {
                 name: "Header",
+                schema: "header",
                 fields: [{
                     name: "Top Border Size",
                     alias: "stylingHeaderTopBorderSize",
@@ -453,6 +455,7 @@ var tuningConfig = {
             },
             {
                 name: "Social Links",
+                schema: ".social-row",
                 fields: [{
                     name: "Display",
                     alias: "stySocialDisplay",
@@ -557,6 +560,7 @@ var tuningConfig = {
             },
             {
                 name: "Thumbnails",
+                schema: ".thumbnail",
                 fields: [{
                     name: "Background Color",
                     alias: "stylingThumbnailsBackgroundColor",
@@ -647,6 +651,7 @@ var tuningConfig = {
             },
             {
                 name: "Navigation",
+                schema: ".nav",
                 fields: [{
                     name: "Font Color",
                     alias: "FontNavFontColor",
@@ -694,6 +699,7 @@ var tuningConfig = {
             },
             {
                 name: "Social Link",
+                schema: "social-row",
                 fields: [{
                     name: "Font Color",
                     alias: "FontSocialFontColor",
@@ -1084,6 +1090,7 @@ var tuningConfig = {
                 }]
             }, {
                 name: "Medium",
+                schema: ".medium",
                 fields: [{
                     name: "Color",
                     alias: "FontMediumColor",
@@ -1139,6 +1146,7 @@ var tuningConfig = {
                 }]
             }, {
                 name: "Highlighted",
+                schema: ".highlighted",
                 fields: [{
                     name: "Color",
                     alias: "FontHighlightedColor",
@@ -1167,6 +1175,7 @@ var tuningConfig = {
                 }]
             }, {
                 name: "Big",
+                schema: ".big",
                 fields: [{
                     name: "Color",
                     alias: "FontBigColor",
@@ -1223,6 +1232,7 @@ var tuningConfig = {
                 }]
             }, {
                 name: "Button",
+                schema: ".button",
                 fields: [{
                     name: "Color",
                     alias: "FontButtonColor",
@@ -1293,6 +1303,7 @@ var tuningConfig = {
             },
             {
                 name: "Color2",
+                schema: ".color2",
                 fields: [{
                     name: "Color",
                     alias: "FontColor2Color",
@@ -1304,6 +1315,7 @@ var tuningConfig = {
             },
             {
                 name: "Color3",
+                schema: ".color3",
                 fields: [{
                     name: "Color",
                     alias: "FontColor3Color",
@@ -1315,6 +1327,7 @@ var tuningConfig = {
             },
             {
                 name: "Color4",
+                schema: ".color4",
                 fields: [{
                     name: "Color",
                     alias: "FontColor4Color",
@@ -1325,6 +1338,7 @@ var tuningConfig = {
             },
             {
                 name: "Link",
+                schema: "p a",
                 fields: [{
                     name: "Color",
                     alias: "FontLinkColor",
diff --git a/src/Umbraco.Web.UI.Client/src/tuning/index.html b/src/Umbraco.Web.UI.Client/src/tuning/index.html
index fe726c661f..bec56aca5a 100644
--- a/src/Umbraco.Web.UI.Client/src/tuning/index.html
+++ b/src/Umbraco.Web.UI.Client/src/tuning/index.html
@@ -16,7 +16,7 @@
         <iframe id="resultFrame" ng-src="{{pageId}}" frameborder="0"></iframe>
     </div>
 
-    <div class="tuning" style="display:none" ng-class="{show:frameFirstLoaded}">
+    <div class="tuning">
 
         <div id="TuningBg" ng-class="{open:isOpen}" style="display: block;">
 
@@ -27,15 +27,15 @@
                     <i ng-if="!isOpen" class="icon icon-right-double-arrow"></i>
                 </div>
 
-                <div ng-if="isOpen" ng-click="settingOpen('previewDevice')" ng-class="{selected:settingIsOpen=='previewDevice'}">
+                <div ng-if="isOpen" ng-click="settingOpen('previewDevice')" ng-class="{selected:settingIsOpen=='previewDevice', show:frameLoaded}" style="display:none">
                     <i class="icon icon-display"></i>
                 </div>
 
-                <div ng-if="isOpen" ng-click="settingOpen('setting')" ng-class="{selected:settingIsOpen=='setting'}">
+                <div ng-if="isOpen" ng-click="settingOpen('setting')" ng-class="{selected:settingIsOpen=='setting',show:frameFirstLoaded}" style="display:none">
                     <i class="icon icon-paint-roller"></i>
                 </div>
 
-                <div ng-if="isOpen" ng-click="settingOpen('presetColors')" ng-class="{selected:settingIsOpen=='presetColors'}">
+                <div ng-if="isOpen" ng-click="settingOpen('presetColors')" ng-class="{selected:settingIsOpen=='presetColors',show:frameFirstLoaded}" style="display:none">
                     <i class="icon icon-palette"></i>
                 </div>
 
@@ -73,7 +73,7 @@
                                                      is-open="(schemaFocus != '' && schemaFocus == subSection.schema.toLowerCase())">
 
                                         <accordion-heading>
-                                            <span ng-click="accordionOpened(subSection.name)" ng-mouseover="accordionWillBeOpened(subSection.name)">
+                                            <span ng-click="accordionOpened(subSection.name)" ng-mouseover="accordionWillBeOpened(subSection.schema)">
                                                 {{subSection.name}}
                                             </span>
                                         </accordion-heading>
diff --git a/src/Umbraco.Web.UI.Client/src/tuning/lib/slider.directive.js b/src/Umbraco.Web.UI.Client/src/tuning/lib/slider.directive.js
index 22b1cef4e7..20df88000b 100644
--- a/src/Umbraco.Web.UI.Client/src/tuning/lib/slider.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/tuning/lib/slider.directive.js
@@ -1,6 +1,8 @@
-/*
- jQuery UI Slider plugin wrapper
-*/
+
+/*********************************************************************************************************/
+/* jQuery UI Slider plugin wrapper */
+/*********************************************************************************************************/
+
 angular.module('ui.slider', []).value('uiSliderConfig', {}).directive('uiSlider', ['uiSliderConfig', '$timeout', function (uiSliderConfig, $timeout) {
     uiSliderConfig = uiSliderConfig || {};
     return {
diff --git a/src/Umbraco.Web.UI.Client/src/tuning/lib/spectrum.directive.js b/src/Umbraco.Web.UI.Client/src/tuning/lib/spectrum.directive.js
index 52abe31714..2d357a4769 100644
--- a/src/Umbraco.Web.UI.Client/src/tuning/lib/spectrum.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/tuning/lib/spectrum.directive.js
@@ -1,3 +1,8 @@
+
+/*********************************************************************************************************/
+/* spectrum color picker directive */
+/*********************************************************************************************************/
+
 angular.module('spectrumcolorpicker', [])
   .directive('spectrum', function () {
       return {
diff --git a/src/Umbraco.Web.UI.Client/src/tuning/tuning.baseStyles.less b/src/Umbraco.Web.UI.Client/src/tuning/tuning.baseStyles.less
index 27b696e32a..1f06caa891 100644
--- a/src/Umbraco.Web.UI.Client/src/tuning/tuning.baseStyles.less
+++ b/src/Umbraco.Web.UI.Client/src/tuning/tuning.baseStyles.less
@@ -32,6 +32,11 @@
         }
     }
 
+    p {
+        margin: 1px 1px 10px 1px;
+    } 
+
+
     /**********************************************************/
     /* Wrapper for wide or boxed view */
     /**********************************************************/
diff --git a/src/Umbraco.Web.UI.Client/src/tuning/tuning.controller.js b/src/Umbraco.Web.UI.Client/src/tuning/tuning.controller.js
index 4368d016b3..831aa03f67 100644
--- a/src/Umbraco.Web.UI.Client/src/tuning/tuning.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/tuning/tuning.controller.js
@@ -10,8 +10,12 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
 .controller("Umbraco.tuningController", function ($scope, $modal, $http, $window, $timeout, $location) {
 
     $scope.isOpen = false;
-    $scope.frameLoaded = 0;
+
+    $scope.frameLoaded = false;
+    $scope.enableTuning = 0;
     $scope.frameFirstLoaded = false;
+
+
     $scope.tuningParameterUrl = "";
     $scope.schemaFocus = "body";
     $scope.settingIsOpen = 'previewDevice';
@@ -78,28 +82,31 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
     // Refresh all less parameters for every changes watching tuningModel 
     var refreshtuning = function () {
         var parameters = [];
-        $.each($scope.tuningModel.categories, function (indexCategory, category) {
-            $.each(category.sections, function (indexSection, section) {
-                $.each(section.subSections, function (indexSubSection, subSection) {
-                    $.each(subSection.fields, function (indexField, field) {
 
-                        // value
-                        parameters.splice(parameters.length + 1, 0, "'@" + field.alias + "':'" + field.value + "'");
+        if ($scope.tuningModel) {
+            $.each($scope.tuningModel.categories, function (indexCategory, category) {
+                $.each(category.sections, function (indexSection, section) {
+                    $.each(section.subSections, function (indexSubSection, subSection) {
+                        $.each(subSection.fields, function (indexField, field) {
 
-                        // special init for font family picker
-                        if (field.type == "fontFamilyPicker") {
-                            parameters.splice(parameters.length + 1, 0, "'@" + field.alias + "_weight':'" + field.fontWeight + "'");
-                            parameters.splice(parameters.length + 1, 0, "'@" + field.alias + "_Style':'" + field.fontStyle + "'");
-                        }
+                            // value
+                            parameters.splice(parameters.length + 1, 0, "'@" + field.alias + "':'" + field.value + "'");
 
+                            // special init for font family picker
+                            if (field.type == "fontFamilyPicker") {
+                                parameters.splice(parameters.length + 1, 0, "'@" + field.alias + "_weight':'" + field.fontWeight + "'");
+                                parameters.splice(parameters.length + 1, 0, "'@" + field.alias + "_Style':'" + field.fontStyle + "'");
+                            }
+
+                        })
                     })
                 })
-            })
-        });
-
-        // Refrech page style
-        document.getElementById("resultFrame").contentWindow.refrechLayout(parameters);
+            });
 
+            // Refrech page style
+            if (document.getElementById("resultFrame").contentWindow.refrechLayout)
+                document.getElementById("resultFrame").contentWindow.refrechLayout(parameters);
+        }
     }
 
     var openIntelTuning = function () {
@@ -193,15 +200,13 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
 
     // Delete current page tuning
     $scope.deleteTuning = function () {
-
         $('.btn-default-delete').attr("disabled", true);
         $http.get('/Umbraco/Api/tuning/Delete', { params: { pageId: $location.search().id } })
         .success(function (data) {
-            $scope.frameLoaded++;
+            $scope.enableTuning++;
             $scope.pageId = $scope.pageId + "&n=123456";
             $('.btn-default-delete').attr("disabled", false);
         })
-
     }
 
     // Toggle panel
@@ -295,7 +300,9 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
 
     // Focus schema in front
     $scope.accordionWillBeOpened = function (schema) {
-        setSelectedSchema(schema);
+        if (schema) {
+            setSelectedSchema(schema);
+        }
     }
 
     // Preload of the google font
@@ -303,9 +310,9 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
         $scope.googleFontFamilies = data;
     })
 
-    // watch framLoaded
-    $scope.$watch("frameLoaded", function () {
-        if ($scope.frameLoaded > 0) {
+    // watch framLoaded, only if iframe page have EnableTuning()
+    $scope.$watch("enableTuning", function () {
+        if ($scope.enableTuning > 0) {
             initTuning();
             $scope.$watch('tuningModel', function () {
                 refreshtuning();
@@ -313,11 +320,12 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
         }
     }, true)
 
-    // first panel init
-    initTuning();
-
-    // toggle panel
-    $scope.togglePanel();
+    // First default load
+    $timeout(function () {
+        // toggle panel
+        $scope.frameLoaded = true;
+        $timeout(function () { 1000, $scope.togglePanel(); });
+    }, 1000);
 
 })
 
@@ -460,8 +468,8 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
     $scope.safeFonts = ["Arial, Helvetica", "Impact", "Lucida Sans Unicode", "Tahoma", "Trebuchet MS", "Verdana", "Georgia", "Times New Roman", "Courier New, Courier"];
     $scope.fonts = [];
     $scope.selectedFont = {};
-    
-    var originalFont = {}; 
+
+    var originalFont = {};
     originalFont.fontFamily = $scope.data.modalField.value;
     originalFont.fontType = $scope.data.modalField.fontType;
     originalFont.fontWeight = $scope.data.modalField.fontWeight;
diff --git a/src/Umbraco.Web.UI.Client/src/tuning/tuning.defaultStyle.less b/src/Umbraco.Web.UI.Client/src/tuning/tuning.defaultStyle.less
index 12745d5cb5..6b6565ce5f 100644
--- a/src/Umbraco.Web.UI.Client/src/tuning/tuning.defaultStyle.less
+++ b/src/Umbraco.Web.UI.Client/src/tuning/tuning.defaultStyle.less
@@ -235,6 +235,10 @@ h1 {
     }
 }
 
+p {
+    margin: 2px 2px 10px 2px;
+} 
+
 
 /* Wrapper for wide or boxed view */
 
diff --git a/src/Umbraco.Web.UI.Client/src/tuning/tuning.front.js b/src/Umbraco.Web.UI.Client/src/tuning/tuning.front.js
index d5328b0627..1038ed0304 100644
--- a/src/Umbraco.Web.UI.Client/src/tuning/tuning.front.js
+++ b/src/Umbraco.Web.UI.Client/src/tuning/tuning.front.js
@@ -6,7 +6,9 @@ var refrechLayout = function (parameters) {
 
     // Disable links
     $('a').addClass("myDisable");
-    $('a').bind("click.myDisable", function () { return false; });
+    $('a').bind("click.myDisable", function () {
+            return false;
+    });
 
     var string = "less.modifyVars({" + parameters.join(",") + "})";
     eval(string);
@@ -49,16 +51,13 @@ var getFont = function (font) {
 
 var setSelectedSchema = function (schema) {
     $("[tuning-over]").css('outline', 'none');
-    $(schema).css('outline', '2px solid blue');
+    $(schema).css('outline', '2px solid #a4c6fd');
 }
 
 var closeIntelTuning = function (tuningModel) {
 
     if (tuningModel) {
 
-        //$('a').removeClass("myDisable");
-        //$('a').unbind("click.myDisable");
-
         $("[tuning-over]").css('outline', 'none');
         $.each(tuningModel.categories, function (key, category) {
             $.each(category.sections, function (key, section) {
@@ -78,10 +77,8 @@ var initIntelTuning = function (tuningModel) {
 
     if (tuningModel) {
 
-        //$('a').addClass("myDisable");
-        //$('a').bind("click.myDisable", function () { return false; });
-
-        $.each(tuningModel.categories, function (key, category) {
+        // Add tuning-over attr for each schema from config
+        $.each(tuningModel.categories, function (key, category) { 
             $.each(category.sections, function (key, section) {
                 $.each(section.subSections, function (key, subSection) {
                     if (subSection.schema) {
@@ -91,6 +88,7 @@ var initIntelTuning = function (tuningModel) {
             });
         });
 
+        // Outline tuning-over
         $(document).mousemove(function (e) {
 
             e.stopPropagation();
@@ -104,11 +102,13 @@ var initIntelTuning = function (tuningModel) {
 
             if (target.attr('tuning-over') != undefined || target.attr('tuning-over') != '') {
                 target.unbind();
-                target.css('outline', '2px solid blue');
+                target.css('outline', '2px solid #a4c6fd');
                 target.click(function (e) {
                     e.stopPropagation();
+                    e.preventDefault();
                     console.info(target.attr('tuning-over'));
                     parent.refrechIntelTuning(target.attr('tuning-over'));
+                    return false;
                 });
             }
         });
diff --git a/src/Umbraco.Web.UI.Client/src/tuning/tuning.global.js b/src/Umbraco.Web.UI.Client/src/tuning/tuning.global.js
index 4a631d6224..6f93f7055f 100644
--- a/src/Umbraco.Web.UI.Client/src/tuning/tuning.global.js
+++ b/src/Umbraco.Web.UI.Client/src/tuning/tuning.global.js
@@ -8,43 +8,45 @@ var refrechIntelTuning = function (schema) {
 
     var scope = angular.element($("#tuningPanel")).scope();
 
-    var notFound = true;
-    angular.forEach(scope.tuningModel.categories, function (category, key) {
-        var isContainer = false;
-        angular.forEach(category.sections, function (section, key) {
-            angular.forEach(section.subSections, function (subSection, key) {
-                if (subSection.schema && schema.toLowerCase() == subSection.schema.toLowerCase()) {
-                    isContainer = true;
-                    notFound = false
-                }
+    if (scope.schemaFocus != schema.toLowerCase()) {
 
+        var notFound = true;
+        angular.forEach(scope.tuningModel.categories, function (category, key) {
+            var isContainer = false;
+            angular.forEach(category.sections, function (section, key) {
+                angular.forEach(section.subSections, function (subSection, key) {
+                    if (subSection.schema && schema.toLowerCase() == subSection.schema.toLowerCase()) {
+                        isContainer = true;
+                        notFound = false
+                    }
+
+                });
             });
+            if (!category.active) {
+                category.active = isContainer;
+            }
         });
-        if (!category.active) {
-            category.active = isContainer;
+        if (notFound) {
+            scope.tuningModel.categories[0].active = true;
         }
-    });
-    if (notFound) {
-        scope.tuningModel.categories[0].active = true;
-    }
-    scope.$apply();
+        scope.$apply();
 
-    if (notFound) {
-        scope.schemaFocus = "body";
-    }
-    else {
-        scope.schemaFocus = schema.toLowerCase();
-    }
-
-    scope.$apply();
+        if (notFound) {
+            scope.schemaFocus = "body";
+        }
+        else {
+            scope.schemaFocus = schema.toLowerCase();
+        }
 
+        scope.$apply();
+    }
 }
 
 var setFrameIsLoaded = function (tuningParameterUrl) {
     console.info("iframe id loaded " + tuningParameterUrl);
     var scope = angular.element($("#tuningPanel")).scope();
     scope.tuningParameterUrl = tuningParameterUrl;
-    scope.frameLoaded++;
+    scope.enableTuning++;
     scope.frameFirstLoaded = true;
     scope.$apply();
 }
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI/Umbraco/js/tuning.config.js b/src/Umbraco.Web.UI/Umbraco/js/tuning.config.js
index 3db7899b10..5b2acc6558 100644
--- a/src/Umbraco.Web.UI/Umbraco/js/tuning.config.js
+++ b/src/Umbraco.Web.UI/Umbraco/js/tuning.config.js
@@ -1084,6 +1084,7 @@ var tuningConfig = {
                 }]
             }, {
                 name: "Medium",
+                schema: ".medium",
                 fields: [{
                     name: "Color",
                     alias: "FontMediumColor",
@@ -1139,6 +1140,7 @@ var tuningConfig = {
                 }]
             }, {
                 name: "Highlighted",
+                schema: ".highlighted",
                 fields: [{
                     name: "Color",
                     alias: "FontHighlightedColor",
@@ -1167,6 +1169,7 @@ var tuningConfig = {
                 }]
             }, {
                 name: "Big",
+                schema: ".big",
                 fields: [{
                     name: "Color",
                     alias: "FontBigColor",
@@ -1223,6 +1226,7 @@ var tuningConfig = {
                 }]
             }, {
                 name: "Button",
+                schema: ".button",
                 fields: [{
                     name: "Color",
                     alias: "FontButtonColor",
@@ -1293,6 +1297,7 @@ var tuningConfig = {
             },
             {
                 name: "Color2",
+                schema: ".color2",
                 fields: [{
                     name: "Color",
                     alias: "FontColor2Color",
@@ -1304,6 +1309,7 @@ var tuningConfig = {
             },
             {
                 name: "Color3",
+                schema: ".color3",
                 fields: [{
                     name: "Color",
                     alias: "FontColor3Color",
@@ -1315,6 +1321,7 @@ var tuningConfig = {
             },
             {
                 name: "Color4",
+                schema: ".color4",
                 fields: [{
                     name: "Color",
                     alias: "FontColor4Color",
@@ -1325,6 +1332,7 @@ var tuningConfig = {
             },
             {
                 name: "Link",
+                name: "a",
                 fields: [{
                     name: "Color",
                     alias: "FontLinkColor",
diff --git a/src/Umbraco.Web.UI/Umbraco/js/tuning.front.js b/src/Umbraco.Web.UI/Umbraco/js/tuning.front.js
index d5328b0627..9b3de57149 100644
--- a/src/Umbraco.Web.UI/Umbraco/js/tuning.front.js
+++ b/src/Umbraco.Web.UI/Umbraco/js/tuning.front.js
@@ -49,16 +49,13 @@ var getFont = function (font) {
 
 var setSelectedSchema = function (schema) {
     $("[tuning-over]").css('outline', 'none');
-    $(schema).css('outline', '2px solid blue');
+    $(schema).css('outline', '2px solid #a4c6fd');
 }
 
 var closeIntelTuning = function (tuningModel) {
 
     if (tuningModel) {
 
-        //$('a').removeClass("myDisable");
-        //$('a').unbind("click.myDisable");
-
         $("[tuning-over]").css('outline', 'none');
         $.each(tuningModel.categories, function (key, category) {
             $.each(category.sections, function (key, section) {
@@ -78,9 +75,7 @@ var initIntelTuning = function (tuningModel) {
 
     if (tuningModel) {
 
-        //$('a').addClass("myDisable");
-        //$('a').bind("click.myDisable", function () { return false; });
-
+        // Add tuning-over attr for each schema from config
         $.each(tuningModel.categories, function (key, category) {
             $.each(category.sections, function (key, section) {
                 $.each(section.subSections, function (key, subSection) {
@@ -91,6 +86,7 @@ var initIntelTuning = function (tuningModel) {
             });
         });
 
+        // Outline tuning-over
         $(document).mousemove(function (e) {
 
             e.stopPropagation();
@@ -104,7 +100,11 @@ var initIntelTuning = function (tuningModel) {
 
             if (target.attr('tuning-over') != undefined || target.attr('tuning-over') != '') {
                 target.unbind();
-                target.css('outline', '2px solid blue');
+
+
+                target.css('outline', '2px solid #a4c6fd');
+
+
                 target.click(function (e) {
                     e.stopPropagation();
                     console.info(target.attr('tuning-over'));
diff --git a/src/Umbraco.Web.UI/Umbraco/js/tuning.panel.js b/src/Umbraco.Web.UI/Umbraco/js/tuning.panel.js
index 5181956345..df50fe8983 100644
--- a/src/Umbraco.Web.UI/Umbraco/js/tuning.panel.js
+++ b/src/Umbraco.Web.UI/Umbraco/js/tuning.panel.js
@@ -8,36 +8,38 @@ var refrechIntelTuning = function (schema) {
 
     var scope = angular.element($("#tuningPanel")).scope();
 
-    var notFound = true;
-    angular.forEach(scope.tuningModel.categories, function (category, key) {
-        var isContainer = false;
-        angular.forEach(category.sections, function (section, key) {
-            angular.forEach(section.subSections, function (subSection, key) {
-                if (subSection.schema && schema.toLowerCase() == subSection.schema.toLowerCase()) {
-                    isContainer = true;
-                    notFound = false
-                }
+    if (scope.schemaFocus != schema.toLowerCase()) {
 
+        var notFound = true;
+        angular.forEach(scope.tuningModel.categories, function (category, key) {
+            var isContainer = false;
+            angular.forEach(category.sections, function (section, key) {
+                angular.forEach(section.subSections, function (subSection, key) {
+                    if (subSection.schema && schema.toLowerCase() == subSection.schema.toLowerCase()) {
+                        isContainer = true;
+                        notFound = false
+                    }
+
+                });
             });
+            if (!category.active) {
+                category.active = isContainer;
+            }
         });
-        if (!category.active) {
-            category.active = isContainer;
+        if (notFound) {
+            scope.tuningModel.categories[0].active = true;
         }
-    });
-    if (notFound) {
-        scope.tuningModel.categories[0].active = true;
-    }
-    scope.$apply();
+        scope.$apply();
 
-    if (notFound) {
-        scope.schemaFocus = "body";
-    }
-    else {
-        scope.schemaFocus = schema.toLowerCase();
-    }
-
-    scope.$apply();
+        if (notFound) {
+            scope.schemaFocus = "body";
+        }
+        else {
+            scope.schemaFocus = schema.toLowerCase();
+        }
 
+        scope.$apply();
+    }
 }
 
 var setFrameIsLoaded = function (tuningParameterUrl) {
@@ -350,7 +352,9 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
 
     // Focus schema in front
     $scope.accordionWillBeOpened = function (schema) {
-        setSelectedSchema(schema);
+        if (schema) {
+            setSelectedSchema(schema);
+        }
     }
 
     // Preload of the google font
@@ -516,8 +520,8 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
     $scope.safeFonts = ["Arial, Helvetica", "Impact", "Lucida Sans Unicode", "Tahoma", "Trebuchet MS", "Verdana", "Georgia", "Times New Roman", "Courier New, Courier"];
     $scope.fonts = [];
     $scope.selectedFont = {};
-    
-    var originalFont = {}; 
+
+    var originalFont = {};
     originalFont.fontFamily = $scope.data.modalField.value;
     originalFont.fontType = $scope.data.modalField.fontType;
     originalFont.fontWeight = $scope.data.modalField.fontWeight;
@@ -641,9 +645,11 @@ angular.module("umbraco.tuning", ['ui.bootstrap', 'spectrumcolorpicker', 'ui.sli
     }
 
 });
-/*
- jQuery UI Slider plugin wrapper
-*/
+
+/*********************************************************************************************************/
+/* jQuery UI Slider plugin wrapper */
+/*********************************************************************************************************/
+
 angular.module('ui.slider', []).value('uiSliderConfig', {}).directive('uiSlider', ['uiSliderConfig', '$timeout', function (uiSliderConfig, $timeout) {
     uiSliderConfig = uiSliderConfig || {};
     return {
@@ -772,6 +778,11 @@ angular.module('ui.slider', []).value('uiSliderConfig', {}).directive('uiSlider'
     };
 }]);
 
+
+/*********************************************************************************************************/
+/* spectrum color picker directive */
+/*********************************************************************************************************/
+
 angular.module('spectrumcolorpicker', [])
   .directive('spectrum', function () {
       return {
diff --git a/src/Umbraco.Web.UI/Umbraco/preview/index.html b/src/Umbraco.Web.UI/Umbraco/preview/index.html
index cf5210cffe..bec56aca5a 100644
--- a/src/Umbraco.Web.UI/Umbraco/preview/index.html
+++ b/src/Umbraco.Web.UI/Umbraco/preview/index.html
@@ -73,7 +73,7 @@
                                                      is-open="(schemaFocus != '' && schemaFocus == subSection.schema.toLowerCase())">
 
                                         <accordion-heading>
-                                            <span ng-click="accordionOpened(subSection.name)" ng-mouseover="accordionWillBeOpened(subSection.name)">
+                                            <span ng-click="accordionOpened(subSection.name)" ng-mouseover="accordionWillBeOpened(subSection.schema)">
                                                 {{subSection.name}}
                                             </span>
                                         </accordion-heading>

From 90e5440518e8f62375382873e70eb1d4bc4ef4ca Mon Sep 17 00:00:00 2001
From: antoine <antoine@lecoati.com>
Date: Wed, 28 May 2014 15:33:36 +0200
Subject: [PATCH 4/4] bootstrap3 ; issue + hx style issue

---
 .../src/tuning/tuning.defaultStyle.less              |  1 +
 src/Umbraco.Web.UI/Umbraco/js/tuning.config.js       |  8 +++++++-
 src/Umbraco.Web.UI/Umbraco/js/tuning.front.js        | 12 ++++++------
 .../Views/Partials/Grid/bootstrap3.cshtml            |  6 +++---
 4 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/tuning/tuning.defaultStyle.less b/src/Umbraco.Web.UI.Client/src/tuning/tuning.defaultStyle.less
index 6b6565ce5f..b34efa3a37 100644
--- a/src/Umbraco.Web.UI.Client/src/tuning/tuning.defaultStyle.less
+++ b/src/Umbraco.Web.UI.Client/src/tuning/tuning.defaultStyle.less
@@ -208,6 +208,7 @@
 
 h1, h2, h3, h4, h5, h6 {
     text-rendering: optimizelegibility;
+    margin:2px;
 }
 
 h1 {
diff --git a/src/Umbraco.Web.UI/Umbraco/js/tuning.config.js b/src/Umbraco.Web.UI/Umbraco/js/tuning.config.js
index 5b2acc6558..06bc76ddd2 100644
--- a/src/Umbraco.Web.UI/Umbraco/js/tuning.config.js
+++ b/src/Umbraco.Web.UI/Umbraco/js/tuning.config.js
@@ -240,6 +240,7 @@ var tuningConfig = {
             name: "General",
             subSections: [{
                 name: "Main",
+                schema: ".content",
                 fields: [{
                     name: "Layout",
                     alias: "stylingMainColumnBoxed",
@@ -304,6 +305,7 @@ var tuningConfig = {
             },
             {
                 name: "Header",
+                schema: "header",
                 fields: [{
                     name: "Top Border Size",
                     alias: "stylingHeaderTopBorderSize",
@@ -453,6 +455,7 @@ var tuningConfig = {
             },
             {
                 name: "Social Links",
+                schema: ".social-row",
                 fields: [{
                     name: "Display",
                     alias: "stySocialDisplay",
@@ -557,6 +560,7 @@ var tuningConfig = {
             },
             {
                 name: "Thumbnails",
+                schema: ".thumbnail",
                 fields: [{
                     name: "Background Color",
                     alias: "stylingThumbnailsBackgroundColor",
@@ -647,6 +651,7 @@ var tuningConfig = {
             },
             {
                 name: "Navigation",
+                schema: ".nav",
                 fields: [{
                     name: "Font Color",
                     alias: "FontNavFontColor",
@@ -694,6 +699,7 @@ var tuningConfig = {
             },
             {
                 name: "Social Link",
+                schema: "social-row",
                 fields: [{
                     name: "Font Color",
                     alias: "FontSocialFontColor",
@@ -1332,7 +1338,7 @@ var tuningConfig = {
             },
             {
                 name: "Link",
-                name: "a",
+                schema: "p a",
                 fields: [{
                     name: "Color",
                     alias: "FontLinkColor",
diff --git a/src/Umbraco.Web.UI/Umbraco/js/tuning.front.js b/src/Umbraco.Web.UI/Umbraco/js/tuning.front.js
index 9b3de57149..1038ed0304 100644
--- a/src/Umbraco.Web.UI/Umbraco/js/tuning.front.js
+++ b/src/Umbraco.Web.UI/Umbraco/js/tuning.front.js
@@ -6,7 +6,9 @@ var refrechLayout = function (parameters) {
 
     // Disable links
     $('a').addClass("myDisable");
-    $('a').bind("click.myDisable", function () { return false; });
+    $('a').bind("click.myDisable", function () {
+            return false;
+    });
 
     var string = "less.modifyVars({" + parameters.join(",") + "})";
     eval(string);
@@ -76,7 +78,7 @@ var initIntelTuning = function (tuningModel) {
     if (tuningModel) {
 
         // Add tuning-over attr for each schema from config
-        $.each(tuningModel.categories, function (key, category) {
+        $.each(tuningModel.categories, function (key, category) { 
             $.each(category.sections, function (key, section) {
                 $.each(section.subSections, function (key, subSection) {
                     if (subSection.schema) {
@@ -100,15 +102,13 @@ var initIntelTuning = function (tuningModel) {
 
             if (target.attr('tuning-over') != undefined || target.attr('tuning-over') != '') {
                 target.unbind();
-
-
                 target.css('outline', '2px solid #a4c6fd');
-
-
                 target.click(function (e) {
                     e.stopPropagation();
+                    e.preventDefault();
                     console.info(target.attr('tuning-over'));
                     parent.refrechIntelTuning(target.attr('tuning-over'));
+                    return false;
                 });
             }
         });
diff --git a/src/Umbraco.Web.UI/Views/Partials/Grid/bootstrap3.cshtml b/src/Umbraco.Web.UI/Views/Partials/Grid/bootstrap3.cshtml
index bc6740f05d..22a5dc10cd 100644
--- a/src/Umbraco.Web.UI/Views/Partials/Grid/bootstrap3.cshtml
+++ b/src/Umbraco.Web.UI/Views/Partials/Grid/bootstrap3.cshtml
@@ -12,7 +12,7 @@
                 <div class="col-md-@column.grid column usky-grid-column">
                     @foreach (var row in column.rows)
                     {
-                        <div class="@row.cssClass @(row.fullScreen == "True" ? "usky-grid-full-size" : "")">
+                        <div class="@row.cssClass">
                             <div>
                                 <div class="row clearfix usky-grid-row">
 
@@ -31,7 +31,7 @@
                                                         {
                                                             case "rte":
                                                                  <text>
-                                                                    @Html.Raw(TemplateUtilities.ParseInternalLinks(control.value.ToString()));
+                                                                    @Html.Raw(TemplateUtilities.ParseInternalLinks(control.value.ToString()))
                                                                  </text>    
                                                             break;
                                                             case "macro":
@@ -79,7 +79,7 @@
                                                                 break;
                                                             case "embed":
                                                                      <text>
-                                                                        @Html.Raw(control.value);
+                                                                        @Html.Raw(control.value)
                                                                      </text>
                                                                 break;
                                                             default: