Discussion:
Scrolling text over video
jason
2009-04-29 04:25:56 UTC
Permalink
Where I work we have monitors in reception that are playing videos of specials, promotions, CEO talking about stuff and so forth.
They are just a series of .VOB files running off of a VLC player on a Win XP box on the rack.

My boss has asked that I create a Winform that allows someone to enter text and submit. This will then create a scrolling ticker across the bottom of the screen while the video is playing.

Now I know that I could use Java or C# for this - but I would so love to use C++ and FLTK - simply because I am looking for any excuse to advance my knowledge in both (and managed languages are too boring and restrictive.)

Any ideas?

Jason
Greg Ercolano
2009-04-29 06:42:02 UTC
Permalink
Post by jason
Where I work we have monitors in reception that are playing videos of specials, promotions, CEO talking about stuff and so forth.
They are just a series of .VOB files running off of a VLC player on a Win XP box on the rack.
My boss has asked that I create a Winform that allows someone to enter text and submit. This will then create a scrolling ticker across the bottom of the screen while the video is playing.
Now I know that I could use Java or C# for this - but I would so love to use C++ and FLTK - simply because I am looking for any excuse to advance my knowledge in both (and managed languages are too boring and restrictive.)
Any ideas?
Two easy things come to mind: a borderless window (similar to my
'nixieclock' app) placed over the top of your video playback window
so that it can draw whatever it wants; double buffering for smooth
scrolling, anti-aliased fonts, etc. eg:

Loading Image...

..where I just placed the nixieclock borderless window
over a video playback.

But that won't really let you have letters "superimposed"
over the video. The letters would have to be on a rectangle,
similar to closed-captioning. There might be native OS calls
you can use to make the FLTK windows 'see through'; I have
no details on that though.

The other way would be drawing into the overlay planes,
like the way a screen-capture app lets one drag out a
rubber band selection over the entire screen.

But I don't know if FLTK supports rendering text into the
overlay plane.. might only support shapes and vectors in
very limited colors, not sure.
jason
2009-04-29 22:34:25 UTC
Permalink
Post by Greg Ercolano
Post by jason
Where I work we have monitors in reception that are playing videos of specials, promotions, CEO talking about stuff and so forth.
They are just a series of .VOB files running off of a VLC player on a Win XP box on the rack.
My boss has asked that I create a Winform that allows someone to enter text and submit. This will then create a scrolling ticker across the bottom of the screen while the video is playing.
Now I know that I could use Java or C# for this - but I would so love to use C++ and FLTK - simply because I am looking for any excuse to advance my knowledge in both (and managed languages are too boring and restrictive.)
Any ideas?
Two easy things come to mind: a borderless window (similar to my
'nixieclock' app) placed over the top of your video playback window
so that it can draw whatever it wants; double buffering for smooth
http://seriss.com/people/erco/fltk/tmp/video-overlay.png
..where I just placed the nixieclock borderless window
over a video playback.
But that won't really let you have letters "superimposed"
over the video. The letters would have to be on a rectangle,
similar to closed-captioning. There might be native OS calls
you can use to make the FLTK windows 'see through'; I have
no details on that though.
The other way would be drawing into the overlay planes,
like the way a screen-capture app lets one drag out a
rubber band selection over the entire screen.
But I don't know if FLTK supports rendering text into the
overlay plane.. might only support shapes and vectors in
very limited colors, not sure.
Thank you very much. The "borderless window" idea is a great start.

Step 1: Create main window as borderless

Step 2: Figure out how to make it draggable without a title bar at the top

Step 3: Figure out how to animate the "scrolling" of the text

Step 4: Consider making the scrollwindow "transparent" some how so that the text can appear to float on the vdeo. I don't think it's possible but it would be nice though :)

This is going to be a great little project and I am really looking forward to it - thanks again for the help.
Matthias Melcher
2009-04-29 23:24:03 UTC
Permalink
Post by jason
Step 2: Figure out how to make it draggable without a title bar at the top
Override your handle(int) method, return "1" for FL_PUSH and you will get
FL_DRAG events. Use the event global coordinates to reposition your window.
Post by jason
Step 3: Figure out how to animate the "scrolling" of the text
Use Fl::add_timout() and repeat_timeout() to generate areoccuring timer. All
the time does is call "redraw()" for your scrolling text window and
increment some integer. Now override the draw() method and draw you text
with the offset given by the previously mentioned integer.
Post by jason
Step 4: Consider making the scrollwindow "transparent" some how so that the
text can appear to float on the vdeo. I don't think it's possible but it would
be nice though :)
Transparency is not supported by 1.1 or 1.3. 2.x supports transparent
windows, but will likely fail when you try to animate that transparency.

Some cards use a video overlay (a hardware generated video image ove your
regular screen) and can only do very simple "cutouts" - no true
transparencies. This is great to keep the load on the CPU to a minimum, but
your decoded video never gets into RAM, making it close to impossible to do
smooth (or any) text effects.

Agaian, OpenGL can be very helpful here: some video cards support decoding a
video stream into an OpenGL texture buffer. You can then do with the live
video stream anything that you can do with an OpenGL screen context (zoom,
distort, overlay, underlay, change colors, etc.)
Greg Ercolano
2009-04-29 23:28:54 UTC
Permalink
Post by jason
Post by Greg Ercolano
Post by jason
Where I work we have monitors in reception that are playing videos of specials, promotions, CEO talking about stuff and so forth.
They are just a series of .VOB files running off of a VLC player on a Win XP box on the rack.
My boss has asked that I create a Winform that allows someone to enter text and submit. This will then create a scrolling ticker across the bottom of the screen while the video is playing.
Now I know that I could use Java or C# for this - but I would so love to use C++ and FLTK - simply because I am looking for any excuse to advance my knowledge in both (and managed languages are too boring and restrictive.)
Any ideas?
Two easy things come to mind: a borderless window (similar to my
'nixieclock' app) placed over the top of your video playback window
so that it can draw whatever it wants; double buffering for smooth
http://seriss.com/people/erco/fltk/tmp/video-overlay.png
..where I just placed the nixieclock borderless window
over a video playback.
But that won't really let you have letters "superimposed"
over the video. The letters would have to be on a rectangle,
similar to closed-captioning. There might be native OS calls
you can use to make the FLTK windows 'see through'; I have
no details on that though.
The other way would be drawing into the overlay planes,
like the way a screen-capture app lets one drag out a
rubber band selection over the entire screen.
But I don't know if FLTK supports rendering text into the
overlay plane.. might only support shapes and vectors in
very limited colors, not sure.
Thank you very much. The "borderless window" idea is a great start.
Step 1: Create main window as borderless
That should be as simply as:

yourwindow->clear_border();
Post by jason
Step 2: Figure out how to make it draggable without a title bar at the top
Here's what the nixieclock does: any click down followed by a drag
moves the window around. Just this little bit of code in the
window's handle() function is all it takes to make the window
draggable..


// HANDLE EVENTS IN THE WINDOW
int YourWindow::handle(int e)
{
static int xoff = 0, yoff = 0;
int ret = Fl_Double_Window::handle(e);
switch ( e ) {
// DOWNCLICK IN WINDOW CREATES CURSOR OFFSETS
case FL_PUSH:
xoff = x() - Fl::event_x_root();
yoff = y() - Fl::event_y_root();
ret = 1;
break;

case FL_DRAG:
// DRAG THE WINDOW AROUND THE SCREEN
position(xoff + Fl::event_x_root(), yoff + Fl::event_y_root());
redraw();
ret = 1;
break;

case FL_RELEASE:
show(); // raise
ret =1;
break;
}
return(ret);
}
Post by jason
Step 3: Figure out how to animate the "scrolling" of the text
Smooth sideways scrolling will be an interesting challenge.
There are some easy cheats such as overriding draw() and
using fl_draw() to draw the text string at different x()
positions.
Post by jason
Step 4: Consider making the scrollwindow "transparent" some how so that
the text can appear to float on the v[i]deo.
On OSX I'm pretty sure there's some simple native OSX calls
to make windows of variable transparency which may work with FLTK
too, not sure.
MacArthur, Ian (SELEX GALILEO, UK)
2009-04-30 08:46:58 UTC
Permalink
Post by jason
Thank you very much. The "borderless window" idea is a great start.
Step 1: Create main window as borderless
Step 2: Figure out how to make it draggable without a title
bar at the top
This is easy to do, and there are loads of examples, e.g. Greg's cheat
sheet here:
http://www.seriss.com/people/erco/fltk/#DraggableBoxes

Or indeed Greg's nixieclock widget...
Post by jason
Step 3: Figure out how to animate the "scrolling" of the text
Use Fl::add_timeout() to update the displayed string and its positionin
the window.
Post by jason
Step 4: Consider making the scrollwindow "transparent" some
how so that the text can appear to float on the vdeo. I don't
think it's possible but it would be nice though :)
Might be trickier... May not be impossible though, but probably platfrom
specific solution. But I think you are only targetting a specific
platform so you may be able to work something.





SELEX Sensors and Airborne Systems Limited
Registered Office: Sigma House, Christopher Martin Road, Basildon, Essex SS14 3EL
A company registered in England & Wales. Company no. 02426132
********************************************************************
This email and any attachments are confidential to the intended
recipient and may also be privileged. If you are not the intended
recipient please delete it from your system and notify the sender.
You should not copy it or use it for any purpose nor disclose or
distribute its contents to any other person.
********************************************************************
Nicholas Shea
2009-04-30 16:46:07 UTC
Permalink
Post by jason
Where I work we have monitors in reception that are playing videos of specials, promotions, CEO talking about stuff and so forth.
They are just a series of .VOB files running off of a VLC player on a Win XP box on the rack.
My boss has asked that I create a Winform that allows someone to enter text and submit. This will then create a scrolling ticker across the bottom of the screen while the video is playing.
Now I know that I could use Java or C# for this - but I would so love to use C++ and FLTK - simply because I am looking for any excuse to advance my knowledge in both (and managed languages are too boring and restrictive.)
Any ideas?
Jason
Hello Jason

I remember a good few years ago there was an OpenGL Tutorial
(number #36) by Jeff Molofee that played an AVI file in OpenGL.
The AVI was played back on a revolving cube. Perhaps using OpenGL
for your playback might open up other interesting possibilities regarding the display of text. I have this tutorial on backup if it is no longer on the web.

Nicholas
Greg Ercolano
2009-04-30 19:38:20 UTC
Permalink
Post by Nicholas Shea
I remember a good few years ago there was an OpenGL Tutorial
(number #36) by Jeff Molofee that played an AVI file in OpenGL.
The AVI was played back on a revolving cube. Perhaps using OpenGL
for your playback might open up other interesting possibilities regarding the display of text. I have this tutorial on backup if it is no longer on the web.
Sure; best way would probably be to "Submit an Article":
http://fltk.org/articles.php

.. showing the example code and tutorial text. It's a good
way for such things to be made public so other fltk'ers can
find them.

I'd like to see this tutorial myself; although I haven't needed
to do realtime avi playback in fltk, I'd like to see the technique
used.

Tools like imagemagick, libquicktime, ffmpeg and others could
probably also be used to do this. But multimedia is often very
native-OS centric, so I imagine it's tricky to make this truly
cross platform.
jason
2009-05-01 01:38:03 UTC
Permalink
Post by Greg Ercolano
Post by Nicholas Shea
I remember a good few years ago there was an OpenGL Tutorial
(number #36) by Jeff Molofee that played an AVI file in OpenGL.
The AVI was played back on a revolving cube. Perhaps using OpenGL
for your playback might open up other interesting possibilities regarding the display of text. I have this tutorial on backup if it is no longer on the web.
http://fltk.org/articles.php
.. showing the example code and tutorial text. It's a good
way for such things to be made public so other fltk'ers can
find them.
I'd like to see this tutorial myself; although I haven't needed
to do realtime avi playback in fltk, I'd like to see the technique
used.
Tools like imagemagick, libquicktime, ffmpeg and others could
probably also be used to do this. But multimedia is often very
native-OS centric, so I imagine it's tricky to make this truly
cross platform.
Hey guys,

Thanks for all the great responses. I am really looking forward to trying some of the suggestions. It would be a great learning tool - however the reality is this - I needed a solution quickly.

And as such I did the unforgivable - no! that is not true - I am not a religous zealot! There is nothing wrong with using the right tool for the job right? :)

So I fired up VS and within 20 mins had a working progam using VB.NET.
I showed it to my boss and he loved it and has asked for a few tweaks - which took a few hours but by the end of the day I have a fully functional scrolling text program.

I still want to try and do it with C++ though as that is where my passion and interests lie.

Wouldn't it be great if C++ weer a RAD tool?
Or maybe not! Now that would be an interesting debate.
MacArthur, Ian (SELEX GALILEO, UK)
2009-05-01 07:50:51 UTC
Permalink
Post by jason
Wouldn't it be great if C++ weer a RAD tool?
Or maybe not! Now that would be an interesting debate.
FLTK + fluid pretty much *is* a RAD tool.




SELEX Sensors and Airborne Systems Limited
Registered Office: Sigma House, Christopher Martin Road, Basildon, Essex SS14 3EL
A company registered in England & Wales. Company no. 02426132
********************************************************************
This email and any attachments are confidential to the intended
recipient and may also be privileged. If you are not the intended
recipient please delete it from your system and notify the sender.
You should not copy it or use it for any purpose nor disclose or
distribute its contents to any other person.
********************************************************************
MacArthur, Ian (SELEX GALILEO, UK)
2009-05-01 10:06:04 UTC
Permalink
Coffe break: so here's my hack at this suggestion.
Seems to work OK, tested on WinXP with mingw and fltk-1.1.x svn.

-------------------------
// implementation of the generic drag banner window
/* Standard headers */
#include <stdlib.h>
#include <stdio.h>
#include <string.h>
#include <unistd.h>

// FLTK headers
#include <FL/Fl.H>
#include <FL/Fl_Double_Window.H>
#include <FL/Fl_Box.H>
#include <Fl/fl_draw.H>

/***********************************************************************
******/
class drag_banner : public Fl_Double_Window {
private:
int x1, y1; // click posn., used for dragging and docking
checks
int xoff, yoff; // origin used for dragging calcs
int scroll_pos; // origin for scrolled text banner
char *msg; // banner message
int len, ht, desc; // banner string dimensions

protected:
// override handle method to catch drag operations
int handle(int event);
void draw(void);

public:
// basic constructor
drag_banner(int X, int Y, int W, int H, const char *L = 0);
// text scroll method
void do_scroll(void) {scroll_pos -= 1; redraw();};
// set the banner message
void set_msg(const char *m);
};
/***********************************************************************
******/
drag_banner::drag_banner(int x, int y, int W, int h, const char *l)
: Fl_Double_Window(x, y, W, h, l){
this->box(FL_FLAT_BOX);
this->color(FL_BACKGROUND_COLOR);
this->clear_border();
scroll_pos = W / 2;
msg = NULL;
} // constructor

int drag_banner::handle(int event) {
int ret = Fl_Double_Window::handle(event);
switch (event) {
case FL_PUSH: // downclick in banner creates cursor offsets
x1 = Fl::event_x_root();
y1 = Fl::event_y_root();
xoff = x() - x1;
yoff = y() - y1;
ret = 1;
break;

case FL_DRAG: // drag the banner around the screen
position(xoff + Fl::event_x_root(), yoff +
Fl::event_y_root());
redraw();
ret = 1;
break;

case FL_RELEASE:
ret = 1;
break;

default:
break;
}
return ret;
} // drag_banner::handle

void drag_banner::draw(void){
Fl_Double_Window::draw(); // draw the base window
fl_font(FL_COURIER, 40); // set the font size
fl_color(FL_BLUE); // set the message colour
if((scroll_pos + len) < 0) scroll_pos = w();
fl_draw(msg, scroll_pos, (h() - desc));
} // draw string method

void drag_banner::set_msg(const char *m){
if(msg) free(msg);
msg = strdup(m);
// measure our string
fl_font(FL_COURIER, 40); // set the font size
len = ht = 0;
fl_measure(msg, len, ht, 0);
desc = fl_descent();
} // set message
/***********************************************************************
******/
drag_banner *banner = NULL;

/***** animation timeout callback ***********/
static void anim_timer(void*) {
banner->do_scroll();
Fl::repeat_timeout(0.03, anim_timer);
} // anim_timer

/***********************************************************************
******/
int main(int argc, char **argv) {
int screen_width = Fl::w();
int screen_height = Fl::h();

banner = new drag_banner(0, (screen_height - 50), screen_width,
50);
banner->set_msg("This is the Banner Message!");
banner->end();
banner->show(argc, argv);

/* Start a timer to run the text scrolling */
Fl::add_timeout(0.1, anim_timer);
/* Run the main event loop */
return Fl::run();
} // main
// end of file

-----------------





SELEX Sensors and Airborne Systems Limited
Registered Office: Sigma House, Christopher Martin Road, Basildon, Essex SS14 3EL
A company registered in England & Wales. Company no. 02426132
********************************************************************
This email and any attachments are confidential to the intended
recipient and may also be privileged. If you are not the intended
recipient please delete it from your system and notify the sender.
You should not copy it or use it for any purpose nor disclose or
distribute its contents to any other person.
********************************************************************
Nicholas Shea
2009-05-01 08:25:54 UTC
Permalink
Hello Greg,

Jeff Molofee has written his own article here:

http://nehe.gamedev.net/data/lessons/lesson.asp?lesson=35

(I got the lesson number wrong). So it's still on the web. I remember porting some of his tutorials to both SDL and Fltk a long time ago. I can't imagine porting this particular example should prove too difficult. Making things cross platform is always the ultimate goal :)
I will have a go at this in the coming weeks and if I produce anything useful, make a post here. I am sure there are other young hotshots in this group who can do this sort of thing in their sleep; I'm an old crusty wheel of 46 years. Still rolling though!

Nicholas
Post by Greg Ercolano
Post by Nicholas Shea
I remember a good few years ago there was an OpenGL Tutorial
(number #36) by Jeff Molofee that played an AVI file in OpenGL.
The AVI was played back on a revolving cube. Perhaps using OpenGL
for your playback might open up other interesting possibilities regarding the display of text. I have this tutorial on backup if it is no longer on the web.
http://fltk.org/articles.php
.. showing the example code and tutorial text. It's a good
way for such things to be made public so other fltk'ers can
find them.
I'd like to see this tutorial myself; although I haven't needed
to do realtime avi playback in fltk, I'd like to see the technique
used.
Tools like imagemagick, libquicktime, ffmpeg and others could
probably also be used to do this. But multimedia is often very
native-OS centric, so I imagine it's tricky to make this truly
cross platform.
jason
2009-05-02 07:47:38 UTC
Permalink
Post by MacArthur, Ian (SELEX GALILEO, UK)
Coffe break: so here's my hack at this suggestion.
Seems to work OK, tested on WinXP with mingw and fltk-1.1.x svn.
-------------------------
// implementation of the generic drag banner window
/* Standard headers */
#include <stdlib.h>
#include <stdio.h>
#include <string.h>
#include <unistd.h>
// FLTK headers
#include <FL/Fl.H>
#include <FL/Fl_Double_Window.H>
#include <FL/Fl_Box.H>
#include <Fl/fl_draw.H>
/***********************************************************************
******/
class drag_banner : public Fl_Double_Window {
int x1, y1; // click posn., used for dragging and docking
checks
int xoff, yoff; // origin used for dragging calcs
int scroll_pos; // origin for scrolled text banner
char *msg; // banner message
int len, ht, desc; // banner string dimensions
// override handle method to catch drag operations
int handle(int event);
void draw(void);
// basic constructor
drag_banner(int X, int Y, int W, int H, const char *L = 0);
// text scroll method
void do_scroll(void) {scroll_pos -= 1; redraw();};
// set the banner message
void set_msg(const char *m);
};
/***********************************************************************
******/
drag_banner::drag_banner(int x, int y, int W, int h, const char *l)
: Fl_Double_Window(x, y, W, h, l){
this->box(FL_FLAT_BOX);
this->color(FL_BACKGROUND_COLOR);
this->clear_border();
scroll_pos = W / 2;
msg = NULL;
} // constructor
int drag_banner::handle(int event) {
int ret = Fl_Double_Window::handle(event);
switch (event) {
case FL_PUSH: // downclick in banner creates cursor offsets
x1 = Fl::event_x_root();
y1 = Fl::event_y_root();
xoff = x() - x1;
yoff = y() - y1;
ret = 1;
break;
case FL_DRAG: // drag the banner around the screen
position(xoff + Fl::event_x_root(), yoff +
Fl::event_y_root());
redraw();
ret = 1;
break;
ret = 1;
break;
break;
}
return ret;
} // drag_banner::handle
void drag_banner::draw(void){
Fl_Double_Window::draw(); // draw the base window
fl_font(FL_COURIER, 40); // set the font size
fl_color(FL_BLUE); // set the message colour
if((scroll_pos + len) < 0) scroll_pos = w();
fl_draw(msg, scroll_pos, (h() - desc));
} // draw string method
void drag_banner::set_msg(const char *m){
if(msg) free(msg);
msg = strdup(m);
// measure our string
fl_font(FL_COURIER, 40); // set the font size
len = ht = 0;
fl_measure(msg, len, ht, 0);
desc = fl_descent();
} // set message
/***********************************************************************
******/
drag_banner *banner = NULL;
/***** animation timeout callback ***********/
static void anim_timer(void*) {
banner->do_scroll();
Fl::repeat_timeout(0.03, anim_timer);
} // anim_timer
/***********************************************************************
******/
int main(int argc, char **argv) {
int screen_width = Fl::w();
int screen_height = Fl::h();
banner = new drag_banner(0, (screen_height - 50), screen_width,
50);
banner->set_msg("This is the Banner Message!");
banner->end();
banner->show(argc, argv);
/* Start a timer to run the text scrolling */
Fl::add_timeout(0.1, anim_timer);
/* Run the main event loop */
return Fl::run();
} // main
// end of file
-----------------
SELEX Sensors and Airborne Systems Limited
Registered Office: Sigma House, Christopher Martin Road, Basildon, Essex SS14 3EL
A company registered in England & Wales. Company no. 02426132
********************************************************************
This email and any attachments are confidential to the intended
recipient and may also be privileged. If you are not the intended
recipient please delete it from your system and notify the sender.
You should not copy it or use it for any purpose nor disclose or
distribute its contents to any other person.
********************************************************************
Fantastic - well done sir!

Continue reading on narkive:
Loading...