alixlahuec / zotero-roam

Connector extension between Roam Research & Zotero
https://alix-lahuec.gitbook.io/zotero-roam/
Apache License 2.0
64 stars 6 forks source link

Narrow panel bug #8

Closed marcocamilo closed 3 years ago

marcocamilo commented 3 years ago

As I just opened Roam and started the Zotero to Roam plug in, I noticed this problem on the screen: the panel was ultra narrow. It just started today. I haven't made any changes to the code other that reformatting the metadata (but that was weeks before this problem) and updating to /zotero-roam@0.6 (which was a really nice update) When I change back to /zotero-roam@0.5 the problem's gone. I'll appreciate the help!

PS: The double icon came from adjusting the versions, refreshing the page updates the plug in buttons on the top right.

Here are the screenshots:

Снимок экрана 2021-06-24 в 11 31 54

Снимок экрана 2021-06-24 в 11 32 18

alixlahuec commented 3 years ago

Hey! Can you make sure that you only have one version running at a time? (no double icons) There were some CSS changes between the two, and there might be a conflict there that causes display issues. Let me know how it goes!

marcocamilo commented 3 years ago

Hi! I made sure of that, but still I have the problem. Here's the screenshot (literally the only change I make is between the /...@0.5 /...@0.6 parts, one character). Here's the code I have:

// To install the extension, simply add the code below : var s = document.createElement("script"); s.src = "https://cdn.jsdelivr.net/npm/@alixlahuec/zotero-roam@0.6"; s.id = "zotero-roam"; s.type = "text/javascript"; document.getElementsByTagName("body")[0].appendChild(s);

zoteroRoam_settings = { dataRequests: { apikey: "Xk1OqJkEm69aqtywO6zlBxN5", dataURI: "users/7117475/items", params: "" }, autoload: true, funcmap: { DEFAULT: "customFormatting" }, shortcuts: { 'toggleSearchPanel': {'altKey': true, 'œ': true}, 'toggleQuickCopy': {'altKey': true, 'ç': true}, 'importMetadata': {'altKey': true, 'dead': true} }, autocomplete: { trigger: '@', // Show autocomplete menu when typing @ format: 'citekey', // Insert the item as @citekey display: 'citekey' // Show autocomplete menu items as citekeys } }

window.customFormatting = function(item){ let metadata = [];

metadata.push(`tags:: #[[academic paper]] #`)
if (item.data.title){
  metadata.push(`title of paper:: ${item.data.title}`) // Title, if available
};
if (item.data.creators.length > 0){ 
  metadata.push(`author:: ${zoteroRoam.formatting.getCreators(item)}`) // Creators list, if available
};
metadata.push(`layer::`)
if (item.data.dateAdded){
  metadata.push(`date read:: ${zoteroRoam.utils.makeDNP(item.data.dateAdded, {brackets: true})}`) // Date added, as Daily Notes Page reference
};

if (item.data.url){ metadata.push(URL:: [${item.data.title}](${item.data.url})) // URL, if available }; // Item's children, if any are in the dataset let children = zoteroRoam.formatting.getItemChildren(item, {pdf_as: "links", notes_as: "formatted", split_char: "\n"}); if(children.pdfItems){ metadata.push(PDF link:: ${children.pdfItems.join(", ")}); } if(children.notes){ let notesBlock = {string: [[Notes]], children: []}; notesBlock.children.push(...children.notes.flat(1)); metadata.push(notesBlock); } metadata.push(Full Notes)

return metadata; 

}

And the screenshot Снимок экрана 2021-06-25 в 00 22 47

alixlahuec commented 3 years ago

So strange! Have you used the browser Inspector before, to take a look at the page's HTML and CSS ? It would give us helpful information to try & figure this out. There might be some CSS conflict somewhere.

marcocamilo commented 3 years ago

Hi! I haven't, that's actually a great idea! The only problem would be: don't know what I'd be looking for (i.e. the name of the conflicting element).

However, trying to play around and turn off the css I have, the problem persisted, even when I have my Roam with no CSS whatsoever. Using the selector I think I pinned it down to .zotero-roam-dialog-overlay .bp3-dialog element, but don't know what could be conflicting. Again, on my side, I haven't changed anything since updating to 0.6. When I turn it back to 0.5, the problem it gone, so I know it must be somehow a bug on the new version.

I should also mention, the page is zoomed in to 175% (as I use it). The further away I zoom, the wider the plug in panel gets, but the more I zoom in (even at the present size), the thiner it get.

Is there any more info I could give you to help solve the problem? Anything in particular I should send?

Of course, thank you in advanced for the help. I truly love this plugin and get so much value out of it (also, nice touch with the, scite feature, love it!)

alixlahuec commented 3 years ago

Great - you figured it out! I just tested it, and it's because of the zoom. The way the size of the panel is calculated was a pixel-based calculation, which doesn't scale when zoom is adjusted. Fix will be released in the next version :)

marcocamilo commented 3 years ago

Super! (Don't know how I even figured it out xD). Excited for that next version and thanks for the help as always :)