Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Reply
Developer
Posts: 107
Registered: ‎02-10-2012
My Device: Limited Developer Edition
My Carrier: WiFi

[HELP] bbUi.js

Heeey pals, im diving into bbUi.js but i cant figure out how get it working it just seems like plain text (no UI)

Heres a screenshot what i get in ripple... 

 

 

bbui.png

 

 

And this is the source code... as you can see im callin the css, js and using the bb.init() command so whats wrong?

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="bbui-0.9.2.css" rel="stylesheet" type="text/css">
<link href="css/tabs.css" rel="stylesheet" type="text/css">
 <script type="text/javascript">
bb.init()
</script>
</head>
<body>

<script id="bbmBubblesJS" src="js/bbmBubbles.js?2" onunload="unloadPushListeners()"></script>
<div data-bb-type="screen" data-bb-effect="fade">
	<div data-bb-type="title" data-bb-caption="BBM Bubbles" data-bb-back-caption="Back" ></div>

	<div id="chatWindow">
		<div data-bb-type="bbm-bubble" data-bb-style="right">
			<div data-bb-type="item" data-bb-img="images/bbmBubbles/bullet.png">My car just broke down and I have one million things to do!!</div> 
			<div data-bb-type="item" data-bb-img="images/bbmBubbles/bullet.png">Why can&apos;t groceries just come to you?</div> 
		</div>
		<div data-bb-type="bbm-bubble" data-bb-style="left">
			<div data-bb-type="item" data-bb-img="images/bbmBubbles/read.png">The big island was fun.. We were there for our honeymoon.  One side of the island is pretty much desert grass and volcano ash, and the other side is rainforest</div> 
		</div>
		<div data-bb-type="bbm-bubble" data-bb-style="right">
			<div data-bb-type="item" data-bb-img="images/bbmBubbles/bullet.png">Neat! I am seriously considering it</div> 
		</div>
		<div data-bb-type="bbm-bubble" data-bb-style="left">
			<div data-bb-type="item" data-bb-img="images/bbmBubbles/read.png">It's pretty cool, as you drive through the black volcanic ash.. People have brought white rocks and spelled their names.  It's like grafiti made out of rocks</div> 
			<div data-bb-type="item" data-bb-img="images/bbmBubbles/read.png">Some cool artwork too</div> 
		</div>
		<div data-bb-type="bbm-bubble" data-bb-style="right">
			<div data-bb-type="item" data-bb-img="images/bbmBubbles/bullet.png">Cool!! I'll have to check that out</div> 
		</div>
	</div>
	<div data-bb-type="action-bar" data-bb-back-caption="Back"></div>
</div>


</body>
</html>

 Thanks.

If i've helped you use the like button (KUDOS)!
Follow me at twitter: @hektorc
Read my blog: http://hektor.in
Check my GitHub: github.com/hektorcyc
Highlighted
Developer
Posts: 314
Registered: ‎03-28-2012
My Device: Curve 9360, Playbook, BB10 Dev Alpha
My Carrier: TMN

Re: [HELP] bbUi.js

Your content should be on a different html file.

Then you need to have bbUI to push the html file to the screen, only then it applies the styling.

Check the index.html and menu.html in the bbUI examples

Nuno