From e534f2c4ffe68de1ae03ba17b65e78e98f64641c Mon Sep 17 00:00:00 2001 From: Anders Evenrud Date: Sun, 8 Feb 2015 20:43:17 +0100 Subject: [PATCH] Themes: Added automatic font inclusion (#79) --- dist-dev/index.html | 1 + dist/index.html | 1 + src/conf/110-frontend.json | 3 +- src/packages/default/CoreWM/main.js | 3 +- src/stylesheets/theme.less | 59 +---------------------------- src/themes/fonts/Karla/style.css | 57 ++++++++++++++++++++++++++++ src/tools/obt | 40 +++++++++++++++---- src/tools/templates/index.html | 1 + 8 files changed, 96 insertions(+), 69 deletions(-) create mode 100644 src/themes/fonts/Karla/style.css diff --git a/dist-dev/index.html b/dist-dev/index.html index 2ac49b5003..f1b2c23aa3 100644 --- a/dist-dev/index.html +++ b/dist-dev/index.html @@ -41,6 +41,7 @@ + diff --git a/dist/index.html b/dist/index.html index b01e6c5898..b92fd172a5 100644 --- a/dist/index.html +++ b/dist/index.html @@ -42,6 +42,7 @@ + diff --git a/src/conf/110-frontend.json b/src/conf/110-frontend.json index 168567d98d..3f62fb112d 100644 --- a/src/conf/110-frontend.json +++ b/src/conf/110-frontend.json @@ -48,9 +48,8 @@ "Sounds" : {}, "Icons" : {}, "Fonts" : { - "default" : "OSjsFont", + "default" : "Karla", "list" : [ - "OSjsFont", "Arial", "Arial Black", "Sans-serif", diff --git a/src/packages/default/CoreWM/main.js b/src/packages/default/CoreWM/main.js index 34447ce320..568c8b6f4c 100644 --- a/src/packages/default/CoreWM/main.js +++ b/src/packages/default/CoreWM/main.js @@ -44,7 +44,7 @@ desktopMargin : 5, wallpaper : 'osjs:///themes/wallpapers/wallpaper.jpg', backgroundColor : '#0B615E', - fontFamily : 'OSjsFont', + fontFamily : 'Karla', theme : 'default', icons : 'default', sounds : 'default', @@ -82,6 +82,7 @@ if ( defaults ) { cfg = Utils.mergeObject(cfg, defaults); } + return cfg; } diff --git a/src/stylesheets/theme.less b/src/stylesheets/theme.less index 166210a7aa..a22b28e7b4 100644 --- a/src/stylesheets/theme.less +++ b/src/stylesheets/theme.less @@ -82,66 +82,9 @@ /** * Base */ -@font-face { - font-family:OSjsFont; - src: url('/themes/fonts/Karla/Regular.eot'); - src: url('/themes/fonts/Karla/Regular.eot?#iefix') format('embedded-opentype'), - url('/themes/fonts/Karla/Regular.svg#karla') format('svg'), - url('/themes/fonts/Karla/Regular.woff') format('woff'), - url('/themes/fonts/Karla/Regular.ttf') format('truetype'); - font-weight:normal; - font-style:normal; -} -@font-face { - font-family:OSjsFont; - src: url('/themes/fonts/Karla/Bold.eot'); - src: url('/themes/fonts/Karla/Bold.eot?#iefix') format('embedded-opentype'), - url('/themes/fonts/Karla/Bold.svg#karla_bold') format('svg'), - url('/themes/fonts/Karla/Bold.woff') format('woff'), - url('/themes/fonts/Karla/Bold.ttf') format('truetype'); - font-weight:bold; -} -@font-face { - font-family:OSjsFont; - src: url('/themes/fonts/Karla/Italic.eot'); - src: url('/themes/fonts/Karla/Italic.eot?#iefix') format('embedded-opentype'), - url('/themes/fonts/Karla/Italic.svg#karla_italic') format('svg'), - url('/themes/fonts/Karla/Italic.woff') format('woff'), - url('/themes/fonts/Karla/Italic.ttf') format('truetype'); - font-style:italic; -} -@font-face { - font-family:OSjsFont; - src: url('/themes/fonts/Karla/Italic.eot'); - src: url('/themes/fonts/Karla/Italic.eot?#iefix') format('embedded-opentype'), - url('/themes/fonts/Karla/Italic.svg#karla_italic') format('svg'), - url('/themes/fonts/Karla/Italic.woff') format('woff'), - url('/themes/fonts/Karla/Italic.ttf') format('truetype'); - font-style:oblique; -} -@font-face { - font-family:OSjsFont; - src: url('/themes/fonts/Karla/BoldItalic.eot'); - src: url('/themes/fonts/Karla/BoldItalic.eot?#iefix') format('embedded-opentype'), - url('/themes/fonts/Karla/BoldItalic.svg#karla_bolditalic') format('svg'), - url('/themes/fonts/Karla/BoldItalic.woff') format('woff'), - url('/themes/fonts/Karla/BoldItalic.ttf') format('truetype'); - font-style:italic; - font-style:italic; -} -@font-face { - font-family:OSjsFont; - src: url('/themes/fonts/Karla/BoldItalic.eot'); - src: url('/themes/fonts/Karla/BoldItalic.eot?#iefix') format('embedded-opentype'), - url('/themes/fonts/Karla/BoldItalic.svg#karla_bolditalic') format('svg'), - url('/themes/fonts/Karla/BoldItalic.woff') format('woff'), - url('/themes/fonts/Karla/BoldItalic.ttf') format('truetype'); - font-style:italic; - font-style:oblique; -} body, input, button, textarea, label, select { - font-family:OSjsFont, Sans-serif; + font-family:Karla, Sans-serif; font-weight:normal; font-style:normal; color: @theme_base_fg_color; diff --git a/src/themes/fonts/Karla/style.css b/src/themes/fonts/Karla/style.css new file mode 100644 index 0000000000..b5c0bf13d0 --- /dev/null +++ b/src/themes/fonts/Karla/style.css @@ -0,0 +1,57 @@ +@font-face { + font-family:Karla; + src: url('/themes/fonts/Karla/Regular.eot'); + src: url('/themes/fonts/Karla/Regular.eot?#iefix') format('embedded-opentype'), + url('/themes/fonts/Karla/Regular.svg#karla') format('svg'), + url('/themes/fonts/Karla/Regular.woff') format('woff'), + url('/themes/fonts/Karla/Regular.ttf') format('truetype'); + font-weight:normal; + font-style:normal; +} +@font-face { + font-family:Karla; + src: url('/themes/fonts/Karla/Bold.eot'); + src: url('/themes/fonts/Karla/Bold.eot?#iefix') format('embedded-opentype'), + url('/themes/fonts/Karla/Bold.svg#karla_bold') format('svg'), + url('/themes/fonts/Karla/Bold.woff') format('woff'), + url('/themes/fonts/Karla/Bold.ttf') format('truetype'); + font-weight:bold; +} +@font-face { + font-family:Karla; + src: url('/themes/fonts/Karla/Italic.eot'); + src: url('/themes/fonts/Karla/Italic.eot?#iefix') format('embedded-opentype'), + url('/themes/fonts/Karla/Italic.svg#karla_italic') format('svg'), + url('/themes/fonts/Karla/Italic.woff') format('woff'), + url('/themes/fonts/Karla/Italic.ttf') format('truetype'); + font-style:italic; +} +@font-face { + font-family:Karla; + src: url('/themes/fonts/Karla/Italic.eot'); + src: url('/themes/fonts/Karla/Italic.eot?#iefix') format('embedded-opentype'), + url('/themes/fonts/Karla/Italic.svg#karla_italic') format('svg'), + url('/themes/fonts/Karla/Italic.woff') format('woff'), + url('/themes/fonts/Karla/Italic.ttf') format('truetype'); + font-style:oblique; +} +@font-face { + font-family:Karla; + src: url('/themes/fonts/Karla/BoldItalic.eot'); + src: url('/themes/fonts/Karla/BoldItalic.eot?#iefix') format('embedded-opentype'), + url('/themes/fonts/Karla/BoldItalic.svg#karla_bolditalic') format('svg'), + url('/themes/fonts/Karla/BoldItalic.woff') format('woff'), + url('/themes/fonts/Karla/BoldItalic.ttf') format('truetype'); + font-style:italic; + font-style:italic; +} +@font-face { + font-family:Karla; + src: url('/themes/fonts/Karla/BoldItalic.eot'); + src: url('/themes/fonts/Karla/BoldItalic.eot?#iefix') format('embedded-opentype'), + url('/themes/fonts/Karla/BoldItalic.svg#karla_bolditalic') format('svg'), + url('/themes/fonts/Karla/BoldItalic.woff') format('woff'), + url('/themes/fonts/Karla/BoldItalic.ttf') format('truetype'); + font-style:italic; + font-style:oblique; +} diff --git a/src/tools/obt b/src/tools/obt index c5d250a7b2..f5cb1fa126 100755 --- a/src/tools/obt +++ b/src/tools/obt @@ -344,17 +344,18 @@ String.prototype.replaceAll = function(stringToFind,stringToReplace){ */ function buildThemes() { var dir = _path.join(ROOT, 'src', 'themes', 'styles'); + var dir2 = _path.join(ROOT, 'src', 'themes', 'fonts'); var q = new AQ(); - function aq(iter, name) { + function aq(name) { q.add(function(cb) { console.log("\033[1;32mBuilding theme \033[0;33m%s\033[0m", name); cb(); }); q.add(function(cb) { - var src = _path.join(dir, iter, 'style.less'); + var src = _path.join(dir, name, 'style.less'); var dest = _path.join(ROOT, 'dist', 'themes', 'styles', name + '.css'); console.log('less', src, dest); @@ -381,15 +382,26 @@ String.prototype.replaceAll = function(stringToFind,stringToReplace){ }); } - var name; - var dirs = getDirs(dir); - for ( var i = 0; i < dirs.length; i++ ) { - name = dirs[i]; + console.log("\033[1;32mBuilding fonts\033[0m"); + var fontStyles = []; + getDirs(dir2).forEach(function(name) { if ( !name.match(/^\.|\_/) ) { - aq(dirs[i], name); + var stylesheet = _path.join(dir2, name, 'style.css'); + if ( _fs.existsSync(stylesheet) ) { + console.log('Found', name); + fontStyles.push(_fs.readFileSync(stylesheet).toString()); + } } - } + }); + var dest = _path.join(ROOT, 'dist', 'themes', 'fonts.css'); + _fs.writeFileSync(dest, fontStyles.join("\n")); + + getDirs(dir).forEach(function(name) { + if ( !name.match(/^\.|\_/) ) { + aq(name); + } + }); q.run(function() { }); } @@ -655,10 +667,22 @@ String.prototype.replaceAll = function(stringToFind,stringToReplace){ return scan_themes(src, 'icon', true); })(); + var fonts = (function() { + var list = []; + var src = _path.join(ROOT, 'src', 'themes', 'fonts'); + getDirs(src).forEach(function(name) { + if ( !name.match(/^\.|\_/) ) { + list.push(name); + } + }); + return list; + })(); + settings.Styles = styles; settings.Icons = icons; settings.Sounds = sounds; + settings.Fonts.list = fonts.concat(settings.Fonts.list); settings.MIME = MIMES.descriptions; settings.EXTMIME = MIMES.mapping; settings.Core.Repositories = REPOS; diff --git a/src/tools/templates/index.html b/src/tools/templates/index.html index 01962f979d..c92eed7bd2 100644 --- a/src/tools/templates/index.html +++ b/src/tools/templates/index.html @@ -41,6 +41,7 @@ + %STYLES%