DIGADIGA

Virtual Class
DETAILED ARCHITECTURE
COMPONENTS
 Shared Whiteboard
 Video/Audio sharing

 Attendee’s List

 File Sharing
SHARED WHITEBOARD
Whiteboard features

 Square drawing
 Filled Square
 Line
 Dashed Line
 Circle
 Eraser
 Free hand Writing
 Line Thickness
 Line Color
 Clear the whole board
WHITEBOARD
USED FLASH COMPONENTS
 Two MovieClips (temp_mc & draw_mc)
 Shared Objects
SQUARE DRAWING
 Two points are required.
 Line Thickness

 Line Color

 Flag (square)

(x1,y1
)

Line Color = “Orange”

(x2,y2
)
Flag =
square
MOVIECLIP COMPONENT
 For shared board two movieClip Components
are used.
 Temp_mc and Draw_mc

 MovieClip:

movieClip are just plains to draw

something on it. We can add motion to those
drawings on movieClip.
 Sprite (AS3)

Sprite is a new component in AS3, that is

also just plain but motion cannot be added to
the drawings on it.
STRATEGY OF TWO MOVIECLIPS
 Temp_mc
When presenter wants to draw something on the board,
he draws it on temp_mc on his side only.

Clears
temp_mc
Sends points
to Server

temp_mc temp_mc draw_mc

Sends points
to Client
TRANSFERRING SQUARE
Flag = 1 color=“blue” x1 = 10 x2 = 10 y1 = 20 y2 = 20
Array

Shared Object
Server (Red5)

Presenter (Client) Attendee (Client)

TRANSFERRING LINE AFTER SQUARE
Flag = 1 color=“blue” x1 = 10 x2 = 20 y1 = 10 y2 = 20
Flag = 2 color=“green” x1 = 1 x2 = 20 y1 = 1 y2 = 10
Array

Shared Object
Server (Red5)

Presenter (Client) Attendee (Client)

GETTING POINTS FOR DRAWING
 Tools:
Tool button click select the flag value.
 On Mouse Button Down:

Picks the initial points (x1,y1).

 On Mouse Move:
Continues to draw on temp_mc.
 On Mouse Button Up:

Picks the ending points (x2,y2).

WHY ARRAY …. ???
Flag = 1 color=“blue” x1 = 10 x2 = 20 y1 = 10 y2 = 20
Flag = 2 color=“green” x1 = 1 x2 = 20 y1 = 1 y2 = 10
Array

Shared Object
Server (Red5)

Presenter (Client) Attendee (Client)

SAME STRATEGY FOR THESE TOOLS
 Filled square
 Line

 Dashed line
LETS ANALYZE CIRCLE
PENCIL AND RUBBER
FREEHAND WRITING
RUBBER
 Rubber is just a filled white square, which
comes over the previous drawing.
 Because of white background, it looks
erasing the material on the board.
WORKING OF PENCIL AND ERASER
 Almost same as the rest of tools.

Getting Points:

 On Mouse Button Down:

Picks the initial points (x1,y1).
 On Mouse Move:
Send initial and current point to the
server.
 On Mouse Button Up:

Ends drawing.
PARALLEL SESSIONS
 PARALLEL SESSIONS
Sends course code + teacher name(drbhatti-cs-308)

drbhatti-cs-
PHP File PHP File
308

yasir-cs-101

PHP File PHP File

Sends course code + teacher name(yasir-cs-101)

PARALLEL SESSIONS
 Students Present:
Gets everything from database, so
conflict does not occur.
 Audio / Video Sharing

Same strategy as for shared objects.