[oae-dev] Widget Development

Discussion:

Jacqueline Ramos

2014-03-11 15:28:53 UTC

Hi.
I am trying to integrate bigbluebutton with apereo OAE and I can't find
documentation bout widgets.
Could you please help me?

Jacqueline
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140311/75d8a147/attachment.html

Nicolaas Matthijs

2014-03-11 16:19:04 UTC

Permalink

Hi Jacqueline,

Unfortunately, the old Widget SDK has been taken offline because it?s too out-of-date at this point. However, widgets are still a core technology and we?d love to help out getting you up and running on creating a BigBlueButton widget.

The core OAE UI widgets can be found in `/node_modules/oae-core`. There are a lot of examples in there, but the `footer` widget is probably the easiest to get a good sense of the structure of a widget.

Did you have any ideas on how you?d like the widget the work and where you?d like it to appear? Do you know if any back-end level integration will be required as well?

Thanks in advance,
Nicolaas

Hi.
I am trying to integrate bigbluebutton with apereo OAE and I can't find documentation bout widgets.
Could you please help me?
Jacqueline
_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

Bert Pareyn

2014-03-11 16:24:45 UTC

Permalink

I?d like to add that an up-to-date widget skeleton can be found at https://collab.lib.cam.ac.uk/content/cam/xk6BOF4wd.
There?s a more detailed implementation of the todo widget at https://collab.lib.cam.ac.uk/content/cam/e1ycauRPO.

HTH,
Bert

Post by Nicolaas Matthijs
Hi Jacqueline,
Unfortunately, the old Widget SDK has been taken offline because it?s too out-of-date at this point. However, widgets are still a core technology and we?d love to help out getting you up and running on creating a BigBlueButton widget.
The core OAE UI widgets can be found in `/node_modules/oae-core`. There are a lot of examples in there, but the `footer` widget is probably the easiest to get a good sense of the structure of a widget.
Did you have any ideas on how you?d like the widget the work and where you?d like it to appear? Do you know if any back-end level integration will be required as well?
Thanks in advance,
Nicolaas

_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140311/d6739027/attachment.html
-------------- next part --------------
A non-text attachment was scrubbed...
Name: signature.asc
Type: application/pgp-signature
Size: 495 bytes
Desc: Message signed with OpenPGP using GPGMail
Url : http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140311/d6739027/attachment.bin

Jacqueline Ramos

2014-03-11 21:37:58 UTC

Permalink

Hi
Thanks for your response

My team would like to place the option of bigbluebutton in the left side of
the page, under "My network".
I would like to know if this is posible because I notices its a widget. How
can I place my BigBlueButton option there?

Regards,
Jacqueline

On Tue, Mar 11, 2014 at 11:19 AM, Nicolaas Matthijs <

Post by Nicolaas Matthijs
Hi Jacqueline,
Unfortunately, the old Widget SDK has been taken offline because it's too
out-of-date at this point. However, widgets are still a core technology and
we'd love to help out getting you up and running on creating a
BigBlueButton widget.
The core OAE UI widgets can be found in `/node_modules/oae-core`. There
are a lot of examples in there, but the `footer` widget is probably the
easiest to get a good sense of the structure of a widget.
Did you have any ideas on how you'd like the widget the work and where
you'd like it to appear? Do you know if any back-end level integration will
be required as well?
Thanks in advance,
Nicolaas

Post by Jacqueline Ramos
Hi.
I am trying to integrate bigbluebutton with apereo OAE and I can't find

documentation bout widgets.

Post by Jacqueline Ramos
Could you please help me?
Jacqueline
_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

--
Liliana Ramos
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140311/01ea1de6/attachment.html

Nicolaas Matthijs

2014-03-12 11:24:54 UTC

Permalink

Hi Jacqueline,

I would recommend creating a new GitHub repository called `oae-bigbluebutton`, which contains all BigBlueButton related widgets. When an institution wants to pull in these widgets, they can just add the link to your GitHub repository in their package.json file, and the widgets will automatically be included.

If you wanted to place the widget underneath the My Network page, you could just create your widget and add it to the configuration of the left hand navigation in `/ui/js/me.js`. Let me know if you?d like any pointers.

Having said all of that, it might be worth thinking about alternative ways of exposing the integration to an end user. For example, what about adding `BigBlueButton Meeting` as an option to the `Create` menu, allowing you to invite users and groups into them (or even create institution-wide/public meetings)?

Hope that helps,
Nicolaas

Post by Jacqueline Ramos
Hi
Thanks for your response
My team would like to place the option of bigbluebutton in the left side of the page, under "My network".
I would like to know if this is posible because I notices its a widget. How can I place my BigBlueButton option there?
Regards,
Jacqueline
Hi Jacqueline,
Unfortunately, the old Widget SDK has been taken offline because it?s too out-of-date at this point. However, widgets are still a core technology and we?d love to help out getting you up and running on creating a BigBlueButton widget.
The core OAE UI widgets can be found in `/node_modules/oae-core`. There are a lot of examples in there, but the `footer` widget is probably the easiest to get a good sense of the structure of a widget.
Did you have any ideas on how you?d like the widget the work and where you?d like it to appear? Do you know if any back-end level integration will be required as well?
Thanks in advance,
Nicolaas

--
Liliana Ramos

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140312/61fbbeb7/attachment.html

frederic dooremont

2014-03-12 11:46:35 UTC

Permalink

Hi all,
can be good idea will be to create in Global admin an entry for activate the widget tenant by tenant ?
bests
frederic

Post by Nicolaas Matthijs
Hi Jacqueline,
I would recommend creating a new GitHub repository called `oae-bigbluebutton`, which contains all BigBlueButton related widgets. When an institution wants to pull in these widgets, they can just add the link to your GitHub repository in their package.json file, and the widgets will automatically be included.
If you wanted to place the widget underneath the My Network page, you could just create your widget and add it to the configuration of the left hand navigation in `/ui/js/me.js`. Let me know if you?d like any pointers.
Having said all of that, it might be worth thinking about alternative ways of exposing the integration to an end user. For example, what about adding `BigBlueButton Meeting` as an option to the `Create` menu, allowing you to invite users and groups into them (or even create institution-wide/public meetings)?
Hope that helps,
Nicolaas

--
Liliana Ramos

_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140312/3b5fa93a/attachment.html

Clay Fenlason

2014-03-12 12:55:23 UTC

Permalink

One of the difficulties with widget development we've frequently wrestled
with is the design implication. On the one hand, we want to encourage a
rich ecosystem of development. On the other hand, we want a holistic
experience that's attractive and easy to use. Past experience suggests that
these two goals are in tension.

I don't think we've figured out a way to balance these concerns well yet.
The old (Nakamura-days) approach threaded the needle by focusing on widgets
that would embed into Sakai docs, rather than widgets which would make
decisions about higher level navigation, etc. This is no longer our
situation.

It seems that at some level the project would be well-advised to supply
some design guidance, though I don't know what form this could take, in
order to improve use and adoption of new widgets. Or is there a way to
abstract out widget functionality that could allow for custom design
decisions (e.g. whether to put it in the lefthand menu or under the Create
drop-down, with appropriately contextualized appearance). That might
require a sophisticated front end framework which I don't think we have
(but don't really know).

But as a representative of one deploying institution, I do know that before
adding a widget I will no longer be satisfied by merely hearing about the
new functionality it brings. I will want to hear about the design
considerations and usability testing that demonstrate that the widget is
well placed, consistent and integrated into the user experience.

~Clay

On Wed, Mar 12, 2014 at 7:46 AM, frederic dooremont <

Post by frederic dooremont
Hi all,
can be good idea will be to create in Global admin an entry for activate
the widget tenant by tenant ?
bests
frederic
Le 12 mars 2014 ? 12:24, Nicolaas Matthijs <
Hi Jacqueline,
I would recommend creating a new GitHub repository called
`oae-bigbluebutton`, which contains all BigBlueButton related widgets. When
an institution wants to pull in these widgets, they can just add the link
to your GitHub repository in their package.json file, and the widgets will
automatically be included.
If you wanted to place the widget underneath the My Network page, you
could just create your widget and add it to the configuration of the left
hand navigation in `/ui/js/me.js`. Let me know if you?d like any pointers.
Having said all of that, it might be worth thinking about alternative ways
of exposing the integration to an end user. For example, what about adding
`BigBlueButton Meeting` as an option to the `Create` menu, allowing you to
invite users and groups into them (or even create institution-wide/public
meetings)?
Hope that helps,
Nicolaas
Hi
Thanks for your response
My team would like to place the option of bigbluebutton in the left side
of the page, under "My network".
I would like to know if this is posible because I notices its a widget.
How can I place my BigBlueButton option there?
Regards,
Jacqueline
On Tue, Mar 11, 2014 at 11:19 AM, Nicolaas Matthijs <

Post by Nicolaas Matthijs
Hi Jacqueline,
Unfortunately, the old Widget SDK has been taken offline because it?s too
out-of-date at this point. However, widgets are still a core technology and
we?d love to help out getting you up and running on creating a
BigBlueButton widget.
The core OAE UI widgets can be found in `/node_modules/oae-core`. There
are a lot of examples in there, but the `footer` widget is probably the
easiest to get a good sense of the structure of a widget.
Did you have any ideas on how you?d like the widget the work and where
you?d like it to appear? Do you know if any back-end level integration will
be required as well?
Thanks in advance,
Nicolaas

Post by Jacqueline Ramos
Hi.
I am trying to integrate bigbluebutton with apereo OAE and I can't find

documentation bout widgets.

--
Liliana Ramos
_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev
_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140312/d993cf5c/attachment-0001.html

Frédéric Dooremont

2014-03-12 14:05:16 UTC

Permalink

I'm ok with clay, I participate a hosting multi-tenant for the France.
And I think some institutions can be intersting by a new widget.
But the code is shared for all tenants hosts which can cause tensions if we impose a new widget.
frederic

One of the difficulties with widget development we've frequently wrestled with is the design implication. On the one hand, we want to encourage a rich ecosystem of development. On the other hand, we want a holistic experience that's attractive and easy to use. Past experience suggests that these two goals are in tension.
I don't think we've figured out a way to balance these concerns well yet. The old (Nakamura-days) approach threaded the needle by focusing on widgets that would embed into Sakai docs, rather than widgets which would make decisions about higher level navigation, etc. This is no longer our situation.
It seems that at some level the project would be well-advised to supply some design guidance, though I don't know what form this could take, in order to improve use and adoption of new widgets. Or is there a way to abstract out widget functionality that could allow for custom design decisions (e.g. whether to put it in the lefthand menu or under the Create drop-down, with appropriately contextualized appearance). That might require a sophisticated front end framework which I don't think we have (but don't really know).
But as a representative of one deploying institution, I do know that before adding a widget I will no longer be satisfied by merely hearing about the new functionality it brings. I will want to hear about the design considerations and usability testing that demonstrate that the widget is well placed, consistent and integrated into the user experience.
~Clay
Hi all,
can be good idea will be to create in Global admin an entry for activate the widget tenant by tenant ?
bests
frederic

--
Liliana Ramos

_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev
_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140312/5f384c9b/attachment.html

Jesus Federico

2014-03-13 15:38:06 UTC

Permalink

Hi everyone,

My name is Jesus Federico. I am part of the bigbluebutton development team
and also the lead developer of bigbluebutton integrations with third part
applications.

Despite the intentions we have had in the past of writing a BigBlueButton
integration for Apereo OAE, this is the first time we are seriously taking
over this project. Mainly because it is the first time we have resources in
place to get this done. Jacqueline has just joined our team this year and
she is going to be working full time on this project for the next few
months, along with Gustavo Salazar (BigBlueButton core developer leading
the group in Ecuador) and myself who are going to be coaching her in
BigBlueButton matters and also working on this project part time.

As it has been done with other integrations developed or maintained by us
(Sakai CLE, Moodle, LTI, Wordpress, Drupal, Joomla) our goal is to write
this component and openly contribute it to the project/community, to assume
its maintenance and to provide support to users and deployers. But for this
to be accomplished we are really going to need your help and guidance. We
see this project more as collaborative than just a contributed one. With
all the required parts involved (BBB developers working on it, OAE
developers coaching us, and users/deployers validating functional
requirements and helping with testing) hopefully we can have a first
version released by the first days of June :).

Our "official" repository is in github and we are going to be using the
name suggested by Nicolaas.

https://github.com/blindsidenetworks/oea-bigbluebutton

Regarding to functionality I agree with Niccolas

Post by Nicolaas Matthijs
For example, what about adding `BigBlueButton Meeting` as an option to the

`Create` menu, allowing you to invite users and groups into them (or even
create institution-wide/public meetings)?

It might be better from a usability perspective to have the availability of
meetings inside the common UI. Keeping simplicity in mind this is our
vision of how the component should look like once deployed. Please take a
look and give us your feedback. You will find marked in blue the parts that
change in OAE or that offer some interaction in the mockup.

https://blindsidenetworks.mybalsamiq.com/projects/oae-bigbluebutton/prototype/oae-main?key=4b89196582026eda64f1c6e7a9aeb08a054502b7

I find this approach closer to the interactivity offered by the
"discussion" component. Do you guys think that we can base the logic for
the meeting component in that one plus the ability to be selective for
multi-tenancy? Perhaps we are not looking in the right direction as we
don't really know the architecture so we can not tell when the line between
widget and core components is crossed. It may be something that can not be
done right now.

And yes, I agree with Cly

Post by Nicolaas Matthijs
It seems that at some level the project would be well-advised to supply

some design guidance, though I don't know what form this could take, in
order to improve use and adoption of new widgets.

We haven't started yet, so I am just putting this on the table for open
discussion.

Best regards,

*Jesus Federico*
Software Engineer, Blindside Networks Inc.

jesus at blindsidenetworks.com
skype: jesus.federico

I'm ok with clay, I participate a hosting multi-tenant for the France.

Post by Nicolaas Matthijs
And I think some institutions can be intersting by a new widget.
But the code is shared for all tenants hosts which can cause tensions if
we impose a new widget.
frederic
Le 12 mars 2014 ? 13:55, Clay Fenlason <clay.fenlason at et.gatech.edu> a
One of the difficulties with widget development we've frequently wrestled
with is the design implication. On the one hand, we want to encourage a
rich ecosystem of development. On the other hand, we want a holistic
experience that's attractive and easy to use. Past experience suggests that
these two goals are in tension.
I don't think we've figured out a way to balance these concerns well yet.
The old (Nakamura-days) approach threaded the needle by focusing on widgets
that would embed into Sakai docs, rather than widgets which would make
decisions about higher level navigation, etc. This is no longer our
situation.
It seems that at some level the project would be well-advised to supply
some design guidance, though I don't know what form this could take, in
order to improve use and adoption of new widgets. Or is there a way to
abstract out widget functionality that could allow for custom design
decisions (e.g. whether to put it in the lefthand menu or under the Create
drop-down, with appropriately contextualized appearance). That might
require a sophisticated front end framework which I don't think we have
(but don't really know).
But as a representative of one deploying institution, I do know that
before adding a widget I will no longer be satisfied by merely hearing
about the new functionality it brings. I will want to hear about the design
considerations and usability testing that demonstrate that the widget is
well placed, consistent and integrated into the user experience.
~Clay
On Wed, Mar 12, 2014 at 7:46 AM, frederic dooremont <

Post by frederic dooremont
Hi all,
can be good idea will be to create in Global admin an entry for activate
the widget tenant by tenant ?
bests
frederic
Le 12 mars 2014 ? 12:24, Nicolaas Matthijs <
Hi Jacqueline,
I would recommend creating a new GitHub repository called
`oae-bigbluebutton`, which contains all BigBlueButton related widgets. When
an institution wants to pull in these widgets, they can just add the link
to your GitHub repository in their package.json file, and the widgets will
automatically be included.
If you wanted to place the widget underneath the My Network page, you
could just create your widget and add it to the configuration of the left
hand navigation in `/ui/js/me.js`. Let me know if you'd like any pointers.
Having said all of that, it might be worth thinking about alternative
ways of exposing the integration to an end user. For example, what about
adding `BigBlueButton Meeting` as an option to the `Create` menu, allowing
you to invite users and groups into them (or even create
institution-wide/public meetings)?
Hope that helps,
Nicolaas
Hi
Thanks for your response
My team would like to place the option of bigbluebutton in the left side
of the page, under "My network".
I would like to know if this is posible because I notices its a widget.
How can I place my BigBlueButton option there?
Regards,
Jacqueline
On Tue, Mar 11, 2014 at 11:19 AM, Nicolaas Matthijs <

Post by Nicolaas Matthijs
Hi Jacqueline,
Unfortunately, the old Widget SDK has been taken offline because it's
too out-of-date at this point. However, widgets are still a core technology
and we'd love to help out getting you up and running on creating a
BigBlueButton widget.
The core OAE UI widgets can be found in `/node_modules/oae-core`. There
are a lot of examples in there, but the `footer` widget is probably the
easiest to get a good sense of the structure of a widget.
Did you have any ideas on how you'd like the widget the work and where
you'd like it to appear? Do you know if any back-end level integration will
be required as well?
Thanks in advance,
Nicolaas
On 11 Mar 2014, at 15:28, Jacqueline Ramos <jackie.ljrm at gmail.com>

Post by Jacqueline Ramos
Hi.
I am trying to integrate bigbluebutton with apereo OAE and I can't

find documentation bout widgets.

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140313/c8882598/attachment-0001.html

Nicolaas Matthijs

2014-03-18 15:08:18 UTC

Permalink

Hi Jesus,

Thanks for providing that background information. It is extremely helpful and the project sounds really exciting.

As it has been done with other integrations developed or maintained by us (Sakai CLE, Moodle, LTI, Wordpress, Drupal, Joomla) our goal is to write this component and openly contribute it to the project/community, to assume its maintenance and to provide support to users and deployers.

This is a great and I think there?s a lot of potential here for an exciting integration. We?d be happy to provide coaching/pointers/review/help wherever possible. If you want, we can also organise some sort of call to discuss some of the integration questions and come up with a technical strategy.

With all the required parts involved (BBB developers working on it, OAE developers coaching us, and users/deployers validating functional requirements and helping with testing) hopefully we can have a first version released by the first days of June :).

That seems like a very sensible deadline :).

Our "official" repository is in github and we are going to be using the name suggested by Nicolaas.
https://github.com/blindsidenetworks/oea-bigbluebutton

Great. As an aside, it looks like there is a typo in the repository name (oea instead of oae).

I find this approach closer to the interactivity offered by the "discussion" component. Do you guys think that we can base the logic for the meeting component in that one plus the ability to be selective for multi-tenancy?

The approach you?ve outlined seems sensible to me. This probably means that the integration will exist of a back-end module that takes care off the back-end integration, REST feeds for getting my meetings and creating new meetings, etc.

There are some high level questions around this that we will want to think through. Things like whether or not groups can be invited into meetings, what happens when a meeting has finished, can there be open/public meetings, how does it integrate into the activity feed and the notifications, are there any email notifications, etc.

Next to that, it seems like we will need at least 3 different UI widgets. One for creating a new meeting, one for listing all of my meetings and one for displaying a meeting.

I have some ideas around how we can make these show up in the UI without requiring customisation to the core code base. We can offer some help in working that out.

Let me know how you?d like to proceed.

Kind regards,
Nicolaas

Hi everyone,
My name is Jesus Federico. I am part of the bigbluebutton development team and also the lead developer of bigbluebutton integrations with third part applications.
Despite the intentions we have had in the past of writing a BigBlueButton integration for Apereo OAE, this is the first time we are seriously taking over this project. Mainly because it is the first time we have resources in place to get this done. Jacqueline has just joined our team this year and she is going to be working full time on this project for the next few months, along with Gustavo Salazar (BigBlueButton core developer leading the group in Ecuador) and myself who are going to be coaching her in BigBlueButton matters and also working on this project part time.
As it has been done with other integrations developed or maintained by us (Sakai CLE, Moodle, LTI, Wordpress, Drupal, Joomla) our goal is to write this component and openly contribute it to the project/community, to assume its maintenance and to provide support to users and deployers. But for this to be accomplished we are really going to need your help and guidance. We see this project more as collaborative than just a contributed one. With all the required parts involved (BBB developers working on it, OAE developers coaching us, and users/deployers validating functional requirements and helping with testing) hopefully we can have a first version released by the first days of June :).
Our "official" repository is in github and we are going to be using the name suggested by Nicolaas.
https://github.com/blindsidenetworks/oea-bigbluebutton
Regarding to functionality I agree with Niccolas

Post by Nicolaas Matthijs
For example, what about adding `BigBlueButton Meeting` as an option to the `Create` menu, allowing you to invite users and groups into them (or even create institution-wide/public meetings)?

It might be better from a usability perspective to have the availability of meetings inside the common UI. Keeping simplicity in mind this is our vision of how the component should look like once deployed. Please take a look and give us your feedback. You will find marked in blue the parts that change in OAE or that offer some interaction in the mockup.
https://blindsidenetworks.mybalsamiq.com/projects/oae-bigbluebutton/prototype/oae-main?key=4b89196582026eda64f1c6e7a9aeb08a054502b7
I find this approach closer to the interactivity offered by the "discussion" component. Do you guys think that we can base the logic for the meeting component in that one plus the ability to be selective for multi-tenancy? Perhaps we are not looking in the right direction as we don't really know the architecture so we can not tell when the line between widget and core components is crossed. It may be something that can not be done right now.
And yes, I agree with Cly

Post by Nicolaas Matthijs
It seems that at some level the project would be well-advised to supply some design guidance, though I don't know what form this could take, in order to improve use and adoption of new widgets.

We haven't started yet, so I am just putting this on the table for open discussion.
Best regards,
Jesus Federico
Software Engineer, Blindside Networks Inc.
jesus at blindsidenetworks.com
skype: jesus.federico
I'm ok with clay, I participate a hosting multi-tenant for the France.
And I think some institutions can be intersting by a new widget.
But the code is shared for all tenants hosts which can cause tensions if we impose a new widget.
frederic

Post by Nicolaas Matthijs
One of the difficulties with widget development we've frequently wrestled with is the design implication. On the one hand, we want to encourage a rich ecosystem of development. On the other hand, we want a holistic experience that's attractive and easy to use. Past experience suggests that these two goals are in tension.
I don't think we've figured out a way to balance these concerns well yet. The old (Nakamura-days) approach threaded the needle by focusing on widgets that would embed into Sakai docs, rather than widgets which would make decisions about higher level navigation, etc. This is no longer our situation.
It seems that at some level the project would be well-advised to supply some design guidance, though I don't know what form this could take, in order to improve use and adoption of new widgets. Or is there a way to abstract out widget functionality that could allow for custom design decisions (e.g. whether to put it in the lefthand menu or under the Create drop-down, with appropriately contextualized appearance). That might require a sophisticated front end framework which I don't think we have (but don't really know).
But as a representative of one deploying institution, I do know that before adding a widget I will no longer be satisfied by merely hearing about the new functionality it brings. I will want to hear about the design considerations and usability testing that demonstrate that the widget is well placed, consistent and integrated into the user experience.
~Clay
Hi all,
can be good idea will be to create in Global admin an entry for activate the widget tenant by tenant ?
bests
frederic

--
Liliana Ramos

_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140318/8337468b/attachment-0001.html

Jacqueline Ramos

2014-03-19 20:54:26 UTC

Permalink

Hi everyone.

I am trying to create a widget like discussionLibrary. I can't even get the
bubble image in my widget.

I noticed that this part of the code does what I want
var initialContent = null;
if ((widgetData.canAdd || widgetData.canManage) && !query) {
initialContent =
oae.api.util.template().render($('#discussionslibrary-list-actions-template',
$rootel));
}

var url = '/api/discussion/library/' + widgetData.context.id;
if (query) {
url = '/api/search/discussion-library/' +
widgetData.context.id;
}

// Set up the infinite scroll for the discussions library
infinityScroll = $('.oae-list', $rootel).infiniteScroll(url,
{
'limit': 12,
'q': query
},
'#discussionslibrary-template',
{
'initialContent': initialContent,
'postProcessor': function(data) {
// Let the template know whether or not the current list
// is a main list or a search list, as different paging
// keys need to be provided for each
data.query = query;
return data;
},
'emptyListProcessor': function() {

oae.api.util.template().render($('#discussionslibrary-noresults-template',
$rootel), {
'query': query
}, $('.oae-list', $rootel));
}
});
};

I can see that in "initialContent" variable is the commented part in the
discussionlibrary.html.
That is what I want to render. In fact I can render it, but not the way it
looks in "My Library"
I get a lot of problems with the variable "url" and "query", if I take
them out I think "infinityScroll" is not complete.
I also noticed that you have other files in the /3akai-ux/shared/oae/api
directory.
Could you please tell me if these files are important for my widget?
And also What is it that I am doing wrong?

Thanks in advanced
Jacqueline
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140319/7ee71ed2/attachment.html

Nicolaas Matthijs

2014-03-24 18:14:39 UTC

Permalink

Hi Jacqueline,

Would it be possible to share what you already have and also provide some more detail around how you?re trying to load this widget?

I can see that in "initialContent" variable is the commented part in the discussionlibrary.html.

`initialContent` corresponds to the first item in the list, which will be used to allow managers of the library to create new items. As you say, it is actually the output of an HTML template in the widget?s HTML file.

That is what I want to render. In fact I can render it, but not the way it looks in "My Library?

I?ll need some more information here, but it might be caused by not having the correct HTML and CSS structure for the list item component to work.

I get a lot of problems with the variable "url" and "query", if I take them out I think "infinityScroll" is not complete.

You definitely need the `url`, as it determines the REST endpoint that will be used to load the data shown in the list. For development purposes, this could also just point to a static JSON file.

I also noticed that you have other files in the /3akai-ux/shared/oae/api directory.

That directory contains all of the core OAE UI APIs. When your widget requires `oae.core` at the top, all of these APIs will be passed into your widget. You will definitely need this to be able to render templates, as that?s part of the OAE util API.

Hope that helps,
Nicolaas

Hi everyone.
I am trying to create a widget like discussionLibrary. I can't even get the bubble image in my widget.
I noticed that this part of the code does what I want
var initialContent = null;
if ((widgetData.canAdd || widgetData.canManage) && !query) {
initialContent = oae.api.util.template().render($('#discussionslibrary-list-actions-template', $rootel));
}
var url = '/api/discussion/library/' + widgetData.context.id;
if (query) {
url = '/api/search/discussion-library/' + widgetData.context.id;
}
// Set up the infinite scroll for the discussions library
infinityScroll = $('.oae-list', $rootel).infiniteScroll(url,
{
'limit': 12,
'q': query
},
'#discussionslibrary-template',
{
'initialContent': initialContent,
'postProcessor': function(data) {
// Let the template know whether or not the current list
// is a main list or a search list, as different paging
// keys need to be provided for each
data.query = query;
return data;
},
'emptyListProcessor': function() {
oae.api.util.template().render($('#discussionslibrary-noresults-template', $rootel), {
'query': query
}, $('.oae-list', $rootel));
}
});
};
I can see that in "initialContent" variable is the commented part in the discussionlibrary.html.
That is what I want to render. In fact I can render it, but not the way it looks in "My Library"
I get a lot of problems with the variable "url" and "query", if I take them out I think "infinityScroll" is not complete.
I also noticed that you have other files in the /3akai-ux/shared/oae/api directory.
Could you please tell me if these files are important for my widget?
And also What is it that I am doing wrong?
Thanks in advanced
Jacqueline
_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140324/e65a920c/attachment-0001.html

Jacqueline Ramos

2014-03-24 22:22:19 UTC

Permalink

Hi Nicolaas,

I couldn't solve that problem I had, but I started from scratch and right
now I am trying to do that floating window in the image. I noticed that is
another widget called "creatediscussion", and that calls other widgets. I
was wondering how does it appear.
I see that you have this button in "discussionlibrary" <button
type="button" class="btn oae-trigger-creatediscussion"> and that triggers
the selector in the creatediscussion with
var setUpCreateDiscussionModal = function() {
$(document).on('click', '.oae-trigger-creatediscussion',
function() {
$('#creatediscussion-modal', $rootel).modal({
'backdrop': 'static'
});
});

That is what I think its happening, because it won't work for me. Would you
please explain me how does that window appear?

On Mon, Mar 24, 2014 at 1:14 PM, Nicolaas Matthijs <

Post by Nicolaas Matthijs
Hi Jacqueline,
Would it be possible to share what you already have and also provide some
more detail around how you're trying to load this widget?
I can see that in "initialContent" variable is the commented part in the
discussionlibrary.html.
`initialContent` corresponds to the first item in the list, which will be
used to allow managers of the library to create new items. As you say, it
is actually the output of an HTML template in the widget's HTML file.
That is what I want to render. In fact I can render it, but not the way it
looks in "My Library"
I'll need some more information here, but it might be caused by not having
the correct HTML and CSS structure for the list item component to work.
I get a lot of problems with the variable "url" and "query", if I take
them out I think "infinityScroll" is not complete.
You definitely need the `url`, as it determines the REST endpoint that
will be used to load the data shown in the list. For development purposes,
this could also just point to a static JSON file.
I also noticed that you have other files in the /3akai-ux/shared/oae/api directory.
That directory contains all of the core OAE UI APIs. When your widget
requires `oae.core` at the top, all of these APIs will be passed into your
widget. You will definitely need this to be able to render templates, as
that's part of the OAE util API.
Hope that helps,
Nicolaas
Hi everyone.
I am trying to create a widget like discussionLibrary. I can't even get
the bubble image in my widget.
I noticed that this part of the code does what I want
var initialContent = null;
if ((widgetData.canAdd || widgetData.canManage) && !query) {
initialContent =
oae.api.util.template().render($('#discussionslibrary-list-actions-template',
$rootel));
}
var url = '/api/discussion/library/' + widgetData.context.id<http://widgetdata.context.id/>
;
if (query) {
url = '/api/search/discussion-library/' +
widgetData.context.id <http://widgetdata.context.id/>;
}
// Set up the infinite scroll for the discussions library
infinityScroll = $('.oae-list', $rootel).infiniteScroll(url,
{
'limit': 12,
'q': query
},
'#discussionslibrary-template',
{
'initialContent': initialContent,
'postProcessor': function(data) {
// Let the template know whether or not the current list
// is a main list or a search list, as different paging
// keys need to be provided for each
data.query = query;
return data;
},
'emptyListProcessor': function() {
oae.api.util.template().render($('#discussionslibrary-noresults-template', $rootel), {
'query': query
}, $('.oae-list', $rootel));
}
});
};
I can see that in "initialContent" variable is the commented part in the
discussionlibrary.html.
That is what I want to render. In fact I can render it, but not the way it
looks in "My Library"
I get a lot of problems with the variable "url" and "query", if I take
them out I think "infinityScroll" is not complete.
I also noticed that you have other files in the /3akai-ux/shared/oae/api directory.
Could you please tell me if these files are important for my widget?
And also What is it that I am doing wrong?
Thanks in advanced
Jacqueline
_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

--
Liliana Ramos
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140324/18a59873/attachment-0001.html
-------------- next part --------------
A non-text attachment was scrubbed...
Name: discussion.png
Type: image/png
Size: 144060 bytes
Desc: not available
Url : Loading Image...

Bert Pareyn

2014-03-25 09:37:26 UTC

Permalink

Hi Jacqueline,

You can read up more on triggers and selectors that load widgets at [1].
It is a widget development draft that already has everything you need to understand how widgets can be triggered using classes (or events).
In your example, ?oae-trigger-creatediscussion? is defined in the creatediscussion widget manifest file. Have a look at it and you?ll find it under selectors.
The ?floating window? you refer to is a Bootstrap modal. You can read more about it at [2]

I hope that helps getting you on your way, let us know if there are any more questions.

Bert

[1] https://github.com/oaeproject/3akai-ux/wiki/Widget-Development-%5BWIP%5D#manifestjs
[2] http://getbootstrap.com/2.3.2/javascript.html#modals

Post by Jacqueline Ramos
Hi Nicolaas,
I couldn't solve that problem I had, but I started from scratch and right now I am trying to do that floating window in the image. I noticed that is another widget called "creatediscussion", and that calls other widgets. I was wondering how does it appear.
I see that you have this button in "discussionlibrary" <button type="button" class="btn oae-trigger-creatediscussion"> and that triggers the selector in the creatediscussion with
var setUpCreateDiscussionModal = function() {
$(document).on('click', '.oae-trigger-creatediscussion', function() {
$('#creatediscussion-modal', $rootel).modal({
'backdrop': 'static'
});
});
That is what I think its happening, because it won't work for me. Would you please explain me how does that window appear?
Hi Jacqueline,
Would it be possible to share what you already have and also provide some more detail around how you?re trying to load this widget?

I can see that in "initialContent" variable is the commented part in the discussionlibrary.html.

That is what I want to render. In fact I can render it, but not the way it looks in "My Library?

I?ll need some more information here, but it might be caused by not having the correct HTML and CSS structure for the list item component to work.

I get a lot of problems with the variable "url" and "query", if I take them out I think "infinityScroll" is not complete.

You definitely need the `url`, as it determines the REST endpoint that will be used to load the data shown in the list. For development purposes, this could also just point to a static JSON file.

I also noticed that you have other files in the /3akai-ux/shared/oae/api directory.

Hi everyone.
I am trying to create a widget like discussionLibrary. I can't even get the bubble image in my widget.
I noticed that this part of the code does what I want
var initialContent = null;
if ((widgetData.canAdd || widgetData.canManage) && !query) {
initialContent = oae.api.util.template().render($('#discussionslibrary-list-actions-template', $rootel));
}
var url = '/api/discussion/library/' + widgetData.context.id;
if (query) {
url = '/api/search/discussion-library/' + widgetData.context.id;
}
// Set up the infinite scroll for the discussions library
infinityScroll = $('.oae-list', $rootel).infiniteScroll(url,
{
'limit': 12,
'q': query
},
'#discussionslibrary-template',
{
'initialContent': initialContent,
'postProcessor': function(data) {
// Let the template know whether or not the current list
// is a main list or a search list, as different paging
// keys need to be provided for each
data.query = query;
return data;
},
'emptyListProcessor': function() {
oae.api.util.template().render($('#discussionslibrary-noresults-template', $rootel), {
'query': query
}, $('.oae-list', $rootel));
}
});
};
I can see that in "initialContent" variable is the commented part in the discussionlibrary.html.
That is what I want to render. In fact I can render it, but not the way it looks in "My Library"
I get a lot of problems with the variable "url" and "query", if I take them out I think "infinityScroll" is not complete.
I also noticed that you have other files in the /3akai-ux/shared/oae/api directory.
Could you please tell me if these files are important for my widget?
And also What is it that I am doing wrong?
Thanks in advanced
Jacqueline
_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

--
Liliana Ramos
<discussion.png>_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140325/05d23dd9/attachment-0001.html
-------------- next part --------------
A non-text attachment was scrubbed...
Name: signature.asc
Type: application/pgp-signature
Size: 495 bytes
Desc: Message signed with OpenPGP using GPGMail
Url : http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140325/05d23dd9/attachment-0001.bin

Jacqueline Ramos

2014-03-31 17:17:51 UTC

Permalink

Thanks Bert

Post by Nicolaas Matthijs
Hi Jacqueline,
You can read up more on triggers and selectors that load widgets at [1].
It is a widget development draft that already has everything you need to
understand how widgets can be triggered using classes (or events).
In your example, 'oae-trigger-creatediscussion' is defined in the
creatediscussion widget manifest file. Have a look at it and you'll find it
under selectors.
The 'floating window' you refer to is a Bootstrap modal. You can read more
about it at [2]
I hope that helps getting you on your way, let us know if there are any more questions.
Bert
[1]
https://github.com/oaeproject/3akai-ux/wiki/Widget-Development-%5BWIP%5D#manifestjs
[2] http://getbootstrap.com/2.3.2/javascript.html#modals
Hi Nicolaas,
I couldn't solve that problem I had, but I started from scratch and right
now I am trying to do that floating window in the image. I noticed that is
another widget called "creatediscussion", and that calls other widgets. I
was wondering how does it appear.
I see that you have this button in "discussionlibrary" <button
type="button" class="btn oae-trigger-creatediscussion"> and that triggers
the selector in the creatediscussion with
var setUpCreateDiscussionModal = function() {
$(document).on('click', '.oae-trigger-creatediscussion', function() {
$('#creatediscussion-modal', $rootel).modal({
'backdrop': 'static'
});
});
That is what I think its happening, because it won't work for me. Would
you please explain me how does that window appear?
On Mon, Mar 24, 2014 at 1:14 PM, Nicolaas Matthijs <

Post by Nicolaas Matthijs
Hi Jacqueline,
Would it be possible to share what you already have and also provide some
more detail around how you're trying to load this widget?
I can see that in "initialContent" variable is the commented part in the
discussionlibrary.html.
`initialContent` corresponds to the first item in the list, which will be
used to allow managers of the library to create new items. As you say, it
is actually the output of an HTML template in the widget's HTML file.
That is what I want to render. In fact I can render it, but not the way
it looks in "My Library"
I'll need some more information here, but it might be caused by not
having the correct HTML and CSS structure for the list item component to
work.
I get a lot of problems with the variable "url" and "query", if I take
them out I think "infinityScroll" is not complete.
You definitely need the `url`, as it determines the REST endpoint that
will be used to load the data shown in the list. For development purposes,
this could also just point to a static JSON file.
I also noticed that you have other files in the /3akai-ux/shared/oae/api directory.
That directory contains all of the core OAE UI APIs. When your widget
requires `oae.core` at the top, all of these APIs will be passed into your
widget. You will definitely need this to be able to render templates, as
that's part of the OAE util API.
Hope that helps,
Nicolaas
Hi everyone.
I am trying to create a widget like discussionLibrary. I can't even get
the bubble image in my widget.
I noticed that this part of the code does what I want
var initialContent = null;
if ((widgetData.canAdd || widgetData.canManage) && !query) {
initialContent =
oae.api.util.template().render($('#discussionslibrary-list-actions-template',
$rootel));
}
var url = '/api/discussion/library/' + widgetData.context.id<http://widgetdata.context.id/>
;
if (query) {
url = '/api/search/discussion-library/' +
widgetData.context.id <http://widgetdata.context.id/>;
}
// Set up the infinite scroll for the discussions library
infinityScroll = $('.oae-list', $rootel).infiniteScroll(url,
{
'limit': 12,
'q': query
},
'#discussionslibrary-template',
{
'initialContent': initialContent,
'postProcessor': function(data) {
// Let the template know whether or not the current list
// is a main list or a search list, as different paging
// keys need to be provided for each
data.query = query;
return data;
},
'emptyListProcessor': function() {
oae.api.util.template().render($('#discussionslibrary-noresults-template', $rootel), {
'query': query
}, $('.oae-list', $rootel));
}
});
};
I can see that in "initialContent" variable is the commented part in the
discussionlibrary.html.
That is what I want to render. In fact I can render it, but not the way
it looks in "My Library"
I get a lot of problems with the variable "url" and "query", if I take
them out I think "infinityScroll" is not complete.
I also noticed that you have other files in the /3akai-ux/shared/oae/api directory.
Could you please tell me if these files are important for my widget?
And also What is it that I am doing wrong?
Thanks in advanced
Jacqueline
_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

--
Liliana Ramos
<discussion.png>_______________________________________________
oae-dev mailing list
oae-dev at collab.sakaiproject.org
http://collab.sakaiproject.org/mailman/listinfo/oae-dev

--
Liliana Ramos
-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://collab.sakaiproject.org/pipermail/oae-dev/attachments/20140331/2514c5da/attachment.html