render different view for html5 presenter

[Gary]

Hi Leonardo,

I am trying to show the whiteboard tool buttons for html5 presenter.

The problem is that I don't have any clues to figure out how to render the specific view for html5 presenter only.

If you have time, please give me some hints.

Thank you very much!

Gary

[Leonardo Daronco]

Hi Gary,

That are separate places today with buttons for the presentation and whiteboard. They are both being hidden by the css (https://github.com/bigbluebutton/bigbluebutton/blob/html5-bridge/labs/bbb-html5-client/public/css/layout.css#L460 -- search for .whiteboard-tools and #slide-controls).

Not sure how they are in the new layout, maybe all these buttons are in a single area. But anyway, the way I think it should be done for now is that the area with the buttons should start hidden by the css (as is done today), and then when you want to show it, you add a class to the element, something like "active", or "is-presenter". Then when this class is set in the element, the css shows it.

Let's say you want to show the #slide-controls.

This div is controlled by the SessionWhiteboardControlsView, that is created and associated with #slide-controls on the SessionWhiteboardView (https://github.com/bigbluebutton/bigbluebutton/blob/html5-bridge/labs/bbb-html5-client/public/js/views/session_whiteboard.coffee#L53).So you could do something like:

On SessionWhiteboardControlsView, add a method like this:

    enable: ->
      @$.addClass("active")

On SessionWhiteboardView you wait for a "users:setPresenter". If the presenter was set for the current user, you enable to controls. Something like:

    globals.events.on "users:setPresenter", (userid) =>
      if globals.currentAuth.isCurrentUser(userid)
        @controlsView.enable()

      else

        @controlsView.disable()

Got the idea?

I've added a method in there that checks whether the new presenter is the current user.

When the client connects it creates a "globals.currentAuth" that stores the username and the meetingID (https://github.com/bigbluebutton/bigbluebutton/blob/html5-bridge/labs/bbb-html5-client/public/js/views/login.coffee#L78). So this "isCurrentUser" can be in there and will just try to match the "userid" passed with the "username" it has stored.

Probably this is not the best definitive solution, but show work for now.

In the css it should be simple, something like:

    #slide-controls { display: hidden; }
    #slide-controls.active { display: block; }

I had to take a good look at the code to remember this, so if something doesn't really work as I said let me know!

Also, as Fred always says, initially the HTML5 should be a viewer only, so if you leave this for later if should be ok.

Regards,

--

Leonardo Crauss Daronco

--
You received this message because you are subscribed to the Google Groups "BigBlueButton-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to bigbluebutton-...@googlegroups.com.
To post to this group, send email to bigblueb...@googlegroups.com.
Visit this group at http://groups.google.com/group/bigbluebutton-dev.
For more options, visit https://groups.google.com/groups/opt_out.

[Gary Deng]

Hi Leonardo,

Thank you so much for your great instructions. "globals.currentAuth.isCurrentUser" is what I am looking for.

Regards,

Gary