<script type="text/javascript" src="http://api.msappspace.com/AppRendering/js/jquery-1.2.1.min.js"></script>
<script type="text/javascript" src="http://api.msappspace.com/AppRendering/js/jquery.ui-1.0/ui.tabs.js"></script>
<script type="text/javascript" src="http://api.msappspace.com/AppRendering/js/jquery.ui-1.0/ui.dialog.js"></script>
<script type="text/javascript" src="http://api.msappspace.com/AppRendering/js/jquery.ui-1.0/ui.resizable.js"></script>
<script type="text/javascript" src="http://api.msappspace.com/AppRendering/js/jquery.ui-1.0/ui.mouse.js"></script>
<script type="text/javascript" src="http://api.msappspace.com/AppRendering/js/jquery.ui-1.0/ui.draggable.js"></script>
<script type="text/javascript" src="http://www.viphaklay.com/jquery/plugins/dimensions_1.2/jquery.dimensions.min.js"></script>

<style type="text/css">
                @import url("http://api.msappspace.com/AppRendering/js/jquery.ui-1.0/themes/flora/flora.all.css");
</style>

<!--[if IE 6]>
<style type="text/css">
                #my-tabs {
                padding-bottom: 20px;
                }

</style>
<![endif]-->

<!--[if IE 7]>
<style type="text/css">
                #my-tabs {
                padding-bottom: 24px;
                }
</style>
<![endif]-->



                <div id="my-tabs" class="flora">
            <ul id="tabList">
                <li><a href="#my-tab1"><span>Tab1</span></a></li>
                <li><a href="#my-tab2"><span>Tab2</span></a></li>
                <li><a href="#my-tab3"><span>Tab3</span></a></li>
            </ul>

            <div id="my-tab1">
                                ahhhhhhhhhhh
            </div>
            <div id="my-tab2">
                                yay!
            </div>
            <div id="my-tab3">
                                wahoooo!
            </div>
                </div>
        

<input id="showLink" type="button" value="show me" />

<span id="divSurprise" style="display:none; border:1px solid black">
Surprise!
<img src="http://www.viphaklay.com/jquery/spinner.gif"/>
<img src="http://www.viphaklay.com/jquery/spinner.gif"/>
<img src="http://www.viphaklay.com/jquery/spinner.gif"/>
<img src="http://www.viphaklay.com/jquery/spinner.gif"/>
<img src="http://www.viphaklay.com/jquery/spinner.gif"/>
</span>

<div id="my-dialog" class="flora" title="vipy rules">Drag me somwhere!</div>


<script type='text/javascript'>

  $(document).ready(function(){

    $("#my-tabs > ul").tabs();

    $("#my-dialog").dialog({ height: 100, width: 100});

    $("#showLink").click(function () {
                if ($("#showLink").val() == "show me") {
                                $("#showLink").val("hide me");
                } else {
                                $("#showLink").val("show me");
                }

        $("#divSurprise").toggle("slow");
    });
    
  });

</script>

excellent!!! includes jquery support!

Question...

If I point my browser at the flora css you are using.. it then imports a number of other CSS files.

If I then point my browser to each of those.. and download all that CSS.. and then combine that CSS into 1 file....

 It seems that if I then point the URL for the CSS to my new "combined .CSS".. the above example doesn't work.  The tabs never show up.

How does that make sense :)?

 Lack of coffee FTW.

Got it :) 

viphak@myspace:

<script type="text/javascript" src="http://www.viphaklay.com/jquery/plugins/dimensions_1.2/jquery.dimensions.min.js"></script>

Are we allowed to import script like that? I have an app that needs to import some js for jquery's plugins and currently everything is working fine. However, I'm afraid that such behavior might be restricted later and my code will no longer work.

 What will be the future restrictions of eval?

Currently I can do a makeRequest, to get back some JSON, the defines functions.. I can eval that ot an object to call them.  This allows me to dynamically change the behavior of my app without having to come login here and edit in the 10pixel editor window hehe.

I guess the bigger question.. is what is the timeline for the "regulations" to be in place, and what is a good definition of them.  I am, as most are, very excited about developing on this platform and seeing what cool things can be done.  But right now it really is a huge mystery... at least to me.

will jquery always be supported in this way?

Are there any other libraries or other extras that we can use? 

Please excuse me if this has already been mentioned elsewhere but I haven't been able to find it and this thread seems like a good place to ask. In trying to design an app that will work across many open social containers it's very helpful to understand exactly what the rules of enngagement are. I understand that referencing external javascript is going to be a no-no but that for now it works.

 What is the story for how to get javascript into your myspace app? It can't be pasting it all into a textarea. That's not a sustainable model. With regards to the specific eval example in this thread, Orkut has support for gadget.json.parse and stringify for the purpose of going to and from JSON. Will MySpace have that support as well? Am I missing where in the API this currently exists?

As far as caja goes I've downloaded the spec but haven't dove into it yet. Will you guys put out a simplified set of rules for the javascript that will pass through the "cajoler"?

I know you're figuring all this stuff out but if you have any insight into some of the expected architecture we can bank on going forward it makes it a little easier to work on creating apps that will be ready to go when you guys are. At the very least I hope my questions will help you guys know what knowledge is needed out here in developer land.

 Thanks and hope to see some of you at the upcoming SF event.

-Michael 

It's great that it seems like you guys will support jQuery, but doesn't look like Caja likes it right now, I put just one line in my app:

 <script type="text/javascript" src="http://api.msappspace.com/AppRendering/js/jquery-1.2.1.min.js"></script>

 Caja did not like a lot of stuff in jquery.min.js.

 So how are we gonna test our js to make sure it will be Caja-friendly?

Has anyone tested this JQuery example in IE7?

Please, take a look at http://developer.myspace.com/Community/forums/t/3277.aspx  

Thanks!

Carolina 

viphak@myspace:

<script type="text/javascript" src="http://www.viphaklay.com/jquery/plugins/dimensions_1.2/jquery.dimensions.min.js"></script>

I just got told that my app can not be approved because it is referencing js from external sites. If I include this will my app be denied? Or is there a location on api.msappspace.com that has dimensions on it?