https://www.aichi-kyosai.or.jp/js/jquery.textresizer.js

1/*
2jQuery Text Resizer Plugin v1.1.0
3    
4Copyright (c) 2009-2013 Mario J Vargas
5See the file MIT-LICENSE.txt for copying permission.
6    
7Website: http://angstrey.com/
8Documentation: http://angstrey.com/index.php/projects/jquery-text-resizer-plugin/
9*/
10;(function ($) {
11    "use strict";
12
13    var TextResizerPlugin, debug, stringify;
14
15    stringify = function (value) {
16        if ("object" === (typeof window.JSON) && "function" === (typeof window.JSON.stringify)) {
17            return JSON.stringify(value);
18        }
19
20        // Because of IE7 and below... Need I say more?
21        return value;
22    };
23
24    debug = function (obj) {
25        if (window.console && "function" === (typeof window.console.log)) {
26            setTimeout(function () {
27                var key,
28                    output = [],
29                    keyValuePair;
30
31                if ("string" === (typeof obj)) {
32                    output.push("jquery.textresizer => " + obj);
33                } else {
34                    output.push("jquery.textresizer => {");
35                    for (key in obj) {
36                        if (obj.hasOwnProperty(key)) {
37                            keyValuePair = [
38                                "    ", key, ": ", stringify(obj[key])
39                            ].join("");
40                            output.push(keyValuePair);
41                        }
42                    }
43                    output.push("}");
44                }
45
46                console.log(output.join("\n"));
47            }, 0);
48        }
49    };
50
51    TextResizerPlugin = function ($elements, options) {
52        this.$elements = $elements;
53        this.settings = options || TextResizerPlugin.defaults;
54    };
55
56    TextResizerPlugin.defaults = {
57        debugMode: false,                               // Disable debug mode.
58        type: "fontSize",                               // Available options: fontSize, css, cssClass.
59        target: "body",                                 // The HTML element to which the new font size will be applied.
60        selectedIndex: -1,                              // No font size option selected by default.
61        suppressClickThrough: true                      // Disables click-through of font size controls.
62    };
63
64    TextResizerPlugin.prototype.buildDefaultFontSizes = function (numElms) {
65        if (0 === numElms) {
66            return;
67        }
68
69        var size0 = 8,                // Initial size, measured in pixels
70            mySizes = [],
71            i,
72            value;
73
74        if (this.settings.debugMode) {
75            debug("In buildDefaultFontSizes: numElms = " + numElms);
76        }
77
78        if (this.settings.debugMode) {
79            for (i = 0; i < numElms; i += 1) {
80                // Append elements in increments of 2 units
81                value = (size0 + (i * 2)) / 10;
82                mySizes.push(value + "em");
83
84                debug("In buildDefaultFontSizes: mySizes[" + i + "] = " + mySizes[i]);
85            }
86        } else {
87            for (i = 0; i < numElms; i += 1) {
88                // Append elements in increments of 2 units
89                value = (size0 + (i * 2)) / 10;
90                mySizes.push(value + "em");
91            }
92        }
93
94        return mySizes;
95    };
96
97    TextResizerPlugin.prototype.serializeHash = function (dictionary) {
98        // jQuery's param() function does not replace white space correctly
99        return $.param(dictionary).replace(/\+/g, "%20");
100    };
101
102    TextResizerPlugin.prototype.deserializeHash = function (serializedValue) {
103        var i,
104            valueCount,
105            keyValuePair,
106            dictionary = {},
107            separatorPattern = /\&|\|/g,
108            dictValues = serializedValue.split(separatorPattern);
109
110        for (i = 0, valueCount = dictValues.length; i < valueCount; i += 1) {
111            // Separate key/value pair and assign to dictionary
112            keyValuePair = dictValues[i].split("=");
113            dictionary[keyValuePair[0]] = window.decodeURIComponent(keyValuePair[1]);
114        }
115
116        // Now that the object is finished, return it
117        return dictionary;
118    };
119
120    TextResizerPlugin.prototype.buildCookieID = function (selector, target, prop) {
121        return "JQUERY.TEXTRESIZER[" + selector + "," + target + "]." + prop;
122    };
123
124    TextResizerPlugin.prototype.getCookie = function (selector, target, prop) {
125        var id = this.buildCookieID(selector, target, prop),
126            cookieValue = cObject[id]; //$.cookie(id)
127
128        if (cObject[id + ".valueType"] === "dict" && cookieValue) { //$.cookie(id + ".valueType")
129            return this.deserializeHash(cookieValue);
130        }
131
132        return cookieValue;
133    };
134
135    TextResizerPlugin.prototype.setCookie = function (selector, target, prop, value) {
136        var id = this.buildCookieID(selector, target, prop),
137            // Cookie expires in 1 year (365 days/year)
138            cookieOpts = { expires: 365, path: "/" },
139            serializedVals;
140
141        var kigen = 365;
142	    var nowdate = new Date();
143    	nowdate.setTime(nowdate.getTime() + kigen*24*60*60*1000);
144        var path = "path=/; Secure; SameSite=None";
145        var kigendate = nowdate.toUTCString();
146        var expires = "expires=" + kigendate + "; ";
147        expires = "max-age=31536000;";
148
149        // Serialize value if it's an object
150        if ("object" === (typeof value)) {
151            // Store type of value so we can convert it back 
152            // to a dictionary object
153
154            document.cookie = id + ".valueType=dict; " + expires + path;
155            //$.cookie(id + ".valueType", "dict", cookieOpts);
156
157            serializedVals = this.serializeHash(value);
158
159            document.cookie = id + "=" + serializedVals + "; " + expires + path;
160            //$.cookie(id, serializedVals, cookieOpts);
161
162            if (this.settings.debugMode) {
163                debug("In setCookie: Cookie: " + id + ": " + serializedVals);
164            }
165        } else {
166            document.cookie = id + "=" + value + "; " + expires + path;
167            //$.cookie(id, value, cookieOpts);
168
169            if (this.settings.debugMode) {
170                debug("In setCookie: Cookie (not hash): " + id + ": " + value);
171            }
172        }
173    };
174
175    TextResizerPlugin.prototype.applyInlineCssProperties = function ($targetElement, cssStyles) {
176        $targetElement.css(cssStyles);
177    };
178
179    TextResizerPlugin.prototype.applyCssClass = function ($targetElement, newSize, cssClasse

179s) {
180        // Remove previously assigned CSS class from
181        // target element. Iterating through matched
182        // elements ensures the class is removed
183        $.each(cssClasses, function () {
184            var className = this.toString();
185            $targetElement.each(function () {
186                var $currentElement = $(this);
187                if ($currentElement.hasClass(className)) {
188                    $currentElement.removeClass(className);
189                }
190            });
191        });
192
193        // Now apply the new CSS class
194        $targetElement.addClass(newSize);
195    };
196
197    TextResizerPlugin.prototype.applySpecificFontSize = function ($targetElement, newSize) {
198        $targetElement.css("font-size", newSize);
199    };
200
201    TextResizerPlugin.prototype.applyFontSize = function (newSize) {
202        if (this.settings.debugMode) {
203            debug([
204                "In applyFontSize(): target: ",
205                this.settings.target,
206                " | ",
207                "newSize: ",
208                stringify(newSize),
209                " | ",
210                "type: ",
211                this.settings.type
212            ].join(""));
213        }
214
215        var $targetElement = $(this.settings.target);
216        switch (this.settings.type) {
217            case "css":
218                this.applyInlineCssProperties($targetElement, newSize);
219                break;
220
221            case "cssClass":
222                this.applyCssClass($targetElement, newSize, this.settings.sizes);
223                break;
224
225            default:
226                this.applySpecificFontSize($targetElement, newSize);
227                break;
228        }
229    };
230
231    TextResizerPlugin.prototype.loadPreviousState = function () {
232        var settings = this.settings,
233            rawSelectedIndex,
234            selectedIndex,
235            prevSize;
236
237        // Determine if jquery.cookie is installed
238        if (cObject) { //$.cookie
239            if (settings.debugMode) {
240                debug("In loadPreviousState(): jquery.cookie: INSTALLED");
241            }
242
243            rawSelectedIndex = this.getCookie(settings.selector, settings.target, "selectedIndex");
244            selectedIndex = parseInt(rawSelectedIndex, 10);
245            prevSize = this.getCookie(settings.selector, settings.target, "size");
246
247            if (!isNaN(selectedIndex)) {
248                settings.selectedIndex = selectedIndex;
249            }
250
251            if (settings.debugMode) {
252                debug("In loadPreviousState: selectedIndex: " + selectedIndex + "; type: " + (typeof selectedIndex));
253
254                debug("In loadPreviousState: prevSize: " + prevSize + "; type: " + (typeof prevSize));
255            }
256
257            if (prevSize) {
258                this.applyFontSize(prevSize);
259            }
260        } else {
261            if (settings.debugMode) {
262                debug("In loadPreviousState(): jquery.cookie: NOT INSTALLED");
263            }
264        }
265    };
266
267    TextResizerPlugin.prototype.markActive = function (sizeButton) {
268        // Deactivate previous button
269        $(this.settings.selector).removeClass("textresizer-active");
270
271        // Mark this button as active
272        $(sizeButton).addClass("textresizer-active");
273    };
274
275    TextResizerPlugin.prototype.saveState = function (newSize) {
276        // Determine if jquery.cookie is installed
277        if (cObject) { //$.cookie
278            var selector = this.settings.selector,
279                target = this.settings.target,
280                selectedIndex = this.settings.selectedIndex;
281
282            if (this.settings.debugMode) {
283                debug("In saveState(): jquery.cookie: INSTALLED");
284            }
285
286            this.setCookie(selector, target, "size", newSize);
287            this.setCookie(selector, target, "selectedIndex", selectedIndex);
288        } else {
289            if (this.settings.debugMode) {
290                debug("In saveState(): jquery.cookie: NOT INSTALLED");
291            }
292        }
293    };
294
295    TextResizerPlugin.prototype.attachResizerToElement = function (element, index) {
296        var thisPlugin = this,
297            settings = thisPlugin.settings,
298            $resizeButton = $(element),                // Current resize button
299            currSizeValue = settings.sizes[index];     // Size corresponding to this resize button
300
301        // Mark this button as active if necessary
302        if (index === settings.selectedIndex) {
303            $resizeButton.addClass("textresizer-active");
304        }
305
306        // Apply the font size to target element when its 
307        // corresponding resize button is clicked
308        $resizeButton.on("click", { index: index }, function (e) {
309            var currentElement = this;
310
311            if (settings.suppressClickThrough) {
312                e.preventDefault();
313            }
314
315            settings.selectedIndex = e.data.index;
316
317            thisPlugin.applyFontSize(currSizeValue);
318            thisPlugin.saveState(currSizeValue);
319
320            thisPlugin.markActive(currentElement);
321        });
322    };
323
324    TextResizerPlugin.prototype.init = function () {
325        var numberOfElements = this.$elements.length,
326            debugMode = TextResizerPlugin.defaults.debugMode;
327
328        if (debugMode) {
329            debug("init() => selection count: " + numberOfElements);
330        }
331
332        // Stop plugin execution if no matched elements
333        if (0 === numberOfElements) {
334            return;
335        }
336
337        // Set up main options before element iteration
338        this.settings = $.extend(
339            {
340                selector: this.$elements.selector,
341                sizes: this.buildDefaultFontSizes(numberOfElements)     // Default font sizes based on number of resize buttons.
342            },
343            $.fn.textresizer.defaults,
344            this.settings
345        );
346
347        debugMode = this.settings.debugMode;
348
349        if (debugMode) {
350            debug(this.settings);
351        }
352
353        // Ensure that the number of defined sizes is suitable
354        // for number of resize buttons.
355        if (numberOfElements > this.settings.sizes.length) {
356            if (debugMode) {
357                debug("ERROR: Number of defined sizes incompatible with number of buttons => elements: " + numberOfElements
358                        + "; defined sizes: " + this.settings.sizes.length
359                        + "; target: " + this.settings.target);
360            }
361
362            return;    // Stop execution of the plugin
363        }
364
365        this.loadPreviousState();
366
367        return this;
368    };
369
370    $.fn.textresizer = function (options) {
371        var plugin = new TextResizerPlugin(this, options).init();
372
373        // Iterate and bind click event function to each element
374        return this.each(function (i) {
375            plugin.attachResizerToElement(this, i);
376        });
377    };
378
379    $.fn.textresizer.defaults = TextResizerPlugin.defaults;
380})(window.jQuery);