Restore tags and related tabs, display note links box

This commit is contained in:
Martynas Bagdonas 2021-05-24 14:31:16 +03:00 committed by Dan Stillman
parent 576b9b7817
commit 61e3e339bb
5 changed files with 100 additions and 19 deletions

View file

@ -274,6 +274,7 @@
}
this.initEditor();
this._id('links-box').item = this._item;
})();
]]></setter>
</property>
@ -392,6 +393,15 @@
this.id('tags').item = this.item;
this.id('related').item = this.item;
this.refresh();
// Hide popup to prevent it being visible out of the context or
// in some cases even invisible but still blocking the next click
this.id('relatedPopup').addEventListener('click', (event) => {
let target = event.originalTarget;
if (target.classList.contains('zotero-box-label')) {
this.id('relatedPopup').hidePopup();
}
});
]]>
</setter>
</property>
@ -568,7 +578,7 @@
<xul:menupopup id="tagsPopup" ignorekeys="true"
onpopupshown="if (!document.commandDispatcher.focusedElement || document.commandDispatcher.focusedElement.tagName=='xul:label'){ /* DEBUG: it would be nice to make this work -- if (this.firstChild.count==0){ this.firstChild.newTag(); } */ this.setAttribute('showing', 'true'); }"
onpopuphidden="if (!document.commandDispatcher.focusedElement || document.commandDispatcher.focusedElement.tagName=='xul:label'){ this.setAttribute('showing', 'false'); }">
<xul:tagsbox id="tags" flex="1" mode="edit" style="display: flex"/>
<xul:tagsbox id="tags" flex="1" mode="edit"/>
</xul:menupopup>
</xul:popupset>
</xul:vbox>

View file

@ -238,19 +238,7 @@ var ZoteroContextPane = new function () {
}
if (splitter.getAttribute('state') != 'collapsed') {
if (_panesDeck.selectedIndex == 0) {
let child = _itemPaneDeck.selectedPanel;
if (child) {
var tabPanels = child.querySelector('tabpanels');
if (tabPanels && tabPanels.selectedIndex == 1) {
var notesDeck = child.querySelector('.notes-deck');
if (notesDeck.selectedIndex == 1) {
return child.querySelector('zoteronoteeditor');
}
}
}
}
else {
if (_panesDeck.selectedIndex == 1) {
var node = _notesPaneDeck.selectedPanel;
if (node.selectedIndex == 1) {
return node.querySelector('zoteronoteeditor');
@ -702,7 +690,6 @@ var ZoteroContextPane = new function () {
editor.mode = readOnly ? 'view' : 'edit';
editor.item = item;
editor.parentItem = null;
editor.hideLinksContainer = true;
node.querySelector('.zotero-context-pane-editor-parent-line').innerHTML = '';
var parentItem = item.parentItem;
@ -773,16 +760,89 @@ var ZoteroContextPane = new function () {
}
var parentItem = Zotero.Items.get(item.parentID);
// Info pane
var panelInfo = document.createElement('vbox');
// Dynamically create item pane tabs and panels as in itemPane.xul.
// Keep the code below in sync with itemPane.xul
// tabbox
var tabbox = document.createElement('tabbox');
tabbox.setAttribute('flex', '1');
tabbox.className = 'zotero-view-tabbox';
container.append(tabbox);
// tabs
var tabs = document.createElement('tabs');
tabs.className = 'zotero-editpane-tabs';
// tabpanels
var tabpanels = document.createElement('tabpanels');
tabpanels.setAttribute('flex', '1');
tabpanels.className = 'zotero-view-item';
tabpanels.addEventListener('select', () => {
_updateAddToNote();
});
tabbox.append(tabs, tabpanels);
// Info tab
var tabInfo = document.createElement('tab');
tabInfo.setAttribute('label', Zotero.Intl.strings['zotero.tabs.info.label']);
// Tags tab
var tabTags = document.createElement('tab');
tabTags.setAttribute('label', Zotero.Intl.strings['zotero.tabs.tags.label']);
// Related tab
var tabRelated = document.createElement('tab');
tabRelated.setAttribute('label', Zotero.Intl.strings['zotero.tabs.related.label']);
tabs.append(tabInfo, tabTags, tabRelated);
// Info panel
var panelInfo = document.createElement('tabpanel');
panelInfo.setAttribute('flex', '1');
panelInfo.className = 'zotero-editpane-item-box';
var itemBox = document.createElement('zoteroitembox');
itemBox.setAttribute('flex', '1');
panelInfo.append(itemBox);
container.append(panelInfo);
// Tags panel
var panelTags = document.createElement('tabpanel');
panelTags.setAttribute('orient', 'vertical');
panelTags.setAttribute('context', 'tags-context-menu');
panelTags.className = 'tags-pane';
panelTags.style.display = 'flex';
var div = document.createElementNS(HTML_NS, 'div');
div.className = 'tags-box-container';
div.style.display = 'flex';
div.style.flexGrow = '1';
panelTags.append(div);
var tagsBoxRef = React.createRef();
ReactDOM.render(
<TagsBoxContainer
key={'tagsBox-' + parentItem.id}
item={parentItem}
editable={!readOnly}
ref={tagsBoxRef}
/>,
div
);
// Related panel
var panelRelated = document.createElement('tabpanel');
var relatedBox = document.createElement('relatedbox');
relatedBox.setAttribute('flex', '1');
relatedBox.className = 'zotero-editpane-related';
panelRelated.addEventListener('click', (event) => {
if (event.originalTarget.closest('.zotero-clicky')) {
Zotero_Tabs.select('zotero-pane');
}
});
panelRelated.append(relatedBox);
tabpanels.append(panelInfo, panelTags, panelRelated);
tabbox.selectedIndex = 0;
itemBox.mode = readOnly ? 'view' : 'edit';
itemBox.item = parentItem;
relatedBox.mode = readOnly ? 'view' : 'edit';
relatedBox.item = parentItem;
}
};

View file

@ -69,6 +69,10 @@
</groupbox>
<!-- Regular item -->
<!--
Keep in sync with contextPane.js (_addItemContext function) which
dynamically creates this itemPane part for each tab
-->
<tabbox id="zotero-view-tabbox" class="zotero-view-tabbox" flex="1" onselect="if (!ZoteroPane_Local.getCollectionTreeRow() || event.originalTarget.localName != 'tabpanels') { return; }; ZoteroItemPane.viewItem(ZoteroPane_Local.getSelectedItems()[0], ZoteroPane_Local.collectionsView.editable ? 'edit' : 'view', this.selectedIndex)">
<tabs id="zotero-editpane-tabs" class="zotero-editpane-tabs">
<tab id="zotero-editpane-info-tab" label="&zotero.tabs.info.label;"/>

View file

@ -2205,6 +2205,8 @@ var ZoteroPane = new function()
if (found) {
document.getElementById('zotero-items-tree').focus();
}
Zotero_Tabs.select('zotero-pane');
};

View file

@ -65,6 +65,11 @@
flex-grow: 1;
margin: 0 2px;
// width: $item-pane-width - $icon-width - $delete-button-width - ($li-side-margin * 2);
// This container shouldn't force any width for its parent,
// because tagsBox is used in more places than just item pane,
// and it can have smaller width than $item-pane-width
width: 0;
}
ul.tags-box-list > li:not(.multiline) .editable-container {