Time and Date when off.

Hi Raymond,
This feature is in Jivelite, whose properties we have not changed. It would be a lot of work for us to incorporate this feature. We are researching on it, but we cannot guarantee to offer it in the near future.

Hi Raymond,

we have not tested the clock screensavers with the 2,8 inch display so far, but it should work with it, too. Ironically, we guess there is a risk of a screen burn-in with the 2,8 inch display, so be careful when testing on your own.

Glad you got your second device working.

Maximilian from Max2Play

Hallo liebes Max2Play Team,

gibt es schon eine Lösung für das 2,8″ Adafruit-Display um die Uhr anzuzeigen?
Das wäre wirklich eine ganz tolle und praktische Sache.

Vielen Dank und macht weiter so..

Hi !

I made a beta upgrade of my M2P in order to have a big clock on my 3.2″ touchscreen (Card C1). Unfortunately, i didn’t find this screensaver. What is is name ?

Have a look on my screen (numeric clock) :

• This reply was modified 8 years, 6 months ago by Bristow.

Argh, i have upgraded on beta only for that. Do we need to re-install Jivelite after upgrade on beta ?

Hi Bristow,

you have to modify the Clock Applet in „/opt/jivelite/jivelite/share/jive/applets/Clock/ClockApplet.lua“ and add the skinname that is used for your 3.2inch display with the correct positioning for the elements shown on the screen. The function you have to modify is:

-- DIGITAL CLOCK SKIN
function Digital:getDigitalClockSkin(skinName)

Try to have a look at how we changed the Digigtal Clock positioning for the Joggler Skin. We would be happy, if you share your results. You may create a patch of the changes that we can add to Jivelite.

All the Best,
Stefan

Hi,

I managed to modify function Digital:getDigitalClockSkin(skinName) for my C1 touchscreen :

This is the new code, i don’t know if it’s very proper, but it’s works 🙂

-- DIGITAL CLOCK SKIN
function Digital:getDigitalClockSkin(skinName)	
	if skinName == 'WQVGAlargeSkin' then
		skinName = 'WQVGAsmallSkin'	
	end
	if  skinName == 'QVGATouchSkin' then 
	 	self.skinName = skinName
		self.imgpath = _imgpath(self)
	 	digitalClockBackground = Tile:loadImage(self.imgpath .. "Clocks/Radial/wallpaper_clock_radial.png")
	 	skinName = 'QVGATouchSkin'
	end
	self.skinName = skinName
	self.imgpath = _imgpath(self)

	local s = {}
	
	if skinName == 'QVGATouchSkin' then		
		screen_width, screen_height = Framework:getScreenSize()
		local shiftx = math.floor((screen_width/2) - 260)
		if shiftx < 0 then
			shiftx = 0
		end
		local shifty = math.floor((screen_height/2) - 140)
		if shifty < 0 then
			shifty = 0
		end
		
		local digitalClockDigit = {
			-- taille de l'heure
			-- font = _font(143),
			font = _font(110),
			align = 'center',
			fg = { 0xcc, 0xcc, 0xcc },
			--w = 76,
			w = 50,
		}
		local shadow = {
			-- w = 76,
			w = 50,
			x = shiftx,
		}		
		
		local x = {}
				-- position sur x
                -- x.h1 = 48 + shiftx
                x.h1 = 10 + shiftx
                -- x.h2 = x.h1 + 75
                x.h2 = x.h1 + 60
                -- x.dots = x.h2 + 75
                x.dots = x.h2 + 60
                x.m1 = x.dots + 39
                -- x.m2 = x.m1 + 86
                x.m2 = x.m1 + 71
                x.alarm = x.m2 + 80
		x.ampm = x.alarm

		local _clockDigit = {
			position = LAYOUT_NONE,
			-- font = _font(143),
			font = _font(110),
			align = 'center',
			fg = { 0xcc, 0xcc, 0xcc },
			y = 54 + shifty,
			zOrder = 10,
		}
		local _digitShadow = _uses(_clockDigit, {
			-- y = 54 + 100 + shifty,
			y = 35 + 100 + shifty,
			x = shiftx,
			zOrder = 1,
		})
	
		s.icon_digitalClockDropShadow = {
			img = _loadImage(self, "Clocks/Digital/drop_shadow_digital.png"),
			align = 'center',
			padding = { 4, 0, 0, 0 },
			-- w = 76,
			w = 50,
		}

		s.icon_digitalClockNoShadow = _uses(s.icon_digitalClockDropShadow, {
			img = false
		})

		s.icon_alarm_on = {
			img = _loadImage(self, "Clocks/Digital/icon_alarm_digital.png"),
		}
		s.icon_alarm_off = {
			img = false
		}

		s.icon_digitalClockHDivider = {
			w = WH_FILL,
			img = _loadImage(self, "Clocks/Digital/divider_hort_digital.png"),
		}

		s.icon_digitalClockVDivider = {
			w = 3,
			img = _loadImage(self, "Clocks/Digital/divider_vert_digital.png"),
			align = 'center',
		}

		s.icon_digitalDots = {
			img = _loadImage(self, "Clocks/Digital/clock_dots_digital.png"),
			align = 'center',
			w = 40,
			border = { 14, 0, 12, 0 },
		}

		s.icon_digitalClockBlank = {
			img = false,
			w = 40,
		}

		s.Clock = {
			bgImg = digitalClockBackground,
			h1 = _uses(_clockDigit, {
				x = x.h1,
			}),
			h1Shadow = _uses(_digitShadow, {
				x = x.h1,
			}),
			h2 = _uses(_clockDigit, {
				x = x.h2,
			}),
			h2Shadow = _uses(_digitShadow, {
				x = x.h2,
			}),
			dots = _uses(_clockDigit, {
				x = x.dots,
				y = 93 + shifty,
				w = 40,
			}),
			m1 = _uses(_clockDigit, {
				x = x.m1,
			}),
			m1Shadow = _uses(_digitShadow, {
				x = x.m1,
			}),
			m2 = _uses(_clockDigit, {
				x = x.m2,
			}),
			m2Shadow = _uses(_digitShadow, {
				x = x.m2,
			}),

			ampm = {
				position = LAYOUT_NONE,
				x = x.ampm,
				y = 112 + shifty,
				font = _font(11),
				align = 'bottom',
				fg = { 0xcc, 0xcc, 0xcc },
			},
			alarm = {
				position = LAYOUT_NONE,
				x = x.alarm,
				y = 56 + shifty,
			},
			ampm = {
				position = LAYOUT_NONE,
				x = 403 + shiftx,
				y = 144 + shifty,
				font = _font(20),
				align = 'bottom',
				fg = { 0xcc, 0xcc, 0xcc },
			},
			horizDivider2 = { hidden = 1 },
			today = { hidden = 1 },
			horizDivider = {
				position = LAYOUT_NONE,
				x = 0 + shiftx,
				y = 194 + shifty,
			},
			date = {
				position = LAYOUT_SOUTH,
				order = { 'dayofweek', 'vdivider1', 'dayofmonth', 'vdivider2', 'month' },
				w = WH_FILL,
				--h = 70,
				h = 40,
				padding = { 0, 0, 0, 6 },
				dayofweek = {
					align = 'center',
					-- w = 190,
					w = 115,
					h = WH_FILL,
					font = _font(20),
					fg = { 0xcc, 0xcc, 0xcc },
					padding  = { 1, 0, 0, 6 },
				},
				vdivider1 = {
					align = 'center',
					w = 3,
				},
				dayofmonth = {
					--font = _font(56),
					font = _font(30),
					-- w = 95,
					w = 80,
					h = WH_FILL,
					align = 'center',
					fg = { 0xcc, 0xcc, 0xcc },
					padding = { 0, 0, 0, 4 },
				},
				vdivider2 = {
					align = 'center',
					w = 3,
				},
				month = {
					font = _font(20),
					w = WH_FILL,
					h = WH_FILL,
					align = 'center',
					fg = { 0xcc, 0xcc, 0xcc },
					padding = { 0, 0, 0, 5 },
				},
				year = {
					font = _boldfont(20),
					-- w = 50,
					w = 40,
					h = WH_FILL,
					align = 'left',
					fg = { 0xcc, 0xcc, 0xcc },
					padding = { 3, 0, 0, 5 },
				},
			},
		}
	
		local blackMask = Tile:fillColor(0x000000ff)
		s.ClockBlack = _uses(s.Clock, {
			bgImg = blackMask,
			horizDivider = { hidden = 1 },
			horizDivider2 = { hidden = 1 },
			today = { hidden = 1 },
			date = {
				order = { 'dayofweek', 'dayofmonth', 'month', 'year' },
			},
			h1Shadow = { hidden = 1 },
			h2Shadow = { hidden = 1 },
			m1Shadow = { hidden = 1 },
			m2Shadow = { hidden = 1 },
		})
		s.ClockTransparent = _uses(s.Clock, {
			bgImg = false,
			horizDivider = { hidden = 1 },
			horizDivider2 = { hidden = 1 },
			today = { hidden = 1 },
			date = {
				order = { 'dayofweek', 'dayofmonth', 'month', 'year' },
			},
			h1Shadow = { hidden = 1 },
			h2Shadow = { hidden = 1 },
			m1Shadow = { hidden = 1 },
			m2Shadow = { hidden = 1 },
		})
	elseif skinName == 'QVGAlandscapeSkin' then

		local digitalClockBackground = Tile:loadImage(self.imgpath .. "Clocks/Digital/bb_clock_digital.png")
		local shadow = {
			w = 62,
		}
		local _clockDigit = {
			position = LAYOUT_NONE,
			font = _font(100),
			align = 'right',
			fg = { 0xcc, 0xcc, 0xcc },
			w = 62,
			y = 48,
			zOrder = 10,
		}
		local _digitShadow = _uses(_clockDigit, {
			y = 116,
			zOrder = 1,
		})
	
		local x = {}
                x.h1 = 19
                x.h2 = x.h1 + 50 
                x.dots = x.h2 + 65
                x.m1 = x.dots + 15
                x.m2 = x.m1 + 64
                x.alarm = x.m2 + 61
		x.ampm = x.alarm

		s.icon_digitalClockDropShadow = {
			img = _loadImage(self, "Clocks/Digital/drop_shadow_digital.png"),
			align = 'center',
			padding = { 4, 0, 0, 0 },
			w = 62,
		}

		s.icon_alarm_on = {
			img = _loadImage(self, "Clocks/Digital/icon_alarm_digital.png")
		}
		s.icon_alarm_off = _uses(s.icon_alarm_on, {
			img = false
		})
		s.icon_digitalClockNoShadow = _uses(s.icon_digitalClockDropShadow, {
				img = false
		})

		s.icon_digitalClockHDivider = {
			w = WH_FILL,
			img = _loadImage(self, "Clocks/Digital/divider_hort_digital.png"),
		}

		s.icon_digitalClockVDivider = {
			w = 3,
			img = _loadImage(self, "Clocks/Digital/divider_vert_digital.png"),
			padding = { 0, 0, 0, 8 },
			align = 'center',
		}

		s.icon_digitalDots = {
			img = _loadImage(self, 'Clocks/Digital/clock_dots_digital.png'),
			align = 'center',
			w = 16,
			padding = { 0, 26, 0, 0 },
		}

		s.icon_digitalClockBlank = {
			img = false,
		}

		s.Clock = {
			bgImg = digitalClockBackground,
			h1 = _uses(_clockDigit, {
				x = x.h1,
			}),
			h1Shadow = _uses(_digitShadow, {
				x = x.h1,
			}),
			h2 = _uses(_clockDigit, {
				x = x.h2,
			}),
			h2Shadow = _uses(_digitShadow, {
				x = x.h2,
			}),
			dots = _uses(_clockDigit, {
				x = x.dots,
				w = 16,
			}),
			m1 = _uses(_clockDigit, {
				x = x.m1,
			}),
			m1Shadow = _uses(_digitShadow, {
				x = x.m1,
			}),
			m2 = _uses(_clockDigit, {
				x = x.m2,
			}),
			m2Shadow = _uses(_digitShadow, {
				x = x.m2,
			}),

			ampm = {
				position = LAYOUT_NONE,
				x = x.ampm,
				y = 112,
				font = _font(11),
				align = 'bottom',
				fg = { 0xcc, 0xcc, 0xcc },
			},
			alarm = {
				position = LAYOUT_NONE,
				x = x.alarm,
				y = 50,
			},
			horizDivider2 = { hidden = 1 },
			horizDivider = {
				position = LAYOUT_NONE,
				x = 0,
				y = 173,
			},
			today = { hidden = '1' },
			date = {
				position = LAYOUT_SOUTH,
				order = { 'dayofweek', 'vdivider1', 'dayofmonth', 'vdivider2', 'month' },
				w = WH_FILL,
				h = 65,
				padding = { 0, 10, 0, 0 },
				dayofweek = {
					align = 'center',
					w = 115,
					h = WH_FILL,
					font = _font(18),
					fg = { 0xcc, 0xcc, 0xcc },
					padding = { 0, 0, 0, 14 },
				},
				vdivider1 = {
					align = 'center',
					w = 2,
				},
				dayofmonth = {
					font = _font(48),
					w = 86,
					h = WH_FILL,
					align = 'center',
					fg = { 0xcc, 0xcc, 0xcc },
					padding = { 0, 0, 0, 12 },
				},
				vdivider2 = {
					align = 'center',
					w = 2,
				},
				month = {
					font = _font(18),
					w = WH_FILL,
					h = WH_FILL,
					align = 'center',
					fg = { 0xcc, 0xcc, 0xcc },
					padding = { 0, 0, 0, 14 },
				},
			},
		}
	
		local blackMask = Tile:fillColor(0x000000ff)
		s.ClockBlack = _uses(s.Clock, {
			bgImg = blackMask,
			horizDivider = { hidden = 1 },
			horizDivider2 = { hidden = 1 },
			today = { hidden = 1 },
			date = {
				order = { 'dayofweek', 'dayofmonth', 'month', 'year' },
			},
			h1Shadow = { hidden = 1 },
			h2Shadow = { hidden = 1 },
			m1Shadow = { hidden = 1 },
			m2Shadow = { hidden = 1 },
		})
		s.ClockTransparent = _uses(s.Clock, {
			bgImg = false,
			horizDivider = { hidden = 1 },
			horizDivider2 = { hidden = 1 },
			today = { hidden = 1 },
			date = {
				order = { 'dayofweek', 'dayofmonth', 'month', 'year' },
			},
			h1Shadow = { hidden = 1 },
			h2Shadow = { hidden = 1 },
			m1Shadow = { hidden = 1 },
			m2Shadow = { hidden = 1 },
		})

	elseif skinName == 'QVGAportraitSkin'  then
		local digitalClockBackground = Tile:loadImage(self.imgpath .. "Clocks/Digital/jive_clock_digital.png")
		local digitalClockDigit = {
			font = _font(90),
			fg = { 0xcc, 0xcc, 0xcc },
			w = WH_FILL,
		}
		local shadow = {
			w = 62,
		}
		local _clockDigit = {
			position = LAYOUT_NONE,
			font = _font(90),
			align = 'right',
			fg = { 0xcc, 0xcc, 0xcc },
			w = 62,
			y = 123,
			zOrder = 10,
		}
		local _digitShadow = _uses(_clockDigit, {
			y = 185,
			padding = { 4, 0, 0, 0 },
			zOrder = 1,
		})
	
		local x = {}
                x.h1 = 0
                x.h2 = x.h1 + 49
                x.dots = x.h2 + 62
                x.m1 = x.dots + 4
                x.m2 = x.m1 + 49
                x.alarm = x.h1

		s.icon_digitalClockDropShadow = {
			img = _loadImage(self, "Clocks/Digital/drop_shadow_digital.png"),
			align = 'center',
			padding = { 4, 0, 0, 0 },
		}

		s.icon_alarm_on = {
			img = _loadImage(self, "Clocks/Digital/icon_alarm_digital.png")
		}
		s.icon_alarm_off = _uses(s.icon_alarm_on, {
			img = false
		})
		s.icon_digitalClockNoShadow = _uses(s.icon_digitalClockDropShadow, {
			img = false
		})

		s.icon_digitalClockHDivider = {
			w = WH_FILL,
			img = _loadImage(self, "Clocks/Digital/divider_hort_digital.png"),
		}

		s.icon_digitalClockVDivider = {
			w = 3,
			img = _loadImage(self, "Clocks/Digital/divider_vert_digital.png"),
			align = 'center',
		}

		s.icon_digitalDots = {
			img = _loadImage(self, 'Clocks/Digital/clock_dots_digital.png'),
			align = 'center',
			w = 18,
			padding = { 0, 0, 0, 0 },
		}

		s.icon_digitalClockBlank = {
			img = false,
		}

		s.Clock = {
			bgImg = digitalClockBackground,
			h1 = _uses(_clockDigit, {
				x = x.h1,
			}),
			h1Shadow = _uses(_digitShadow, {
				x = x.h1,
			}),
			h2 = _uses(_clockDigit, {
				x = x.h2,
			}),
			h2Shadow = _uses(_digitShadow, {
				x = x.h2,
			}),
			dots = _uses(_clockDigit, {
				x = x.dots,
				w = 18,
				y = 143,
			}),
			m1 = _uses(_clockDigit, {
				x = x.m1,
			}),
			m1Shadow = _uses(_digitShadow, {
				x = x.m1,
			}),
			m2 = _uses(_clockDigit, {
				x = x.m2,
			}),
			m2Shadow = _uses(_digitShadow, {
				x = x.m2,
			}),

			today = {
				position = LAYOUT_NORTH,
				h = 83,
				zOrder = 2,
				w = WH_FILL,
				align = 'center',
				fg = { 0xcc, 0xcc, 0xcc },
				font = _font(20),
			},

			ampm = {
				position = LAYOUT_NONE,
				x = 203,
				y = 208,
				font = _font(14),
				align = 'bottom',
				fg = { 0xcc, 0xcc, 0xcc },
			},
			alarm = {
				position = LAYOUT_NONE,
				x = 12,
				y = 209,
			},
			horizDivider = {
				position = LAYOUT_NONE,
				x = 0,
				y = 320 - 84,
			},
			horizDivider2 = {
				position = LAYOUT_NONE,
				x = 0,
				y = 84,
			},
			date = {
				position = LAYOUT_SOUTH,
				order = { 'month', 'vdivider1', 'dayofmonth' },
				w = WH_FILL,
				h = 83,
				padding = { 0, 10, 0, 0 },
				dayofweek = { hidden = 1 },
				vdivider1 = {
					align = 'center',
					w = 2,
					h = WH_FILL,
				},
				month = {
					font = _font(20),
					w = WH_FILL,
					h = WH_FILL,
					align = 'center',
					fg = { 0xcc, 0xcc, 0xcc },
					padding = { 2, 0, 0, 15 },
				},
				dayofmonth = {
					font = _font(48),
					w = 86,
					h = WH_FILL,
					align = 'center',
					fg = { 0xcc, 0xcc, 0xcc },
					padding = { 0, 0, 0, 15 },
				},
			},
		}
	
		local blackMask = Tile:fillColor(0x000000ff)
		s.ClockBlack = _uses(s.Clock, {
			bgImg = blackMask,
			horizDivider = { hidden = 1 },
			horizDivider2 = { hidden = 1 },
			date = {
				order = { 'month', 'dayofmonth' },
			},
			h1Shadow = { hidden = 1 },
			h2Shadow = { hidden = 1 },
			m1Shadow = { hidden = 1 },
			m2Shadow = { hidden = 1 },
		})
		s.ClockTransparent = _uses(s.Clock, {
			bgImg = false,
			horizDivider = { hidden = 1 },
			horizDivider2 = { hidden = 1 },
			date = {
				order = { 'month', 'dayofmonth' },
			},
			h1Shadow = { hidden = 1 },
			h2Shadow = { hidden = 1 },
			m1Shadow = { hidden = 1 },
			m2Shadow = { hidden = 1 },
		})
	
	end

	return s
end

So the photo you have looks like it’s on a little 3.5 inch touch screen right? Looks very good!

This is this touchscreen : http://www.hardkernel.com/main/products/prdt_info.php?g_code=G142060963922
3.2″ and 320 x 240 pix

Were do you put this code in what folder?

Then it will just work?

You have to choose QVGATouchSkin for skin and change and replace function Digital:getDigitalClockSkin() by my code.

I have commented almost all changes i made like this :

			-- font = _font(143),
			font = _font(110),

This function is in this file /opt/jivelite/jivelite/share/jive/applets/Clock/ClockApplet.lua. After changes, you have to restart Jivelite.

Happy to see that 🙂

You don’t have littles lines and shadow under numbers. I think some pics are missing on your system. They are in /opt/jivelite/jivelite/share/jive/applets/QVGATouchSkin/images/Clocks/Digital/

You must have these files :

And, i didn’t see the good background : /opt/jivelite/jivelite/share/jive/applets/QVGATouchSkin/images/Clocks/Radial/wallpaper_clock_radial.png

• This reply was modified 8 years, 4 months ago by Bristow.

Hi Bristow,

thanks for sharing your code! I changed it a little to keep the JogglerSkin working and added the changes to the Jivelite installer in Max2Play. If anyone is interested: update Max2Play to the latest Beta version and install Jivelite from Source (not the compiled version).

Stefan

Hi Raymond,

did you choose the Digital Clock Screensaver in the Settings for the „When Off“ setting (sounds like you have set Blankscreensaver in the „When Off“ event)?