Migration to landscape2

[tegioz]

Hi! 👋

We've been working on a new version of the landscape generating software, landscape2. This new version relies on the same landscape.yml file as the main data source, so nothing changes regarding adding or updating entries in the landscape.

The CNCF landscape has already been successfully migrated to landscape2, and we'd like to start migrating more landscapes 🙂

We are already building the OpenSSF landscape using landscape2, you can check it out at https://openssf.landscape2.io/. It'd be great if you could give it a try when you have a chance and, whenever you are ready, we can proceed with the migration.

The process is very simple and would involve the following steps:

• Add/update some DNS entries [1]
• Stop background automated processes that write to this repository (i.e. CNCF bot)
• Unlink this repository from Netlify
• Update README file and clean up some files no longer needed in this repository
• Setup the landscape2-validate-action to validate the landscape.yml file on PRs (optional)

We can take care of the last 4 points, you'd only need to update the DNS entries.

Landscape2 supports embedding a view with items in a category/subcategory in another website, but it works slightly different than landscape1. If parts of this landscape are embedded using this mechanism on other websites, we'd appreciate if you could let them know about how it works now.

Please ping me if you have any question 😉

[1] We’d need to know the hostnames you’d like to use to prepare our end to listen on them before switching the DNS (i.e. landscape.openssf.org). Once we are ready we'll provide you with the destination for the DNS entries so that you can update them.

[hythloda]

Can we test it out with landscape2@openssf.org first before proceeding?

[tegioz]

Hi @hythloda

Sure, no problem 👍 (you have it available at https://openssf.landscape2.io at the moment though 🙂)

[hythloda]

We are having issues with v2 and the at risk flag. We would like to monitor the v2 before trusting it completely as well. It looks like the landscape2 is pulling the correct at risk flagged member but not the new member it should.

[tegioz]

Could you share some more details about the problem? Not sure what you mean by the "at risk flag", but we'd be happy to look into it if there's any issue 🙂

[hythloda]

For example https://github.com/ossf/ossf-landscape/pull/409/files
Checkmarx, Cycode, Checkmarx are members but 'at risk' so v1 landscape incorrrecly wants to remove.
Hedera is a member and it seems like v1 landscape doesn't add.

[tegioz]

I see. But I'm afraid that's not related to landscape v2. V2 feeds from the same landscape.yml file and at the moment it's built daily. At build time, we'll use that data file as it is at that moment. But if there is something that's automatically adding or removing some entries from the data file they may not show up properly.

If you need us to build it manually at any time please let us know. https://openssf.landscape2.io it's being built daily and should be up to date (within that time frame).

[hythloda]

Our current code for the landscape:

<iframe src="https://landscape.openssf.org/pages/members/" frameBorder="0" id="landscape" scrolling="no" style="width: 1px; min-width: 100%"></iframe><script src="https://landscape.openssf.org/iframeResizer.js"></script>

[bbpursell1]

Currently, the only thing that the OpenSSF landscape is meaningfully used for is the display here: https://openssf.org/about/members/

That uses an iframe which displays this view: https://openssf.org/about/members/

Is there a similar view presented in landscape2? I don't see anything displayed at https://openssf.landscape2.io/pages/members.

[tegioz]

Yes! It works slightly different but it should be easy to migrate. Please see:

https://openssf.landscape2.io/embed-setup

https://github.com/cncf/landscape2/blob/main/README.md#embeddable-views

[hythloda]

We have tried several iterations of this in the WP site and could not get it to look good on both mobile desktop with the current iterations. We can explore more later with time but do not have the bandwidth at the moment. Some of our testing is below

The code provided gives just one looks like this on desktop

meanwhile on mobile

The only way I saw to fix this was setting the size of each element and that was functional on Desktop

However mobile did not show anything still.

[tegioz]

Hi @hythloda 👋

Did you enable iframe-resizer? It works slightly different than in the previous landscape (please see the demo referenced below).

Note

In addition to the customization options available in the embed setup view, it's also possible to embed views using iframe-resizer. This feature can be enabled by adding iframe-resizer=true to the embed url (demo).

Is the source code of that website publicly available? If you still run into issues after trying the suggestion above, we'd be happy to take a look at it and submit a PR if needed 🙂

[hythloda]

We did try the iframe-resizer and it still had a scroller

  <script src="https://cdnjs.cloudflare.com/ajax/libs/iframe-resizer/4.3.9/iframeResizer.min.js"></script>  
  <iframe id="iframe-landscape" src="https://openssf.landscape2.io/embed/embed.html?key=openssf-members--premier&headers=true&category-header=true&category-in-subcategory=false&item-name=false&title-uppercase=false&title-alignment=left&title-font-family=sans-serif&title-font-size=13&style=clean&size=xl&items-alignment=left&bg-color=%23331f6b&fg-color=%23ffffff&iframe-resizer=true" style="width: 1px; min-width: 100%; min-height: 100px; border: 0;"></iframe>
  <script>
    iFrameResize({ }, '#iframe-landscape');
  </script>

[cynthia-sg]

Hi @hythloda 👋

We did try the iframe-resizer and it still had a scroller

  <script src="https://cdnjs.cloudflare.com/ajax/libs/iframe-resizer/4.3.9/iframeResizer.min.js"></script>  
  <iframe id="iframe-landscape" src="https://openssf.landscape2.io/embed/embed.html?key=openssf-members--premier&headers=true&category-header=true&category-in-subcategory=false&item-name=false&title-uppercase=false&title-alignment=left&title-font-family=sans-serif&title-font-size=13&style=clean&size=xl&items-alignment=left&bg-color=%23331f6b&fg-color=%23ffffff&iframe-resizer=true" style="width: 1px; min-width: 100%; min-height: 100px; border: 0;"></iframe>
  <script>
    iFrameResize({ }, '#iframe-landscape');
  </script>

The code you shared seems to be working fine -no scroll-, you can see it in action in this codepen: https://codepen.io/cynthiasg/pen/QWPOdYm (I applied some minor changes to the styles to make it look similar to your current site, but it's mostly the same).

I'd be happy to assist further if you could point me to the site's source code. Please note that if you have multiple iframes you need to call iFrameResize(...) for each using the corresponding id. You can also see how this is being used in the Kubernetes or CNCF's website, just in case it helps.

[hythloda]

Must be a wordpress plug issue then here is what I see after uploading it
screen-capture.webm

[tegioz]

We're not familiar with WordPress or that particular plugin to be honest, but it looks like Javascript code must be added in a different way when using it:

https://www.youtube.com/watch?v=47cCW8zZ27A

Maybe leaving the iframe tag on the raw html section and moving the script tags to the raw js section will do the trick.

Hope this helps 🙂

[hythloda]

I have tried various ways of getting it to work with the rawJS block and it always looks the same with the small scrolling window. We have plans on potentially migrating to a new site and landscape1 works fine until such a time.
Attempt:

Attempt:

Attempt: