diff --git a/components/Carbon.js b/components/Carbon.js index d595786..e4eeb38 100644 --- a/components/Carbon.js +++ b/components/Carbon.js @@ -4,7 +4,7 @@ import domtoimage from 'dom-to-image' import CodeMirror from 'react-codemirror' import Spinner from 'react-spinner' import WindowControls from '../components/WindowControls' -import { COLORS } from '../lib/constants' +import { COLORS, DEFAULT_LANGUAGE } from '../lib/constants' const DEFAULT_SETTINGS = { paddingVertical: '50px', @@ -13,7 +13,7 @@ const DEFAULT_SETTINGS = { marginHorizontal: '45px', background: '#fed0ec', theme: 'dracula', - language: 'javascript' + language: DEFAULT_LANGUAGE } class Carbon extends React.Component { @@ -23,6 +23,8 @@ class Carbon extends React.Component { this.state = { loading: true } + + this.detectLanguage = this.detectLanguage.bind(this) } componentDidMount() { @@ -31,12 +33,23 @@ class Carbon extends React.Component { }) } + detectLanguage () { + return 'javascript' + } + render () { const config = Object.assign(DEFAULT_SETTINGS, this.props.config) + let language + if (config.language.name === 'Auto') { + language = this.detectLanguage(this.props.children) + } else { + language = config.language.module || 'plaintext' + } + const options = { lineNumbers: false, - mode: config.language, + mode: language, theme: config.theme, scrollBarStyle: null, viewportMargin: Infinity, diff --git a/lib/constants.js b/lib/constants.js index 4ceee7b..5deebb3 100644 --- a/lib/constants.js +++ b/lib/constants.js @@ -55,6 +55,10 @@ export const LANGUAGES = [ { name: 'Plain Text' }, + { + name: 'C', + module: 'clike' + }, { name: 'Clojure', module: 'clojure' @@ -229,6 +233,8 @@ export const LANGUAGES = [ } ] +export const DEFAULT_LANGUAGE = { name: 'Auto' } + export const COLORS = { BLACK: '#121212', PRIMARY: '#F8E81C', diff --git a/pages/editor.js b/pages/editor.js index 5935516..a3f4854 100644 --- a/pages/editor.js +++ b/pages/editor.js @@ -9,7 +9,7 @@ import ReadFileDropContainer from '../components/ReadFileDropContainer' import Toolbar from '../components/Toolbar' import Carbon from '../components/Carbon' import api from '../lib/api' -import { THEMES, LANGUAGES, COLORS, DEFAULT_CODE } from '../lib/constants' +import { THEMES, LANGUAGES, DEFAULT_LANGUAGE, COLORS, DEFAULT_CODE } from '../lib/constants' class Editor extends React.Component { /* pathname, asPath, err, req, res */ @@ -30,7 +30,7 @@ class Editor extends React.Component { this.state = { background: '#ABB8C3', theme: THEMES[0].id, - language: 'javascript', // TODO LANGUAGES[0] + language: DEFAULT_LANGUAGE, dropShadow: true, windowControls: true, paddingVertical: '48px',