pro/im_webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

finishing touches, all seems to work

Browse Source
This commit is contained in:
or-else
2023-03-24 15:15:40 -07:00
parent e68ebc8336
commit d0c88fbd0d
8 changed files with 66 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/base.css
+13
View File
@@ -3190,6 +3190,10 @@ ul.phone-country-selector span.country {
#mountPoint { #mountPoint {
padding: 0; padding: 0;
} }
.pinned {
min-width: 16rem;
}
} }
@media (max-width: 640px) { @media (max-width: 640px) {
@@ -3223,4 +3227,13 @@ ul.phone-country-selector span.country {
/* Just an indicator that the screen is in mobile mode */ /* Just an indicator that the screen is in mobile mode */
transition-property: -tinode-mobile; transition-property: -tinode-mobile;
} }
#pinned-wrapper {
height: 3.5rem;
margin: 0.25rem;
}
.pinned {
min-width: unset;
}
} }
css/base.min.css
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
src/views/messages-view.jsx
+24 -12
View File
@@ -362,7 +362,6 @@ class MessagesView extends React.Component {
peerMessagingDisabled: false peerMessagingDisabled: false
}); });
} }
console.log("getDerivedStateFromProps", nextProps.topic, prevState.topic);
Object.assign(nextState, { Object.assign(nextState, {
minSeqId: topic.minMsgSeq(), minSeqId: topic.minMsgSeq(),
maxSeqId: topic.maxMsgSeq(), maxSeqId: topic.maxMsgSeq(),
@@ -1634,13 +1633,16 @@ class MessagesView extends React.Component {
}<ContactBadges badges={icon_badges} /></div> }<ContactBadges badges={icon_badges} /></div>
<div id="topic-last-seen">{lastSeen}</div> <div id="topic-last-seen">{lastSeen}</div>
</div> </div>
<PinnedMessages {!this.props.displayMobile ?
tinode={this.props.tinode} <PinnedMessages
messages={pinnedMessages} tinode={this.props.tinode}
selected={this.state.selectedPin} messages={pinnedMessages}
setSelected={index => this.setState({selectedPin: index})} selected={this.state.selectedPin}
onSelected={this.handleQuoteClick} isAdmin={this.state.isAdmin}
onCancel={this.handleUnpinMessage} /> setSelected={index => this.setState({selectedPin: index})}
onSelected={this.handleQuoteClick}
onCancel={this.handleUnpinMessage} />
: null}
{groupTopic ? {groupTopic ?
<GroupSubs <GroupSubs
tinode={this.props.tinode} tinode={this.props.tinode}
@@ -1654,10 +1656,20 @@ class MessagesView extends React.Component {
</div> </div>
</div> </div>
{this.props.displayMobile ? {this.props.displayMobile ?
<ErrorPanel <>
level={this.props.errorLevel} <PinnedMessages
text={this.props.errorText} tinode={this.props.tinode}
onClearError={this.props.onError} /> messages={pinnedMessages}
selected={this.state.selectedPin}
isAdmin={this.state.isAdmin}
setSelected={index => this.setState({selectedPin: index})}
onSelected={this.handleQuoteClick}
onCancel={this.handleUnpinMessage} />
<ErrorPanel
level={this.props.errorLevel}
text={this.props.errorText}
onClearError={this.props.onError} />
</>
: null} : null}
<LoadSpinner show={this.state.fetchingMessages} /> <LoadSpinner show={this.state.fetchingMessages} />
{messagesComponent} {messagesComponent}
src/widgets/pinned-messages.jsx
+6 -5
View File
@@ -36,7 +36,6 @@ class PinnedMessages extends React.PureComponent {
e.stopPropagation(); e.stopPropagation();
const idx = Math.max(this.props.selected - 1, 0); const idx = Math.max(this.props.selected - 1, 0);
if (idx != this.props.selected) { if (idx != this.props.selected) {
console.log("Move selection to ", idx);
this.props.setSelected(idx); this.props.setSelected(idx);
} }
} }
@@ -46,7 +45,6 @@ class PinnedMessages extends React.PureComponent {
e.stopPropagation(); e.stopPropagation();
const idx = Math.min(this.props.selected + 1, (this.props.messages || []).length - 1); const idx = Math.min(this.props.selected + 1, (this.props.messages || []).length - 1);
if (idx != this.props.selected) { if (idx != this.props.selected) {
console.log("Move selection to ", idx);
this.props.setSelected(idx); this.props.setSelected(idx);
} }
} }
@@ -67,9 +65,12 @@ class PinnedMessages extends React.PureComponent {
return shown ? return shown ?
(<div id="pinned-wrapper"> (<div id="pinned-wrapper">
<div className="cancel"> {this.props.isAdmin ?
<a href="#" onClick={this.handleCancel}><i className="material-icons gray">close</i></a> <div className="cancel">
</div> <a href="#" onClick={this.handleCancel}><i className="material-icons gray">close</i></a>
</div> :
<div><i className="material-icons gray">push_pin</i></div>
}
<div className="pinned-scroll">{dots}</div> <div className="pinned-scroll">{dots}</div>
<div className="pinned" onClick={this.handleSelected}>{shown}</div> <div className="pinned" onClick={this.handleSelected}>{shown}</div>
{selected > 0 ? {selected > 0 ?
umd/index.dev.js
+19 -9
View File
@@ -5390,7 +5390,6 @@ class MessagesView extends (react__WEBPACK_IMPORTED_MODULE_0___default().Compone
peerMessagingDisabled: false peerMessagingDisabled: false
}); });
} }
console.log("getDerivedStateFromProps", nextProps.topic, prevState.topic);
Object.assign(nextState, { Object.assign(nextState, {
minSeqId: topic.minMsgSeq(), minSeqId: topic.minMsgSeq(),
maxSeqId: topic.maxMsgSeq(), maxSeqId: topic.maxMsgSeq(),
@@ -6536,16 +6535,17 @@ class MessagesView extends (react__WEBPACK_IMPORTED_MODULE_0___default().Compone
badges: icon_badges badges: icon_badges
})), react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { })), react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
id: "topic-last-seen" id: "topic-last-seen"
}, lastSeen)), react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_pinned_messages_jsx__WEBPACK_IMPORTED_MODULE_15__["default"], { }, lastSeen)), !this.props.displayMobile ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_pinned_messages_jsx__WEBPACK_IMPORTED_MODULE_15__["default"], {
tinode: this.props.tinode, tinode: this.props.tinode,
messages: pinnedMessages, messages: pinnedMessages,
selected: this.state.selectedPin, selected: this.state.selectedPin,
isAdmin: this.state.isAdmin,
setSelected: index => this.setState({ setSelected: index => this.setState({
selectedPin: index selectedPin: index
}), }),
onSelected: this.handleQuoteClick, onSelected: this.handleQuoteClick,
onCancel: this.handleUnpinMessage onCancel: this.handleUnpinMessage
}), groupTopic ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_group_subs_jsx__WEBPACK_IMPORTED_MODULE_8__["default"], { }) : null, groupTopic ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_group_subs_jsx__WEBPACK_IMPORTED_MODULE_8__["default"], {
tinode: this.props.tinode, tinode: this.props.tinode,
subscribers: this.state.onlineSubs subscribers: this.state.onlineSubs
}) : null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { }) : null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
@@ -6553,11 +6553,21 @@ class MessagesView extends (react__WEBPACK_IMPORTED_MODULE_0___default().Compone
onClick: this.handleContextClick onClick: this.handleContextClick
}, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", { }, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", {
className: "material-icons" className: "material-icons"
}, "more_vert")))), this.props.displayMobile ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_error_panel_jsx__WEBPACK_IMPORTED_MODULE_7__["default"], { }, "more_vert")))), this.props.displayMobile ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_pinned_messages_jsx__WEBPACK_IMPORTED_MODULE_15__["default"], {
tinode: this.props.tinode,
messages: pinnedMessages,
selected: this.state.selectedPin,
isAdmin: this.state.isAdmin,
setSelected: index => this.setState({
selectedPin: index
}),
onSelected: this.handleQuoteClick,
onCancel: this.handleUnpinMessage
}), react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_error_panel_jsx__WEBPACK_IMPORTED_MODULE_7__["default"], {
level: this.props.errorLevel, level: this.props.errorLevel,
text: this.props.errorText, text: this.props.errorText,
onClearError: this.props.onError onClearError: this.props.onError
}) : null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_load_spinner_jsx__WEBPACK_IMPORTED_MODULE_12__["default"], { })) : null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_widgets_load_spinner_jsx__WEBPACK_IMPORTED_MODULE_12__["default"], {
show: this.state.fetchingMessages show: this.state.fetchingMessages
}), messagesComponent, this.state.dragging && this.isDragEnabled() ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { }), messagesComponent, this.state.dragging && this.isDragEnabled() ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
className: "drag-n-drop" className: "drag-n-drop"
@@ -14828,7 +14838,6 @@ class PinnedMessages extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureC
e.stopPropagation(); e.stopPropagation();
const idx = Math.max(this.props.selected - 1, 0); const idx = Math.max(this.props.selected - 1, 0);
if (idx != this.props.selected) { if (idx != this.props.selected) {
console.log("Move selection to ", idx);
this.props.setSelected(idx); this.props.setSelected(idx);
} }
} }
@@ -14837,7 +14846,6 @@ class PinnedMessages extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureC
e.stopPropagation(); e.stopPropagation();
const idx = Math.min(this.props.selected + 1, (this.props.messages || []).length - 1); const idx = Math.min(this.props.selected + 1, (this.props.messages || []).length - 1);
if (idx != this.props.selected) { if (idx != this.props.selected) {
console.log("Move selection to ", idx);
this.props.setSelected(idx); this.props.setSelected(idx);
} }
} }
@@ -14858,14 +14866,16 @@ class PinnedMessages extends (react__WEBPACK_IMPORTED_MODULE_0___default().PureC
}); });
return shown ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { return shown ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
id: "pinned-wrapper" id: "pinned-wrapper"
}, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { }, this.props.isAdmin ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
className: "cancel" className: "cancel"
}, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { }, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
href: "#", href: "#",
onClick: this.handleCancel onClick: this.handleCancel
}, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", { }, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", {
className: "material-icons gray" className: "material-icons gray"
}, "close"))), react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { }, "close"))) : react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", {
className: "material-icons gray"
}, "push_pin")), react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
className: "pinned-scroll" className: "pinned-scroll"
}, dots), react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { }, dots), react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
className: "pinned", className: "pinned",
umd/index.dev.js.map
+1 -1
View File
File diff suppressed because one or more lines are too long
umd/index.prod.js
+1 -1
View File
File diff suppressed because one or more lines are too long
umd/index.prod.js.map
+1 -1
View File
File diff suppressed because one or more lines are too long