Create/Update Action Bar Dynamically #311

Closed
tneil opened this Issue Aug 30, 2012 · 28 comments

Comments

Projects
None yet
10 participants
@tneil
Member

tneil commented Aug 30, 2012

Create and modify an action bar dynamically after the screen has been inserted into the DOM

For the Action Bar:

  • show() [Completed]
  • hide() [Completed]
  • setSelectedTab(action) [Completed]
  • setBackCaption(caption) [Completed]

For an Action:

  • show() [Complete]
  • hide() [Complete]
  • setCaption(text) [Completed]
  • getCaption(); [Completed]
  • getAccentText();
  • setAccentText(value);
  • setImage(img) [Completed]
  • getImage(); [Completed]
  • enable() // Excludes tabs, tabs shouldn't be disabled, but the method will be stubbed out so there isn't an undefined error
  • disable() // Excludes tabs, tabs shouldn't be disabled, but the method will be stubbed out so there isn't an undefined error

General

  • Add sample page to show how to manipulate the control with JavaScript [Completed]

tneil pushed a commit that referenced this issue Sep 8, 2012

@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Sep 8, 2012

Member

setCaption() and setImage() have now been added for Action Items

Member

tneil commented Sep 8, 2012

setCaption() and setImage() have now been added for Action Items

tneil pushed a commit that referenced this issue Nov 6, 2012

Tim Neil
Merge pull request #441 from lyricidal/next
Added setBackCaption to Action Bars #311, setOnCaption/setOffCaption to Toggle Buttons #315 and added show, hide, remove to Scroll Panels
@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Nov 6, 2012

Member

ActionBar setBackCaption() has now been implemented

Member

tneil commented Nov 6, 2012

ActionBar setBackCaption() has now been implemented

@rrenna

This comment has been minimized.

Show comment Hide comment
@rrenna

rrenna Nov 28, 2012

using setCaption() on an action seems to break my ActionBar, not sure if it's a mistake somewhere in my code or not. Leaving the Action bar to be labelled declaratively works perfectly.

rrenna commented Nov 28, 2012

using setCaption() on an action seems to break my ActionBar, not sure if it's a mistake somewhere in my code or not. Leaving the Action bar to be labelled declaratively works perfectly.

@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Nov 30, 2012

Member

Can you explain more what you're referring to by break?

Are you able to post a screenshot of what you are seeing?

Can you list the device and OS version combination that you are using?

The examples in the bbUI samples for action bar manipulation are working, so I'm wondering what you're seeing.

Member

tneil commented Nov 30, 2012

Can you explain more what you're referring to by break?

Are you able to post a screenshot of what you are seeing?

Can you list the device and OS version combination that you are using?

The examples in the bbUI samples for action bar manipulation are working, so I'm wondering what you're seeing.

@rrenna

This comment has been minimized.

Show comment Hide comment
@rrenna

rrenna Nov 30, 2012

The issue was on my end, I'll update the comment to avoid confusion. Thanks Tim.

rrenna commented Nov 30, 2012

The issue was on my end, I'll update the comment to avoid confusion. Thanks Tim.

@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Dec 1, 2012

Member

Added setSelectedTab(), getCaption(),getImage()

Member

tneil commented Dec 1, 2012

Added setSelectedTab(), getCaption(),getImage()

@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Dec 19, 2012

Member

Added show() and hide()

Member

tneil commented Dec 19, 2012

Added show() and hide()

@mtfranchetto

This comment has been minimized.

Show comment Hide comment
@mtfranchetto

mtfranchetto Dec 20, 2012

I'm a BB10 developer, when are you planning to release this updates?

appendAction(action)
insertActionBefore(newAction, existingAction)

Thanks

I'm a BB10 developer, when are you planning to release this updates?

appendAction(action)
insertActionBefore(newAction, existingAction)

Thanks

@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Dec 21, 2012

Member

It will likely be sometime in January

Member

tneil commented Dec 21, 2012

It will likely be sometime in January

@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Jan 18, 2013

Member

Started work on the show(), hide()... Keeping a todo list here..

  • Simple show/hide on action button [Complete]
  • Add data-bb-visible attribute for initial action visibility [Complete]
  • Simple show/hide on action overflow item [Complete]
  • Add data-bb-visible attribute for initial action overflow item visibility [Complete]
  • Simple show/hide on tab [Complete]
  • Add data-bb-visible attribute for initial tab visibility [Complete]
  • Simple show/hide on tab overflow item [Complete]
  • Add data-bb-visible attribute for initial tab overflow item visibility [Complete]
  • Handle shadowing on action overflow button when tab appears/disappears beside it [Complete]
  • General glitches with action overflow button issues when dynamically changing tab/action visibility [Complete]
Member

tneil commented Jan 18, 2013

Started work on the show(), hide()... Keeping a todo list here..

  • Simple show/hide on action button [Complete]
  • Add data-bb-visible attribute for initial action visibility [Complete]
  • Simple show/hide on action overflow item [Complete]
  • Add data-bb-visible attribute for initial action overflow item visibility [Complete]
  • Simple show/hide on tab [Complete]
  • Add data-bb-visible attribute for initial tab visibility [Complete]
  • Simple show/hide on tab overflow item [Complete]
  • Add data-bb-visible attribute for initial tab overflow item visibility [Complete]
  • Handle shadowing on action overflow button when tab appears/disappears beside it [Complete]
  • General glitches with action overflow button issues when dynamically changing tab/action visibility [Complete]

@tneil tneil referenced this issue Jan 19, 2013

Closed

Screen Management #616

@gcsantiago

This comment has been minimized.

Show comment Hide comment
@gcsantiago

gcsantiago Jan 20, 2013

Simple show/hide on action button [Complete]

👍 stay walking... i will follow :)

Simple show/hide on action button [Complete]

👍 stay walking... i will follow :)

@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Jan 21, 2013

Member

First revisions for show, hide for actions/tabs that are not in the overflow menus are checked in.. there are still bugs with the action overflow button appearing/disappearing when you sometimes call show,hide on the items. I think this is a padding issue where the action overflow button wraps to the below the action bar.

But if you aren't using the action overflow menu on your action bar, this first check-in should work not too bad. Still more work to do

Member

tneil commented Jan 21, 2013

First revisions for show, hide for actions/tabs that are not in the overflow menus are checked in.. there are still bugs with the action overflow button appearing/disappearing when you sometimes call show,hide on the items. I think this is a padding issue where the action overflow button wraps to the below the action bar.

But if you aren't using the action overflow menu on your action bar, this first check-in should work not too bad. Still more work to do

@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Jan 22, 2013

Member

Checked in some progress.. the darn show/hide for main actions/tabs on the action bar are giving me grief. Especially when you have tab/action overflow buttons. Combine that with the initial data-bb-visible attribute and it's a bit of a mess.

I'm going to have to do some major surgery on the action sizing code. But I have some ideas on how I can structure it to make things simpler than they are now.

Member

tneil commented Jan 22, 2013

Checked in some progress.. the darn show/hide for main actions/tabs on the action bar are giving me grief. Especially when you have tab/action overflow buttons. Combine that with the initial data-bb-visible attribute and it's a bit of a mess.

I'm going to have to do some major surgery on the action sizing code. But I have some ideas on how I can structure it to make things simpler than they are now.

@gcsantiago

This comment has been minimized.

Show comment Hide comment
@gcsantiago

gcsantiago Jan 22, 2013

never retreat, never surrender ! I appreciate your effort, and will be highlighted with my app behavior ! Thanks

never retreat, never surrender ! I appreciate your effort, and will be highlighted with my app behavior ! Thanks

@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Jan 23, 2013

Member

Making some pretty good progress today on the button/tab show and hide functions. Still some more tweaking yet, but I'm getting closer :o)

Member

tneil commented Jan 23, 2013

Making some pretty good progress today on the button/tab show and hide functions. Still some more tweaking yet, but I'm getting closer :o)

@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Jan 23, 2013

Member

Dynamic show/hide of actions is now checked in. The wiki has also been updated. All that we have left for action bars is enabled/disabled states for buttons :o)

Giddy-up!!

Member

tneil commented Jan 23, 2013

Dynamic show/hide of actions is now checked in. The wiki has also been updated. All that we have left for action bars is enabled/disabled states for buttons :o)

Giddy-up!!

tneil pushed a commit that referenced this issue Jan 23, 2013

@andreyavram

This comment has been minimized.

Show comment Hide comment
@andreyavram

andreyavram Jan 24, 2013

Very good news! Thanks Tim!

Very good news! Thanks Tim!

@achan

This comment has been minimized.

Show comment Hide comment
@achan

achan Jan 26, 2013

Is appending actions to the action bar still on the road map? Any suggestions on how to do this in the meantime?

I am adding tabs to the actionbar from onscreenready... is that supposed to work? The web inspector shows that my divs have been appended to the actionbar, but they are unprocessed.

achan commented Jan 26, 2013

Is appending actions to the action bar still on the road map? Any suggestions on how to do this in the meantime?

I am adding tabs to the actionbar from onscreenready... is that supposed to work? The web inspector shows that my divs have been appended to the actionbar, but they are unprocessed.

@splatterb0y

This comment has been minimized.

Show comment Hide comment
@splatterb0y

splatterb0y Jan 27, 2013

@achan
It will work if you add the markup in the onscreenready event, but not if you add it in the ondomready event because at this point all the markup is already processed by bbUI.js

 bb.init({onscreenready : function(element, id, params) {
        // Markup generated here will be processed by bbUI.js

       // Add markup with jQuery Example
       $("#selector", element).append('<input type="text"></input>');
     },
     ondomready: function(element, id, params) {
         // Markup generated here is not touched by bbUI.js
     }});
}, false);

@achan
It will work if you add the markup in the onscreenready event, but not if you add it in the ondomready event because at this point all the markup is already processed by bbUI.js

 bb.init({onscreenready : function(element, id, params) {
        // Markup generated here will be processed by bbUI.js

       // Add markup with jQuery Example
       $("#selector", element).append('<input type="text"></input>');
     },
     ondomready: function(element, id, params) {
         // Markup generated here is not touched by bbUI.js
     }});
}, false);
@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Jan 27, 2013

Member

Correct, you should be able to manipulate adding/removing items in the onscreenready event. For the foreseeable future, I don't see the ability to add/remove/insert functions being available.

Member

tneil commented Jan 27, 2013

Correct, you should be able to manipulate adding/removing items in the onscreenready event. For the foreseeable future, I don't see the ability to add/remove/insert functions being available.

@rodnolan

This comment has been minimized.

Show comment Hide comment
@rodnolan

rodnolan Jan 27, 2013

Contributor

This will work if you're hard coding the elements you want to add but you run into the issue described by @achan if you try to async load the page fragment. Maybe this idea #643 would solve that.

Contributor

rodnolan commented Jan 27, 2013

This will work if you're hard coding the elements you want to add but you run into the issue described by @achan if you try to async load the page fragment. Maybe this idea #643 would solve that.

@achan

This comment has been minimized.

Show comment Hide comment
@achan

achan Jan 27, 2013

That was exactly what I was doing @rodnolan. My temporary solution was to load the objects that would represent my tabs into localStorage and pull them from there in onscreenready.

achan commented Jan 27, 2013

That was exactly what I was doing @rodnolan. My temporary solution was to load the objects that would represent my tabs into localStorage and pull them from there in onscreenready.

@splatterb0y

This comment has been minimized.

Show comment Hide comment
@splatterb0y

splatterb0y Feb 17, 2013

Can you please add the set/getAccentText?

Can you please add the set/getAccentText?

@bert2002

This comment has been minimized.

Show comment Hide comment
@bert2002

bert2002 Mar 8, 2013

Will it be possible to change the onclick event after the screen has been inserted into the DOM?

bert2002 commented Mar 8, 2013

Will it be possible to change the onclick event after the screen has been inserted into the DOM?

@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Mar 8, 2013

Member

@bert2002 you should be able to do that now by re-assigning the onclick

document.getElementById('myaction').onclick = function() {alert('hello world');};
Member

tneil commented Mar 8, 2013

@bert2002 you should be able to do that now by re-assigning the onclick

document.getElementById('myaction').onclick = function() {alert('hello world');};
@bert2002

This comment has been minimized.

Show comment Hide comment
@bert2002

bert2002 Mar 8, 2013

@tneil oh that was easy and working as you said :) many thanks

bert2002 commented Mar 8, 2013

@tneil oh that was easy and working as you said :) many thanks

@T-M-C

This comment has been minimized.

Show comment Hide comment
@T-M-C

T-M-C Apr 20, 2013

+1 for setAccentText(value)

T-M-C commented Apr 20, 2013

+1 for setAccentText(value)

@tneil

This comment has been minimized.

Show comment Hide comment
@tneil

tneil Jul 5, 2013

Member

Closing this issue in favor of the new v1.0 markup and associated JavaScript interfaces based on issue #933

Member

tneil commented Jul 5, 2013

Closing this issue in favor of the new v1.0 markup and associated JavaScript interfaces based on issue #933

@tneil tneil closed this Jul 5, 2013

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment