locked
adding css/javascript/html files through other ways other than redeploying the application

    Question

  • Hello,

    We are looking at ways that we can add/update css files after the application has been deployed to minimize the impact of redeploying the application. I am working on a proof of concept of this and have it to the point were I can save the file into the Windows.Storage.ApplicationData.current.localFolder. When I try and add the style sheet to the document, the styles don't seem to be there. This is the code I'm using to add the stylesheet is as follows:
                                        var _href = 'ms-appdata:///local/default.css' ;
                                        var fileref = document.createElement("link");
                                        fileref.setAttribute("rel", "stylesheet");
                                        fileref.setAttribute("type", "text/css");
                                        fileref.setAttribute("href", _href);
                                        document.getElementsByTagName("head")[0].appendChild(fileref);

    Is there a step I'm missing in the that needs to happen to re-render the document? Is this a valid approach for doing what I want to do?

    thx!

    EDIT : I have even tried to add a static reference to the file, but it still isn't adding the styles. This is the reference I have added:
    <link href="ms-appdata:///local/default.css" rel="stylesheet" type="text/css" />

    Is there a security reason this isn't working?

    • Edited by Hugh Fairfield Wednesday, May 16, 2012 8:08 PM New Information to add
    Wednesday, May 16, 2012 7:20 PM

Answers

  • Hi Hugh,

    OK thanks, if you searched for default.css and did not find it in the tool, I suspect that this is a security issue and we block this for css files.  I will do some further digging and see what I can discover.

    UPDATE: Hi Hugh, you cannot update the HTML/JS/Or CSS using the src tag (this is blocked) since these resources loaded this way must be in your application package.  What is the nature of your CSS changes?  Can you simply update the style attributes for the elements of concern?  What is the scenario that you anticipate the need to change CSS and not want to simply re-deploy the package?

    -Jeff


    Jeff Sanders (MSFT)


    Thursday, May 17, 2012 1:03 PM
    Moderator

All replies

  • Hi Hugh,

    If you run process monitory you can see if the file is read or not.  You can download it from here:

    http://technet.microsoft.com/en-us/sysinternals/bb896645

    -Jeff


    Jeff Sanders (MSFT)

    Wednesday, May 16, 2012 8:21 PM
    Moderator
  • Hi Jeff,

    I did what you said. It seems to be been read properly (it is a little tough to tell since there are a lot of data that is created in the logs).

    there are a few odd entries i'll share with you:
    INVALID PARAMETER

    BUFFER OVERFLOW - Information: 0x20

    OBJECTID NOT FOUND - Control: FSCTL_GET_OBJECT_ID

    Is that the only way to tell if the file is being read?

    Thanks for the quick reply!

    Wednesday, May 16, 2012 9:02 PM
  • I tried something similar with script that is loaded from the local folder (after being downloaded from the web) and creating a script tag and setting its text to the content of the downloaded script file worked.

    I have not tried to specify the downloaded file as a src attribute though.

    Thursday, May 17, 2012 8:26 AM
  • Hi Hugh,

    OK thanks, if you searched for default.css and did not find it in the tool, I suspect that this is a security issue and we block this for css files.  I will do some further digging and see what I can discover.

    UPDATE: Hi Hugh, you cannot update the HTML/JS/Or CSS using the src tag (this is blocked) since these resources loaded this way must be in your application package.  What is the nature of your CSS changes?  Can you simply update the style attributes for the elements of concern?  What is the scenario that you anticipate the need to change CSS and not want to simply re-deploy the package?

    -Jeff


    Jeff Sanders (MSFT)


    Thursday, May 17, 2012 1:03 PM
    Moderator
  • Hey Jeff...this is the same app I've been bugging you about for the past 3 months in these forums :)

    Imaging the Windows Store app. Imagine all Entertainment applications were in a light blue info box in the grid layout of apps. Now if these colours are in the CSS(e.g. category-entertainment class), you want to make sure the colours are changable on the fly as per a customer request, so you want to have that CSS come in dynamic. Yes, those colours could be in a database, but now say you want to make the ratings stars a bit smaller via their CSS. All these little things...tweaks...colours...shifting things a bit. You don't want to have 8 days of it sitting in the Marketplace queue for it to be placed in the Windows Store. This is where having all your less "important" CSS files coming in off the server helps. Update CSS on server, app will detect if it's newer, and pull it in. BAM...new layout.

    p.s. Windows Store is probably not a good example, as I now see that colours seem to be app-specific...so just imagine the colours of apps are diven by category, and not a random eye-burning rainbow :)

    Thursday, May 17, 2012 3:10 PM
  • Hey, you aren't bugging me :-).

    I can undestand your example.  Hopefully the majority of apps will not be doing this... I would get annoyed by a constantly changing UI!

    That said if this is a super important feature of your application you could implement the style changes on the fly right?  You just can't download and apply a CSS style sheet to do it.

    On the otherhand, If you have an important change to the UI for all users, updating the app is the way to go.

    -Jeff


    Jeff Sanders (MSFT)

    Thursday, May 17, 2012 3:19 PM
    Moderator
  • Hi Jeff,

    The scenario for this is that they want to deploy this application with the standard windows 8 image for all MS employees. As such, the upgrade path isn't completely clear in this case (unlike a marketplace app where there are notifications. We had thought that if we could update the css/javascript/html files it would give an easier upgrade path.

    Since this isn't a supported way, we'll just have to make the application as flexible as we can and get a better understanding of the upgrade path we'd have to follow.

    thx for the support!

    Hugh

    Thursday, May 17, 2012 5:16 PM
  • I tried this as well, but I found that there was one style that was getting stripped:
    .category-bg-innovation {
      background: -ms-linear-gradient(top, #8BC53F, #547726);
    }It becomse:
    .category-bg-innovation {

    }

    Most likely it is a security concern. We are going to see if we can work around this.

    Thursday, May 17, 2012 5:19 PM