Matrix Theme for HABPanel

I used or better tried to use the original one

Hmmm. Any other errors? I’ll have a look later today!

No, no errors.
Just thousands of lines like this are shown (One for every svg file):

Processing file: user-interaction-review_girl 2.svg

Looks like it can’t get the files via http. Can you access the svg files through the openhab’s web server?

E.g.

http://openhabianpi.local:8080/static/matrix-theme/original-svg/...filename

beautiful stuff! Thanx alot!

working on customizing it now to my HABPanel layout.

I added a cursor: pointer to the .widget .icon section also :slight_smile:

1 Like

I am not sure. Maybe a basic approach similar to this? Custom widget: 8 point Thermostat

I added some error handling to the script. Can you get the latest version and rerun?

I will try Tonight

this ist the output - i cannot see the additional loggings:

[22:01:22] openhabian@openHABianPi:/etc/openhab2/html/matrix-theme$ sudo python svg_combiner.py 

Processing file: Document & Folder_file-add.svg
Processing file: image video_cam-2 2.svg
Processing file: user-interaction-review_1-3-cross.svg
Processing file: Weather_dark-moon.svg
Processing file: emotions_mad 2.svg
Processing file: Control & Navigation_stop-04 2.svg
Processing file: Userinterface_medium-box 2.svg
Processing file: Household_back-stool.svg
Processing file: Celebration & Holidays_Christmas ball.svg
Processing file: Clothes & Shoes-02 2.svg
Processing file: Games & Entertainment_sports-wear 2.svg
Processing file: Finance & Shopping_partsal-2.svg
Processing file: Control & Navigation_left-blend-arrow 2.svg
Processing file: Userinterface_game 2.svg
Processing file: Games & Entertainment_shuttilebat.svg
Processing file: Household_bed-2.svg
Processing file: Audio & Music Instruments_sound2 2.svg
Processing file: arrow-with-circle-left 2.svg
Processing file: user-interaction-review_blocks 2.svg
Processing file: Control & Navigation_visual.svg
Processing file: github-with-circle.svg
Processing file: Design_indent-inside 2.svg
Processing file: thermometer 2.svg
Processing file: food and drink_coffee.svg
Processing file: gesture_4f-tap-up 3.svg
Processing file: Clothes & Shoes-73 2.svg
Processing file: Editing_test-veticle-line 2.svg
Processing file: Celebration & Holidays_navigator.svg
Processing file: Buildings-25 2.svg
Processing file: gesture_3fingers-56 4.svg
Processing file: map and locations_map-circle 2.svg
Processing file: Finance & Shopping_bank-2.svg
Processing file: Clothes & Shoes-31.svg
Processing file: Control & Navigation_share-right-down 2.svg
Processing file: Document & Folder_folder-lock.svg
Processing file: Editing_h5-05 2.svg
Processing file: Office-51.svg
Processing file: Games & Entertainment_stumps 2.svg
Processing file: Office-93 2.svg
Processing file: Devices & Network II_blend-file 2.svg
Processing file: Games & Entertainment_knight 2.svg
Processing file: Office-63.svg
Processing file: SociaI-icons_linkedin-1 2.svg
Processing file: Clothes & Shoes-53.svg
Processing file: Devices & Network_charging-2 2.svg
Processing file: image-inverted 2.svg
Processing file: Control & Navigation-II_arw-rd-left 2.svg
Processing file: Buildings-49 2.svg
Processing file: Celebration & Holidays_leef -dec 2.svg
Processing file: Editing_scale 2.svg
Processing file: gesture_5f-pinchin 4.svg
Processing file: gesture_2f-swipe-down-35.svg
Processing file: Finance & Shopping_coin-3.svg
Processing file: Buildings-52.svg
Processing file: image video_slier-1 2.svg
Processing file: Office-27 2.svg
Processing file: Finance & Shopping_locker-block 2.svg
Processing file: user-interaction-review_verticle-bars 2.svg
Processing file: Devices & Network_charging-3.svg
Processing file: Weather_rain-1 2.svg
Processing file: Finance & Shopping_report-up 2.svg
Processing file: Weather_night-thunder.svg
Processing file: Household_book-shelve 2.svg
Processing file: compass.svg
Processing file: Clothes & Shoes-79 2.svg
Processing file: arrow-long-up.svg
Processing file: creative-commons-attribution.svg
Processing file: check.svg
Processing file: Design_2-square-l.svg
Processing file: gesture_searching 4.svg
Processing file: Document & Folder_file-check 2.svg
Processing file: basecamp.svg
Processing file: Games & Entertainment_ball-4.svg
Processing file: map and locations_map-locate-39.svg
Processing file: food and drink_juice cup 2.svg
Processing file: gesture_3f-horizotal-dragin 3.svg
Processing file: Design_compress.svg
Processing file: Clothes & Shoes-29.svg
Processing file: Household_bedt-set 2.svg
Processing file: gesture_4f-drag-left-right.svg
Processing file: Celebration & Holidays-II_ghost.svg
Processing file: Audio & Music Instruments_cd-cover.svg
Processing file: help-with-circle 2.svg
Processing file: unread 2.svg
Processing file: Celebration & Holidays-II_net 2.svg
Processing file: Household_dining-set 2.svg
Processing file: Userinterface_report-flag 2.svg
Processing file: Userinterface_bookmark.svg
Processing file: Devices & Network_cloud-right.svg
Processing file: SociaI-icons_digg6.svg
Processing file: user-interaction-review_statitstics 2.svg
Processing file: SociaI-icons_blogger.svg
Processing file: Design_5-square 2.svg
Processing file: Clothes & Shoes-25.svg
Processing file: Control & Navigation_down3-arrow.svg
Processing file: Devices & Network_headphone 2.svg
Processing file: clapperboard 2.svg
Processing file: Control & Navigation_infinity.svg
Processing file: Games & Entertainment_globe-climp.svg
Processing file: Control & Navigation-II_node-right 2.svg
Processing file: Office-54.svg
Processing file: back-in-time 2.svg
Processing file: Control & Navigation-II_arw-rd-left.svg
Processing file: image video_web-cam.svg
Processing file: Office-57 2.svg
Processing file: Control & Navigation_close-arrows 2.svg
Processing file: Office-39.svg
Processing file: gesture_5f-drag.svg
Processing file: Games & Entertainment_winner.svg
Processing file: food and drink_cashews.svg
Processing file: game-controller.svg
Processing file: SociaI-icons_virb.svg
Processing file: Userinterface_cloud-down.svg
Processing file: Audio & Music Instruments_headphone-mic 2.svg
Processing file: Household_vacuum-cleaner.svg
Processing file: Celebration & Holidays_candles-43.svg
Processing file: facebook 2.svg
Processing file: Games & Entertainment_ball-5-77.svg
Processing file: Control & Navigation_left2-arrow 2.svg
Processing file: emoji-neutral.svg
Processing file: Control & Navigation_down-arrow-42.svg
Processing file: map and locations_map-locate-13 2.svg
Processing file: SociaI-icons_google-38.svg
Processing file: user-interaction-review_graph-x 2.svg
Processing file: dots-two-vertical 2.svg
Processing file: bowl.svg
Processing file: Audio & Music Instruments_headphone 2.svg
Processing file: SociaI-icons_black 2.svg
Processing file: sound.svg
Processing file: Userinterface_page-back 2.svg
Processing file: awareness-ribbon.svg
Processing file: gesture_2f-drag-left-right-54.svg
Processing file: tumblr 2.svg
Processing file: user-interaction-review_cross 2.svg
Processing file: SociaI-icons_qik 2.svg
Processing file: Userinterface_unloack.svg
Processing file: picasa.svg
Processing file: Control & Navigation-II_arw-rd-down.svg
Processing file: Design_decrease height 2.svg
Processing file: Buildings-01 2.svg
Processing file: remove-user 2.svg
Processing file: phone.svg
Processing file: gesture_finger-press 3.svg
Processing file: Control & Navigation-II_line-arw-rt 2.svg
Processing file: Buildings-46 2.svg
Processing file: SociaI-icons_arto 2.svg
Processing file: Celebration & Holidays_bag-2.svg
Processing file: credit-card 2.svg
Processing file: Devices & Network_nan0-sim.svg
Processing file: Document & Folder_file-chart.svg
Processing file: Document & Folder_board-close 2.svg
Processing file: Clothes & Shoes-43 2.svg
Processing file: food and drink_dryfruit.svg
Processing file: Control & Navigation_control-2.svg
Processing file: controller-fast-backward 2.svg
Processing file: Devices & Network_radio-2 2.svg
Processing file: Office-20 2.svg
Processing file: Editing_bottom-block 2.svg
Processing file: vine.svg
Processing file: Office-17.svg
Processing file: user-interaction-review_graph-top 2.svg
Processing file: Games & Entertainment_park-game-5 2.svg
Processing file: SociaI-icons_yahoo.svg
Processing file: circle-with-cross 2.svg
Processing file: Design_wave.svg
Processing file: food and drink_papper 2.svg
Processing file: image video_palyer.svg
Processing file: image video_photos-4-32.svg
Processing file: SociaI-icons_speech 2.svg
Processing file: Weather_direction-s 2.svg
Processing file: Userinterface_popup 2.svg
Processing file: loop.svg
Processing file: tv.svg
Processing file: power-plug.svg
Processing file: ccw.svg
Processing file: food and drink_juice-straw-66.svg
Processing file: Household_washing-machi 2.svg
Processing file: Design_cylindrical 2.svg
Processing file: Office-04 2.svg
Processing file: mouse-pointer 2.svg
Processing file: tablet-mobile-combo 2.svg
Processing file: user-interaction-review_girl-hair 2.svg
Processing file: gesture_3f-tap-down 2.svg
Processing file: Clothes & Shoes-27.svg
Processing file: Devices & Network_wifi 2.svg
Processing file: emotions_mad-smile-2 2.svg
Processing file: user-interaction-review_unlock-user-rd 2.svg
Processing file: Audio & Music Instruments_sound.svg
Processing file: pie-chart.svg
Processing file: map and locations_map-close 2.svg
Processing file: Control & Navigation_stretch 2.svg
Processing file: Celebration & Holidays_umbrella 2.svg
Processing file: Audio & Music Instruments_drum.svg
Processing file: Devices & Network_micro-sim 2.svg
Processing file: gesture_2f-swipe-up 3.svg
Processing file: controller-jump-to-start 2.svg
Processing file: Finance & Shopping_amex-card 2.svg
Processing file: trophy.svg
Processing file: Office-05 2.svg
Processing file: gesture_drag down 3.svg
Processing file: Editing_center-align.svg
Processing file: SociaI-icons_retweet.svg
Processing file: Celebration & Holidays_snowflake-6.svg
Processing file: image video_photo-1.svg
Processing file: gesture_2f-tap-25 4.svg
Processing file: Document & Folder_doc.svg
Processing file: Weather_half-moon.svg
Processing file: SociaI-icons_github 2.svg
Processing file: gesture_4f-tap-down 2.svg
Processing file: Weather_1-4-moon.svg
Processing file: map and locations_locate-add 2.svg
Processing file: Devices & Network_responsive.svg
Processing file: google±with-circle 2.svg
Processing file: gesture_swipe-left-h 3.svg
Processing file: bell.svg
Processing file: Devices & Network_cpu.svg
Processing file: aircraft-take-off 2.svg
Processing file: Household_sofa-wood.svg
Processing file: old-phone 2.svg
Processing file: Celebration & Holidays_shore.svg
Processing file: Userinterface_player 2.svg
Processing file: Finance & Shopping_money-rotate-38.svg
Processing file: Audio & Music Instruments_sound1.svg
Processing file: food and drink_dish.svg
Processing file: emotions_laughter.svg
Processing file: Userinterface_mail-61.svg
Processing file: Design_square-c.svg
Processing file: Control & Navigation_round-close-arrow 2.svg
Processing file: Editing_left-align.svg
Processing file: user-interaction-review_upload-user 2.svg
Processing file: Finance & Shopping_dollar-bag.svg
Processing file: gesture_press.svg
Processing file: food and drink_cube cake.svg
Processing file: Document & Folder_after effects.svg
Processing file: Document & Folder_after effects 2.svg
Processing file: gesture_3fingers-41 2.svg
Processing file: Games & Entertainment_angribird-2.svg
Processing file: user-interaction-review_waves 2.svg
Processing file: Games & Entertainment_indoorgame 2.svg
Processing file: Buildings-53 2.svg
Processing file: user-interaction-review_round-chart.svg
Processing file: Celebration & Holidays_beach umbrella.svg
Processing file: Control & Navigation_channels.svg
Processing file: Devices & Network_magic-mouse 2.svg
Processing file: mic 2.svg
Processing file: tree.svg
Processing file: facebook.svg
Processing file: gesture_5f-swipe-left 3.svg
Processing file: Devices & Network II_left-folder.svg
Processing file: map and locations_map 2.svg
Processing file: Games & Entertainment_ball-3.svg
Processing file: image video_sun-file.svg
Processing file: Office-81.svg
Processing file: Clothes & Shoes-44.svg
Processing file: Devices & Network_tabs.svg
Processing file: gesture_5f-swipe-up 3.svg
Processing file: Finance & Shopping_coin-4.svg
Processing file: gesture_5f-tap-hold.svg
Processing file: gesture_5f-press.svg
Processing file: image video_cam-3 2.svg
Processing file: Buildings-54.svg
Processing file: Celebration & Holidays_Christmas ball -3.svg
Processing file: Weather_direction-n 2.svg
Processing file: Document & Folder_file-music.svg
Processing file: SociaI-icons_picasa 2.svg
Processing file: gesture_1f-tap-down 4.svg
Processing file: map and locations_locate-minus 2.svg
Processing file: user-interaction-review_favorite-user 2.svg
Processing file: Userinterface_details.svg
Processing file: Document & Folder_folder-settings 2.svg
Processing file: Household_refrigerator-s 2.svg
Processing file: Document & Folder_folder-trash.svg
Processing file: Games & Entertainment_helmat 2.svg
Processing file: Celebration & Holidays-II_fish.svg
Processing file: user-interaction-review_unlock-user 2.svg
Processing file: user-interaction-review_user-round 2.svg
Processing file: gesture_drag down.svg
Processing file: Devices & Network_storager 2.svg
Processing file: gesture_1f-tap-up 4.svg
Processing file: Document & Folder_board-unloack 2.svg
Processing file: food and drink_pubs.svg
Processing file: Household_round-lamp.svg
Processing file: arrow-long-right 2.svg
Processing file: Celebration & Holidays_wine-glass 2.svg
Processing file: align-vertical-middle.svg
Processing file: Audio & Music Instruments_sound-cancel 2.svg
Processing file: Control & Navigation-II_arw-right 2.svg
Processing file: Document & Folder_files-3 2.svg
Processing file: Celebration & Holidays-II-21.svg
Processing file: emotions_intence 2.svg
Processing file: Userinterface_blank-browser.svg
Processing file: SociaI-icons_bing-08 2.svg
Processing file: popup.svg
Processing file: SociaI-icons_slideshare-68 2.svg
Processing file: Celebration & Holidays-II_beach 2.svg
Processing file: image video_film 2.svg
Processing file: emotions_mustache 2.svg
Processing file: Household_dish-cleaner 2.svg
Processing file: aircraft-landing 2.svg
Processing file: map and locations_locate-people.svg
Processing file: Finance & Shopping_card-unloack 2.svg
Processing file: Control & Navigation_share-top 2.svg
Processing file: Games & Entertainment_Golf.svg
Processing file: info.svg
Processing file: gesture_2fingers 2.svg
Processing file: Buildings-12 2.svg
Processing file: Editing_braces.svg
Processing file: Devices & Network_cloud-up.svg
Processing file: image video_tick-file 2.svg
Processing file: gesture_5f-swipe-up 2.svg
Processing file: align-horizontal-middle 2.svg
Processing file: network.svg
Processing file: SociaI-icons_smugmug.svg
Processing file: video-camera.svg
Processing file: gauge 2.svg
Processing file: user-interaction-review_success-user 2.svg
Processing file: list.svg
Processing file: Buildings-55 2.svg
Processing file: gesture_5f-drag-up-down 4.svg
Processing file: Devices & Network II_drag-folder.svg
Processing file: drink 2.svg
Processing file: Clothes & Shoes-46.svg
Processing file: Document & Folder_file-music 2.svg
Processing file: emotions_spooked-2 2.svg
Processing file: cloud 2.svg
Processing file: Finance & Shopping_dollar-43 2.svg
Processing file: text-document 2.svg
Processing file: Control & Navigation-II_node-left 2.svg
Processing file: Household_lomg-table.svg
Processing file: tablet 2.svg
Processing file: emoji-flirt.svg
Processing file: Celebration & Holidays_snowflake-8 2.svg
Processing file: SociaI-icons_linkedin.svg
Processing file: Control & Navigation_share-left-down.svg
Processing file: Clothes & Shoes-62.svg
Processing file: Clothes & Shoes-23 2.svg
Processing file: Clothes & Shoes-03.svg
Processing file: Buildings-58 2.svg
Processing file: Celebration & Holidays-II-22.svg
Processing file: compass 2.svg
Processing file: time-slot 2.svg
Processing file: user-interaction-review_time-user 2.svg
Processing file: food and drink_corn-glass-67 2.svg
Processing file: food and drink_glass.svg
Processing file: gesture_5f-tap-up 4.svg
Processing file: user-interaction-review_chat-m.svg
Processing file: food and drink_coconut 2.svg
Processing file: Buildings-85.svg
Processing file: Audio & Music Instruments_music-note2 2.svg
Processing file: Control & Navigation_connection-arw-r.svg
Processing file: Games & Entertainment_Gymnastics 2.svg
Processing file: Control & Navigation-II_dropdown.svg
Processing file: emotions_devasation.svg
Processing file: Document & Folder_file-block 2.svg
Processing file: Games & Entertainment_table-tennis.svg
Processing file: Clothes & Shoes-36 2.svg
Processing file: Office-96.svg
Processing file: gesture_2f-tap-25 2.svg
Processing file: user-interaction-review_love-pople 2.svg
Processing file: Buildings-51.svg
Processing file: gesture_4f-drag-left-right 2.svg
Processing file: Control & Navigation_3-1 arrow 2.svg
Processing file: map and locations_locate-close-23.svg
Processing file: Household_food-maker.svg
Processing file: Userinterface_tick 2.svg
Processing file: emotions_kids 2.svg
Processing file: Document & Folder_file-rotate 2.svg
Processing file: dots-two-horizontal 2.svg
Processing file: Control & Navigation_anti-clock-arw.svg
Processing file: Celebration & Holidays_tree-1 2.svg
Processing file: gesture_2f-drag-left-right-38.svg

Processing file: SociaI-icons_forrst.svg
Processing file: user-interaction-review_girl 2.svg
Done in 70.682254076 seconds 0 symbols created

Are you sure you copied all the files? It should be 2400 or so files. Looks much less.

… the text would be much longer as the forum rules allow it. the “…” are thousands of files.

Is it possible to get some basic logging information to get rid out until which position the script runs correct?

I added some more logging. Please rerun.

this is the result;

Processing file: Household_king-sofa.svg
500
Processing file: Userinterface_letter.svg
500
Processing file: flag.svg
500
Processing file: Clothes & Shoes-97.svg
500
Processing file: Finance & Shopping_money-exchange.svg
500
Processing file: gesture_finger-security 4.svg
500
Processing file: Weather_1-3moon.svg
500
Processing file: Buildings_mosque.svg
500
Processing file: Document & Folder_file-drawer-2.svg
500
Processing file: Finance & Shopping_locker.svg
500
Processing file: SociaI-icons_orkut.svg
500
Processing file: SociaI-icons_forrst.svg
500
Processing file: user-interaction-review_girl 2.svg
500
Done in 72.8568069935 seconds 0 symbols created

ah hah! It gets an internal server error when accessing the file via http.

Does this link work for you:

http://openhabianpi.local:8080/static/matrix-theme/original-svgs/Weather_dark-moon.svg

It may be a permission problem when you copied the files.

How about something like this:

3 Likes

Looks very good :wink:
Are the buttons responsive, i.e. setting and showing the set temperature? I guess the left number shall represent the actual temp. Further optional settings would be a button to toggle the auto-mode of the thermostat and a label showing the window state (open/closed), but this seems to be an easy part I could do myself.

Very nice! Can you share the code?

so, tried it with the local link. result is:

HTTP ERROR: 500

Problem accessing /static/matrix-theme/original-svgs/Weather_dark-moon.svg. Reason:

/etc/openhab2/html/matrix-theme/original-svgs/Weather_dark-moon.svg (Permission denied)

Powered by Jetty://

at the moment the permissions are:

-rwx------ 1 openhabian openhabian    801 Jan  7  2015 youtube-with-circle.svg

which permissions are needed?

You should set the read permission to all!

thank you, Patrick.

after a sudo chmod -R a+r /etc/openhab2/html/matrix-theme/original-svgs

now i get the following result:

Done in 120.657310963 seconds 96 symbols created

Victory! :slight_smile: