Author Topic: YouTube Support Teaser  (Read 18569 times)

July 26, 2009, 06:21:44 PM
Read 18569 times

elmarweber

  • Hero Member

  • Offline
  • *****

  • 500
    • WDTV Tools
Hi,

had some time post some news on the YouTube support. It's late, so I'm not copying text and images over here, so just the link to the blog post: http://wdtv.elmarweber.org/index.php/2009/youtube-support-teaser.

Some more updates will follow piece by piece.

ciao,
elm

PS: If any one of you has some time and is interested in designing a fancy UI for the YouTube support please PM me.

July 26, 2009, 09:28:08 PM
Reply #1

lilibabe

  • Hero Member

  • Offline
  • *****

  • 1462
    • http://wdtv.free.fr/
Nice job and nice new website too !

Even if i'm not using WDLXTV, i can try to design something... What kind of graphics do you need ?
« Last Edit: July 26, 2009, 10:14:00 PM by lilibabe »
If you appreciate my work and want to contribute, feel free to donate at http://wdtv.free.fr/

July 27, 2009, 02:33:00 AM
Reply #2

BMD_Online

  • Full Member

  • Offline
  • ***

  • 135
On my side, I have tried to implement a live-converter for flv files.
Using fuse and ffmpeg libraries.

First, I have tried to convert (and watch) on the fly flv to mpeg using ffmpeg provided with ipkg.
I think WDTV doesn't have enough CPU for this. So, I have aborted my project.

July 27, 2009, 03:32:44 AM
Reply #3

rezmus

  • Sr. Member

  • Offline
  • ****

  • 418
yep, tried that too with ffmpeg, but it took ages. fortunately youtube provides videos as mp4 which play fine on wdtv without conversion. nice work elm ;) i would like to see also modded thumb mode with 320 x 240 thumbs which are provided by youtube.

July 27, 2009, 04:33:16 AM
Reply #4

BMD_Online

  • Full Member

  • Offline
  • ***

  • 135
yep, tried that too with ffmpeg, but it took ages. fortunately youtube provides videos as mp4 which play fine on wdtv without conversion. nice work elm ;) i would like to see also modded thumb mode with 320 x 240 thumbs which are provided by youtube.

Yes, youtube provides mp4 files too. But other providers (dailymotion) doesn't.
In my case, I watch some online documentary only available in Dailymoiton, in flv format.

Elm, for keyboard layout, is it possible to use QWERTY (english), AZERTY (french)... using WDTV locale ?
For example (don't know your files names), something like youtube_searc.xml including youtube_keyboard.xml
And, youtube_keyboard corresponding to youtube_keyboard_fr.xml or youtube_keyboard_en.xml...

July 27, 2009, 04:44:44 AM
Reply #5

rezmus

  • Sr. Member

  • Offline
  • ****

  • 418
u can't coz on wdtv u can declare max 29 browse / thumb list objects per page and it must be a table, so 29 x 1, 14 x 2, 7 x 4, etc. and qwerty layout requires more objects (10 x 4 or so).

July 27, 2009, 04:50:12 AM
Reply #6

BMD_Online

  • Full Member

  • Offline
  • ***

  • 135
u can't coz on wdtv u can declare max 29 browse / thumb list objects per page and it must be a table, so 29 x 1, 14 x 2, 7 x 4, etc. and qwerty layout requires more objects (10 x 4 or so).

Using only letters, we need something like 10 x 3 = 30 objects !
We can't use 10 x 2 and 9 x 1 (for bottom line) = 29 objects ? I haven't looked at actual keyboard/search page.

July 27, 2009, 06:03:01 AM
Reply #7

elmarweber

  • Hero Member

  • Offline
  • *****

  • 500
    • WDTV Tools
Nice job and nice new website too !

Even if i'm not using WDLXTV, i can try to design something... What kind of graphics do you need ?

in the long term I though of the following structure
YouTube Home
=> Featured Videos
=> Most Popular
=> Search
  => Keyboard layout
=> Channels
  .... all categories from youtube

So a home screen where the four parts are nicely organized first, then a design for browsing the video files (list+thumb) that matches the home screen's overall design. And of course the keyboards. Keyboard files were a bit tricky, but its feasible, although loading is a little slow (about 1.5 seconds instead of instantly).

When this integrates in your other design it's of course optimal =)

The current plan is to use the default OSD layout for normal browsing and just use the keyboard for search queries, so everything is normal anyway. A fancy design that skins the whole YouTube support is just nice-to-have eye candy.

ciao,
elm

July 27, 2009, 06:10:26 AM
Reply #8

elmarweber

  • Hero Member

  • Offline
  • *****

  • 500
    • WDTV Tools
On my side, I have tried to implement a live-converter for flv files.
Using fuse and ffmpeg libraries.

First, I have tried to convert (and watch) on the fly flv to mpeg using ffmpeg provided with ipkg.
I think WDTV doesn't have enough CPU for this. So, I have aborted my project.

Did you try to convert to MP4 or another format? Because MP4 with AVC and H.264 takes a lot of time, maybe using mpg or so works better?

Scratch that =), just got 11 fps with mpeg.


The easiest way would of course be FLV support from the firmware, AFAIR the chip supported it.

ciao,
elm
« Last Edit: July 27, 2009, 06:25:31 AM by elmarweber »

July 27, 2009, 06:24:37 AM
Reply #9

elmarweber

  • Hero Member

  • Offline
  • *****

  • 500
    • WDTV Tools
i would like to see also modded thumb mode with 320 x 240 thumbs which are provided by youtube.

To get the full resolution I probably have to copy the thumbnails to the /tmp/cache/YouTube/something directory?


u can't coz on wdtv u can declare max 29 browse / thumb list objects per page and it must be a table, so 29 x 1, 14 x 2, 7 x 4, etc. and qwerty layout requires more objects (10 x 4 or so).

I got it work with at least 35 (7 x 5) images, it crashed with 8 x 5 however. I don't use any special tags, just @@act-browselist-XX and two overlayed image tables to get the hover effect. I'm still trying to figure out the safe maximum dimensions. And although its a table you can position each table object anywhere when x and y is specified. This does not fix the navigation, so the images must still be position in the right order, but they can be moved around freely, e.g. to get the alignment of keyboard characters.
I'm still trying if there is a way to skip a field in the table, there are some tags for the image / text field I'm not sure about.

Here is the generated code:

Code: [Select]
  <ctrlgrp>
    <listbox valkey="browselist" autoenter="1" autoswitch="0" move="page" cols="8" rows="5" lbmask="lr"  loop_scroll="1" turbo_trigger="10" turbo_multi="10" />
<linebreak/>
  </ctrlgrp>

  <table x="281" y="235" w="640" h="300" fontsize="20" selected_fontsize="26"
         cols="8" rows="5" colspacing="0" rowspacing="0"
lbimage="image/browser_list_btn.png" clickimage="image/browser_list_btn.png" 
textcolor="0xe2e2e2" actnoseltextcolor="0xe2e2e2" actoverlistcolor="0xe2e2e2"
activetextcolor="0xe2e2e2" selectedtextcolor="0xe2e2e2" auto_translate="1">

<image image="image/keyboard_symbol_09_btn_f.png" active="@@act-browselist-0" border="@@act-browselist-0" align="hcenter" />
<image image="image/keyboard_uppercass_a_btn_f.png" active="@@act-browselist-1" border="@@act-browselist-1" align="hcenter" />
<image image="image/keyboard_uppercass_b_btn_f.png" active="@@act-browselist-2" border="@@act-browselist-2" align="hcenter" />
<image image="image/keyboard_uppercass_c_btn_f.png" active="@@act-browselist-3" border="@@act-browselist-3" align="hcenter" />
<image image="image/keyboard_uppercass_d_btn_f.png" active="@@act-browselist-4" border="@@act-browselist-4" align="hcenter" />
<image image="image/keyboard_uppercass_e_btn_f.png" active="@@act-browselist-5" border="@@act-browselist-5" align="hcenter" />
<image image="image/keyboard_uppercass_f_btn_f.png" active="@@act-browselist-6" border="@@act-browselist-6" align="hcenter" />
<image image="image/keyboard_uppercass_g_btn_f.png" active="@@act-browselist-7" border="@@act-browselist-7" align="hcenter" />
<image image="image/keyboard_uppercass_h_btn_f.png" active="@@act-browselist-8" border="@@act-browselist-8" align="hcenter" />
<image image="image/keyboard_uppercass_i_btn_f.png" active="@@act-browselist-9" border="@@act-browselist-9" align="hcenter" />
<image image="image/keyboard_uppercass_j_btn_f.png" active="@@act-browselist-10" border="@@act-browselist-10" align="hcenter" />
<image image="image/keyboard_uppercass_k_btn_f.png" active="@@act-browselist-11" border="@@act-browselist-11" align="hcenter" />
<image image="image/keyboard_uppercass_l_btn_f.png" active="@@act-browselist-12" border="@@act-browselist-12" align="hcenter" />
<image image="image/keyboard_uppercass_m_btn_f.png" active="@@act-browselist-13" border="@@act-browselist-13" align="hcenter" />
<image image="image/keyboard_uppercass_n_btn_f.png" active="@@act-browselist-14" border="@@act-browselist-14" align="hcenter" />
<image image="image/keyboard_uppercass_o_btn_f.png" active="@@act-browselist-15" border="@@act-browselist-15" align="hcenter" />
<image image="image/keyboard_uppercass_p_btn_f.png" active="@@act-browselist-16" border="@@act-browselist-16" align="hcenter" />
<image image="image/keyboard_uppercass_q_btn_f.png" active="@@act-browselist-17" border="@@act-browselist-17" align="hcenter" />
<image image="image/keyboard_uppercass_r_btn_f.png" active="@@act-browselist-18" border="@@act-browselist-18" align="hcenter" />
<image image="image/keyboard_uppercass_s_btn_f.png" active="@@act-browselist-19" border="@@act-browselist-19" align="hcenter" />
<image image="image/keyboard_uppercass_t_btn_f.png" active="@@act-browselist-20" border="@@act-browselist-20" align="hcenter" />
<image image="image/keyboard_uppercass_u_btn_f.png" active="@@act-browselist-21" border="@@act-browselist-21" align="hcenter" />
<image image="image/keyboard_uppercass_v_btn_f.png" active="@@act-browselist-22" border="@@act-browselist-22" align="hcenter" />
<image image="image/keyboard_uppercass_w_btn_f.png" active="@@act-browselist-23" border="@@act-browselist-23" align="hcenter" />
<image image="image/keyboard_uppercass_x_btn_f.png" active="@@act-browselist-24" border="@@act-browselist-24" align="hcenter" />
<image image="image/keyboard_uppercass_y_btn_f.png" active="@@act-browselist-25" border="@@act-browselist-25" align="hcenter" />
<image image="image/keyboard_uppercass_z_btn_f.png" active="@@act-browselist-26" border="@@act-browselist-26" align="hcenter" />
<image image="image/keyboard_number_0_btn_f.png" active="@@act-browselist-27" border="@@act-browselist-27" align="hcenter" />
<image image="image/keyboard_number_1_btn_f.png" active="@@act-browselist-28" border="@@act-browselist-28" align="hcenter" />
<image image="image/keyboard_number_2_btn_f.png" active="@@act-browselist-29" border="@@act-browselist-29" align="hcenter" />
<image image="image/keyboard_number_3_btn_f.png" active="@@act-browselist-30" border="@@act-browselist-30" align="hcenter" />
<image image="image/keyboard_number_4_btn_f.png" active="@@act-browselist-31" border="@@act-browselist-31" align="hcenter" />
<image image="image/keyboard_number_5_btn_f.png" active="@@act-browselist-32" border="@@act-browselist-32" align="hcenter" />
<image image="image/keyboard_number_6_btn_f.png" active="@@act-browselist-33" border="@@act-browselist-33" align="hcenter" />
<image image="image/keyboard_number_7_btn_f.png" active="@@act-browselist-34" border="@@act-browselist-34" align="hcenter" />
<image image="image/keyboard_number_8_btn_f.png" active="@@act-browselist-35" border="@@act-browselist-35" align="hcenter" />
<image image="image/keyboard_number_9_btn_f.png" active="@@act-browselist-36" border="@@act-browselist-36" align="hcenter" />
<image image="image/keyboard_number_0_btn_f.png" active="@@act-browselist-37" border="@@act-browselist-37" align="hcenter" />
<image image="image/keyboard_number_1_btn_f.png" active="@@act-browselist-38" border="@@act-browselist-38" align="hcenter" />
<image image="image/keyboard_number_2_btn_f.png" active="@@act-browselist-39" border="@@act-browselist-39" align="hcenter" />
</table>
  <table x="281" y="235" w="640" h="300" fontsize="20" selected_fontsize="26"
         cols="8" rows="5" colspacing="0" rowspacing="0"
lbimage="image/browser_list_btn.png" clickimage="image/browser_list_btn.png" 
textcolor="0xe2e2e2" actnoseltextcolor="0xe2e2e2" actoverlistcolor="0xe2e2e2"
activetextcolor="0xe2e2e2" selectedtextcolor="0xe2e2e2" auto_translate="1">

<image image="image/keyboard_symbol_09_btn_n.png" active="@@act-browselist-0" border="@@act-browselist-0" align="hcenter" disable="@@act-browselist-0" />
<image image="image/keyboard_uppercass_a_btn_n.png" active="@@act-browselist-1" border="@@act-browselist-1" align="hcenter" disable="@@act-browselist-1" />
<image image="image/keyboard_uppercass_b_btn_n.png" active="@@act-browselist-2" border="@@act-browselist-2" align="hcenter" disable="@@act-browselist-2" />
<image image="image/keyboard_uppercass_c_btn_n.png" active="@@act-browselist-3" border="@@act-browselist-3" align="hcenter" disable="@@act-browselist-3" />
<image image="image/keyboard_uppercass_d_btn_n.png" active="@@act-browselist-4" border="@@act-browselist-4" align="hcenter" disable="@@act-browselist-4" />
<image image="image/keyboard_uppercass_e_btn_n.png" active="@@act-browselist-5" border="@@act-browselist-5" align="hcenter" disable="@@act-browselist-5" />
<image image="image/keyboard_uppercass_f_btn_n.png" active="@@act-browselist-6" border="@@act-browselist-6" align="hcenter" disable="@@act-browselist-6" />
<image image="image/keyboard_uppercass_g_btn_n.png" active="@@act-browselist-7" border="@@act-browselist-7" align="hcenter" disable="@@act-browselist-7" />
<image image="image/keyboard_uppercass_h_btn_n.png" active="@@act-browselist-8" border="@@act-browselist-8" align="hcenter" disable="@@act-browselist-8" />
<image image="image/keyboard_uppercass_i_btn_n.png" active="@@act-browselist-9" border="@@act-browselist-9" align="hcenter" disable="@@act-browselist-9" />
<image image="image/keyboard_uppercass_j_btn_n.png" active="@@act-browselist-10" border="@@act-browselist-10" align="hcenter" disable="@@act-browselist-10" />
<image image="image/keyboard_uppercass_k_btn_n.png" active="@@act-browselist-11" border="@@act-browselist-11" align="hcenter" disable="@@act-browselist-11" />
<image image="image/keyboard_uppercass_l_btn_n.png" active="@@act-browselist-12" border="@@act-browselist-12" align="hcenter" disable="@@act-browselist-12" />
<image image="image/keyboard_uppercass_m_btn_n.png" active="@@act-browselist-13" border="@@act-browselist-13" align="hcenter" disable="@@act-browselist-13" />
<image image="image/keyboard_uppercass_n_btn_n.png" active="@@act-browselist-14" border="@@act-browselist-14" align="hcenter" disable="@@act-browselist-14" />
<image image="image/keyboard_uppercass_o_btn_n.png" active="@@act-browselist-15" border="@@act-browselist-15" align="hcenter" disable="@@act-browselist-15" />
<image image="image/keyboard_uppercass_p_btn_n.png" active="@@act-browselist-16" border="@@act-browselist-16" align="hcenter" disable="@@act-browselist-16" />
<image image="image/keyboard_uppercass_q_btn_n.png" active="@@act-browselist-17" border="@@act-browselist-17" align="hcenter" disable="@@act-browselist-17" />
<image image="image/keyboard_uppercass_r_btn_n.png" active="@@act-browselist-18" border="@@act-browselist-18" align="hcenter" disable="@@act-browselist-18" />
<image image="image/keyboard_uppercass_s_btn_n.png" active="@@act-browselist-19" border="@@act-browselist-19" align="hcenter" disable="@@act-browselist-19" />
<image image="image/keyboard_uppercass_t_btn_n.png" active="@@act-browselist-20" border="@@act-browselist-20" align="hcenter" disable="@@act-browselist-20" />
<image image="image/keyboard_uppercass_u_btn_n.png" active="@@act-browselist-21" border="@@act-browselist-21" align="hcenter" disable="@@act-browselist-21" />
<image image="image/keyboard_uppercass_v_btn_n.png" active="@@act-browselist-22" border="@@act-browselist-22" align="hcenter" disable="@@act-browselist-22" />
<image image="image/keyboard_uppercass_w_btn_n.png" active="@@act-browselist-23" border="@@act-browselist-23" align="hcenter" disable="@@act-browselist-23" />
<image image="image/keyboard_uppercass_x_btn_n.png" active="@@act-browselist-24" border="@@act-browselist-24" align="hcenter" disable="@@act-browselist-24" />
<image image="image/keyboard_uppercass_y_btn_n.png" active="@@act-browselist-25" border="@@act-browselist-25" align="hcenter" disable="@@act-browselist-25" />
<image image="image/keyboard_uppercass_z_btn_n.png" active="@@act-browselist-26" border="@@act-browselist-26" align="hcenter" disable="@@act-browselist-26" />
<image image="image/keyboard_number_0_btn_n.png" active="@@act-browselist-27" border="@@act-browselist-27" align="hcenter" disable="@@act-browselist-27" />
<image image="image/keyboard_number_1_btn_n.png" active="@@act-browselist-28" border="@@act-browselist-28" align="hcenter" disable="@@act-browselist-28" />
<image image="image/keyboard_number_2_btn_n.png" active="@@act-browselist-29" border="@@act-browselist-29" align="hcenter" disable="@@act-browselist-29" />
<image image="image/keyboard_number_3_btn_n.png" active="@@act-browselist-30" border="@@act-browselist-30" align="hcenter" disable="@@act-browselist-30" />
<image image="image/keyboard_number_4_btn_n.png" active="@@act-browselist-31" border="@@act-browselist-31" align="hcenter" disable="@@act-browselist-31" />
<image image="image/keyboard_number_5_btn_n.png" active="@@act-browselist-32" border="@@act-browselist-32" align="hcenter" disable="@@act-browselist-32" />
<image image="image/keyboard_number_6_btn_n.png" active="@@act-browselist-33" border="@@act-browselist-33" align="hcenter" disable="@@act-browselist-33" />
<image image="image/keyboard_number_7_btn_n.png" active="@@act-browselist-34" border="@@act-browselist-34" align="hcenter" disable="@@act-browselist-34" />
<image image="image/keyboard_number_8_btn_n.png" active="@@act-browselist-35" border="@@act-browselist-35" align="hcenter" disable="@@act-browselist-35" />
<image image="image/keyboard_number_9_btn_n.png" active="@@act-browselist-36" border="@@act-browselist-36" align="hcenter" disable="@@act-browselist-36" />
<image image="image/keyboard_number_0_btn_n.png" active="@@act-browselist-37" border="@@act-browselist-37" align="hcenter" disable="@@act-browselist-37" />
<image image="image/keyboard_number_1_btn_n.png" active="@@act-browselist-38" border="@@act-browselist-38" align="hcenter" disable="@@act-browselist-38" />
<image image="image/keyboard_number_2_btn_n.png" active="@@act-browselist-39" border="@@act-browselist-39" align="hcenter" disable="@@act-browselist-39" />
</table>

ciao,
elm

July 27, 2009, 06:31:05 AM
Reply #10

elmarweber

  • Hero Member

  • Offline
  • *****

  • 500
    • WDTV Tools
Elm, for keyboard layout, is it possible to use QWERTY (english), AZERTY (french)... using WDTV locale ?
For example (don't know your files names), something like youtube_searc.xml including youtube_keyboard.xml
And, youtube_keyboard corresponding to youtube_keyboard_fr.xml or youtube_keyboard_en.xml...

Yes its possible. But requires the different keyboard files as well as changes to the YouTube filesystem. The search is basically just a folder structure

-Search
 - a
   - a
   - b
   - ...
 - b ...

So when you navigate to /Search/a/b/c/d/_search you get a list of videos for abcd as search string. To adapt the sorting for the UI the directory naming must include a prefix number to achieve a correct sorting:

- Search
  -  1 q
  -  2 w
  -  3 e
  - ..

And so on, based on that individual layouts are possible.

ciao,elm

July 27, 2009, 11:04:14 AM
Reply #11

mike2k8

  • Full Member

  • Offline
  • ***

  • 100
Looks great, elmarweber.

One opinion about keyboard layouts.
If the "keyboard" is going to be used by navigating with the remote, Wouldn't be better for usability to keep alphabetical order?
I don't see the point of qwerty if you can't really type.

July 27, 2009, 12:28:22 PM
Reply #12

elmarweber

  • Hero Member

  • Offline
  • *****

  • 500
    • WDTV Tools
One opinion about keyboard layouts.
If the "keyboard" is going to be used by navigating with the remote, Wouldn't be better for usability to keep alphabetical order?
I don't see the point of qwerty if you can't really type.

Good point, never thought about it that way. Maybe better orientation for some users, but that's all. Keyboard fanatics like me find letters on a keyboard faster than in the alphabet =)

The only other reason I can think of is continuity, the search keyboard for the WDTV database has a querty layout if I'm not mistaken.

ciao,
elm

July 27, 2009, 09:34:09 PM
Reply #13

TON

  • Jr. Member

  • Offline
  • **

  • 87
Good point, never thought about it that way. Maybe better orientation for some users, but that's all. Keyboard fanatics like me find letters on a keyboard faster than in the alphabet =)
elm
That is just my case ;D
I have a suggestion though it might be difficult to implement. Is it possible to make switchable keyboard layouts? There are quite a few languages that are not based on the Latin alphabet and it would be nice to support them as well. I believe people would agree to some delays when the layouts are switched. Some coding like UTF8 should be used internally as well.

July 28, 2009, 12:12:07 AM
Reply #14

BMD_Online

  • Full Member

  • Offline
  • ***

  • 135
Keyboard fanatics like me find letters on a keyboard faster than in the alphabet =)

Me too. ;)