SpiffyUI debug in eclipse save changes problem

24 views
Skip to first unread message

rao...@gmail.com

unread,
Jan 30, 2013, 10:22:05 AM1/30/13
to spif...@googlegroups.com
Hello,

I developed an application (using SpiffyUI mvsbsample) by replacing colors and codes by a custom database. It works nicely. But I want to make some changes to its original look.
Say I want to turn black background to blue. I am not able to figure out what are exact steps needed to debug SpiffyUI application in eclipse. I run mvn and jetty from dos and
open project(in development mode) in eclipse. I installed GWT developer plugin for chrome and use its developer tools. At this point I get confused since I am not able to figure out
how to make changes to the project and save them. I request for help.

Regards.

Rao

Zack Grossbart

unread,
Jan 30, 2013, 10:53:55 AM1/30/13
to spif...@googlegroups.com
Hello Rao,

Thanks for using Spiffy UI.

We have a video that shows you how to set up debug mode with Spiffy UI. You
can see it on our dev mode page here:

http://www.spiffyui.org/?hostedMode

However, if you're interested in changing the look and feel of the MVSB
control you would do that from CSS. You can use a tool like Firebug to
inspect the CSS of the MVSB control and see what you want to change.

Thanks,
Zack
--
You received this message because you are subscribed to the Google Groups
"Spiffy UI" group.
To unsubscribe from this group and stop receiving emails from it, send an
email to spiffy-ui+...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

Marcos Lilljedahl

unread,
Jan 30, 2013, 12:31:00 PM1/30/13
to spif...@googlegroups.com
Hi Rao, 

You also have the $PROJECT_devmode_embeded.launch file wich comes with the the project creator that allows you to debug your GWT application without running ant or maven outside eclipse.

Just install the GWT Eclispe plugin, set up your project to use GWT capabilities and execute the launcher as a GWT application.

Regards, 

Marcos.

rao...@gmail.com

unread,
Jan 31, 2013, 9:31:43 AM1/31/13
to spif...@googlegroups.com
Hello,

Thanks for your quick replies. I am enclosing an image of my application here. Please notice '?' at left upper corner which resides in a html <body> and disappears upon deletion.
This change is not sustained after reloading browser. Firebug tells that it is coming from MvsbSampleUI_min.CSS (line1). I cannot figure out how to effect
this change in the code. Also there are several files(html,CSS,js and xml). I am not an expert in CSS but would you please help me to understand how it works?.

Please help.

Best regards

Rao
image.png

Zack Grossbart

unread,
Jan 31, 2013, 10:00:23 AM1/31/13
to spif...@googlegroups.com
Hello Rao,

You're seeing a strange line number because you're using the compiled
version of the CSS. There's another file you can load called
index-debug.html. You can load it by putting /index-debug.html at the end
of your URL.

index-debug.html uses the uncompressed CSS so you should get some better
line numbers. Hopefully that will help you use Firebug and figure out
what's going on in your project.

Bess Siegal

unread,
Jan 31, 2013, 10:14:30 AM1/31/13
to spif...@googlegroups.com
Rao,
If it is the MvsbSamples project, there isn't an index-debug.html -- sorry.  But you could try changing the MvsbSamples.css file and rebuilding and redeploying.  As Zack suggested earlier, if you use something like Firebug or Chrome Developer tools, you can right click on the element you would like to style differently and choose Inspect Element.  You can then go about tweaking the css live.  Once you have your desired styles copy then back into MvsbSamples.css

I couldn't tell from your screenshot what you were trying to change. 
Best,
Bess

rao...@gmail.com

unread,
Feb 2, 2013, 5:22:40 AM2/2/13
to spif...@googlegroups.com
Thanks.
What is the correct syntax for this line from index.html?

<script>if ( typeof window.JSON === 'undefined' ) { document.write('<script src="org.spiffyui.mvsb.samples.index/js/lib/json2.js"></script>'); }</script>

I see these characters in browser: ');}  and if I do ".js"><\/script>" ? appears.

Regards.

Rao

Zack Grossbart

unread,
Feb 2, 2013, 1:23:30 PM2/2/13
to spif...@googlegroups.com
Hi Rao,

It should look like this:

<script>if ( typeof window.JSON === 'undefined' ) { document.write('<script
src="js/lib/json2.js"><\/script>'); }</script>

It looks like your syntax is correct. By the way... You can remove this
line if you don't need to support IE8.

-Zack
Reply all
Reply to author
Forward
0 new messages