SemanticMediaWiki / KnowledgeGraph

Visualize the knowledge graph within Semantic MediaWiki
https://www.mediawiki.org/wiki/Extension:KnowledgeGraph
GNU Affero General Public License v3.0
3 stars 0 forks source link

bug (parser function): fixed wrapper height causes overlays #6

Closed gesinn-it-gea closed 1 week ago

gesinn-it-gea commented 2 months ago

Given a wiki with Chameleon skin. When source editing a page with the #knowledgegraph parser function, a preview will overlay the wiki text editor making the text inaccessible.

image

The same happens on regular pages:

image

gesinn-it-gea commented 2 months ago

This is caused by a fixed style in knowledgegraph-wrapper

image

thomas-topway-it commented 2 months ago

@gesinn-it-gea I cannot reproduce with chameleon and last version, could you please post the styles from the inspector ? -- or is there a public url that I can access ?

gesinn-it-gea commented 2 months ago

Currently I do not have a public URL,

The problem is the style attribute height set to 28px in my case.

gesinn-it-gea commented 2 months ago
## -------- Chameleon --------
# Chameleon included via Composer
wfLoadExtension( 'Bootstrap' );
wfLoadSkin( 'chameleon' );
$wgDefaultSkin="chameleon";
$egChameleonLayoutFile= "$IP/skins/chameleon/layouts/standard.xml";
## ======== Chameleon ========
gesinn-it-gea commented 2 months ago

In Vector (just commenting Chameleon), rendering works as expected. JS console:

image

thomas-topway-it commented 2 months ago

@gesinn-it-gea I remember I had already fixed this issue and perhaps I've found it shows here https://test.knowledge.wiki/SemanticGraph?useskin=chameleon

gesinn-it-gea commented 2 months ago

@thomas-topway-it thanks for looking into it. Is the fix you have mentioned already committed here?

thomas-topway-it commented 2 months ago

it should, so it is strange it happens, now I'm trying to update the KG extension on the server to check if it is caused by an old version. If this is not the case, I can debug it

gesinn-it-gea commented 2 months ago

Your wiki show's the same bug. Try to add some text before and after the parser function call to make it easier to see the overlay.

image

thomas-topway-it commented 2 months ago

I have now installed the last version and looks correct https://test.knowledge.wiki/SemanticGraph

thomas-topway-it commented 2 months ago

git clone https://github.com/SemanticMediaWiki/KnowledgeGraph

thomas-topway-it commented 2 months ago

ah, no, one second, there wasn't the skin https://test.knowledge.wiki/SemanticGraph?useskin=chameleon

gesinn-it-gea commented 2 months ago

Please edit your example page to have some text before and after the parser function

TEXT BEFORE
{{#knowledgegraph...
TEXT AFTER
thomas-topway-it commented 2 months ago

I don't have account on this wiki, however I'm trying to debug it anyway, I have identified the issue (at DOM level)

gesinn-it-gea commented 2 months ago

@krabina can you please edit the example page as described in my last comment

https://test.knowledge.wiki/SemanticGraph

thomas-topway-it commented 2 months ago

for now I've fixed this https://github.com/SemanticMediaWiki/KnowledgeGraph/commit/4a2483f7aacd7785edc7644a56bec0dfebdc6f9c a quite bad inadvertence, my fault

thomas-topway-it commented 2 months ago

there is still some inconsistency between chameleon and vector, I'm trying to find out the reason

thomas-topway-it commented 2 months ago

I did a better assessment https://github.com/SemanticMediaWiki/KnowledgeGraph/commit/f253f947062ffa35c053ebcc207516bdb4430945

so somehow (either Chameleon or Bootstrap) transform the jquery width() and height() functions to have absolute values, so now we are using plain javascript

gesinn-it-gea commented 2 months ago

works perfect! Many thanks for having a look at this. One hint: there seems to be still some console output. This should imho be removed.

thomas-topway-it commented 2 months ago

ok, done https://github.com/SemanticMediaWiki/KnowledgeGraph/commit/7d9133396e12e7a089a171e33305bc0b6931d7df