docs/libs/gitbook-2.6.7/js/plugin-fontsettings.js

   1 gitbook.require(["gitbook", "lodash", "jQuery"], function(gitbook, _, $) {
   2     var fontState;
   3
   4     var THEMES = {
   5         "white": 0,
   6         "sepia": 1,
   7         "night": 2
   8     };
   9
  10     var FAMILY = {
  11         "serif": 0,
  12         "sans": 1
  13     };
  14
  15     // Save current font settings
  16     function saveFontSettings() {
  17         gitbook.storage.set("fontState", fontState);
  18         update();
  19     }
  20
  21     // Increase font size
  22     function enlargeFontSize(e) {
  23         e.preventDefault();
  24         if (fontState.size >= 4) return;
  25
  26         fontState.size++;
  27         saveFontSettings();
  28     };
  29
  30     // Decrease font size
  31     function reduceFontSize(e) {
  32         e.preventDefault();
  33         if (fontState.size <= 0) return;
  34
  35         fontState.size--;
  36         saveFontSettings();
  37     };
  38
  39     // Change font family
  40     function changeFontFamily(index, e) {
  41         e.preventDefault();
  42
  43         fontState.family = index;
  44         saveFontSettings();
  45     };
  46
  47     // Change type of color
  48     function changeColorTheme(index, e) {
  49         e.preventDefault();
  50
  51         var $book = $(".book");
  52
  53         if (fontState.theme !== 0)
  54             $book.removeClass("color-theme-"+fontState.theme);
  55
  56         fontState.theme = index;
  57         if (fontState.theme !== 0)
  58             $book.addClass("color-theme-"+fontState.theme);
  59
  60         saveFontSettings();
  61     };
  62
  63     function update() {
  64         var $book = gitbook.state.$book;
  65
  66         $(".font-settings .font-family-list li").removeClass("active");
  67         $(".font-settings .font-family-list li:nth-child("+(fontState.family+1)+")").addClass("active");
  68
  69         $book[0].className = $book[0].className.replace(/\bfont-\S+/g, '');
  70         $book.addClass("font-size-"+fontState.size);
  71         $book.addClass("font-family-"+fontState.family);
  72
  73         if(fontState.theme !== 0) {
  74             $book[0].className = $book[0].className.replace(/\bcolor-theme-\S+/g, '');
  75             $book.addClass("color-theme-"+fontState.theme);
  76         }
  77     };
  78
  79     function init(config) {
  80         var $bookBody, $book;
  81
  82         //Find DOM elements.
  83         $book = gitbook.state.$book;
  84         $bookBody = $book.find(".book-body");
  85
  86         // Instantiate font state object
  87         fontState = gitbook.storage.get("fontState", {
  88             size: config.size || 2,
  89             family: FAMILY[config.family || "sans"],
  90             theme: THEMES[config.theme || "white"]
  91         });
  92
  93         update();
  94     };
  95
  96
  97     gitbook.events.bind("start", function(e, config) {
  98         var opts = config.fontsettings;
  99         if (!opts) return;
 100
 101         // Create buttons in toolbar
 102         gitbook.toolbar.createButton({
 103             icon: 'fa fa-font',
 104             label: 'Font Settings',
 105             className: 'font-settings',
 106             dropdown: [
 107                 [
 108                     {
 109                         text: 'A',
 110                         className: 'font-reduce',
 111                         onClick: reduceFontSize
 112                     },
 113                     {
 114                         text: 'A',
 115                         className: 'font-enlarge',
 116                         onClick: enlargeFontSize
 117                     }
 118                 ],
 119                 [
 120                     {
 121                         text: 'Serif',
 122                         onClick: _.partial(changeFontFamily, 0)
 123                     },
 124                     {
 125                         text: 'Sans',
 126                         onClick: _.partial(changeFontFamily, 1)
 127                     }
 128                 ],
 129                 [
 130                     {
 131                         text: 'White',
 132                         onClick: _.partial(changeColorTheme, 0)
 133                     },
 134                     {
 135                         text: 'Sepia',
 136                         onClick: _.partial(changeColorTheme, 1)
 137                     },
 138                     {
 139                         text: 'Night',
 140                         onClick: _.partial(changeColorTheme, 2)
 141                     }
 142                 ]
 143             ]
 144         });
 145
 146
 147         // Init current settings
 148         init(opts);
 149     });
 150 });
 151
 152