Index: webapp/components/uiOptions/js/UIEnhancer.js =================================================================== --- webapp/components/uiOptions/js/UIEnhancer.js (revision 7172) +++ webapp/components/uiOptions/js/UIEnhancer.js (working copy) @@ -96,6 +96,15 @@ container.css("line-height", spacing + "em"); }; + var overrideScaledDownSizes = function (container, minSize) { + // TODO: we should get the nodes with scaled down sizes, check the size in the computed style, + // and set the size to the min if it is smaller then minSize + + // For now replace all the font size classes that are smaller then 100 with fl-font-size-100 + // Note that the fss font size class is hardcoded here and this should be changed. + replaceClass(container, "[class*=fl-font-size-]", /\bfl-font-size-[0-9]{1,2}\s+/g, 'fl-font-size-100'); + }; + /** * Sets the font size on the container. Removes all fss classes that decrease font size. * @param {Object} container @@ -101,13 +110,15 @@ * @param {Object} container * @param {Object} size */ - var setMinSize = function (container, size) { - // TODO: fss font size class prefix is hardcoded here - if (size && size > 0) { - container.css("font-size", size + "pt"); - replaceClass(container, "[class*=fl-font-size-]", /\bfl-font-size-[0-9]{1,2}\s+/g, 'fl-font-size-100'); + var setMinSize = function (container, minSize, baseSize) { + if (minSize && minSize > 0) { + if (minSize > baseSize) { + container.css("font-size", minSize + "pt"); + } + overrideScaledDownSizes(container, minSize); } else { - container.css("font-size", ""); // empty is same effect as not being set + // Clear a previously set min text size + container.css("font-size", ""); // empty is same effect as not being set } }; @@ -162,7 +173,15 @@ var styleInputs = function (container, settings, classnameMap) { styleElements($("input", container), settings.inputsLarger, classnameMap.inputsLarger); }; - + + // Set the baseTextSize from the container only if it is not already set + var setBaseTextSizeFromContainer = function (container, model) { + if (!model.baseTextSize) { + // TODO: find a better conversion from pixels to points + model.baseTextSize = parseFloat(container.css("font-size")) / 1.3; + } + }; + /** * Initialize the model first looking at options.savedSettings, then in the settingsStore and finally in the options.defaultSiteSettings * @param {Object} that @@ -171,6 +190,7 @@ // First check for settings in the options if (that.options.savedSettings) { that.model = that.options.savedSettings; + setBaseTextSizeFromContainer(that.container, that.model); return; } @@ -176,6 +196,7 @@ // Use the settingsStore or the defaultSiteSettings if there are no settings that.model = that.settingsStore.fetch() || fluid.copy(that.defaultSiteSettings); + setBaseTextSizeFromContainer(that.container, that.model); }; /** @@ -232,7 +253,7 @@ that.container.removeClass(clashingClassnames); addStyles(that.container, that.model, that.options.classnameMap); styleElements(that.container, !isTrue(that.model.backgroundImages), that.options.classnameMap.noBackgroundImages); - setMinSize(that.container, that.model.textSize); + setMinSize(that.container, that.model.minTextSize, that.model.baseTextSize); setLineSpacing(that.container, that.model.lineSpacing); setToc(that, that.model.toc); styleLinks(that.container, that.model, that.options.classnameMap); @@ -275,6 +296,7 @@ classnameMap: { "textFont": { + "default": "", "serif": "fl-font-serif", "sansSerif": "fl-font-sans", "arial": "fl-font-arial", @@ -313,11 +335,12 @@ "inputsLarger": "fl-text-larger" }, defaultSiteSettings: { - textFont: "", // key from classname map - textSpacing: "", // key from classname map + textFont: "default", // key from classname map + textSpacing: "default", // key from classname map theme: "default", // key from classname map layout: "default", // key from classname map - textSize: "", // in points + baseTextSize: "", // in points + minTextSize: "", // in points lineSpacing: "", // in ems backgroundImages: true, // boolean toc: false, // boolean Index: webapp/components/uiOptions/js/UIOptions.js =================================================================== --- webapp/components/uiOptions/js/UIOptions.js (revision 7172) +++ webapp/components/uiOptions/js/UIOptions.js (working copy) @@ -278,7 +278,7 @@ }; }; - var options = createOptions("textSize"); + var options = createOptions("minTextSize"); fluid.merge(null, options, that.options.textMinSize.options); fluid.initSubcomponents(that, "textMinSize", [that.options.selectors.textMinSizeCtrl, options]); Index: webapp/integration-demos/uportal/js/portal.js =================================================================== --- webapp/integration-demos/uportal/js/portal.js (revision 7172) +++ webapp/integration-demos/uportal/js/portal.js (working copy) @@ -63,7 +63,7 @@ * Settings for high contrast, large font */ demo.hcLargeSettings = { - textSize: "16", + minTextSize: "16", textFont: "courier", textSpacing: "wide", theme: "highContrast", Index: webapp/tests/component-tests/uiOptions/js/UIEnhancerTests.js =================================================================== --- webapp/tests/component-tests/uiOptions/js/UIEnhancerTests.js (revision 7172) +++ webapp/tests/component-tests/uiOptions/js/UIEnhancerTests.js (working copy) @@ -19,7 +19,7 @@ (function ($) { $(document).ready(function () { var testSettings = { - textSize: "18", + minTextSize: "18", textFont: "courier", textSpacing: "wide1", theme: "highContrast" @@ -80,9 +80,9 @@ // Change the results, save again. It should work again. var differentSettings = fluid.copy(testSettings); - differentSettings.textSize = "32"; + differentSettings.minTextSize = "32"; store.save(differentSettings); - jqUnit.assertEquals("Changed settings are saved correctly.", store.fetch().textSize, "32"); + jqUnit.assertEquals("Changed settings are saved correctly.", store.fetch().minTextSize, "32"); // Let's go check the cookie directly and make sure it's there. var cookieNameIndex = document.cookie.indexOf(store.options.cookieName); @@ -88,12 +88,12 @@ var cookieNameIndex = document.cookie.indexOf(store.options.cookieName); jqUnit.assertTrue("Our cookie should be floating somewhere in the browser.", cookieNameIndex >= 0); - jqUnit.assertTrue("Our cookie should contain the textSize 32.", + jqUnit.assertTrue("Our cookie should contain the minTextSize 32.", document.cookie.indexOf("32") > cookieNameIndex); - // Now we can create a uiEnhancer and see that the textSize is set to 32 + // Now we can create a uiEnhancer and see that the minTextSize is set to 32 var enhancer = fluid.uiEnhancer(); - jqUnit.assertEquals("The uiEnhancer should have a textSize of 32", "32", enhancer.model.textSize); + jqUnit.assertEquals("The uiEnhancer should have a minTextSize of 32", "32", enhancer.model.minTextSize); // Reset the cookie settings store.save(enhancer.options.defaultSiteSettings); @@ -110,9 +110,9 @@ // Change the results, save again. It should work again. var differentSettings = fluid.copy(testSettings); - differentSettings.textSize = "32"; + differentSettings.minTextSize = "32"; store.save(differentSettings); - jqUnit.assertEquals("Changed settings are saved correctly.", "32", store.fetch().textSize); + jqUnit.assertEquals("Changed settings are saved correctly.", "32", store.fetch().minTextSize); jqUnit.assertEquals("Theme was saved correctly.", "highContrast", store.fetch().theme); // Now we can create a uiEnhancer and see that the theme is default not high contrast Index: webapp/tests/component-tests/uiOptions/js/UIOptionsTests.js =================================================================== --- webapp/tests/component-tests/uiOptions/js/UIOptionsTests.js (revision 7172) +++ webapp/tests/component-tests/uiOptions/js/UIOptionsTests.js (working copy) @@ -21,7 +21,7 @@ var tests = new jqUnit.TestCase("UIOptions Tests"); var hcSkin = { - textSize: "8", + minTextSize: "8", textFont: "verdana", textSpacing: "wide2", theme: "highContrast" @@ -61,7 +61,7 @@ var model = uiOptions.model; jqUnit.assertNotNull("Model is not null", model); jqUnit.assertNotUndefined("Model is not undefined", model); - jqUnit.assertFalse("Min text size is not set", !!model.textSize); + jqUnit.assertFalse("Min text size is not set", !!model.minTextSize); jqUnit.assertEquals("Text font is set", "", model.textFont); jqUnit.assertEquals("Text spacing is set", "", model.textSpacing); jqUnit.assertEquals("Colour scheme is set", "default", model.theme);