Skip to main content
[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index] [List Home]
Re: [orion-dev] Styling a contributed page.link.category?
> Sorry, in my example I meant "imageDataURI"  not "imageClass"

Yes, I figured that out. Somehow I didn't see in the docs there's the 'imageDataURI' option. After your pointer I checked the docs again and it *is* mentioned there. So I must have skimmed the docs too quickly yesterday.

Thanks again,

Kris

On Thu, Oct 16, 2014 at 8:17 AM, Simon Kaegi <Simon_Kaegi@xxxxxxxxxx> wrote:

Sorry, in my example I meant "imageDataURI"  not "imageClass"

Inactive hide details for Simon Kaegi---10/16/2014 09:20:22 AM---The image is also contributable as a data URI. Use "imageDataUSimon Kaegi---10/16/2014 09:20:22 AM---The image is also contributable as a data URI. Use "imageDataURI" instead of "imageClass".


    From:

Simon Kaegi/Ottawa/IBM@IBMCA

    To:

Orion developer discussions <orion-dev@xxxxxxxxxxx>,

    Date:

10/16/2014 09:20 AM

    Subject:

Re: [orion-dev] Styling a contributed page.link.category?

    Sent by:

orion-dev-bounces@xxxxxxxxxxx



The image is also contributable as a data URI. Use "imageDataURI" instead of "imageClass".

e.g.


Inactive hide details for Kris De Volder ---10/15/2014 09:18:50 PM---Okay, so copying the images.css didn't actually work the wKris De Volder ---10/15/2014 09:18:50 PM---Okay, so copying the images.css didn't actually work the way I expected. Worked fine in 'development
    From:

Kris De Volder <kdevolder@xxxxxxxxxx>
    To:

orion-dev <orion-dev@xxxxxxxxxxx>,
    Date:

10/15/2014 09:18 PM
    Subject:

Re: [orion-dev] Styling a contributed page.link.category?
    Sent by:

orion-dev-bounces@xxxxxxxxxxx



Okay, so copying the images.css didn't actually work the way I expected. Worked fine in 'development' mode but in deployed mode the 'optimized' orion munges all the css into one big file per page.
So it didn't actually load images.css file anymore.

I came up with an even hackier solution. This js code added to the flux plugin:

    function addCss(cssText) {
        var document = window.top.document;
        var css = document.createElement("style");
        css.type = "text/css";
        css.innerHTML = cssText;
        document.head.appendChild(css);
    }
       
    addCss(".flux-sprite {\n"+
        "    background: url('/images/cloud_icon_16.png') 12px;\n"+
        "    background-repeat: no-repeat;\n"+
        "    width:16px;height:16px;\n" +
        "}\n"
    );

That actually works! But... Yuck! There's got to be a better way. No?

Kris

PS: This works for us but I think only because the flux plugin and our 'orion-node' are served on the same domain. It probably doesn't work if plugin is hosted on a separate domain.

On Wed, Oct 15, 2014 at 1:15 PM, Kris De Volder <kdevolder@xxxxxxxxxx> wrote:
    I'm using the extension points:
      - "orion.page.link.category"
      - "orion.page.link"

    To add a page link category and link.

    This works, but what I can't figure out is if/how I can also add some css to orion pages to actually style the button for the newly defined category.

    This is what I got now:

     
    provider.registerServiceProvider("orion.page.link.category", null, {
    id: "flux",
    name: "Flux",
    nameKey: "Flux",
    nls: "orion-plugin/nls/messages",
    imageClass: "core-sprite-sites",
    order: 5
    });
    provider.registerServiceProvider("orion.page.link", null, {
    id: "flux.deployer",
    name: "CF Deployer",
    category: "flux",
    order: 10,
    uriTemplate: "    https://flux-cf-deployer.cfapps.io"
    });

    You can see that I have used 'core-sprites-sites' so it shows a little 'globe' icon for this category.

    What I would like to do instead is use "flux-sprite" for imageClass. But then I also need to be able to
    somehow add some css to the page that defines how to style the "flux-sprite" class.

    Is this possible? If yes, how?

    Kris

    PS: I'm doing this in the flux orion-node server, in this context, since we are running our own server, I could just copy the css from orion.client code base and modify it to add my 'flux-sprite' class to "images.css" but this doesn't feel like the right solution (and wouldn't be an option if I created a 'standalone' plugin to be added to the orion instance running on orionhub.
_______________________________________________
orion-dev mailing list
orion-dev@xxxxxxxxxxx
To change your delivery options, retrieve your password, or unsubscribe from this list, visit
https://dev.eclipse.org/mailman/listinfo/orion-dev
_______________________________________________
orion-dev mailing list
orion-dev@xxxxxxxxxxx
To change your delivery options, retrieve your password, or unsubscribe from this list, visit
https://dev.eclipse.org/mailman/listinfo/orion-dev


_______________________________________________
orion-dev mailing list
orion-dev@xxxxxxxxxxx
To change your delivery options, retrieve your password, or unsubscribe from this list, visit
https://dev.eclipse.org/mailman/listinfo/orion-dev

GIF image

GIF image

Back to the top