mirror of https://github.com/espruino/BangleApps
219 lines
8.1 KiB
JavaScript
219 lines
8.1 KiB
JavaScript
//HolaMundo v202212
|
|
// place your const, vars, functions or classes here
|
|
{
|
|
var contador=1;
|
|
var v_mode_debug=0;
|
|
var v_model=process.env.BOARD;
|
|
|
|
var v_color_statictxt='#b30000';
|
|
//var v_color_b_area='#111111';
|
|
//orange RGB format rrggbb //white,Orange,DarkGreen,Yellow,Maroon,Blue,green,Purple,cyan,olive,DarkCyan,pink
|
|
var a_colors= Array(0xFFFF,0xFD20,0x03E0,0xFFE0,0x7800,0x001F,0x07E0,0x780F,0x07FF,0x7BE0,0x03EF,0xF81F);
|
|
|
|
var x_max_screen=g.getWidth();
|
|
var y_max_screen=g.getHeight();
|
|
var y_wg_bottom=g.getHeight()-25;
|
|
var y_wg_top=25;
|
|
|
|
//EMSCRIPTEN,EMSCRIPTEN2
|
|
if (v_model=='BANGLEJS'||v_model=='EMSCRIPTEN') {
|
|
var v_color_lines=0xFFFF; //White hex format
|
|
var v_color_text=0x07E0;
|
|
var v_font1size=10; //out of quotes
|
|
var v_font2size=12;
|
|
var v_font_banner_size=30;
|
|
var v_font3size=12;
|
|
var x_btn_area=215;
|
|
var x_max_usable_area=x_btn_area;//Pend! only for bangle.js
|
|
var y_btn2=124; //harcoded for bangle.js cuz it is not the half of display height
|
|
var graph_y=120;
|
|
var box_x2=195;
|
|
var box_y2=150;
|
|
}else{ //BJS2
|
|
//176x176
|
|
var v_color_lines="#000"; //White hex format
|
|
var v_color_text="#000";
|
|
var v_font1size=9; //out of quotes
|
|
var v_font2size=9;
|
|
var v_font_banner_size=16;
|
|
var v_font3size=8;
|
|
//g.setColor("#000"); //black or dark
|
|
x_max_usable_area=176;
|
|
var graph_y=60;
|
|
var box_x2=128;
|
|
var box_y2=104;
|
|
}
|
|
if (v_mode_debug>0) console.log("device="+v_model);
|
|
var v_arraypos=0;
|
|
var v_acolorpos=0; //for fg
|
|
var v_aBGcolorPos=5; //for bg
|
|
var a_string1 = Array('hola', 'hello', 'saluton', 'ola','ciao', 'salut','czesc','konnichiwa');
|
|
var a_string2 = Array('mundo!', 'world!', 'mondo!','mundo!','mondo!','monde!','swiat!','sekai!');
|
|
|
|
|
|
}
|
|
if (v_mode_debug>0) {
|
|
console.log("*** UI dimensions***");
|
|
console.log("x="+x_max_screen);
|
|
console.log("y_wg_bottom="+y_wg_bottom);
|
|
}
|
|
|
|
// special function to handle display switch on
|
|
Bangle.on('lcdPower', (on) => {
|
|
if (on) {
|
|
contador=contador+1;
|
|
PrintHelloWorld();
|
|
// call your app function here
|
|
// If you clear the screen, do Bangle.drawWidgets();
|
|
}
|
|
});
|
|
|
|
//Clear/fill dynamic area except widget area, right and bottom status line
|
|
function ClearActiveArea(){
|
|
g.setColor(a_colors[v_aBGcolorPos]); //dynamic color
|
|
g.fillRect(0,y_wg_top,box_x2,box_y2);
|
|
g.flip();
|
|
}
|
|
|
|
function DrawBangleButtons(){
|
|
g.setFontVector(v_font1size);
|
|
g.setColor(v_color_lines);//White
|
|
|
|
g.drawString("Lang", x_max_screen-g.stringWidth("Lang"),y_wg_top+v_font1size+1);
|
|
//above Btn2
|
|
//g.setFontVector(v_font1size).drawString("Off", x_max_screen-g.stringWidth("Off"),y_btn2-(2*v_font1size));
|
|
g.drawString("Color", x_max_screen-g.stringWidth("Color"),y_btn2-v_font1size);
|
|
//above Btn3
|
|
g.drawString("Quit", x_max_screen-g.stringWidth("Quit"),y_wg_bottom-(2*v_font1size));
|
|
g.flip();
|
|
g.setColor(v_color_text); //green
|
|
g.setFontVector(v_font1size);
|
|
g.drawString("B1", x_max_screen-g.stringWidth("B1"),y_wg_top);
|
|
g.drawString("B2", x_max_screen-g.stringWidth("B2"),y_btn2);
|
|
g.drawString("B3",x_max_screen-g.stringWidth("B3"),y_wg_bottom-v_font1size);
|
|
g.flip();
|
|
}
|
|
|
|
function DrawBottomInfoBanner(){
|
|
/* External Vars:v_color_text,v_font2size,x_max_usable_area,y_wg_bottom
|
|
*/
|
|
g.setColor(v_color_text);
|
|
var info_text1="Swipe <- -> (Lang)";
|
|
//var info_text2="Touch: Left=Up Right=Down";
|
|
//aligned left of max usable area
|
|
g.setFontVector(v_font2size);
|
|
//g.drawString(info_text2, x_max_usable_area-g.stringWidth(info_text2)-2 ,y_wg_bottom-(2*v_font2size));
|
|
g.drawString(info_text1, x_max_usable_area-g.stringWidth(info_text1)-2 ,y_wg_bottom-v_font2size);
|
|
g.flip();
|
|
}
|
|
|
|
//function Graphics.setColor(r, g, b) binary
|
|
// banglejs.com/reference#l_Graphics_setColor
|
|
|
|
function PrintHelloWorld(){
|
|
ClearActiveArea(); //except widgets and bottom
|
|
|
|
if (v_mode_debug>0) console.log("drawing a "+a_string1[v_arraypos]+" "+a_string2[v_arraypos]);
|
|
|
|
g.setColor(a_colors[v_acolorpos]); //dynamic color
|
|
g.setFont("Vector",v_font_banner_size);
|
|
g.drawString(a_string1[v_arraypos],2,55);
|
|
//line below 2nd string
|
|
g.drawLine(10, 149, 150, 149);
|
|
g.flip();
|
|
|
|
g.setColor(a_colors[v_acolorpos+1]); //dynamic color
|
|
g.drawString(a_string2[v_arraypos],5,85);
|
|
g.flip();
|
|
|
|
g.setFont("Vector",v_font3size);
|
|
g.setColor(v_color_statictxt);
|
|
g.drawString("Display on/off: "+contador ,10,box_y2+7);
|
|
//var mem=process.memory();
|
|
//if (v_mode_debug>0) console.log("Mem free/total: "+mem.free+"/"+mem.total);
|
|
g.flip();
|
|
}
|
|
|
|
function PrintMainStaticArea(){
|
|
g.setColor(v_color_statictxt);
|
|
g.setFont("Vector",v_font3size);
|
|
g.drawString("#by DPG #bangle.js",10,box_y2+5+(v_font3size*2));
|
|
g.drawString("#javascript #espruino",10,box_y2+5+(v_font3size*3));
|
|
|
|
var img_obj_RedHi = {
|
|
width : 40, height : 40, bpp : 4,
|
|
transparent : 0,
|
|
buffer : require("heatshrink").decompress(atob("AFkM7vd4EAhoTNhvQhvcgHdAQIAL5oWCFIPdExo+CEoIZCABI0DhvADIZhJL4IXDHRkMEAQmOCYgmOAAIOBHwImNRQgmPHgYmCUIIXMJobfB3jgCWZJNDEga1JYQQQCMYZoJJAJNDBwgTICQPdCY7lDRQx4DVIwTIHYZzEHZATFBwblDCZRKEO5ITFWAbIJCYrHBAAImICYwEB5raKCYwAMCYXc5gADE5hLDAAgTIBJLkBBJAyKHw5hKBRJJKKJSuII5Q0IhqPKCbjRKCc4AgA=="))
|
|
}
|
|
g.drawImage(img_obj_RedHi,box_x2+2,graph_y);
|
|
g.flip();
|
|
}
|
|
|
|
|
|
//inc var postion for text array
|
|
function ChangeLang(dir){
|
|
if (v_mode_debug>0) console.log("ChangeLang, dir, Prev pos: "+dir+" , "+v_arraypos);
|
|
|
|
if ((dir==1) && (v_arraypos<a_string1.length-1)) v_arraypos++;
|
|
else if ((dir== 1) && (v_arraypos==a_string1.length-1)) v_arraypos=0;
|
|
else if ((dir== -1) && (v_arraypos>0)) v_arraypos--;
|
|
else if ((dir== -1) && (v_arraypos==0)) v_arraypos=a_string1.length-1;
|
|
PrintHelloWorld();
|
|
}
|
|
|
|
//inc var postion for color array
|
|
function ChangeColor(){
|
|
//if (v_mode_debug>0) console.log("ChangeColor, colpos: "+v_acolorpos);
|
|
if (v_acolorpos<a_colors.length-2) v_acolorpos++;
|
|
else v_acolorpos=0;
|
|
PrintHelloWorld();
|
|
}
|
|
function ChangeBGColor(){
|
|
if (v_aBGcolorPos<a_colors.length-2) v_aBGcolorPos++;
|
|
else v_aBGcolorPos=0;
|
|
ClearActiveArea(); //except widgets and bottom
|
|
PrintHelloWorld();
|
|
}
|
|
function UserInput(){
|
|
Bangle.on('touch', function(button){
|
|
switch(button){
|
|
case 1:
|
|
ChangeLang();//left area
|
|
break;
|
|
case 2:
|
|
ChangeBGColor();//right
|
|
break;
|
|
case 3:
|
|
ChangeColor();
|
|
//Bangle.showLauncher();//quit
|
|
break;
|
|
}
|
|
});
|
|
|
|
if (v_model=='BANGLEJS'||v_model=='EMSCRIPTEN') {
|
|
setWatch(ChangeLang, BTN1, { repeat: true });//func to quit
|
|
setWatch(ChangeColor, BTN2, { repeat: true });
|
|
setWatch(Bangle.showLauncher, BTN3, { repeat: true });
|
|
} //touchscreen to quit
|
|
else setWatch(ChangeColor, BTN1, { repeat: true });//func to quit
|
|
Bangle.on('swipe', dir => {
|
|
if(dir == 1) ChangeLang(1); //right
|
|
else ChangeLang(-1); //left
|
|
});
|
|
}
|
|
|
|
if (v_mode_debug>0) console.log("**************************");
|
|
if (v_mode_debug>0) console.log("Log: *** hola mundo app");
|
|
g.clear();
|
|
Bangle.loadWidgets();
|
|
Bangle.drawWidgets();
|
|
Bangle.setUI({
|
|
mode : "custom",
|
|
back : function() {load();}
|
|
});
|
|
if (v_model=='BANGLEJS'||v_model=='EMSCRIPTEN') DrawBangleButtons();
|
|
DrawBottomInfoBanner();
|
|
UserInput();
|
|
PrintMainStaticArea();
|
|
PrintHelloWorld();
|
|
|