timeslider settings for fonts

src/node/utils/Settings.js

@@ -95,7 +95,7 @@ exports.toolbar = {
     ["showusers"]
   ],
   timeslider: [
-    ["timeslider_export", "timeslider_returnToPad"]
+    ["timeslider_export", "timeslider_settings", "timeslider_returnToPad"]
   ]
 }
 

src/node/utils/toolbar.js

@@ -210,6 +210,12 @@ module.exports = {
       class: "buttonicon buttonicon-import_export"
     },
 
+    timeslider_settings: {
+      command: "settings",
+      localizationId: "pad.toolbar.settings.title",
+      class: "buttonicon buttonicon-settings"
+    },
+
     timeslider_returnToPad: {
       command: "timeslider_returnToPad",
       localizationId: "timeslider.toolbar.returnbutton",

src/static/css/timeslider.css

@@ -205,12 +205,9 @@ stepper:active{
   float:right;
   height:30px;
 }
-#settings,
+#import_export, #settings{
-#import_export,
+  top: 115px;
-#embed,
+  position: fixed;
-#connectivity,
-#users {
-    top: 62px;
 }
 #import_export .popup {
   width: 183px;
@@ -219,9 +216,7 @@ stepper:active{
   border-radius: 0 0 0 6px;
 }
 #import_export {
-  top: 115px;
   width: 185px;
-  position: fixed;
 }
 .timeslider-bar {
   background: #f7f7f7;
@@ -237,7 +232,7 @@ stepper:active{
 .timeslider-bar #editbar {
   border-bottom: none;
   float: right;
-  width: 170px;
+  width: 180px;
 }
 .timeslider-bar h1 {
   margin: 5px

src/static/js/timeslider.js

@@ -163,6 +163,32 @@ function handleClientVars(message)
   $('#leftstep').attr("title", html10n.get("timeslider.backRevision"));
   $('#rightstep').attr("title", html10n.get("timeslider.forwardRevision"));
 
+  // font family change
+  $("#viewfontmenu").change(function(){
+    var font = $("#viewfontmenu").val();
+    if(font === "monospace") setFont("Courier new");
+    if(font === "opendyslexic") setFont("OpenDyslexic");
+    if(font === "comicsans") setFont("Comic Sans MS");
+    if(font === "georgia") setFont("Georgia");
+    if(font === "impact") setFont("Impact");
+    if(font === "lucida") setFont("Lucida");
+    if(font === "lucidasans") setFont("Lucida Sans Unicode");
+    if(font === "palatino") setFont("Palatino Linotype");
+    if(font === "tahoma") setFont("Tahoma");
+    if(font === "timesnewroman") setFont("Times New Roman");
+    if(font === "trebuchet") setFont("Trebuchet MS");
+    if(font === "verdana") setFont("Verdana");
+    if(font === "symbol") setFont("Symbol");
+    if(font === "webdings") setFont("Webdings");
+    if(font === "wingdings") setFont("Wingdings");
+    if(font === "sansserif") setFont("MS Sans Serif");
+    if(font === "serif") setFont("MS Serif");
+  });
+
+}
+
+function setFont(font){
+  $('#padcontent').css("font-family", font);
 }
 
 exports.baseURL = '';

src/templates/timeslider.html

@@ -176,11 +176,41 @@
 <% e.end_block(); %>
 </div>
 
+<div class="popup" id="settings">
+  <tr>
+    <td>
+      <label for="viewfontmenu" data-l10n-id="pad.settings.fontType">Font type:</label>
+    </td>
+    <td>
+      <select id="viewfontmenu">
+        <option value="normal" data-l10n-id="pad.settings.fontType.normal"></option>
+        <option value="monospace" data-l10n-id="pad.settings.fontType.monospaced"></option>
+        <option value="opendyslexic" data-l10n-id="pad.settings.fontType.opendyslexic"></option>
+        <option value="comicsans" data-l10n-id="pad.settings.fontType.comicsans"></option>
+        <option value="georgia" data-l10n-id="pad.settings.fontType.georgia"></option>
+        <option value="impact" data-l10n-id="pad.settings.fontType.impact"></option>
+        <option value="lucida" data-l10n-id="pad.settings.fontType.lucida"></option>
+        <option value="lucidasans" data-l10n-id="pad.settings.fontType.lucidasans"></option>
+        <option value="palatino" data-l10n-id="pad.settings.fontType.palatino"></option>
+        <option value="tahoma" data-l10n-id="pad.settings.fontType.tahoma"></option>
+        <option value="timesnewroman" data-l10n-id="pad.settings.fontType.timesnewroman"></option>
+        <option value="trebuchet" data-l10n-id="pad.settings.fontType.trebuchet"></option>
+        <option value="verdana" data-l10n-id="pad.settings.fontType.verdana"></option>
+        <option value="symbol" data-l10n-id="pad.settings.fontType.symbol"></option>
+        <option value="webdings" data-l10n-id="pad.settings.fontType.webdings"></option>
+        <option value="wingdings" data-l10n-id="pad.settings.fontType.wingdings"></option>
+        <option value="sansserif" data-l10n-id="pad.settings.fontType.sansserif"></option>
+        <option value="serif" data-l10n-id="pad.settings.fontType.serif"></option>
+      </select>
+    </td>
+  </tr>
+</div>
+
 <!-- export code -->
 <div id="import_export">
-
 <div id="export" class="popup">
   <p data-l10n-id="timeslider.exportCurrent"></p>
+  <a id="exportetherpada" target="_blank" class="exportlink"><div class="exporttype" id="exportetherpad" data-l10n-id="pad.importExport.exportetherpad"></div></a>
   <a id="exporthtmla" target="_blank" class="exportlink"><div class="exporttype" id="exporthtml" data-l10n-id="pad.importExport.exporthtml"></div></a>
   <a id="exportplaina" target="_blank" class="exportlink"><div class="exporttype" id="exportplain" data-l10n-id="pad.importExport.exportplain"></div></a>
   <a id="exportworda" target="_blank" class="exportlink"><div class="exporttype" id="exportword" data-l10n-id="pad.importExport.exportword"></div></a>