configuration/DefaultTheme.js

  1. import JsonCSS from 'json-css'
  2. import merge from 'lodash.merge'
  3. import { editorLogger as logger } from './LoggerConfig'
  5. /**
  6.  * @typedef {PenStyle} InkTheme
  7.  */
  8. /**
  9.  * @typedef {Object} MathTheme
  10.  * @property {String} font-family=STIXGeneral Font-family to be used
  11.  */
  12. /**
  13.  * @typedef {Object} GeneratedTheme
  14.  * @property {String} font-family=STIXGeneral Font-family to be used
  15.  * @property {String} color=#A8A8A8FF Color to be used
  16.  */
  17. /**
  18.  * @typedef {Object} TextTheme
  19.  * @property {String} font-family=OpenSans Font-family to be used
  20.  * @property {Number} font-size=10 Font-size to be used
  21.  */
  22. /**
  23.  * @typedef {Object} Theme
  24.  * @property {InkTheme} ink General settings
  25.  * @property {MathTheme} .math Math theme
  26.  * @property {GeneratedTheme} .math-solver Theme to be used for generated items
  27.  * @property {TextTheme} .text Text theme
  28.  */
  30. /**
  31.  * Default theme
  32.  * @type {Theme}
  33.  */
  34. const defaultTheme = {
  35.   ink: {
  36.     color: '#000000',
  37.     '-myscript-pen-width': 1,
  38.     '-myscript-pen-fill-style': 'none',
  39.     '-myscript-pen-fill-color': '#FFFFFF00'
  40.   },
  41.   '.math': {
  42.     'font-family': 'STIXGeneral'
  43.   },
  44.   '.math-solved': {
  45.     'font-family': 'STIXGeneral',
  46.     color: '#A8A8A8FF'
  47.   },
  48.   '.text': {
  49.     'font-family': 'MyScriptInter',
  50.     'font-size': 10
  51.   }
  52. }
  53. const parser = new JsonCSS()
  55. /**
  56.  * Generate theme
  57.  * @param {Theme} theme Custom theme to be applied
  58.  * @return {Theme} Overridden theme
  59.  */
  60. export function overrideDefaultTheme (theme) {
  61.   const currentTheme = merge({}, defaultTheme, theme === undefined ? {} : theme)
  62.   logger.debug('Override default theme', currentTheme)
  63.   return currentTheme
  64. }
  66. export function toCSS (theme) {
  67.   return parser.toCSS(theme)
  68. }
  70. export function toJSON (theme) {
  71.   return parser.toJSON(theme)
  72. }
  74. export default defaultTheme