Skip to content

Commit

Permalink
Release 0.2.2
Browse files Browse the repository at this point in the history
  • Loading branch information
@ChugunovRoman
ChugunovRoman committed Oct 25, 2018
2 parents 374f953 + 19aff7e commit c8f4ac6
Show file tree
Hide file tree
Showing 8 changed files with 97 additions and 92 deletions.
2 changes: 2 additions & 0 deletions @types/renderer/index.d.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,8 @@ interface Window extends EventTarget, WindowTimers, WindowSessionStorage, Window
promiseMessage(name: string, args?: any, transferList?: Array<string>): Promise<void>
setMessageHandler(handler: Function): void;
};

__figmaContent: any
}

declare var window: Window;
8 changes: 2 additions & 6 deletions config/webpack.config.renderer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,17 +40,13 @@ const dev = {
extensions: ['.ts', '.tsx', '.js', '.jsx', '.json', '.scss'],
modules: [
'node_modules',
'preact'
'react'
],
alias: {
Components: path.resolve(rootFolder, 'src/renderer/components'),
Store: path.resolve(rootFolder, 'src/renderer/stores'),
Const: path.resolve(rootFolder, 'src/constants'),
Utils: path.resolve(rootFolder, 'src/utils'),
'react': 'preact-compat',
'react-dom': 'preact-compat',
'create-react-class': 'preact-compat/lib/create-react-class',
'react-dom-factories': 'preact-compat/lib/react-dom-factories'
Utils: path.resolve(rootFolder, 'src/utils')
}
},

Expand Down
2 changes: 1 addition & 1 deletion package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "figma-linux",
"version": "0.2.1",
"version": "0.2.2",
"description": "Figma is the first interface design tool based in the browser, making it easier for teams to create software.",
"main": "src/main/index.js",
"repository": "git@github.com:ChugunovRoman/figma-linux.git",
Expand Down
4 changes: 3 additions & 1 deletion src/middleware/webBinding.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import * as fs from "fs";

import { sendMsgToMain } from "Utils";

const API_VERSION = 9;
const API_VERSION = 10;
let webPort: MessagePort;
let fontMap: any = null;
let resolveFontMapPromise: any = null;
Expand Down Expand Up @@ -61,6 +61,8 @@ const initWebApi = (version: number, fileBrowser: boolean) => {
}
}

window.__figmaContent = false;

window.__figmaDesktop = {
version: version,
fileBrowser: fileBrowser,
Expand Down
8 changes: 4 additions & 4 deletions src/package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "figma-linux",
"version": "0.2.1",
"version": "0.2.2",
"description": "Figma is the first interface design tool based in the browser, making it easier for teams to create software.",
"main": "main/main.js",
"repository": "git@github.com:ChugunovRoman/figma-linux.git",
Expand All @@ -13,9 +13,9 @@
"dependencies": {
"electron-devtools-installer": "^2.2.4",
"mobx": "^5.0.3",
"mobx-preact": "^3.0.0",
"preact": "^8.2.9",
"preact-compat": "^3.18.0",
"mobx-react": "^5.2.8",
"react": "^16.5.2",
"react-dom": "^16.5.2",
"source-map-support": "^0.5.6"
}
}
159 changes: 82 additions & 77 deletions src/renderer/components/Tabs/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ class Tabs extends React.Component<TabsProps, {}> {

private close = (e: React.MouseEvent<HTMLDivElement> & Event, id: number) => {
e.stopPropagation();
e.nativeEvent.stopImmediatePropagation();
e.nativeEvent && e.nativeEvent.stopImmediatePropagation();

let tabs = toJS(this.props.tabs!.tabs);
const currentTabId: number = toJS(this.props.tabs!.current);
Expand All @@ -53,83 +53,87 @@ class Tabs extends React.Component<TabsProps, {}> {
this.focus(event, tab.id);

// Move tab
if (/tab/.test(tabEl.className)) {
const currentTab: Tab = this.props.tabs.tabs.find(t => t.id === tab.id )
const TabContainer = tabEl.parentNode as HTMLDivElement;
const TabContainerRect = TabContainer.getBoundingClientRect();
const TabBox = tabEl.getBoundingClientRect();
const BoxXShift = event.pageX - TabBox.left;
let fakeTab: HTMLDivElement;
let fakeTabBox: ClientRect | DOMRect;
let fakeTabClassName: string;
let shift = 1;
let isMove = false;

const onMouseMove = (e: MouseEvent) => {
const TabBoxUpdated = tabEl.getBoundingClientRect();
const left = Math.abs(e.pageX - (BoxXShift + TabBox.width));

tabEl.style.position = 'absolute';
tabEl.style.zIndex = '1000';
tabEl.style.height = '28px';

if (!isMove) {
this.props.tabs.updateTab({ ...currentTab, moves: true });
fakeTab = document.getElementsByClassName('fakeTab')[0] as HTMLDivElement;
fakeTabBox = fakeTab.getBoundingClientRect();
fakeTabClassName = fakeTab.className;
isMove = true;
}

// left side restriction
if ((e.pageX + (TabBox.left - BoxXShift)) > TabContainerRect.right) {
return;
}

// right side restriction
if ((e.pageX - BoxXShift) < TabContainerRect.left) {
shift += 3;

if (Math.floor((left / shift) < 0 ? 0 : (left / shift)) !== 0) {
tabEl.style.left = `-${left / shift}px`;
} else {
tabEl.style.left = `0px`;
}

return;
}

if (TabBoxUpdated.left > fakeTabBox.right - 20) {
console.log('Move tab to right ', TabBoxUpdated.left, fakeTabBox.right - 20);
fakeTab.className = fakeTabClassName.replace(/order(\d)/, match => {
let order = parseInt(match.replace(/\D/g, ''));
return 'order' + (order + 2);
});
// this.props.tabs.updateTab({ ...currentTab, order: currentTab.order + 2 });
}
// if (/tab/.test(tabEl.className)) {
// const currentTab: Tab = this.props.tabs.tabs.find(t => t.id === tab.id )
// const TabContainer = tabEl.parentNode as HTMLDivElement;
// const TabContainerRect = TabContainer.getBoundingClientRect();
// const TabBox = tabEl.getBoundingClientRect();
// const BoxXShift = event.pageX - TabBox.left;
// let fakeTab: HTMLDivElement;
// let fakeTabBox: ClientRect | DOMRect;
// let fakeTabClassName: string;
// let shift = 1;
// let isMove = false;

// const onMouseMove = (e: MouseEvent) => {
// const TabBoxUpdated = tabEl.getBoundingClientRect();
// const left = Math.abs(e.pageX - (BoxXShift + TabBox.width));

// tabEl.style.position = 'absolute';
// tabEl.style.zIndex = '1000';
// tabEl.style.height = '28px';

// if (!isMove) {
// this.props.tabs.updateTab({ ...currentTab, moves: true });
// fakeTab = document.getElementsByClassName('fakeTab')[0] as HTMLDivElement;
// fakeTabBox = fakeTab.getBoundingClientRect();
// fakeTabClassName = fakeTab.className;
// isMove = true;
// }

// // left side restriction
// if ((e.pageX + (TabBox.left - BoxXShift)) > TabContainerRect.right) {
// return;
// }

// // right side restriction
// if ((e.pageX - BoxXShift) < TabContainerRect.left) {
// shift += 3;

// if (Math.floor((left / shift) < 0 ? 0 : (left / shift)) !== 0) {
// tabEl.style.left = `-${left / shift}px`;
// } else {
// tabEl.style.left = `0px`;
// }

// return;
// }

// if (TabBoxUpdated.left > fakeTabBox.right - 30) {
// console.log('Move tab to right ', TabBoxUpdated.left, fakeTabBox.right - 30);
// // fakeTab.className = fakeTabClassName.replace(/order(\d)/, match => {
// // let order = parseInt(match.replace(/\D/g, ''));
// // return 'order' + (order + 2);
// // });
// this.props.tabs.updateTab({ ...currentTab, order: currentTab.order + 2 });
// }

if (TabBoxUpdated.right < fakeTabBox.left + 20) {
console.log('Move tab to left ', TabBoxUpdated.right, fakeTabBox.left + 20);
// this.props.tabs.updateTab({ ...currentTab, order: currentTab.order - 2 });
}

tabEl.style.left = `${left}px`;
shift = 0;
};
const onMouseUp = (e: MouseEvent) => {
tabEl.style.position = 'relative';
tabEl.style.left = `0px`;
tabEl.style.zIndex = '0';

this.props.tabs.updateTab({ id: currentTab.id, moves: false });

document.removeEventListener('mousemove', onMouseMove);
document.removeEventListener('mouseup', onMouseUp);
};

document.addEventListener('mousemove', onMouseMove)
document.addEventListener('mouseup', onMouseUp);
}
// if (TabBoxUpdated.right < fakeTabBox.left + 30) {
// console.log('Move tab to left ', TabBoxUpdated.right, fakeTabBox.left + 30);
// // fakeTab.className = fakeTabClassName.replace(/order(\d)/, match => {
// // let order = parseInt(match.replace(/\D/g, ''));
// // return 'order' + (order - 2);
// // });
// this.props.tabs.updateTab({ ...currentTab, order: currentTab.order - 2 });
// }

// tabEl.style.left = `${left}px`;
// shift = 0;
// };
// const onMouseUp = (e: MouseEvent) => {
// tabEl.style.position = 'relative';
// tabEl.style.left = `0px`;
// tabEl.style.zIndex = '0';

// this.props.tabs.updateTab({ id: currentTab.id, moves: false });

// document.removeEventListener('mousemove', onMouseMove);
// document.removeEventListener('mouseup', onMouseUp);
// };

// document.addEventListener('mousemove', onMouseMove)
// document.addEventListener('mouseup', onMouseUp);
// }

} break;
// Handle middle click, close tab
Expand Down Expand Up @@ -187,6 +191,7 @@ class Tabs extends React.Component<TabsProps, {}> {
label: 'Close',
visible: true,
click: () => {
console.log('close tab id: ', id);
this.close(event, id);
}
}
Expand Down
4 changes: 2 additions & 2 deletions src/renderer/components/style.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ html, body {
}

@for $i from 1 through 50 {
.order#{i} {
order: #{i};
.order#{$i} {
order: #{$i};
}
}

0 comments on commit c8f4ac6

Please sign in to comment.