Initial add from apps

packages/ui-identicon/src/beachball/shape/circle.spec.js

@@ -0,0 +1,18 @@
+// Copyright 2017-2018 @polkadot/ui-identicon authors & contributors
+// This software may be modified and distributed under the terms
+// of the Apache-2.0 license. See the LICENSE file for details.
+
+import xmlserializer from 'xmlserializer';
+
+import seeder from '../seeder';
+import circle from './circle';
+
+describe('circle', () => {
+  it('creates a circle shape', () => {
+    expect(
+      xmlserializer.serializeToString(
+        circle(seeder(), 'blue', 50, 2)
+      )
+    ).toEqual('<circle xmlns="http://www.w3.org/2000/svg" cx="25" cy="32.5" r="15" fill="blue"/>');
+  });
+});

packages/ui-identicon/src/beachball/shape/circle.ts

@@ -0,0 +1,23 @@
+// Copyright 2016 Dan Finlay
+// Copyright 2017-2018 @polkadot/ui-identicon authors & contributors
+// This software may be modified and distributed under the terms
+// of the Apache-2.0 license. See the LICENSE file for details.
+
+import { Seeder } from '../types';
+
+import newCircle from '../svg/circle';
+import { SHAPE_COUNT } from '../defaults';
+
+export default function circle (seeder: Seeder, fill: string, diameter: number, count: number): Element {
+  const center = diameter / 2;
+  const angle = seeder() * 360;
+  const radius = (((SHAPE_COUNT - count) / SHAPE_COUNT) * (diameter / 2)) + ((diameter / 8) * seeder());
+  const offset = (diameter / 4) * (seeder() + ((count + 1) / SHAPE_COUNT));
+  const cx = (offset * Math.sin(angle)) + center;
+  const cy = (offset * Math.cos(angle)) + center;
+  const svg = newCircle(radius, cx, cy);
+
+  svg.setAttributeNS('', 'fill', fill);
+
+  return svg;
+}

packages/ui-identicon/src/beachball/shape/square.ts

@@ -0,0 +1,26 @@
+// Copyright 2016 Dan Finlay
+// Copyright 2017-2018 @polkadot/ui-identicon authors & contributors
+// This software may be modified and distributed under the terms
+// of the Apache-2.0 license. See the LICENSE file for details.
+
+import { Seeder } from '../types';
+
+import newRect from '../svg/rect';
+import { SHAPE_COUNT } from '../defaults';
+
+export default function square (seeder: Seeder, fill: string, diameter: number, count: number): Element {
+  const center = diameter / 2;
+  const svg = newRect(diameter);
+  const firstRot = seeder();
+  const angle = Math.PI * 2 * firstRot;
+  const scale = count / SHAPE_COUNT;
+  const velocity = ((diameter / SHAPE_COUNT) * seeder()) + (scale * diameter);
+  const tx = (Math.cos(angle) * velocity).toFixed(3);
+  const ty = (Math.sin(angle) * velocity).toFixed(3);
+  const rot = ((firstRot * 360) + (seeder() * 180)).toFixed(1);
+
+  svg.setAttributeNS('', 'transform', `translate(${tx} ${ty}) rotate(${rot} ${center} ${center})`);
+  svg.setAttributeNS('', 'fill', fill);
+
+  return svg;
+}