Getting loading panel to disappear - two Xinhas on page

rylan76 · 2010-11-25 09:05:46

Hi Guys

I'm having problems with two Xinha areas on one page. One is immediately loaded and set up, the other must be hidden until a user clicks on a dropdown.

Everything works fine, except the second, hidden Xinha's "loading..." message remains visible (at "Finishing..."), no matter what I do. I simply can't get the second Xinha's loading message to disappear, -until- I click on the dropdown and the hidden area's generate() is actually called.

Obviously, if users are on the page and they do not click on the dropdown, I do not want a spurious Xinha loading notification to hang around until, maybe, they click on the dropdown.

Here's my config:

xinha_init = xinha_init ? xinha_init : function()
        {
        xinha_editors = xinha_editors ? xinha_editors :
        [
         'content_area_contents',
         'poll_contents'
         ];
.
.
.
xinha_editors.content_area_contents.generate();
        }

    Xinha._addEvent(window,'load', xinha_init);

and then, the onclick for the dropdown does this:

echo "if (poll_editor_started == 0)\n";

  echo "{\n";

  echo "poll_editor_started = 1;\n";

  echo "xinha_editors.poll_contents.generate();\n";

  echo "}\n";

  echo "}\n";

The problem is that the poll_contents textarea's Xinha loading block stays visible forever, until the above generate is executed-on-click on the dropdown.

I suppose my question is then how can I have the FIRST Xinha textarea show the "loading..." panel, but NOT the second one, or, alternatively, how can I hide the second Xinha textarea's "loading..." panel, other than clicking on the dropdown and thus executing its generate() func, which removes the "loading..." panel only on completion?

Thanks!

ejucovy · 2010-11-25 10:20:31

There's a `xinha_config.showLoading` option which might do what you want. You could try setting `xinha_config.showLoading = false` for the second editor (but not the first - you'd need to have two separate configuration objects).

If that doesn't do what you want, you could also generate both editors on page load, but also use javascript to set display:none for the element containing the second one until the right event occurs.

gogo · 2010-11-25 18:37:27

Agree, hide the loading with the config option, I never use it.

Also, you need to have the textarea displayed (visible) when doing generate, sounds like you already do, but just make sure, otherwise things tend to get screwy.

rylan76 · 2010-11-26 03:00:45

ejucovy wrote:

There's a `xinha_config.showLoading` option which might do what you want. You could try setting `xinha_config.showLoading = false` for the second editor (but not the first - you'd need to have two separate configuration objects).
If that doesn't do what you want, you could also generate both editors on page load, but also use javascript to set display:none for the element containing the second one until the right event occurs.

Hi

Thanks for the reply! However, my instance of Xinha completely ignores

xinha_config.showLoading = false;

I've set it like this:

xinha_config = xinha_config ? xinha_config() : new Xinha.Config()
.
.
.
xinha_config.colorPickerCellSize = "12px";

xinha_config.undoSteps = 40;

xinha_config.showLoading = false; <------

xinha_config.CharacterMap.mode = 'panel'
.
.
.
xinha_editors.content_area_contents.config.width = '640px';

xinha_editors.content_area_contents.config.height = '440px';

xinha_editors.poll_contents.config.width = '640px';
xinha_editors.poll_contents.config.height = '240px';

xinha_editors.content_area_contents.generate();

Both the immediately generated area and the deferred-generation area have their Loading messages display just as if I specified xinha_config.showLoading = true or as if I've left it at default.

Any other ideas? This seems very simple, but it apparently isn't been at it for two whole working days now.

I've managed to find the layer node for the Loading message and just delete that node - which has the correct visual effect I want - but doing this crashes something in Xinha itself and I get Javascript errors on the page.

Thanks for the help!

rylan76 · 2010-11-26 03:10:03

gogo wrote:

Agree, hide the loading with the config option, I never use it.
Also, you need to have the textarea displayed (visible) when doing generate, sounds like you already do, but just make sure, otherwise things tend to get screwy.

Yep, that's the problem. The xinha area that must be "hidden-until-click" is in a table for which I set the containing TR to display:none. If you then set that containing TR to display:block in IE (or display:table-row in FF) on click of the controlling page element (a dropdown) the Xinha comes up but is "white" - not working, and doesn't respond to a click on it so you can start typing. It's completely locked, you have to reload the page and make sure that the containing TR is NOT set to display:none at the time when that Xinha is generated.

This has been rather easily solved by delaying generation of the hidden xinha until the controlling page element is clicked to set all the table's TRs to display:block / display:table-row, and it works. First set the Xinha-containing TR to display:block / table-row, THEN call generate() on it.

This works 100%, EXCEPT for the fact that the "Loading" for this delayed-generation hidden-until-cick Xinha keeps floating around forever - until you call generate()... and I simply cannot get that "Loading" layer to not display, or alternatively, to appear only when generate() is called, and then disappear when generate() finishes.

Any further comments appreciated!

Thanks you very much.

gogo · 2010-11-26 04:42:44

I would guess that your config is happening too late in the process (so loading has already started when you set showLoading = false)

Change it in the XinhaCore.js itself.

rylan76 · 2010-11-26 05:42:10

gogo wrote:

I would guess that your config is happening too late in the process (so loading has already started when you set showLoading = false)
Change it in the XinhaCore.js itself.

Ok, I tried to do that, only to find that it is ALREADY set to false by default...?

Oh gods.

Maybe something with how I start it all up is wrong somehow. Here's how I start it all up:

xinha_init = xinha_init ? xinha_init : function()
        {
        xinha_editors = xinha_editors ? xinha_editors :
        [
         'content_area_contents',
         'poll_contents'
         ];
  
        xinha_plugins = xinha_plugins ? xinha_plugins :
        [
         'CharacterMap',
         'ContextMenu',
         'Linker',
         'SuperClean',
         'EditTag','ListType'
         ];
  
        if(!Xinha.loadPlugins(xinha_plugins, xinha_init)) return;

        xinha_config = xinha_config ? xinha_config() : new Xinha.Config();

        xinha_config.showLoading = false;
             
        xinha_config.pageStyleSheets = ["../css/fwf_cms_stylesheet.css"];

        xinha_config.pageStyle = ["body {margin-left: 0px;margin-top: 0px;margin-right: 0px;margin-bottom: 0px;font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 10px;line-height: 14px;background-color: #e8e8e8;}"];

        xinha_config.toolbar = [
                    ["popupeditor"],
                    ["separator","formatblock","fontsize","bold","italic","underline","strikethrough"],
                    ["separator","forecolor","hilitecolor","textindicator"],
                    ["separator","subscript","superscript"],
                    ["linebreak","separator","justifyleft","justifycenter","justifyright","justifyfull"],
                    ["separator","insertorderedlist","listtype","insertunorderedlist","outdent","indent"],
                    ["separator","inserthorizontalrule","createlink"],
                    ["linebreak","separator","undo","redo","selectall","print"], (Xinha.is_gecko ? [] : ["cut","copy","paste","overwrite"]),
                    ["separator","killword","clearfonts","removeformat","toggleborders","splitblock","lefttoright", "righttoleft"],
                    ["separator","htmlmode","showhelp","about"]
                    ];

        xinha_config.formatblock =
        {
            "&mdash; format &mdash;": "",
            "Heading 1": "h1",
            "Heading 2": "h2",
            "Heading 3": "h3",
            "Heading 4": "h4",
            "Normal"   : "p"
        };

        xinha_config.fontsize =
        {
            "&mdash; font size &mdash;": "",
            "1 (8 pt)" : "1",
            "2 (10 pt)": "2",
            "3 (12 pt)": "3",
            "4 (14 pt)": "4",
            "5 (18 pt)": "5"
        };

        xinha_config.colorPickerCellSize = "12px";
        xinha_config.undoSteps = 40;

        xinha_config.CharacterMap.mode = 'panel';

        xinha_editors   = Xinha.makeEditors(xinha_editors, xinha_config, xinha_plugins);

        xinha_editors.content_area_contents.config.width = '640px';
        xinha_editors.content_area_contents.config.height = '440px';

        xinha_editors.poll_contents.config.width = '640px';
        xinha_editors.poll_contents.config.height = '240px';

        xinha_editors.content_area_contents.generate();

        //Xinha.startEditors(xinha_editors);
        }

    Xinha._addEvent(window,'load', xinha_init);

I've also tried simply commenting line 76 in XinhaLoader.js:

Xinha.removeLoadingMessages(xinha_editors);  
//Xinha.createLoadingMessages(xinha_editors); //Altered by sviljoen@polard.com on 2010-11-26
callbackIfNotReady()

and this does almost exactly what I want, except, only "Loading Core" is shown, and then the loading panel disappears, instead of showing the plugins being loaded. I do end up with a situation then where the hidden Xinha's loading panel is not hovering around until I go and click on its associated activator which sets the TR containing it to display:block / display: table-row.

I've also tried in XinhaLoader.js in Xinha.createLoadingMessages = function(xinha_editors) to check for a hidden-type input in the DOM just above

Xinha.loadingMessages.push(Xinha.createLoadingMessage(document.getElementById(xinha_editors[i])));

and make an IF there - if the hidden input is defined, do not execute the above, if it is not, do execute the above.

However, this doesn't work either as the DOM isn't loaded yet at that point, since I keep getting null if I try to access my hidden "for this xinha, show loading" at that point. Strangely enough, document.getElementById(xinha_editors[i])) ALSO returns NULL at that point - so how come you can do

Xinha.loadingMessages.push(Xinha.createLoadingMessage(document.getElementById(xinha_editors[i])));

without getting an error...?! It seems like chicken-and-egg situation.

Also, I've tried just commenting the above line - but then I get javascript exceptions referring to a "missing main".

Anyway, besides the point. Any other ideas? This seems an incredibly simple thing to do, but it isn't, apparently!

ejucovy · 2010-11-26 10:30:28

Hmm, I'm seeing this behavior too, now, in the Newbie example against the most recent copy of trunk. So you're not just crazy. I'll look into it.

ejucovy · 2010-11-26 10:39:32

Oh -- well, this only happens if you're using XinhaLoader.js -- if you don't use that, config.showLoading works as documented.

You should be able to (more or less) just replace your <script src="XinhaLoader.js"> with a <script src="XinhaCore.js"> .. a few things might need to be reordered.

ejucovy · 2010-11-26 10:59:26

rylan76,

I filed a ticket describing this problem: http://trac.xinha.org/ticket/1563 -- I'm not sure whether it should be fixed, but I wanted to document it at least. On that ticket I attached a patch to XinhaLoader.js and a modified version of Newbie.html to show how you could fix it in your copy.

But, I think the best solution is the one I mentioned above -- use XinhaCore.js instead of XinhaLoader.js, because part of the purpose of XinhaLoader.js is to show loading messages. There are some things in the /examples/ directory that should show you how to use XinhaCore.js directly; it should be mostly straightforward.

gogo · 2010-11-26 18:33:08

Ahh, I agree. I've never used XinhaLoader.js (I didn't develop it either!), but I always thought that it's sole purpose in life was to show loading messages. So if you don't want loading messages, lose XinhaLoader :-)

I wonder why we have that config option at all, seems it wouldn't do much.

rylan76 · 2010-11-29 10:06:00

Hi guys

Thanks for the assistance and suggestions. I'll see if I work it around through xinhacore.js itself it solves my issues.

Thanks for the assistance!

Kind regards

Xinha Discussion Forum

Announcement

#1 2010-11-25 09:05:46

Getting loading panel to disappear - two Xinhas on page

#2 2010-11-25 10:20:31

Re: Getting loading panel to disappear - two Xinhas on page

#3 2010-11-25 18:37:27

Re: Getting loading panel to disappear - two Xinhas on page

#4 2010-11-26 03:00:45

Re: Getting loading panel to disappear - two Xinhas on page

#5 2010-11-26 03:10:03

Re: Getting loading panel to disappear - two Xinhas on page

#6 2010-11-26 04:42:44

Re: Getting loading panel to disappear - two Xinhas on page

#7 2010-11-26 05:42:10

Re: Getting loading panel to disappear - two Xinhas on page

#8 2010-11-26 10:30:28

Re: Getting loading panel to disappear - two Xinhas on page

#9 2010-11-26 10:39:32

Re: Getting loading panel to disappear - two Xinhas on page

#10 2010-11-26 10:59:26

Re: Getting loading panel to disappear - two Xinhas on page

#11 2010-11-26 18:33:08

Re: Getting loading panel to disappear - two Xinhas on page

#12 2010-11-29 10:06:00

Re: Getting loading panel to disappear - two Xinhas on page

Board footer