nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2024-11-26 23:50:52 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'dev' into feature/marketplace

Browse Source
This commit is contained in:
dank074 2021-12-23 14:56:37 -06:00
commit 703760e809
14 changed files with 82 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/icons/chat-history.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 574 B

BIN
src/assets/images/icons/cog.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 448 B

BIN
src/assets/images/icons/like-room.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 481 B

BIN
src/assets/images/icons/room-link.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 322 B

BIN
src/assets/images/icons/small-room.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 413 B

BIN
src/assets/images/icons/zoom-less.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 252 B

BIN
src/assets/images/icons/zoom-more.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 475 B

42
src/assets/styles/icons.scss
View File

@ -303,6 +303,48 @@
height: 15px;
}
&.icon-small-room {
background: url("../images/icons/small-room.png");
width: 17px;
height: 16px;
}
&.icon-cog {
background: url("../images/icons/cog.png");
width: 21px;
height: 21px;
}
&.icon-chat-history {
background: url("../images/icons/chat-history.png");
width: 17px;
height: 21px;
}
&.icon-room-link {
background: url("../images/icons/room-link.png");
width: 17px;
height: 15px;
}
&.icon-zoom-more {
background: url("../images/icons/zoom-more.png");
width: 12px;
height: 22px;
}
&.icon-zoom-less {
background: url("../images/icons/zoom-less.png");
width: 12px;
height: 22px;
}
&.icon-like-room {
background: url("../images/icons/like-room.png");
width: 20px;
height: 22px;
}
&.icon-arrows {
background: url("../images/icons/arrows.png");
width: 17px;

21
src/views/chat-history/ChatHistoryView.tsx
View File

@ -80,18 +80,19 @@ export const ChatHistoryView: FC<{}> = props =>
parent={props.parent}
rowIndex={props.index}
>
<div key={props.key} style={props.style} className="row chathistory-entry justify-content-start">
<div key={props.key} style={props.style} className="chathistory-entry justify-content-start">
{(item.type === ChatEntryType.TYPE_CHAT) &&
<div className={`col d-flex flex-wrap text-break text-wrap ${isDark ? 'dark' : 'light'}`}>
<div className="p-1">{item.timestamp}</div>
<div className="p-1 fw-bold cursor-pointer" dangerouslySetInnerHTML={ { __html: (item.name + ':') }} />
<div className="p-1 text-break text-wrap">{item.message}</div>
<div className={`p-1 d-flex gap-1 ${isDark ? 'dark' : 'light'}`}>
<div className="text-muted">{item.timestamp}</div>
<div className="cursor-pointer d-flex text-nowrap" dangerouslySetInnerHTML={ { __html: (item.name + ':') }} />
<div className="text-break text-wrap flex-grow-1">{item.message}</div>
</div>
}
{(item.type === ChatEntryType.TYPE_ROOM_INFO) &&
<div className={`col d-flex flex-wrap text-break text-wrap ${isDark ? 'dark' : 'light'}`}>
<div className="p-1">{item.timestamp}</div>
<div className="p-1 fw-bold cursor-pointer">{item.name}</div>
<div className={`p-1 d-flex gap-1 ${isDark ? 'dark' : 'light'}`}>
<div className="text-muted">{item.timestamp}</div>
<i className="icon icon-small-room" />
<div className="cursor-pointer text-break text-wrap">{item.name}</div>
</div>
}
@ -134,9 +135,9 @@ export const ChatHistoryView: FC<{}> = props =>
<ChatHistoryContextProvider value={ { chatHistoryState, roomHistoryState } }>
<ChatHistoryMessageHandler />
{isVisible &&
<NitroCardView uniqueKey="chat-history" className="nitro-chat-history" simple={ false } theme={'dark'} >
<NitroCardView uniqueKey="chat-history" className="nitro-chat-history" simple={ false } theme={'dark'} >
<NitroCardHeaderView headerText={ 'Chat History' } onCloseClick={ event => setIsVisible(false) } theme={'dark'}/>
<NitroCardContentView className="chat-history-content" theme={'dark'}>
<NitroCardContentView className="chat-history-content p-0" theme={'dark'}>
<div className="row w-100 h-100 chat-history-container">
<AutoSizer defaultWidth={300} defaultHeight={200} onResize={onResize}>
{({ height, width }) =>

2
src/views/floorplan-editor/FloorplanEditorView.tsx
View File

@ -122,7 +122,7 @@ export const FloorplanEditorView: FC<{}> = props =>
<>
<FloorplanEditorContextProvider value={{ originalFloorplanSettings: originalFloorplanSettings, setOriginalFloorplanSettings: setOriginalFloorplanSettings, visualizationSettings: visualizationSettings, setVisualizationSettings: setVisualizationSettings }}>
{isVisible &&
<NitroCardView className="nitro-floorplan-editor">
<NitroCardView uniqueKey="floorpan-editor" className="nitro-floorplan-editor" simple={ true }>
<NitroCardHeaderView headerText={LocalizeText('floor.plan.editor.title')} onCloseClick={() => setIsVisible(false)} />
<NitroCardContentView>
<NitroLayoutGrid>

2
src/views/floorplan-editor/common/FloorplanEditor.ts
View File

@ -30,7 +30,7 @@ export class FloorplanEditor extends PixiApplicationProxy
super({
width: width,
height: height,
backgroundColor: 0x2b2b2b,
backgroundColor: 0x000000,
antialias: true,
autoDensity: true,
resolution: 1,

4
src/views/floorplan-editor/views/FloorplanCanvasView.tsx
View File

@ -105,7 +105,9 @@ export const FloorplanCanvasView: FC<{}> = props =>
</NitroLayoutFlex>
<NitroLayoutFlex className="align-items-center justify-content-center">
<div className="arrow-button"><button className="btn btn-primary" onClick={() => onClickArrowButton('left')}><i className="fas fa-arrow-left"/></button></div>
<div ref={elementRef} className="editor-area" />
<div className="rounded-2 overflow-hidden">
<div ref={elementRef} className="editor-area" />
</div>
<div className="arrow-button"><button className="btn btn-primary" onClick={() => onClickArrowButton('right')}><i className="fas fa-arrow-right"/></button></div>
</NitroLayoutFlex>
<NitroLayoutFlex className="align-items-center justify-content-center">

14
src/views/room/widgets/room-tools/RoomToolsWidgetView.scss
View File

@ -1,7 +1,7 @@
.nitro-room-tools {
position: absolute;
bottom: 125px;
left: -133px;
left: -145px;
background: rgba($dark,.95);
box-shadow: inset 0px 5px lighten(rgba($dark,.6),2.5), inset 0 -4px darken(rgba($dark,.6),4);
border-top-right-radius: $border-radius;
@ -36,4 +36,16 @@
opacity: .5;
}
}
.tools-item {
.icon {
width: 22px;
background-repeat: no-repeat;
background-position: center;
}
&:hover {
text-decoration: underline;
}
}
}

22
src/views/room/widgets/room-tools/RoomToolsWidgetView.tsx
View File

@ -45,21 +45,21 @@ export const RoomToolsWidgetView: FC<{}> = props =>
return (
<div className={'nitro-room-tools ps-3 d-flex' + classNames({ ' open': isExpended })}>
<div className="list-group list-group-flush w-100 me-1">
<div className="list-group-item" onClick={ () => handleToolClick('settings') }>
<i className="fas fa-cog me-2" />{ LocalizeText('room.settings.button.text') }
<div className="d-flex flex-column gap-2 w-100 py-2 pe-2">
<div className="d-flex align-items-center gap-2 cursor-pointer tools-item" onClick={ () => handleToolClick('settings') }>
<i className="icon icon-cog" /> { LocalizeText('room.settings.button.text') }
</div>
<div className="list-group-item" onClick={ () => handleToolClick('zoom') }>
<i className={ 'fas me-2 ' +classNames({ 'fa-search-minus': !isZoomedIn, 'fa-search-plus': isZoomedIn }) } />{ LocalizeText('room.zoom.button.text') }
<div className="d-flex align-items-center gap-2 cursor-pointer tools-item" onClick={ () => handleToolClick('zoom') }>
<i className={ 'icon ' +classNames({ 'icon-zoom-less': !isZoomedIn, 'icon-zoom-more': isZoomedIn }) } />{ LocalizeText('room.zoom.button.text') }
</div>
<div className="list-group-item" onClick={ () => handleToolClick('chat_history') }>
<i className="fas fa-comment-alt me-2" />{ LocalizeText('room.chathistory.button.text') }
<div className="d-flex align-items-center gap-2 cursor-pointer tools-item" onClick={ () => handleToolClick('chat_history') }>
<i className="icon icon-chat-history" />{ LocalizeText('room.chathistory.button.text') }
</div>
<div className={ 'list-group-item' + classNames({ ' disabled': isLiked })} onClick={ () => handleToolClick('like_room') }>
<i className="fas fa-heart me-2" />{ LocalizeText('room.like.button.text') }
<div className={ 'd-flex align-items-center gap-2 cursor-pointer tools-item' + classNames({ ' disabled': isLiked })} onClick={ () => handleToolClick('like_room') }>
<i className="icon icon-like-room" /> { LocalizeText('room.like.button.text') }
</div>
<div className="list-group-item" onClick={ () => handleToolClick('toggle_room_link') }>
<i className="fas fa-link me-2" />{ LocalizeText('navigator.embed.caption') }
<div className="d-flex align-items-center gap-2 cursor-pointer tools-item" onClick={ () => handleToolClick('toggle_room_link') }>
<i className="icon icon-room-link" />{ LocalizeText('navigator.embed.caption') }
</div>
</div>
<div className="cursor-pointer d-flex align-items-center px-2" onClick={() => setIsExpanded(value => !value)}>