forked from Miroirs/x49gp
load external style-X.css for styling instead of hardcoding it
This commit is contained in:
parent
85c445c7d8
commit
4f8d3977e5
6 changed files with 201 additions and 145 deletions
89
dist/style-49gp.css
vendored
Normal file
89
dist/style-49gp.css
vendored
Normal file
|
@ -0,0 +1,89 @@
|
|||
window {
|
||||
background-color: #f5deb3;
|
||||
font-family: URW Gothic;
|
||||
font-weight: normal;
|
||||
}
|
||||
.label-key,
|
||||
.label-left,
|
||||
.label-right,
|
||||
.label-letter,
|
||||
.label-below {
|
||||
font-weight: bold;
|
||||
}
|
||||
.annunciator {
|
||||
padding: 0px;
|
||||
color: #080808;
|
||||
}
|
||||
.lcd-container,
|
||||
.annunciators-container {
|
||||
background-color: #a9d0b2;
|
||||
}
|
||||
button {
|
||||
background-image: none;
|
||||
padding: 0px;
|
||||
margin-left: 15px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
button.key-down {
|
||||
border-color: #080808;
|
||||
}
|
||||
button.menu {
|
||||
background-color: #a9a9a9;
|
||||
}
|
||||
button.function {
|
||||
background-color: #696969;
|
||||
}
|
||||
button.arrow {
|
||||
background-color: #e0e0e0;
|
||||
border-radius: 33%;
|
||||
}
|
||||
button.alpha {
|
||||
background-color: #fae82c;
|
||||
}
|
||||
button.core,
|
||||
button.core-number {
|
||||
background-color: #080808;
|
||||
}
|
||||
button.alpha .label-key,
|
||||
button.arrow .label-key,
|
||||
button.menu .label-key {
|
||||
color: #080808;
|
||||
}
|
||||
button.shift-left {
|
||||
background-color: #4060a4;
|
||||
}
|
||||
button.shift-right {
|
||||
background-color: #8e2518;
|
||||
}
|
||||
button.shift-left .label-key,
|
||||
button.shift-right .label-key {
|
||||
font-size: 24px; /* typically 2 * base font size */
|
||||
color: #080808;
|
||||
}
|
||||
button.core-number .label-key,
|
||||
button.arrow .label-key,
|
||||
.annunciator {
|
||||
font-size: 21px; /* typically 1.75 * base font size */
|
||||
}
|
||||
.label-key {
|
||||
font-size: 12px; /* base font size */
|
||||
color: #ffffff;
|
||||
}
|
||||
.label-left,
|
||||
.label-right,
|
||||
.label-letter,
|
||||
.label-below {
|
||||
font-size: 9px; /* typically 0.75 * base font size */
|
||||
}
|
||||
.label-left {
|
||||
color: #4060a4;
|
||||
}
|
||||
.label-right {
|
||||
color: #c06e60;
|
||||
}
|
||||
.label-below {
|
||||
color: #4060a4;
|
||||
}
|
||||
.label-letter {
|
||||
color: #fae82c;
|
||||
}
|
89
dist/style-50g.css
vendored
Normal file
89
dist/style-50g.css
vendored
Normal file
|
@ -0,0 +1,89 @@
|
|||
window {
|
||||
background-color: #272727;
|
||||
font-family: URW Gothic;
|
||||
font-weight: normal;
|
||||
}
|
||||
.label-key,
|
||||
.label-left,
|
||||
.label-right,
|
||||
.label-letter,
|
||||
.label-below {
|
||||
font-weight: bold;
|
||||
}
|
||||
.annunciator {
|
||||
padding: 0px;
|
||||
color: #080808;
|
||||
}
|
||||
.lcd-container,
|
||||
.annunciators-container {
|
||||
background-color: #a9d0b2;
|
||||
}
|
||||
button {
|
||||
background-image: none;
|
||||
padding: 0px;
|
||||
margin-left: 15px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
button.key-down {
|
||||
border-color: #080808;
|
||||
}
|
||||
button.menu {
|
||||
background-color: #a9a9a9;
|
||||
}
|
||||
button.function {
|
||||
background-color: #696969;
|
||||
}
|
||||
button.arrow {
|
||||
background-color: #e0e0e0;
|
||||
border-radius: 33%;
|
||||
}
|
||||
button.alpha {
|
||||
background-color: #fae82c;
|
||||
}
|
||||
button.core,
|
||||
button.core-number {
|
||||
background-color: #080808;
|
||||
}
|
||||
button.alpha .label-key,
|
||||
button.arrow .label-key,
|
||||
button.menu .label-key {
|
||||
color: #080808;
|
||||
}
|
||||
button.shift-left {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
button.shift-right {
|
||||
background-color: #8e2518;
|
||||
}
|
||||
button.shift-left .label-key,
|
||||
button.shift-right .label-key {
|
||||
font-size: 24px; /* typically 2 * base font size */
|
||||
color: #080808;
|
||||
}
|
||||
button.core-number .label-key,
|
||||
button.arrow .label-key,
|
||||
.annunciator {
|
||||
font-size: 21px; /* typically 1.75 * base font size */
|
||||
}
|
||||
.label-key {
|
||||
font-size: 12px; /* base font size */
|
||||
color: #ffffff;
|
||||
}
|
||||
.label-left,
|
||||
.label-right,
|
||||
.label-letter,
|
||||
.label-below {
|
||||
font-size: 9px; /* typically 0.75 * base font size */
|
||||
}
|
||||
.label-left {
|
||||
color: #f5f5f5;
|
||||
}
|
||||
.label-right {
|
||||
color: #c06e60;
|
||||
}
|
||||
.label-below {
|
||||
color: #4060a4;
|
||||
}
|
||||
.label-letter {
|
||||
color: #fae82c;
|
||||
}
|
6
dist/x50ng.scd
vendored
6
dist/x50ng.scd
vendored
|
@ -57,8 +57,7 @@ Please consult HP's manual (for their official firmware) or the documentation of
|
|||
- *--49gp* emulate an HP 49g+
|
||||
- *--newrpl-keyboard* label keyboard for newRPL
|
||||
- *-n* *--name*[=_name_] set alternate UI name
|
||||
- *-f* *--font*[=_fontname_] set alternate UI font
|
||||
- *-s* *--font-size*[=_X_] scale text by X (default: 3)
|
||||
- *-s* *--style-filename*[=_filename_] css filename in <datadir> (default: style-<model>.css)
|
||||
- *-S* *--display-scale*[=_X_] scale LCD by X (default: 2)
|
||||
- *--enable-debug*[=_port_] enable the debugger interface (default port: 1234)
|
||||
- *--debug* use along -D to also start the debugger immediately
|
||||
|
@ -81,8 +80,7 @@ The general configuration file of *x49gpng*. Content reflecting default values (
|
|||
name = "HP 50g" -- this customize the title of the window
|
||||
model = "50g" -- possible values: "49gp", "50g". Changes the colors and the bootloader looked for when (re-)flashing
|
||||
newrpl_keyboard = false -- when true this makes the keyboard labels more suited to newRPL use
|
||||
font = "urw gothic l"
|
||||
font_size = 12 -- integer only
|
||||
style_filename = "style-50g.css" -- CSS file (relative to this file)
|
||||
display_scale = 2 -- integer only
|
||||
verbose = false
|
||||
--- End of saturnng configuration ----------------------------------------------
|
||||
|
|
|
@ -25,13 +25,8 @@ struct options opt = {
|
|||
.newrpl = false,
|
||||
.name = NULL,
|
||||
.verbose = false,
|
||||
.font_size = 12,
|
||||
.style_filename = NULL,
|
||||
.display_scale = 2,
|
||||
#if defined( __linux__ )
|
||||
.font = "urw gothic l",
|
||||
#else
|
||||
.font = "Century Gothic",
|
||||
#endif
|
||||
};
|
||||
|
||||
lua_State* config_lua_values;
|
||||
|
@ -100,14 +95,13 @@ static char* config_to_string( void )
|
|||
"-- Configuration file for x50ng\n"
|
||||
"-- This is a comment\n"
|
||||
"name = \"%s\" -- this customize the title of the window\n"
|
||||
"model = \"%s\" -- possible values: \"49gp\", \"50g\". Changes the colors and the bootloader looked for when (re-)flashing\n"
|
||||
"model = \"%s\" -- possible values: \"49gp\", \"50g\". Changes the bootloader looked for when (re-)flashing\n"
|
||||
"newrpl_keyboard = %s -- when true this makes the keyboard labels more suited to newRPL use\n"
|
||||
"font = \"%s\"\n"
|
||||
"font_size = %i -- integer only\n"
|
||||
"style_filename = \"%s\" -- CSS file (relative to this file)\n"
|
||||
"display_scale = %i -- integer only\n"
|
||||
"verbose = %s\n"
|
||||
"--- End of x50ng configuration -----------------------------------------------\n",
|
||||
opt.name, opt.model == MODEL_50G ? "50g" : "49gp", opt.newrpl ? "true" : "false", opt.font, opt.font_size, opt.display_scale,
|
||||
opt.name, opt.model == MODEL_50G ? "50g" : "49gp", opt.newrpl ? "true" : "false", opt.style_filename, opt.display_scale,
|
||||
opt.verbose ? "true" : "false" );
|
||||
|
||||
return config;
|
||||
|
@ -156,10 +150,9 @@ void config_init( char* progname, int argc, char* argv[] )
|
|||
int clopt_verbose = -1;
|
||||
|
||||
char* clopt_name = NULL;
|
||||
char* clopt_font = NULL;
|
||||
char* clopt_style_filename = NULL;
|
||||
int clopt_model = -1;
|
||||
int clopt_newrpl = -1;
|
||||
int clopt_font_size = -1;
|
||||
int clopt_display_scale = -1;
|
||||
|
||||
int print_config_and_exit = false;
|
||||
|
@ -178,8 +171,7 @@ void config_init( char* progname, int argc, char* argv[] )
|
|||
{"49gp", no_argument, NULL, 496 },
|
||||
{"newrpl-keyboard", no_argument, &clopt_newrpl, true},
|
||||
{"name", required_argument, NULL, 'n' },
|
||||
{"font", required_argument, NULL, 'f' },
|
||||
{"font-size", required_argument, NULL, 's' },
|
||||
{"style-filename", required_argument, NULL, 's' },
|
||||
{"display-scale", required_argument, NULL, 'S' },
|
||||
|
||||
{"enable-debug", required_argument, NULL, 10 },
|
||||
|
@ -212,8 +204,7 @@ void config_init( char* progname, int argc, char* argv[] )
|
|||
" --newrpl-keyboard label keyboard for newRPL\n"
|
||||
"\n"
|
||||
" -n --name[=<name>] set alternate UI name\n"
|
||||
" -f --font[=<fontname>] set alternate UI font\n"
|
||||
" -s --font-size[=<X>] scale text by X (default: 3)\n"
|
||||
" -s --style-filename[=<filename>] css filename in <datadir> (default: style-<model>.css)\n"
|
||||
" -S --display-scale[=<X>] scale LCD by X (default: 2)\n"
|
||||
"\n"
|
||||
" --enable-debug[=<port>] enable the debugger interface\n"
|
||||
|
@ -257,24 +248,25 @@ void config_init( char* progname, int argc, char* argv[] )
|
|||
clopt_model = MODEL_49GP;
|
||||
if ( clopt_name == NULL )
|
||||
clopt_name = "HP 49g+";
|
||||
if ( clopt_style_filename == NULL )
|
||||
clopt_style_filename = "style-49gp.css";
|
||||
break;
|
||||
case 506:
|
||||
clopt_model = MODEL_50G;
|
||||
if ( clopt_name == NULL )
|
||||
clopt_name = "HP 50g";
|
||||
if ( clopt_style_filename == NULL )
|
||||
clopt_style_filename = "style-50g.css";
|
||||
break;
|
||||
case 'n':
|
||||
clopt_name = strdup( optarg );
|
||||
break;
|
||||
case 's':
|
||||
clopt_font_size = atoi( optarg );
|
||||
clopt_style_filename = strdup( optarg );
|
||||
break;
|
||||
case 'S':
|
||||
clopt_display_scale = atoi( optarg );
|
||||
break;
|
||||
case 'f':
|
||||
clopt_font = strdup( optarg );
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
|
@ -304,10 +296,12 @@ void config_init( char* progname, int argc, char* argv[] )
|
|||
switch ( opt.model ) {
|
||||
case MODEL_49GP:
|
||||
opt.name = opt.newrpl ? "HP 49g+ / newRPL" : "HP 49g+";
|
||||
opt.style_filename = "style-49gp.css";
|
||||
break;
|
||||
case MODEL_50G:
|
||||
default:
|
||||
opt.name = opt.newrpl ? "HP 50g / newRPL" : "HP 50g";
|
||||
opt.style_filename = "style-50g.css";
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
@ -315,11 +309,8 @@ void config_init( char* progname, int argc, char* argv[] )
|
|||
lua_getglobal( config_lua_values, "name" );
|
||||
opt.name = strdup( luaL_optstring( config_lua_values, -1, opt.name ) );
|
||||
|
||||
lua_getglobal( config_lua_values, "font" );
|
||||
opt.font = strdup( luaL_optstring( config_lua_values, -1, opt.font ) );
|
||||
|
||||
lua_getglobal( config_lua_values, "font_size" );
|
||||
opt.font_size = luaL_optinteger( config_lua_values, -1, opt.font_size );
|
||||
lua_getglobal( config_lua_values, "style_filename" );
|
||||
opt.style_filename = strdup( luaL_optstring( config_lua_values, -1, opt.style_filename ) );
|
||||
|
||||
lua_getglobal( config_lua_values, "display_scale" );
|
||||
opt.display_scale = luaL_optinteger( config_lua_values, -1, opt.display_scale );
|
||||
|
@ -334,14 +325,12 @@ void config_init( char* progname, int argc, char* argv[] )
|
|||
opt.verbose = clopt_verbose;
|
||||
if ( clopt_name != NULL )
|
||||
opt.name = strdup( clopt_name );
|
||||
if ( clopt_font != NULL )
|
||||
opt.font = strdup( clopt_font );
|
||||
if ( clopt_style_filename != NULL )
|
||||
opt.style_filename = strdup( clopt_style_filename );
|
||||
if ( clopt_model != -1 )
|
||||
opt.model = clopt_model;
|
||||
if ( clopt_newrpl != -1 )
|
||||
opt.newrpl = clopt_newrpl;
|
||||
if ( clopt_font_size > 0 )
|
||||
opt.font_size = clopt_font_size;
|
||||
if ( clopt_display_scale > 0 )
|
||||
opt.display_scale = clopt_display_scale;
|
||||
|
||||
|
|
|
@ -27,9 +27,8 @@ struct options {
|
|||
bool newrpl;
|
||||
char* name;
|
||||
|
||||
char* font;
|
||||
int display_scale;
|
||||
int font_size;
|
||||
char* style_filename;
|
||||
bool verbose;
|
||||
bool haz_config_file;
|
||||
|
||||
|
|
112
src/x50ng/ui.c
112
src/x50ng/ui.c
|
@ -20,22 +20,8 @@
|
|||
|
||||
#include "gdbstub.h"
|
||||
|
||||
#define FONT_SIZE_KEY opt.font_size
|
||||
#define FONT_SIZE_SYMBOL ( 2 * opt.font_size )
|
||||
#define FONT_SIZE_NUMBER ( ( int )( 1.75 * opt.font_size ) )
|
||||
#define FONT_SIZE_TINY ( ( int )( 0.75 * opt.font_size ) )
|
||||
|
||||
#define KB_NB_ROWS 10
|
||||
|
||||
#define KB_WIDTH_6_KEYS ( 3 * opt.font_size )
|
||||
#define KB_WIDTH_5_KEYS ( 4 * opt.font_size )
|
||||
|
||||
#define KB_HEIGHT_MENU_KEYS ( ( int )( 1.75 * opt.font_size ) )
|
||||
#define KB_HEIGHT_SMALL_KEYS ( ( int )( 2 * opt.font_size ) )
|
||||
#define KB_HEIGHT_BIG_KEYS ( ( int )( 2.5 * opt.font_size ) )
|
||||
|
||||
#define KB_SPACING_KEYS ( opt.display_scale )
|
||||
|
||||
#define LCD_WIDTH ( 131 * opt.display_scale )
|
||||
#define LCD_HEIGHT ( 80 * opt.display_scale )
|
||||
|
||||
|
@ -612,83 +598,6 @@ static x49gp_ui_key_t ui_keys[ NB_KEYS ] = {
|
|||
.eint = 7},
|
||||
};
|
||||
|
||||
char* css_global = "window {"
|
||||
" background-color: %s;"
|
||||
" font-weight: normal;"
|
||||
"}"
|
||||
".label-key, .label-left, .label-right, .label-letter, .label-below {"
|
||||
" font-weight: bold;"
|
||||
"}"
|
||||
/* "box { border: 1px dashed red; }" */
|
||||
/* "label { border: 1px dotted yellow; }" */
|
||||
".annunciator {"
|
||||
" padding: 0px;"
|
||||
" color: #080808;"
|
||||
"}"
|
||||
".lcd-container, .annunciators-container {"
|
||||
" background-color: #a9d0b2;"
|
||||
"}"
|
||||
"button {"
|
||||
" background-image: none;"
|
||||
" padding: 0px;"
|
||||
" margin-left: 15px;"
|
||||
" margin-right: 15px;"
|
||||
"}"
|
||||
"button.key-down {"
|
||||
" border-color: #080808;"
|
||||
"}"
|
||||
"button.menu {"
|
||||
" background-color: #a9a9a9;"
|
||||
"}"
|
||||
"button.function {"
|
||||
" background-color: #696969;"
|
||||
"}"
|
||||
"button.arrow {"
|
||||
" background-color: #e0e0e0;"
|
||||
" border-radius: 33%;"
|
||||
"}"
|
||||
"button.alpha {"
|
||||
" background-color: #fae82c;"
|
||||
"}"
|
||||
"button.core, button.core-number {"
|
||||
" background-color: #080808;"
|
||||
"}"
|
||||
"button.alpha .label-key, button.arrow .label-key, button.menu .label-key {"
|
||||
" color: #080808;"
|
||||
"}"
|
||||
"button.shift-left {"
|
||||
" background-color: %s;"
|
||||
"}"
|
||||
"button.shift-right {"
|
||||
" background-color: #8e2518;"
|
||||
"}"
|
||||
"button.shift-left .label-key, button.shift-right .label-key {"
|
||||
" font-size: %ipx;"
|
||||
" color: #080808;"
|
||||
"}"
|
||||
"button.core-number .label-key, button.arrow .label-key, .annunciator {"
|
||||
" font-size: %ipx;"
|
||||
"}"
|
||||
".label-key {"
|
||||
" font-size: %ipx;"
|
||||
" color: #ffffff;"
|
||||
"}"
|
||||
".label-left, .label-right, .label-letter, .label-below {"
|
||||
" font-size: %ipx;"
|
||||
"}"
|
||||
".label-left {"
|
||||
" color: %s;"
|
||||
"}"
|
||||
".label-right {"
|
||||
" color: #c06e60;"
|
||||
"}"
|
||||
".label-below {"
|
||||
" color: #4060a4;"
|
||||
"}"
|
||||
".label-letter {"
|
||||
" color: #fae82c;"
|
||||
"}";
|
||||
|
||||
/*************/
|
||||
/* functions */
|
||||
/*************/
|
||||
|
@ -1466,7 +1375,7 @@ static int ui_load( x49gp_module_t* module, GKeyFile* keyfile )
|
|||
int key_index = 0;
|
||||
int nb_keys_in_row = 0;
|
||||
for ( int row = 0; row < KB_NB_ROWS; row++ ) {
|
||||
rows_containers[ row ] = gtk_box_new( GTK_ORIENTATION_HORIZONTAL, KB_SPACING_KEYS );
|
||||
rows_containers[ row ] = gtk_box_new( GTK_ORIENTATION_HORIZONTAL, 0 );
|
||||
gtk_box_set_homogeneous( GTK_BOX( rows_containers[ row ] ), true );
|
||||
gtk_container_add( GTK_CONTAINER( keyboard_container ), rows_containers[ row ] );
|
||||
|
||||
|
@ -1515,10 +1424,6 @@ static int ui_load( x49gp_module_t* module, GKeyFile* keyfile )
|
|||
#else
|
||||
gtk_style_context_add_class( gtk_widget_get_style_context( button->button ), button->key->css_class );
|
||||
#endif
|
||||
gtk_widget_set_size_request( button->button, ( row < 3 ) ? KB_WIDTH_6_KEYS : KB_WIDTH_5_KEYS,
|
||||
( row == 0 ) ? KB_HEIGHT_MENU_KEYS
|
||||
: ( key_index < 30 ) ? KB_HEIGHT_SMALL_KEYS
|
||||
: KB_HEIGHT_BIG_KEYS );
|
||||
gtk_widget_set_can_focus( button->button, false );
|
||||
gtk_widget_add_events( button->button, GDK_BUTTON_PRESS_MASK | GDK_BUTTON_RELEASE_MASK | GDK_LEAVE_NOTIFY_MASK );
|
||||
g_signal_connect( G_OBJECT( button->button ), "button-press-event", G_CALLBACK( react_to_button_press ), button );
|
||||
|
@ -1581,21 +1486,8 @@ static int ui_load( x49gp_module_t* module, GKeyFile* keyfile )
|
|||
|
||||
// Apply CSS
|
||||
GtkCssProvider* style_provider = gtk_css_provider_new();
|
||||
char* color_bg_49gp = "#f5deb3";
|
||||
char* color_bg_50g = "#272727";
|
||||
char* color_shift_left_49gp = "#4060a4";
|
||||
char* color_shift_left_50g = "#f5f5f5";
|
||||
bool is_50g = ( ui->calculator == UI_CALCULATOR_HP50G );
|
||||
char* css;
|
||||
|
||||
asprintf( &css, css_global, is_50g ? color_bg_50g : color_bg_49gp, is_50g ? color_shift_left_50g : color_shift_left_49gp,
|
||||
FONT_SIZE_SYMBOL, FONT_SIZE_NUMBER, FONT_SIZE_KEY, FONT_SIZE_TINY, is_50g ? color_shift_left_50g : color_shift_left_49gp );
|
||||
|
||||
#if GTK_MAJOR_VERSION == 4
|
||||
gtk_css_provider_load_from_string( style_provider, css );
|
||||
#else
|
||||
gtk_css_provider_load_from_data( style_provider, css, -1, NULL );
|
||||
#endif
|
||||
gtk_css_provider_load_from_path( style_provider, g_build_filename( opt.datadir, opt.style_filename, NULL ), NULL );
|
||||
|
||||
gtk_style_context_add_provider_for_screen( gdk_screen_get_default(), GTK_STYLE_PROVIDER( style_provider ),
|
||||
GTK_STYLE_PROVIDER_PRIORITY_USER + 1 );
|
||||
|
|
Loading…
Reference in a new issue