YUILibrary - Open source JavaScript and CSS for building richly interactive software.
Fork YUI on GitHub

Board index » YUI 3 Gallery Forums: » Gallery Forums » YUI2 Wrapper

Page 1 of 1   [ 5 posts ]
New Topic | Post Reply | Print view

Alberto Santini

  • Username: icebox
  • Joined: Wed Sep 16, 2009 3:16 am
  • Posts: 34
  • IRC: icebox
  • Offline
  • Profile
Tags:

ConPA migration...

Post Posted: Wed Nov 25, 2009 11:55 am
+1-
I report my experience migrating ConPA [1] from yui2 to yui3.

At the moment the changes are in the dev environment, but as soon as possible the ported app will be deployed to the public environment.

My yui2 app can be simplified with the following code:

Code:
       
        YAHOO.widget.Chart.SWFURL =
            "http://yui.yahooapis.com/2.8.0r4/build/charts/assets/charts.swf";

        YAHOO.namespace("proplus.conpa");

        YAHOO.proplus.conpa.COOKIE = "proplus.conpa.basket";

        YAHOO.proplus.conpa.init = function () {
        // ...
        }       

        YAHOO.util.Event.onDOMReady(YAHOO.proplus.conpa.init);


Following the examples provided, I wrapped my yui2 app:

Code:
YUI({
    modules: {
        'gallery-yui2': {
            //~ fullpath: 'http://yui.yahooapis.com/gallery-2009.11.19-20/build/gallery-yui2/gallery-yui2-min.js',
            fullpath: 'http://caridy.github.com/examples/js-demo/gallery-yui2.js',
            requires: ['node-base', 'get', 'async-queue'],
            optional: [],
            supersedes: []
        }
    }
}).use('gallery-yui2', function (Y) {

    Y.yui2({
        modules: {
            'inputEx': {
                fullpath: "./js/inputex-min.js",
                requires: ["utilities",
                    "datasource",
                    "autocomplete",
                    "container",
                    "menu",
                    "button",
                    "calendar",
                    "json",
                    "swf",
                    "charts",
                    "cookie",
                    "datatable",
                    "slider",
                    "tabview"]
            }
        }
    }).use("connection", "inputEx", function () {

        YAHOO.widget.Chart.SWFURL =
            "http://yui.yahooapis.com/2.8.0r4/build/charts/assets/charts.swf";

        YAHOO.namespace("proplus.conpa");

        YAHOO.proplus.conpa.COOKIE = "proplus.conpa.basket";

        YAHOO.proplus.conpa.init = function () {
        // ...
        };

        Y.on("domready", YAHOO.proplus.conpa.init);

    });

});


It works nice.

Some notes.

- I use 'http://caridy.github.com/examples/js-demo/gallery-yui2.js' instead of 'http://yui.yahooapis.com/gallery-2009.11.19-20/build/gallery-yui2/gallery-yui2-min.js' because there are some issues with that version.

- Is a correct style wrap global variables as "YAHOO.something" in yui2 wrapper?
If I put the variable outside yui2.use() block YAHOO does not exist (correctly).

- if I add a custom css file as

Code:
        modules: {
            'inputEx': {
                fullpath: "./js/inputex-min.js",
                requires: ["inputEx-css",
                    "utilities",
                    "datasource",
                    "autocomplete",
                    "container",
                    "menu",
                    "button",
                    "calendar",
                    "json",
                    "swf",
                    "charts",
                    "cookie",
                    "datatable",
                    "slider",
                    "tabview"]
            },
            'inputEx-css': {
                fullpath: "./css/inputex-min.css",
                type: "css"
            }
        }


I get the following error:
other is undefined
http://yui.yahooapis.com/2.8.0r4/build/ ... der-min.js
Line 10


However yui2-gallery is a great piece of code. :)

Regards,
IceBox


[1] http://proplus.aptanacloud.com/ConPA/ConPA.html

Caridy Patino

YUI Contributor

  • Username: caridy
  • Joined: Mon Dec 08, 2008 5:40 pm
  • Posts: 349
  • Location: Miami, FL
  • Twitter: caridy
  • GitHub: caridy
  • Gists: caridy
  • IRC: caridy
  • YUI Developer
  • Offline
  • Profile
Tags:

Re: ConPA migration...

Post Posted: Wed Nov 25, 2009 6:27 pm
+0-
Hey Alberto,

Thanks for sharing your thoughts.

1. Yes, the push is pending since nov 19, should be ready in the next few days.
2. No, I don't think you need to use namespace anymore, unless your legacy code requires it. In YUI2 we normally do to avoid having global variables. In yui3 (with wrapper) you're coding within a sandbox, so you don't really need to add complexity.
3. About the CSS issue, I'm not so sure about this. It should works, I will try to check it later. Probably is because of the order. Try to put inputEx-css before the inputEx.

Best Regards,
Caridy

Alberto Santini

  • Username: icebox
  • Joined: Wed Sep 16, 2009 3:16 am
  • Posts: 34
  • IRC: icebox
  • Offline
  • Profile
Tags:

Re: ConPA migration...

Post Posted: Wed Nov 25, 2009 11:25 pm
+0-
Hello Caridy.

1. Ok.

2. I can reduce user namespace as "YAHOO.proplus.conpa", but a variable as YAHOO.widget.Chart.SWFURL is mandatory. I am in the case my legacy code requires it. Of course it would be good practice reducing the global variables to zero. :)

3. I think it was a my network issue, I think a timeout problem related with my mobile connection. At the moment there is no that issue.

Thanks for the support,
Alberto

Alberto Santini

  • Username: icebox
  • Joined: Wed Sep 16, 2009 3:16 am
  • Posts: 34
  • IRC: icebox
  • Offline
  • Profile
Tags:

Re: ConPA migration...

Post Posted: Thu Nov 26, 2009 10:24 am
+0-
Me again.

I have double checked the code: there is was no error because I didn't include "inputEx-css" as required item.
The stylesheet was not loaded.

Code:
    Y.yui2({
        insertBefore: 'styleoverrides',
        root: '2.8.0r4/build/',
        modules: {
            'inputEx': {
                fullpath: "./js/inputex-min.js",
                requires: ["inputEx-css", // I forgot this... copy/cut error :)
                    "utilities",
                    "datasource",
                    "autocomplete",
                    "container",
                    "menu",
                    "button",
                    "calendar",
                    "json",
                    "swf",
                    "charts",
                    "cookie",
                    "datatable",
                    "slider",
                    "tabview"]
            },
            'inputEx-css': {
                fullpath: "./css/inputex-min.css",
                type: "css"
            }
        }
    }).use("connection", "inputEx", function () {
...



Using

YAHOO_config = {
seed: 'yuiloader/yuiloader.js'
};

I get the following message:

other is undefined
http://yui.yahooapis.com/2.8.0r4/build/ ... iloader.js
Line 3327

---> if (mm.ext && mm.type == 'css' && !other.ext && other.type == 'css') {


I debugged it.

The stack trace:

anonymous("inputEx-css", "datemeth")yuiloader.js (line 3327)
anonymous("inputEx-css", "calendar")yuiloader.js (line 3311)
anonymous()yuiloader.js (line 3360)
anonymous(Object)yuiloader.js (line 2931)
anonymous(Object, Object name=type)yuiloader.js (line 3518)
anonymous()gallery-yui2.js (line 198)
anonymous()combo?3....e-min.js& (line 64)
anonymous()combo?3....e-min.js& (line 8)
anonymous(Object details=[1] type=execute target=Object)combo?3....e-min.js& (line 64)
anonymous([Object details=[1] type=execute target=Object 0=Object])combo?3....e-min.js& (line 38)
anonymous()combo?3....e-min.js& (line 37)
anonymous("execute")combo?3....e-min.js& (line 38)
anonymous(function())combo?3....e-min.js& (line 64)
anonymous()combo?3....e-min.js& (line 64)
anonymous()combo?3....ui-min.js (line 10)
[Break on this error] if (mm.ext && mm.type ==...&& !other.ext && other.type == 'css') {\n


What is "datemeth" (sic!)? Have I been missing anything?



Thanks,

Alberto

Alberto Santini

  • Username: icebox
  • Joined: Wed Sep 16, 2009 3:16 am
  • Posts: 34
  • IRC: icebox
  • Offline
  • Profile
Tags:

Re: ConPA migration...

Post Posted: Thu Nov 26, 2009 11:28 am
+0-
I found the following ticket:

Dynamic loading (by YUILoader) fails for calendar:
http://yuilibrary.com/projects/yui2/ticket/2528474

Regards,
IceBox
Page 1 of 1   [ 5 posts ]
New Topic | Post Reply | Print view
Display posts from previous:  Sort by  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
YUI 3.1.2 is an important security update for all YUI 3.1.x and 3.2.0pr1 implementers.

Recent Forums Posts

Recent YUI Blog Posts

Latest YUI Theater Videos

Online Users