Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Fluid 4323 - Fixed the chrome issue with the table of contents. #298

Merged
merged 5 commits into from over 1 year ago

3 participants

Cindy Qi Li Michelle Anastasia Cheetham
This page is out of date. Refresh to see the latest.
2  src/webapp/components/tableOfContents/html/TableOfContents.html
... ... @@ -1,5 +1,5 @@
1 1 <!-- Table of contents template -->
2   -<h1>Table of Contents</h1>
  2 +<h1 class="flc-tableOfContents-exclude">Table of Contents</h1>
3 3 <ul class="flc-toc-levels-level1">
4 4 <li class="flc-toc-levels-items1">
5 5 <a class="flc-toc-levels-link1" href="">1</a>
38 src/webapp/components/tableOfContents/js/TableOfContents.js
@@ -43,16 +43,25 @@ var fluid_1_5 = fluid_1_5 || {};
43 43 };
44 44
45 45 /**
46   - * Invoker function to filter headings. Default is to filter out the visible headings.
  46 + * Invoker function to filter headings. Default is to filter out the visible headings
  47 + * that don't have a special 'exclusion' class.
47 48 * @param Object Contains a list of headings, usually generated by that.locate("headings")
48 49 * @return filtered headings
49 50 */
50   - fluid.tableOfContents.filterHeadings = function (headings) {
51   - return headings.filter(":visible");
  51 + fluid.tableOfContents.filterHeadings = function (headings, exclude) {
  52 + return headings.filter(":visible").filter('[class!="' + exclude + '"]');
52 53 };
53 54
  55 + fluid.tableOfContents.regenerateToc = function (that) {
  56 + var headings = that.filterHeadings(that.locate("headings"), that.options.selectors.exclude);
  57 + that.anchorInfo = fluid.transform(headings, function (heading) {
  58 + return that.headingTextToAnchor(heading);
  59 + });
  60 + var headingsModel = that.modelBuilder.assembleModel(headings, that.anchorInfo);
  61 + that.applier.requestChange("", headingsModel);
  62 + };
  63 +
54 64 fluid.tableOfContents.finalInit = function (that) {
55   - var headings = that.filterHeadings(that.locate("headings"));
56 65
57 66 that.headingTextToAnchor = function (heading) {
58 67 var guid = that.generateGUID();
@@ -66,9 +75,6 @@ var fluid_1_5 = fluid_1_5 || {};
66 75 return anchorInfo;
67 76 };
68 77
69   - that.anchorInfo = fluid.transform(headings, function (heading) {
70   - return that.headingTextToAnchor(heading);
71   - });
72 78
73 79 // TODO: is it weird to have hide and show on a component?
74 80 that.hide = function () {
@@ -79,9 +85,12 @@ var fluid_1_5 = fluid_1_5 || {};
79 85 that.locate("tocContainer").show();
80 86 };
81 87
82   - var headingsModel = that.modelBuilder.assembleModel(headings, that.anchorInfo);
83   -
84   - that.applier.requestChange("", headingsModel);
  88 + that.applier.modelChanged.addListener("headingsModel", function () {
  89 + if (that.levels) {
  90 + that.levels.refreshView();
  91 + }
  92 + });
  93 + that.regenerateToc();
85 94
86 95 that.events.onReady.fire();
87 96 };
@@ -112,11 +121,16 @@ var fluid_1_5 = fluid_1_5 || {};
112 121 invokers: {
113 122 insertAnchor: "fluid.tableOfContents.insertAnchor",
114 123 generateGUID: "fluid.tableOfContents.generateGUID",
115   - filterHeadings: "fluid.tableOfContents.filterHeadings"
  124 + filterHeadings: "fluid.tableOfContents.filterHeadings",
  125 + regenerateToc: {
  126 + funcName: "fluid.tableOfContents.regenerateToc",
  127 + args: "{that}"
  128 + }
116 129 },
117 130 selectors: {
118 131 headings: ":header",
119   - tocContainer: ".flc-toc-tocContainer"
  132 + tocContainer: ".flc-toc-tocContainer",
  133 + exclude: "flc-tableOfContents-exclude"
120 134 },
121 135 events: {
122 136 onReady: null,
3  src/webapp/components/uiOptions/html/FatPanelUIOptionsFrame.html
@@ -37,7 +37,8 @@
37 37 </head>
38 38
39 39 <body class="fl-uiOptions-fatPanel fl-focus">
40   - <div class="flc-toc-tocContainer fl-hidden">
  40 + <div class="fl-hidden">
  41 + <div class="flc-toc-tocContainer"></div>
41 42 </div>
42 43 </body>
43 44
30 src/webapp/integration-demos/uiOptions/js/uiOptionsDemo.js
@@ -6,9 +6,15 @@
6 6 var pathToTemplates = "../../components/uiOptions/html/";
7 7
8 8 var extraSiteSettings = {
9   - simplifiedContent: false,
10   - selfVoicing: false
11   - };
  9 + simplifiedContent: false,
  10 + selfVoicing: false
  11 + };
  12 +
  13 + demo.updateToc = function (tocEnactor) {
  14 + if (tocEnactor.tableOfContents) {
  15 + tocEnactor.tableOfContents.regenerateToc();
  16 + }
  17 + };
12 18
13 19 demo.initPageEnhancer = function (customThemeName) {
14 20 fluid.pageEnhancer({
@@ -19,6 +25,24 @@
19 25 theme: {
20 26 "default": customThemeName
21 27 }
  28 + },
  29 + components: {
  30 + simplifiedContent: {
  31 + options: {
  32 + listeners: {
  33 + settingChanged: "{uiEnhancer}.events.simplifyContentChanged"
  34 + }
  35 + }
  36 + }
  37 + },
  38 + events: {
  39 + simplifyContentChanged: null
  40 + },
  41 + listeners: {
  42 + simplifyContentChanged: {
  43 + listener: "demo.updateToc",
  44 + args: "{that}.tableOfContents"
  45 + }
22 46 }
23 47 });
24 48 };
33 src/webapp/integration-demos/uiOptions/js/uiOptionsExtra.js
@@ -128,9 +128,15 @@ var fluid_1_5 = fluid_1_5 || {};
128 128 selectors: {
129 129 content: ".flc-uiOptions-content"
130 130 },
  131 + styles: {
  132 + simplified: "fl-uiOptins-content-simplified"
  133 + },
131 134 model: {
132 135 value: false
133 136 },
  137 + events: {
  138 + settingChanged: null
  139 + },
134 140 invokers: {
135 141 set: {
136 142 funcName: "fluid.uiOptions.actionAnts.simplifiedContentEnactor.set",
@@ -147,26 +153,32 @@ var fluid_1_5 = fluid_1_5 || {};
147 153
148 154 fluid.uiOptions.actionAnts.simplifiedContentEnactor.set = function (value, that) {
149 155 var contentContainer = that.container.find(that.options.selectors.content);
  156 + var simplified = contentContainer.hasClass(that.options.styles.simplified);
150 157
151 158 if (!that.initialContent || !that.article) {
152 159 that.initialContent = contentContainer.html();
153   - $("aside", that.container).addClass("fl-hidden");
154   - $("img", that.container).css("float", "none");
155   - $("figure", that.container).css("float", "none");
156   - var article = contentContainer.find("article").html();
  160 + var articleDom = contentContainer.find("article").clone();
  161 + $("aside", articleDom).remove();
  162 + $("img", articleDom).css("float", "none");
  163 + $("figure", articleDom).css("float", "none");
  164 + var article = articleDom.html();
157 165 that.article = article ? article : that.initialContent;
158 166 that.origBg = $("body").css("background-image");
159 167 }
160 168
161 169 if (value) {
162   - if (contentContainer.html() !== that.article) {
  170 + if (!simplified) {
163 171 $("body").css("background-image", "none");
164 172 contentContainer.html(that.article);
  173 + contentContainer.addClass(that.options.styles.simplified);
  174 + that.events.settingChanged.fire();
165 175 }
166 176 } else {
167   - if (contentContainer.html() !== that.initialContent) {
  177 + if (simplified) {
168 178 $("body").css("background-image", that.origBg);
169 179 contentContainer.html(that.initialContent);
  180 + contentContainer.removeClass(that.options.styles.simplified);
  181 + that.events.settingChanged.fire();
170 182 }
171 183 }
172 184 };
@@ -189,6 +201,7 @@ var fluid_1_5 = fluid_1_5 || {};
189 201 simplifiedContent: {
190 202 type: "fluid.uiOptions.actionAnts.simplifiedContentEnactor",
191 203 container: "{uiEnhancer}.container",
  204 + createOnEvent: "onCreateSimplifiedContent",
192 205 options: {
193 206 sourceApplier: "{uiEnhancer}.applier",
194 207 rules: {
@@ -196,7 +209,15 @@ var fluid_1_5 = fluid_1_5 || {};
196 209 }
197 210 }
198 211 }
  212 + },
  213 + events: {
  214 + onCreateSimplifiedContent: null
199 215 }
200 216 });
  217 + fluid.uiEnhancer.extraActions.finalInit = function (that) {
  218 + $(document).ready(function () {
  219 + that.events.onCreateSimplifiedContent.fire();
  220 + });
  221 + };
201 222
202 223 })(jQuery, fluid_1_5);

Tip: You can add notes to lines in a file. Hover to the left of a line to make a note

Something went wrong with that request. Please try again.