Commit a50456ba authored by Laurent Wouters's avatar Laurent Wouters
Browse files

[feature] Implementing the side bar

parent 38659a0ee8cb
......@@ -63,26 +63,47 @@ class Sidebar extends React.Component<{}, State> {
data: null,
registry: null
};
let self = this;
let loadForTab = (tabId: number) => {
self.state.tabId = tabId;
Promise.all([getCurrentResource(tabId), getViewRegistry()]).then(
(values: [ResourceData, definition.ViewRegistry]) => {
self.state.data = values[0];
self.state.registry = values[1];
self.state.pane = "main";
self.setState(self.state);
}
);
};
this.onTabActivated = this.onTabActivated.bind(this);
this.onTabUpdated = this.onTabUpdated.bind(this);
this.reloadTabData = this.reloadTabData.bind(this);
// load for the current tab
getCurrentTabId().then(loadForTab);
getCurrentTabId().then((tabId: number) => {
this.state.tabId = tabId;
this.setState(this.state);
this.reloadTabData(tabId);
});
// listen for change of the current tab
chrome.tabs.onActivated.addListener(
(activeInfo: chrome.tabs.TabActiveInfo) => {
this.state.pane = "loading";
self.setState(self.state);
loadForTab(activeInfo.tabId);
chrome.tabs.onActivated.addListener(this.onTabActivated);
chrome.tabs.onUpdated.addListener(this.onTabUpdated);
}
onTabActivated(activeInfo: chrome.tabs.TabActiveInfo) {
this.state.tabId = activeInfo.tabId;
this.state.pane = "loading";
this.setState(this.state);
this.reloadTabData(activeInfo.tabId);
}
onTabUpdated(
tabId: number,
changeInfo: chrome.tabs.TabChangeInfo,
tab: chrome.tabs.Tab
) {
if (tabId != this.state.tabId) return;
if (!changeInfo.status) return;
if (changeInfo.status != "complete") return;
this.state.pane = "loading";
this.setState(this.state);
this.reloadTabData(this.state.tabId);
}
reloadTabData(tabId: number) {
Promise.all([getCurrentResource(tabId), getViewRegistry()]).then(
(values: [ResourceData, definition.ViewRegistry]) => {
this.state.data = values[0];
this.state.registry = values[1];
this.state.pane = "main";
this.setState(this.state);
}
);
}
......@@ -91,26 +112,45 @@ class Sidebar extends React.Component<{}, State> {
if (this.state.pane == "loading") {
return <ConfigLoading />;
} else if (this.state.data == null || this.state.data == undefined) {
return <span>This tab is not using an active Linked Data browser.</span>;
return (
<div
style={{
width: "90%",
marginLeft: "5%",
marginTop: "5vh",
marginBottom: "5vh"
}}
>
<div className="alert alert-info" role="alert">
This tab is not using an active Linked Data browser.
</div>
</div>
);
} else {
return (
<div>
<CurrentTabViews
data={this.state.data}
registry={this.state.registry}
displayBack={false}
onClickBack={() => {}}
/>
<CurrentTabDataSources
data={this.state.data}
displayBack={false}
onClickBack={() => {}}
/>
<CurrentTabResources
data={this.state.data}
displayBack={false}
onClickBack={() => {}}
/>
<div style={{ marginTop: "10pt" }}>
<CurrentTabViews
data={this.state.data}
registry={this.state.registry}
displayBack={false}
onClickBack={() => {}}
/>
</div>
<div style={{ marginTop: "10pt" }}>
<CurrentTabDataSources
data={this.state.data}
displayBack={false}
onClickBack={() => {}}
/>
</div>
<div style={{ marginTop: "10pt" }}>
<CurrentTabResources
data={this.state.data}
displayBack={false}
onClickBack={() => {}}
/>
</div>
</div>
);
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment