Wireframe sample

mydraft-cc · Feb 18, 2018 · 2f717a6 · 2f717a6
commit 2f717a6
Show file tree

Hide file tree

Showing 115 changed files with 12,949 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,21 @@
+# See https://help.github.com/ignore-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,29 @@
+{
+    // When opening a file, `editor.tabSize` and `editor.insertSpaces` will be detected based on the file contents.
+    "editor.detectIndentation": false,
+
+    // Typescript version from local package to be consistent
+    "typescript.tsdk": "node_modules/typescript/lib",
+
+    // Configure glob patterns for excluding files and folders.
+    "files.exclude": {
+        "_test-output": true,
+        "**/node_modules": true,
+        "**/Assets": true,
+        "**/artifacts": true,
+        "**/build": true,
+        "**/logs": true,
+        "**/out": true,
+        "**/obj": true,
+        "**/bin": true,
+        "**/*.lock.json": true,
+        "**/*.bat": true,
+        "**/*.sln": true,
+        "**/*.sln.DotSettings": true,
+        "**/*.user": true,
+        "**/*.xproj": true,
+        "**/*.gitattributes": true,
+        ".vs:": true,
+        ".vscode:": true
+    }
+}
diff --git a/README.md b/README.md
diff --git a/package.json b/package.json
@@ -0,0 +1,30 @@
+{
+  "name": "athene2",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "@types/react-redux": "^5.0.15",
+    "@types/redux": "^3.6.0",
+    "immutable": "^3.8.2",
+    "paper": "^0.11.5",
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0",
+    "react-redux": "^5.0.7",
+    "react-scripts-ts": "2.13.0",
+    "redux": "^3.7.2"
+  },
+  "scripts": {
+    "start": "react-scripts-ts start",
+    "build": "react-scripts-ts build",
+    "test": "react-scripts-ts test --env=jsdom",
+    "eject": "react-scripts-ts eject"
+  },
+  "devDependencies": {
+    "@types/jest": "^22.1.2",
+    "@types/node": "^9.4.5",
+    "@types/paper": "^0.9.14",
+    "@types/react": "^16.0.36",
+    "@types/react-dom": "^16.0.3",
+    "typescript": "^2.7.1"
+  }
+}
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/index.html b/public/index.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="theme-color" content="#000000">
+    <!--
+      manifest.json provides metadata used when your web app is added to the
+      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
+    -->
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
+    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+    <title>React App</title>
+  </head>
+  <body>
+    <noscript>
+      You need to enable JavaScript to run this app.
+    </noscript>
+    <div id="root"></div>
+    <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+  </body>
+</html>
diff --git a/public/manifest.json b/public/manifest.json
@@ -0,0 +1,15 @@
+{
+  "short_name": "React App",
+  "name": "Create React App Sample",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    }
+  ],
+  "start_url": "./index.html",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}
diff --git a/src/App.tsx b/src/App.tsx
@@ -0,0 +1,20 @@
+import * as React from 'react';
+
+import { RendererService } from '@app/wireframes/model';
+
+import { EditorViewContainer } from '@app/wireframes/renderer/editor';
+
+interface AppProps {
+    // The renderer service.
+    rendererService: RendererService;
+}
+
+export class App extends React.Component<AppProps, {}> {
+    public render() {
+        return (
+            <div>
+                <EditorViewContainer rendererService={this.props.rendererService} />
+            </div>
+        );
+    }
+}
diff --git a/src/core/index.ts b/src/core/index.ts
@@ -0,0 +1,11 @@
+export * from './utils/color';
+export * from './utils/color-palette';
+export * from './utils/immutable-id-map';
+export * from './utils/immutable-list';
+export * from './utils/immutable-object';
+export * from './utils/immutable-set';
+export * from './utils/math-helper';
+export * from './utils/paper-helper';
+export * from './utils/rotation';
+export * from './utils/vec2';
+export * from './utils/rect2';
diff --git a/src/core/utils/color-palette.spec.ts b/src/core/utils/color-palette.spec.ts
@@ -0,0 +1,9 @@
+import { ColorPalette } from '@app/core';
+
+describe('ColorPalatte', () => {
+    it('should generate colors', () => {
+        const palette = ColorPalette.colors();
+
+        expect(palette.colors.length).toBeGreaterThan(20);
+    });
+});
diff --git a/src/core/utils/color-palette.ts b/src/core/utils/color-palette.ts
@@ -0,0 +1,34 @@
+import { Color } from '@app/core';
+
+const BREWERS = {
+      greys: [0xffffff, 0xF0F0F0, 0xbdbdbd, 0x969696, 0x737373, 0x525252, 0x252525, 0x000000],
+    oranges: [0xfee6ce, 0xfdd0a2, 0xfdae6b, 0xfd8d3c, 0xf16913, 0xd94801, 0xa63603, 0x7f2704],
+       reds: [0xfee0d2, 0xfcbba1, 0xfc9272, 0xfb6a4a, 0xef3b2c, 0xcb181d, 0xa50f15, 0x67000d],
+     greens: [0xe5f5e0, 0xc7e9c0, 0xa1d99b, 0x74c476, 0x41ab5d, 0x238b45, 0x006d2c, 0x00441b],
+    purples: [0xefedf5, 0xdadaeb, 0xbcbddc, 0x9e9ac8, 0x807dba, 0x6a51a3, 0x54278f, 0x3f007d],
+      blues: [0xdeebf7, 0xc6dbef, 0x9ecae1, 0x6baed6, 0x4292c6, 0x2171b5, 0x08519c, 0x08306b]
+};
+
+export class ColorPalette {
+    constructor(
+        public readonly colors: Color[],
+        public readonly defaultColor: Color
+    ) {
+    }
+
+    public static colors(): ColorPalette {
+        const colors: Color[] = [];
+
+        for (let key in BREWERS) {
+            if (BREWERS.hasOwnProperty(key)) {
+                const brewer = BREWERS[key];
+
+                for (let color of brewer) {
+                    colors.push(Color.fromNumber(color));
+                }
+            }
+        }
+
+        return new ColorPalette(colors, colors[7]);
+    }
+}