Icon picker at the bottom

This commit is contained in:
Paulo Gustavo Veiga 2023-01-06 09:11:12 -08:00
parent 12835ded0a
commit 4158f3773e
21 changed files with 26 additions and 27 deletions

View File

@ -3,7 +3,7 @@ services:
e2e: e2e:
image: cypress/included:11.2.0 image: cypress/included:11.2.0
container_name: wisemapping-integration-tests container_name: wisemapping-integration-tests
entrypoint: '/bin/sh -c "yarn install && yarn bootstrap && yarn build && yarn test:integration"' entrypoint: '/bin/sh -c "yarn install && yarn build && yarn test:integration"'
working_dir: /e2e working_dir: /e2e
environment: environment:
- CYPRESS_imageSnaphots=true - CYPRESS_imageSnaphots=true

View File

@ -3,7 +3,7 @@ services:
e2e: e2e:
image: cypress/included:11.2.0 image: cypress/included:11.2.0
container_name: wisemapping-integration-tests container_name: wisemapping-integration-tests
entrypoint: '/bin/sh -c "yarn bootstrap && yarn build && yarn test:integration"' entrypoint: '/bin/sh -c "yarn build && yarn test:integration"'
working_dir: /e2e working_dir: /e2e
environment: environment:
- CYPRESS_imageSnaphots=true - CYPRESS_imageSnaphots=true

Binary file not shown.

Before

Width:  |  Height:  |  Size: 94 KiB

After

Width:  |  Height:  |  Size: 94 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 95 KiB

After

Width:  |  Height:  |  Size: 96 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 95 KiB

After

Width:  |  Height:  |  Size: 95 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 101 KiB

After

Width:  |  Height:  |  Size: 101 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 97 KiB

After

Width:  |  Height:  |  Size: 97 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 95 KiB

After

Width:  |  Height:  |  Size: 96 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 93 KiB

After

Width:  |  Height:  |  Size: 92 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 102 KiB

After

Width:  |  Height:  |  Size: 101 KiB

View File

@ -54,13 +54,6 @@ const IconPicker = ({ triggerClose, iconModel }: IconPickerProp): ReactElement =
return ( return (
<Box style={{ padding: '5px' }}> <Box style={{ padding: '5px' }}>
<FormGroup sx={{ align: 'center' }}>
<FormControlLabel
label={<FormattedMessage id="icon-picker.show-images" defaultMessage="Show images" />}
control={<Switch onChange={handleCheck} />}
/>
</FormGroup>
{checked && ( {checked && (
<EmojiPicker <EmojiPicker
onEmojiClick={handleEmojiSelect} onEmojiClick={handleEmojiSelect}
@ -69,8 +62,13 @@ const IconPicker = ({ triggerClose, iconModel }: IconPickerProp): ReactElement =
previewConfig={{ showPreview: false }} previewConfig={{ showPreview: false }}
/> />
)} )}
{!checked && <IconImageTab iconModel={iconModel} triggerClose={triggerClose} />} {!checked && <IconImageTab iconModel={iconModel} triggerClose={triggerClose} />}
<FormGroup sx={{ float: 'right' }}>
<FormControlLabel
label={<FormattedMessage id="icon-picker.show-images" defaultMessage="Show images" />}
control={<Switch onChange={handleCheck} />}
/>
</FormGroup>
</Box> </Box>
); );
}; };

View File

@ -22,11 +22,13 @@ class MapInfoImpl implements MapInfo {
private title: string; private title: string;
private locked: boolean; private locked: boolean;
private starred: boolean; private starred: boolean;
private lockedMsg: string | undefined;
constructor(id: string, title: string, locked: boolean) { constructor(id: string, title: string, locked: boolean, lockedMsg?: string) {
this.id = id; this.id = id;
this.title = title; this.title = title;
this.locked = locked; this.locked = locked;
this.lockedMsg = lockedMsg;
this.starred = true; this.starred = true;
} }
@ -44,7 +46,7 @@ class MapInfoImpl implements MapInfo {
} }
setTitle(value: string): void { setTitle(value: string): void {
throw this.title; throw (this.title = value);
} }
isLocked(): boolean { isLocked(): boolean {

View File

@ -37,15 +37,16 @@ const options: EditorOptions = {
enableKeyboardEvents: true, enableKeyboardEvents: true,
}; };
const mapInfo = new MapInfoImpl('welcome', 'Develop WiseMapping', true); const mapInfo = new MapInfoImpl('welcome', 'Develop WiseMapping', true, "It's locked !");
const container = document.getElementById('root'); const container = document.getElementById('root');
const root = createRoot(container!); const root = createRoot(container!);
root.render(<Editor root.render(
<Editor
mapInfo={mapInfo} mapInfo={mapInfo}
options={options} options={options}
persistenceManager={persistence} persistenceManager={persistence}
onAction={(action) => console.log('action called:', action)} onAction={(action) => console.log('action called:', action)}
onLoad={initialization} onLoad={initialization}
/> />,
); );

View File

@ -31,7 +31,6 @@ const initialization = (designer: Designer) => {
}; };
const persistence = new LocalStorageManager('samples/{id}.wxml', false, false); const persistence = new LocalStorageManager('samples/{id}.wxml', false, false);
const mapId = 'welcome';
const options: EditorOptions = { const options: EditorOptions = {
mode: 'showcase', mode: 'showcase',
locale: 'en', locale: 'en',

View File

@ -1,6 +1,7 @@
context('Maps Page', () => { context('Maps Page', () => {
beforeEach(() => { beforeEach(() => {
cy.visit('/c/maps'); cy.visit('/c/maps');
cy.get('.MuiCard-root').should('have.length', 3);
}); });
it('should match the snapshot', () => { it('should match the snapshot', () => {
@ -11,11 +12,8 @@ context('Maps Page', () => {
context('iphone-5 resolution', () => { context('iphone-5 resolution', () => {
beforeEach(() => { beforeEach(() => {
cy.viewport('iphone-5'); cy.viewport('iphone-5');
cy.visit('/c/maps', { cy.visit('/c/maps');
onLoad: (win) => { cy.get('.MuiCard-root').should('have.length', 3);
win.onerror = null;
},
});
}); });
it('Displays mobile menu button', () => { it('Displays mobile menu button', () => {
@ -41,6 +39,7 @@ context('720p resolution', () => {
beforeEach(() => { beforeEach(() => {
cy.viewport(1280, 720); cy.viewport(1280, 720);
cy.visit('/c/maps'); cy.visit('/c/maps');
cy.get('.MuiCard-root').should('have.length', 3);
}); });
it('Displays mobile menu button', () => { it('Displays mobile menu button', () => {

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 34 KiB

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.9 KiB

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.6 KiB

After

Width:  |  Height:  |  Size: 40 KiB

View File

@ -24,14 +24,14 @@ class MapInfoImpl implements MapInfo {
private title: string; private title: string;
private zoom: number; private zoom: number;
private locked: boolean; private locked: boolean;
private lockedMsg: string; private lockedMsg: string | undefined;
constructor( constructor(
id: number, id: number,
client: Client, client: Client,
title: string, title: string,
locked: boolean, locked: boolean,
lockedMsg: string, lockedMsg: string | undefined,
zoom: number, zoom: number,
) { ) {
this.id = id; this.id = id;
@ -62,7 +62,7 @@ class MapInfoImpl implements MapInfo {
return this.locked; return this.locked;
} }
getLockedMessage(): string { getLockedMessage(): string | undefined {
return this.lockedMsg; return this.lockedMsg;
} }

View File

@ -16,7 +16,7 @@
* limitations under the License. * limitations under the License.
*/ */
import React, { useEffect } from 'react'; import React, { useEffect } from 'react';
import Editor from '@wisemapping/editor'; import Editor, { EditorOptions } from '@wisemapping/editor';
import { import {
EditorRenderMode, EditorRenderMode,
PersistenceManager, PersistenceManager,
@ -136,7 +136,7 @@ const EditorPage = ({ isTryMode }: EditorPropsType): React.ReactElement => {
const isAccountLoaded = mode === 'showcase' || useFetchAccount; const isAccountLoaded = mode === 'showcase' || useFetchAccount;
const loadCompleted = mode && isAccountLoaded; const loadCompleted = mode && isAccountLoaded;
let options, persistence: PersistenceManager; let options: EditorOptions, persistence: PersistenceManager;
let mapInfo: MapInfo; let mapInfo: MapInfo;
if (loadCompleted) { if (loadCompleted) {
options = EditorOptionsBuilder.build(userLocale.code, mode, hotkey); options = EditorOptionsBuilder.build(userLocale.code, mode, hotkey);
@ -145,7 +145,7 @@ const EditorPage = ({ isTryMode }: EditorPropsType): React.ReactElement => {
mapId, mapId,
client, client,
options.mapTitle, options.mapTitle,
options.isLocked, options.locked,
options.lockedMsg, options.lockedMsg,
options.zoom, options.zoom,
); );