Paths

Table of Contentst

Differential D6186

misc: Add iframe view for contents and directories
ClosedPublic
Actions

Authored by anlambert on Sep 3 2021, 5:22 PM.

Details

Reviewers

vlorentz

Group Reviewers

Reviewers

Maniphest Tasks

T3489: Implement iframe view for content and directory elements

Commits

rDWAPPSe2b48563ac20: misc: Add iframe view for contents and directories

Summary

Add a new Django view that can be embedded in an iframe to display
contents and directories archived by Software Heritage in a minimalist
Web UI.

The URL targetting that view is /embed/(swhid)/.

The view enables to navigate in a source tree and to display SWHIDs
of currently browsed objects. It also has a fixed header with a link
to softwareheritage.org and a link to browse current object on the
main archive website. Code fragment highlighting for content objects
is also supported if the input SWHID has a lines qualifier.

Below is an example of how to integrate that view in an iframe:

<iframe style="width: 100%; height: 500px; border: 1px solid rgba(0, 0, 0, 0.125);" src="https://archive.softwareheritage.org/embed/(swhid)/"></iframe>

And this is how it looks:

Related to T3489

Diff Detail

Repository

rDWAPPS Web applications

Branch

swhid-iframe

Lint

No Linters Available

Unit

No Unit Test Coverage

Build Status

Buildable 23364
Build 36458: Phabricator diff pipeline on jenkins	Jenkins console · Jenkins
Build 36457: arc lint + arc unit

Event Timeline

anlambert created this revision.Sep 3 2021, 5:22 PM

Herald added a reviewer: Reviewers. · View Herald TranscriptSep 3 2021, 5:22 PM

Build has FAILED

Patch application report for D6186 (id=22410)

Rebasing onto ea485ffd9e...

First, rewinding head to replay your work on top of it...
Applying: misc: Add iframe view for contents and directories

Changes applied before test

commit 9160352b58af3a3b3855384717393c6fe1d24e3b
Author: Antoine Lambert <antoine.lambert@inria.fr>
Date:   Fri May 28 17:57:58 2021 +0200

    misc: Add iframe view for contents and directories
    
    Add a new Django view that can be embedded in an iframe to display
    contents and directories archived by Software Heritage in a minimalist
    Web UI.
    
    The URL targetting that view is /embed/(swhid)/.
    
    The view enables to navigate in a source tree and to display SWHIDs
    of currently browsed objects. It also has a fixed header with a link
    to softwareheritage.org and a link to browse current object on the
    main archive website. Code fragment highlighting for content objects
    is also supported if the input SWHID has a lines qualifier.
    
    Related to T3489

Link to build: https://jenkins.softwareheritage.org/job/DWAPPS/job/tests-on-diff/1068/
See console output for more information: https://jenkins.softwareheritage.org/job/DWAPPS/job/tests-on-diff/1068/console

Harbormaster returned this revision to the author for changes because remote builds failed.Sep 3 2021, 5:23 PM

Harbormaster failed remote builds in B23364: Diff 22410!

Build has FAILED

Patch application report for D6186 (id=22410)

Rebasing onto ea485ffd9e...

First, rewinding head to replay your work on top of it...
Applying: misc: Add iframe view for contents and directories

Changes applied before test

commit 161100178a6d3897a7428702d2249ac1420bffb1
Author: Antoine Lambert <antoine.lambert@inria.fr>
Date:   Fri May 28 17:57:58 2021 +0200

    misc: Add iframe view for contents and directories
    
    Add a new Django view that can be embedded in an iframe to display
    contents and directories archived by Software Heritage in a minimalist
    Web UI.
    
    The URL targetting that view is /embed/(swhid)/.
    
    The view enables to navigate in a source tree and to display SWHIDs
    of currently browsed objects. It also has a fixed header with a link
    to softwareheritage.org and a link to browse current object on the
    main archive website. Code fragment highlighting for content objects
    is also supported if the input SWHID has a lines qualifier.
    
    Related to T3489

Link to build: https://jenkins.softwareheritage.org/job/DWAPPS/job/tests-on-diff/1069/
See console output for more information: https://jenkins.softwareheritage.org/job/DWAPPS/job/tests-on-diff/1069/console

Build is green

Patch application report for D6186 (id=22410)

Rebasing onto ea485ffd9e...

First, rewinding head to replay your work on top of it...
Applying: misc: Add iframe view for contents and directories

Changes applied before test

commit 7cbc0460a6bf8b7b33c821806c7eda47c5c3d104
Author: Antoine Lambert <antoine.lambert@inria.fr>
Date:   Fri May 28 17:57:58 2021 +0200

    misc: Add iframe view for contents and directories
    
    Add a new Django view that can be embedded in an iframe to display
    contents and directories archived by Software Heritage in a minimalist
    Web UI.
    
    The URL targetting that view is /embed/(swhid)/.
    
    The view enables to navigate in a source tree and to display SWHIDs
    of currently browsed objects. It also has a fixed header with a link
    to softwareheritage.org and a link to browse current object on the
    main archive website. Code fragment highlighting for content objects
    is also supported if the input SWHID has a lines qualifier.
    
    Related to T3489

See https://jenkins.softwareheritage.org/job/DWAPPS/job/tests-on-diff/1070/ for more details.

Harbormaster completed remote builds in B23364: Diff 22410.Sep 6 2021, 11:02 AM

anlambert requested review of this revision.Sep 6 2021, 11:02 AM

Can you add a documentation page explaining how to use it?

swh/web/templates/misc/iframe.html
161–163	Why `display: none`?

In D6186#160119, @vlorentz wrote:

Can you add a documentation page explaining how to use it?

Sure, I was thinking adding a new section in the sphinx doc about it and adding instructions in the permalinks tab the same way we did for the swh badges.

swh/web/templates/misc/iframe.html
161–163	LibreJS does not require the link to be visible and I do not think it is relevant to show it for the iframe case.

I just tried it and it still looks great. I found some edge cases/nitpicking on the layout though:

When displaying content, the first line looks slightly smaller than the other ones; and when listing a revision/directory, text in the table header is not vertically centered. A few px in breadcrumbs-container's margin-bottom should fix it.

Also, when clicking on a line, it is highlighted, then the iframe scrolls in such a way half the line is hidden beneath the breadcrumbs-container.

Additionally, with JS disabled (or before it's loaded, which takes a noticeable fraction of a second for me), the "identifiers" popup is always shown, and is beneath the iframe's card-header; because d-sm-block has display: block !important, which overrides the style="display: none;" attribute. (There is a similar issue on the main website, but at least it's shown in a usable way instead of being beneath a position: fixed block)

When displaying content, the first line looks slightly smaller than the other ones; and when listing a revision/directory, text in the table header is not vertically centered. A few px in breadcrumbs-container's margin-bottom should fix it.

Nice catch, fixed by tweaking top margin of pre element containing source code.

Also, when clicking on a line, it is highlighted, then the iframe scrolls in such a way half the line is hidden beneath the breadcrumbs-container.

I disabled lines highlighting for the iframe view through javascript, did you recompile the static assets before your tests ?

Additionally, with JS disabled (or before it's loaded, which takes a noticeable fraction of a second for me), the "identifiers" popup is always shown, and is beneath the iframe's card-header; because d-sm-block has display: block !important, which overrides the style="display: none;" attribute. (There is a similar issue on the main website, but at least it's shown in a usable way instead of being beneath a position: fixed block)

Thanks for spotting, I moved the setting of the d-sm-block class from HTML to Javascript in order to fix the issue.

I disabled lines highlighting for the iframe view through javascript, did you recompile the static assets before your tests ?

Yes (I have to, the python process crashes when I don't)

Update:

rebase
address @vlorentz comments
fix a couple of spotted issues
add sphinx documentation
add modals displayable from the SWHIDs tab explaining how to integrate iframe views in external web page

Build is green

Patch application report for D6186 (id=22464)

Rebasing onto b552b01dc7...

Current branch diff-target is up to date.

Changes applied before test

commit 394734c93d44f54fb718cde54c0f3b7644806074
Author: Antoine Lambert <antoine.lambert@inria.fr>
Date:   Fri May 28 17:57:58 2021 +0200

    misc: Add iframe view for contents and directories
    
    Add a new Django view that can be embedded in an iframe to display
    contents and directories archived by Software Heritage in a minimalist
    Web UI.
    
    The URL targetting that view is /embed/(swhid)/.
    
    The view enables to navigate in a source tree and to display SWHIDs
    of currently browsed objects. It also has a fixed header with a link
    to softwareheritage.org and a link to browse current object on the
    main archive website. Code fragment highlighting for content objects
    is also supported if the input SWHID has a lines qualifier.
    
    Related to T3489

See https://jenkins.softwareheritage.org/job/DWAPPS/job/tests-on-diff/1088/ for more details.

Harbormaster completed remote builds in B23415: Diff 22464.Sep 7 2021, 3:44 PM

In D6186#160165, @vlorentz wrote:

I disabled lines highlighting for the iframe view through javascript, did you recompile the static assets before your tests ?

Yes (I have to, the python process crashes when I don't)

I just tried, and it seems I can't anymore... most of the time.

However, if I click on a line number right after it displayed the column, I can still one line and it will scroll to it.

In D6186#160753, @vlorentz wrote:

In D6186#160165, @vlorentz wrote:

I disabled lines highlighting for the iframe view through javascript, did you recompile the static assets before your tests ?

Yes (I have to, the python process crashes when I don't)

I just tried, and it seems I can't anymore... most of the time.

However, if I click on a line number right after it displayed the column, I can still one line and it will scroll to it.

Ack, I see what is wrong, I have a better idea to properly disable lines selection.

Update:

rebase
ensure click handler for code highlighting will not be created in iframe mode

thanks!

This revision is now accepted and ready to land.Sep 8 2021, 5:15 PM

Build is green

Patch application report for D6186 (id=22494)

Rebasing onto ec19895012...

Current branch diff-target is up to date.

Changes applied before test

commit e2b48563ac205c0993f0aae1fab536a4a2ded884
Author: Antoine Lambert <antoine.lambert@inria.fr>
Date:   Fri May 28 17:57:58 2021 +0200

    misc: Add iframe view for contents and directories
    
    Add a new Django view that can be embedded in an iframe to display
    contents and directories archived by Software Heritage in a minimalist
    Web UI.
    
    The URL targetting that view is /embed/(swhid)/.
    
    The view enables to navigate in a source tree and to display SWHIDs
    of currently browsed objects. It also has a fixed header with a link
    to softwareheritage.org and a link to browse current object on the
    main archive website. Code fragment highlighting for content objects
    is also supported if the input SWHID has a lines qualifier.
    
    Related to T3489

See https://jenkins.softwareheritage.org/job/DWAPPS/job/tests-on-diff/1096/ for more details.

Harbormaster completed remote builds in B23444: Diff 22494.Sep 8 2021, 5:15 PM

Closed by commit rDWAPPSe2b48563ac20: misc: Add iframe view for contents and directories (authored by anlambert). · Explain WhySep 8 2021, 5:34 PM

This revision was automatically updated to reflect the committed changes.

anlambert added a commit: rDWAPPSe2b48563ac20: misc: Add iframe view for contents and directories.