This is a migrated thread and some comments may be shown as answers.

Loading pane on Material skin

16 Answers 116 Views
Ajax
This is a migrated thread and some comments may be shown as answers.
Jon
Top achievements
Rank 1
Jon asked on 10 Feb 2016, 02:56 PM

Hi, 

I'm not getting any loading panes loading when using the material skin.  Is there a known issue?  The below works when I set the skin on the loading panel as black but not when Material...

 

<html lang="en">
    <head runat="server">
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Login Page</title>
    </head>
  <body >
        <form id="uxLoginForm" runat="server">
            <telerik:RadScriptManager ID="uxRadScriptManager" runat="server"></telerik:RadScriptManager>
            <telerik:RadStyleSheetManager ID="uxRadStyleSheetManager" Runat="server"></telerik:RadStyleSheetManager>
            <div id="test" style="width:1000px;height:100px;background-color:red;">ddd</div>
            <telerik:RadAjaxManager ID="uxRadAjaxManager" runat="server" >
                <AjaxSettings>
                    <telerik:AjaxSetting AjaxControlID="test">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="test" LoadingPanelID="uxLoadingPanel" />
                        </UpdatedControls>
                        </telerik:AjaxSetting>
                </AjaxSettings>
            </telerik:RadAjaxManager>
            <telerik:RadAjaxLoadingPanel ID="uxLoadingPanel" Runat="server" Skin="Material" ></telerik:RadAjaxLoadingPanel>
        </form>           
        <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
            <script type="text/javascript">
                function pageLoad() {
                    currentLoadingPanel = $find("<%= uxLoadingPanel.ClientID %>");
                    currentLoadingPanel.show("test");
 
                };
            </script>
        </telerik:RadCodeBlock>
    </body>
</html>

 

16 Answers, 1 is accepted

Sort by
0
Jon
Top achievements
Rank 1
answered on 10 Feb 2016, 04:20 PM

Further to the above this must be a bug as looking at the source for the CSS there is nothing setup to create the relevant Material skins.  I'vegot it working with the following CSS work around but could do withit being done properly.

Regards

Jon

.RadAjax .raDiv {
    background-image:url('/Images/loading.gif')
}
.RadAjax .raColor {
    background-color: #202020;
    color: white;
}
.RadAjax .raTransp {
    opacity: 0.6;
    -moz-opacity: .6;
    filter: alpha(opacity=60);
}

0
Maria Ilieva
Telerik team
answered on 11 Feb 2016, 09:06 AM
Hi Jon,

We are aware of this bug and the issue will be fixed in the upcoming SP release which is scheduled for the end of February. Excuse us for any inconvenience this issue may lead.

Regards,
Maria Ilieva
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Jon
Top achievements
Rank 1
answered on 11 Feb 2016, 09:12 AM

Ah super. Thanks Maria.

Do you happen to have the animation already done and available?  I'm using an old one that doesn't fit too well with the material theme.

0
Pavlina
Telerik team
answered on 16 Feb 2016, 11:40 AM
Hi,

This issue is already fixed and the fix will be available in the latest internal build which should be visible in your account later today. You can use it as a temporary solution until the official SP1 version of the controls is released next week.

Regards,
Pavlina
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Jon
Top achievements
Rank 1
answered on 16 Feb 2016, 12:37 PM
Superb, thanks Pavlina!
0
Jon
Top achievements
Rank 1
answered on 16 Feb 2016, 09:52 PM

Hi Pavlina,

I've just tried it and it works very well although I think that the animation could do with a little work as it is quite jumpy. Could a dark version of it be done as well please?  Then I can use that with my dark versions of the Material theme :)

In an ideal world it would be good to have a css back circle that was the color of the theme then have the animation as simply a circle with a transparent part moving around and exposing the back of the circle.  Then as the theme colour changed the animation would change with it.  Just a thought :)

Best Regards

Jon

0
Jon
Top achievements
Rank 1
answered on 18 Feb 2016, 08:24 AM

Hi again Pavlina,

I'm noticing quite a few css issues with the new internal build:

1) Multiple line textboxes don't render properly - they render with one line (IE/Chrome)

2) Checkbox labels on IE are very small

3) The date/time picker icons on IE look very blocky - almost as if a gif rather than png is being used as the icon.  They certainly don't seem to be being done with an icon font.

I'll advise of any more - where is the best place to post general css issues?

0
Maria Ilieva
Telerik team
answered on 19 Feb 2016, 02:31 PM
Hello Jon,

Thank you for reporting the described issues.

We will further research on them locally and will log them in our tracking system for fixing. You can use the feedback portal below for logging all issues you overs on our end:

http://feedback.telerik.com/project/108

As a token of gratitude for sharing your feedback you will find your Telerik points updated.

Regards,
Maria Ilieva
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Jon
Top achievements
Rank 1
answered on 19 Feb 2016, 07:23 PM

Hi Maria,

Thanks for the points.

The work around that I am using for the text box height issue is to have a class setup to specify the height.  I don't mind that actually as it does mean I can standardise.  In the past it certainly worked from the row setting.

Regards

Jon

0
Maria Ilieva
Telerik team
answered on 24 Feb 2016, 11:44 AM
Hi,

We actually made significant improvement in unifying the form controls' metrics for the upcoming SP release that should be available till the end of the week. So I would suggest you to download it after it is released and see how it behaves in your scenario.

Regards,
Maria Ilieva
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Jon
Top achievements
Rank 1
answered on 24 Feb 2016, 11:47 AM

Hi Maria,

Yes I'm really looking forward to that update :)  I will be going fully live with my rebuilt site sometime in the next couple of weeks so having all the outstanding niggles resolved will be nice :)

Regards

Jon

0
Pavlina
Telerik team
answered on 26 Feb 2016, 04:06 PM
Hello,

Q1 2016 SP1 release is already available for download in customer accounts. Release notes for this version are available here:
http://www.telerik.com/support/whats-new/aspnet-ajax/release-history/ui-for-asp-net-ajax-q1-2016-sp1-version-2016-1-225

Give it a try and let us know in case you still encounter any issues.

Regards,
Pavlina
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Jon
Top achievements
Rank 1
answered on 01 Mar 2016, 09:15 AM

Hi Pavlina,

Many thanks yes I'd seen that and it's working nicely.

Could you supply me with a dark version of the animation please?  Because of it being a gif the image doesn't look too good on a dark background.

Regards

Jon

0
Maria Ilieva
Telerik team
answered on 02 Mar 2016, 02:34 PM
Hello Jon,

The gif for the LoadingPanel for each specific skin is designed based on the skin specifics and for the Metro skin there is no built in dark gif that can be used.
I would suggest you to generate the gif you need suing the tool bellow and simply add the new gif to the LoadingPanel:
http://loading.io/


Regards,
Maria Ilieva
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Jon
Top achievements
Rank 1
answered on 02 Mar 2016, 04:39 PM

Hi Maria,

Thanks for that I had a look but kept coming back to slightly grainy images.  I have found a css solutionthat works with stunning results but am having some issues integrating to the existing site.  Post on it is here: http://www.telerik.com/forums/global-change-of-the-loading-panel

Regards

Jon

0
Maria Ilieva
Telerik team
answered on 07 Mar 2016, 12:58 PM
Hello Jon,

I noticed that a colleague of mine already answered to your question in the forum thread. please keep posting your further question there - in the new forum thread so that we can easily track your case.

Regards,
Maria Ilieva
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Tags
Ajax
Asked by
Jon
Top achievements
Rank 1
Answers by
Jon
Top achievements
Rank 1
Maria Ilieva
Telerik team
Pavlina
Telerik team
Share this question
or