Click here to Skip to main content
15,745,504 members
Articles / Multimedia / OpenGL
Posted 13 Sep 2007


52 bookmarked

An OpenGL Sample as Firefox Plugin

Rate me:
Please Sign up or sign in to vote.
4.82/5 (18 votes)
13 Sep 20072 min read
A tutorial on how a Firefox plugin does OpenGL rendering
Sample Image - maximum width is 600 pixels


This articles explains how OpenGL is rendered as a Firefox plugin. I don't know whether it's useful. I did it for fun!


I was trying to render an X3D file with OpenGL as a Firefox plugin. I know there are many such X3D file viewers, but mine intends to handle the haptic field... well, this sample is just a by-product.

Tinkering with the Code

You will first need to download Gecko plugin API and Firefox source code. Download Gecko SDK and extract to \yourroot\gecko-sdk\.

Download Firefox source code from here, extract to \yourroot\mozilla.
Then we start from a basic plugin sample. Go to the folder: yourroot\mozilla\modules\plugin\tools\sdk\samples\basic\windows.

Here's a little trick, we need to run unix2dos on npbasic.dsp and npbasic.dsw under this folder. Then we open and cover the project by Visual C++ Express, we will be successful now. From project properties, change the Additional include directories to yourroot\gecko-sdk\include; yourroot\mozilla\modules\plugin\tools\sdk\samples\include. Try to build now, if successful, we continue...

Open plugin.cpp, then

#include "plugin.h"


#include <gl/gl.h> 

Then, after the line:

static WNDPROC lpOldProc = NULL; 

add two functions EnableOpenGL and DisableOpenGL:

void EnableOpenGL(HWND hWnd, HDC * hDC, HGLRC * hRC); 
void DisableOpenGL(HWND hWnd, HDC hDC, HGLRC hRC);

Add EnableOpenGL and SetTimer as shown below:

NPBool nsPluginInstance::init(NPWindow* aWindow)

    //we add EnableOpenGL and SetTimer
    EnableOpenGL( mhWnd, &hDC, &hRC );
        SetTimer(mhWnd, 0,  1,  (TIMERPROC) NULL); // no timer callback

Then, add DisableOpenGL as shown below:

void nsPluginInstance::shut() 
    // subclass it back 

    // We add DisableOpenGL

    DisableOpenGL( mhWnd, hDC, hRC );
.... } 

After that, in PluginWinProc, we need to handle WM_TIMER message like the following:

case WM_TIMER:
    theta += 1.0f;
    PostMessage( hWnd, WM_PAINT, NULL, NULL );

At last we do OpenGL rendering in the case of WM_PAINT, remove the original code under this case, and replace it with our code as follows:

glClearColor( 0.0f, 0.0f, 0.0f, 0.0f ); 
glRotatef( theta, 0.0f, 0.0f, 1.0f );
glBegin( GL_TRIANGLES ); 
   glColor3f( 1.0f, 0.0f, 0.0f ); 
   glVertex2f( 0.0f, 1.0f );
   glColor3f( 0.0f, 1.0f, 0.0f ); 
   glVertex2f( 0.87f, -0.5f );
   glColor3f( 0.0f, 0.0f, 1.0f );
   glVertex2f( -0.87f, -0.5f ); 
SwapBuffers( hDC );

It's almost done, but don't forget to define EnableOpenGL and DisableOpenGL:

void EnableOpenGL(HWND hWnd, HDC * hDC, HGLRC * hRC)
    int format;
    // get the device context (DC)
    *hDC = GetDC( hWnd ); // set the pixel format for the DC
    ZeroMemory( &pfd, sizeof( pfd ) );
    pfd.nSize = sizeof( pfd );
    pfd.nVersion = 1; 
    pfd.iPixelType = PFD_TYPE_RGBA;
    pfd.cColorBits = 24;
    pfd.cDepthBits = 16;
    pfd.iLayerType = PFD_MAIN_PLANE;
    format = ChoosePixelFormat( *hDC, &pfd );
    SetPixelFormat( *hDC, format, &pfd );
    // create and enable the render context (RC)
    *hRC = wglCreateContext( *hDC ); 
    wglMakeCurrent( *hDC, *hRC );

// Disable OpenGL
void DisableOpenGL(HWND hWnd, HDC hDC, HGLRC hRC)
    wglMakeCurrent( NULL, NULL );
    wglDeleteContext( hRC );
    ReleaseDC( hWnd, hDC );

It's done!

Build the Project

Nothing to say, just Image 2

Test the plugin

Copy npbasic.dll to C:\Program Files\Mozilla Firefox\plugins\ or yourfolder\Mozilla Firefox\plugins\.
From the folder yourroot\mozilla\modules\plugin\tools\sdk\samples\basic\, you will find test.html, double click and you would see a rotating triangle, colorful...

Another way to test the plugin

If we open a file of the type that a plugin is registered, then the plugin will be triggered. Open basic.rc with a text editor, find the string "FileExtents" and change the value to whatever you want. I changed it to hx3d. Next, create an empty file with the extension .hx3d, I created testbasic.hx3d under my folder. In the Firefox URL box, type c:\\testbasic.hx3d, you would also see the plugin triangle.

Now... enjoy!


This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

Written By
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

Questionutility and dll Pin
shenbagam1224-Jan-13 21:59
shenbagam1224-Jan-13 21:59 
GeneralLinker Error: 2001: Unresolved external symbol _NPN_USERAGENT Pin
veridev1-Jun-10 3:56
veridev1-Jun-10 3:56 
Questiongecko 1.9.2 (firefox 3.6)+Visual Studio 2010 beta = ?? Pin
ginkolev2-Apr-10 10:12
ginkolev2-Apr-10 10:12 
QuestionHow about textures? Pin
Jasmine Pomelo18-Jun-09 2:34
Jasmine Pomelo18-Jun-09 2:34 
GeneralNice Example Pin
VishalIndia6-Mar-09 19:37
VishalIndia6-Mar-09 19:37 
GeneralGreat example Pin
lin06759-Dec-08 0:04
lin06759-Dec-08 0:04 
GeneralGetting linking Error Pin
Member 414011926-Nov-08 1:49
Member 414011926-Nov-08 1:49 
GeneralNot portable Pin
Kuryn18-Oct-08 11:50
Kuryn18-Oct-08 11:50 
GeneralRe: Not portable Pin
ivanmen28-Mar-09 12:09
ivanmen28-Mar-09 12:09 
Generalcompiling error Pin
hyuen15-Jun-08 22:17
hyuen15-Jun-08 22:17 
QuestionGetting linking Error Pin
manish.patel11-Apr-08 0:46
manish.patel11-Apr-08 0:46 
AnswerRe: Getting linking Error Pin
cesarpachon11-Apr-08 7:09
cesarpachon11-Apr-08 7:09 
Questionsome implementation problems Pin
cesarpachon2-Apr-08 2:23
cesarpachon2-Apr-08 2:23 
AnswerRe: some implementation problems Pin
yooyo9-Oct-08 8:04
yooyo9-Oct-08 8:04 
QuestionError building the project in VS 2005 Pin
nachiketk23-Oct-07 21:07
nachiketk23-Oct-07 21:07 
AnswerRe: Error building the project in VS 2005 PinPopular
Ruiying23-Oct-07 22:38
Ruiying23-Oct-07 22:38 
GeneralVery interesting Pin
yarp14-Sep-07 0:05
yarp14-Sep-07 0:05 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.