Permalink
Browse files

Add Sandbox!

  • Loading branch information...
sorvell committed Apr 26, 2013
1 parent 68e4d88 commit 02e45ebfc4815816544b608077880f949a10e8ea
View
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
View
Binary file not shown.
View
Binary file not shown.
View
@@ -0,0 +1,40 @@
+<!--
+Copyright 2013 The Toolkitchen Authors. All rights reserved.
+Use of this source code is governed by a BSD-style
+license that can be found in the LICENSE file.
+-->
+<link rel="import" href="../../toolkit/components/g-panels.html">
+<link rel="import" href="../../toolkit/components/g-tabs.html">
+<link rel="import" href="../../toolkit/components/g-ratings.html">
+<link rel="import" href="../../toolkit/components/g-sidebar.html">
+<link rel="import" href="../../toolkit/components/g-togglebutton.html">
+<link rel="import" href="../../toolkit/components/g-toolbar.html">
+<link rel="import" href="../../toolkit/components/g-icon-button.html">
+<link rel="import" href="../../toolkit/components/g-menu-item.html">
+<link rel="import" href="../../toolkit/components/g-menu.html">
+<link rel="import" href="../../toolkit/components/g-ajax.html">
+<!-- -->
+<link rel="import" href="../../toolkit/components/animation/g-blink.html">
+<link rel="import" href="../../toolkit/components/animation/g-bounce.html">
+<link rel="import" href="../../toolkit/components/animation/g-flip.html">
+<link rel="import" href="../../toolkit/components/animation/g-shake.html">
+<!-- -->
+<link rel="import" href="../../pantry/Chart.js/chart-js.html">
+<link rel="import" href="../../pantry/Ace/Ace.html">
+<link rel="import" href="../../pantry/CoolClock/coolclock.html">
+<link rel="import" href="../../pantry/js-beautify/js-beautify.html">
+<link rel="import" href="../../pantry/Stock/stock.html">
+<link rel="import" href="../../pantry/Weather/wu-weather.html">
+<link rel="import" href="../../pantry/humane-js/humane-js.html">
+<link rel="import" href="../../pantry/smoothie-charts/smoothie-chart.html">
+<link rel="import" href="../../pantry/marked/marked-js.html">
+<link rel="import" href="../../pantry/pdf.js/pdf-js.html">
+<!-- -->
+<link rel="import" href="tk-meta.html">
+<link rel="import" id="metadata" href="metadata.html">
+<!-- -->
+<link rel="import" href="tk-canvas.html">
+<link rel="import" href="tk-palette.html">
+<link rel="import" href="tk-inspector.html">
+<link rel="import" href="tk-source.html">
+<link rel="import" href="tk-app.html">
View
Binary file not shown.
View
Binary file not shown.
View
Binary file not shown.
View
Binary file not shown.
View
Binary file not shown.
View
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 15.0.0, SVG Export Plug-In -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" [
+ <!ENTITY ns_flows "http://ns.adobe.com/Flows/1.0/">
+]>
+<svg version="1.1"
+ xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
+ x="0px" y="0px" width="21px" height="21px" viewBox="0 0 21 21" overflow="visible" enable-background="new 0 0 21 21"
+ xml:space="preserve">
+<defs>
+</defs>
+<g>
+ <polygon fill="#dd4b39" points="10.5,5 11.711,9.201 16,9.201 12.5,11.764 13.898,16 10.5,13.291 7.101,16 8.5,11.764 5,9.201
+ 9.289,9.201 "/>
+</g>
+<path fill="#ab1400" d="M10.498,5.902l0.975,3.369c0.029,0.105,0.129,0.18,0.24,0.18c0.002,0,0.002,0,0.002,0h3.492l-2.857,2.109
+ c-0.088,0.064-0.125,0.178-0.09,0.281l1.135,3.439l-2.742-2.186c-0.045-0.037-0.1-0.055-0.154-0.055
+ c-0.057,0-0.111,0.018-0.156,0.055L7.6,15.281l1.137-3.439c0.033-0.104-0.002-0.217-0.09-0.281L5.787,9.451h3.498h0.006
+ c0.111,0,0.209-0.074,0.24-0.18L10.498,5.902 M10.498,5L9.291,9.201H5l3.498,2.562L7.1,16l3.398-2.709L13.895,16l-1.398-4.236
+ l3.499-2.562h-4.282L10.498,5L10.498,5z M15.995,9.201H16H15.995z"/>
+
+</svg>
View
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<!--
+Copyright 2013 The Toolkitchen Authors. All rights reserved.
+Use of this source code is governed by a BSD-style
+license that can be found in the LICENSE file.
+-->
+<html>
+ <head>
+ <title>UI Toolkit Sandbox</title>
+ <meta charset="UTF-8">
+ <script src="../../toolkit/toolkit.js"></script>
+ <link rel="import" id="components" href="components.html">
+ <style>
+ body, html {
+ position: relative;
+ height: 100%;
+ }
+ body {
+ margin: 0;
+ overflow: hidden;
+ font-family: Arial;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ background-color: whitesmoke;
+ }
+ tk-app {
+ position: absolute;
+ left: 0;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ }
+ </style>
+ </head>
+ <body>
+ <tk-app touch-action="none"></tk-app>
+ </body>
+</html>
View
@@ -0,0 +1,143 @@
+<tk-meta id="g-toolbar" label="Toolbar">
+ <template>
+ <g-toolbar style="right: 0px; left: 0px;">
+ <g-icon-button src="images/star_full.svg" active="true"></g-icon-button>
+ <div class="flex">Toolbar</div>
+ <g-toolbar responsive="true">
+ <g-icon-button src="images/add.png"></g-icon-button>
+ <g-icon-button src="images/favorite.png"></g-icon-button>
+ </g-toolbar>
+ <g-icon-button src="images/hangout.png"></g-icon-button>
+ </g-toolbar>
+ </template>
+</tk-meta>
+
+<tk-meta id="g-tabs" label="Tabs">
+ <template>
+ <g-tabs selected="0">
+ <span>One</span>
+ <span>Two</span>
+ <span>Three</span>
+ <span>Four</span>
+ </g-tabs>
+ </template>
+</tk-meta>
+
+<tk-meta id="g-ratings" label="Ratings"></tk-meta>
+
+<tk-meta id="g-togglebutton" label="Toggle Button"></tk-meta>
+
+<tk-meta id="g-menu" label="Menu">
+ <template>
+ <g-menu selected="0">
+ <g-menu-item src="images/comment.png">Post a Comment</g-menu-item>
+ <g-menu-item src="images/hangout.png">Share Link</g-menu-item>
+ <g-menu-item src="images/mail.png">Email Link</g-menu-item>
+ <g-menu-item src="images/favorite.png">Add to Favorites</g-menu-item>
+ </g-menu>
+ </template>
+</tk-meta>
+
+<tk-meta id="div" label="Caption">
+ <template>
+ <div style="border: 1px dotted silver; padding: 6px;">A Caption</div>
+ </template>
+</tk-meta>
+
+<tk-meta id="chart-js" label="Chart.js">
+ <property name="kind" kind="select" options="Bar,Line,Radar,Pie,PolarArea"></property>
+ <property name="color" kind="color"></property>
+</tk-meta>
+
+<tk-meta id="ajaxorg-ace" label="Ace Editor">
+ <template>
+ <ajaxorg-ace style="border: 1px dotted silver; width: 300px; height: 200px;"></ajaxorg-ace>
+ </template>
+</tk-meta>
+
+<tk-meta id="x-coolclock" label="CoolClock"></tk-meta>
+
+<tk-meta id="g-ajax" label="Ajax">
+ <template>
+ <g-ajax style="border: 1px dotted silver; padding: 8px;">Ajax</g-ajax>
+ </template>
+ <property name="handleAs" kind="select" options="json,text,xml"></property>
+</tk-meta>
+
+<tk-meta id="g-blink" label="Blink">
+ <template>
+ <g-blink style="border: 1px dotted silver; padding: 8px;">Blink</g-blink>
+ </template>
+</tk-meta>
+
+<tk-meta id="g-bounce" label="Bounce">
+ <template>
+ <g-bounce style="border: 1px dotted silver; padding: 8px;">Bounce</g-bounce>
+ </template>
+</tk-meta>
+
+<tk-meta id="g-flip" label="Flip">
+ <template>
+ <g-flip style="border: 1px dotted silver; padding: 8px;">Flip</g-flip>
+ </template>
+</tk-meta>
+
+<tk-meta id="g-shake" label="Shake">
+ <template>
+ <g-shake style="border: 1px dotted silver; padding: 8px;">Shake</g-shake>
+ </template>
+</tk-meta>
+
+<tk-meta id="g-flip-bounce" label="Flip & Bounce">
+ <template>
+ <g-animation-group type="seq" style="border: 1px dotted silver; padding: 8px">
+ <g-flip style="border: 1px dotted silver; padding: 8px;">Flip</g-flip>
+ <g-bounce startOffset="-0.2" magnitude="-100px" style="border: 1px dotted silver; padding: 8px;">Bounce</g-bounce>
+ SeqGroup
+ </g-animation-group>
+ </template>
+</tk-meta>
+
+<tk-meta id="g-flip-out" label="Flip Out">
+ <template>
+ <g-animation-group type="par" style="border: 1px dotted silver; padding: 8px">
+ <g-flip duration="0.7" style="border: 1px dotted silver; padding: 8px;">Flip</g-flip>
+ <g-animation duration="0.5" startOffset="0.5" easing="ease-out" style="border: 1px dotted silver; padding: 8px">
+ <g-property name="opacity">
+ <g-keyframe value="1"></g-keyframe>
+ <g-keyframe value="0"></g-keyframe>
+ </g-property>
+ Fade Out
+ </g-animation>
+ ParGroup
+ </g-animation-group>
+ </template>
+</tk-meta>
+
+<tk-meta id="x-stock" label="Stock">
+ <template>
+ <x-stock symbol="GOOG"></x-stock>
+ </template>
+</tk-meta>
+
+<tk-meta id="wu-weather" label="Weather"></tk-meta>
+
+<tk-meta id="tk-app" label="Sandbox App">
+ <template>
+ <tk-app style="width: 900px; height: 600px;"></tk-app>
+ </template>
+</tk-meta>
+
+<tk-meta id="humane-js" label="Notification">
+ <template>
+ <humane-js onclick="log()" style="border: 3px dotted gray; background-color: silver; padding: 12px;">Notification</humane-js>
+ </template>
+</tk-meta>
+
+<tk-meta id="pdf-js" label="PDF Reader"></tk-meta>
+
+<tk-meta id="smoothie-chart" label="Smoothie Chart"></tk-meta>
+
+<tk-meta id="marked-js" label="Markdown Renderer">
+ <property name="text" kind="text"></property>
+</tk-meta>
View
@@ -0,0 +1,14 @@
+[
+ {
+ "value": 30,
+ "color": "#F38630"
+ },
+ {
+ "value": 50,
+ "color": "#E0E4CC"
+ },
+ {
+ "value": 100,
+ "color": "#69D2E7"
+ }
+]
View
@@ -0,0 +1,72 @@
+/*
+ * Copyright 2013 The Toolkitchen Authors. All rights reserved.
+ * Use of this source code is governed by a BSD-style
+ * license that can be found in the LICENSE file.
+ */
+
+(function() {
+
+function reflect(element, name) {
+ return {
+ obj: element,
+ name: name,
+ value: element[name],
+ meta: element.meta && element.meta[name]
+ };
+}
+
+function reflectProperty(element, name) {
+ var v = element[name];
+ if (v !== null
+ && v !== undefined
+ && typeof v !== 'function'
+ && typeof v !== 'object'
+ //&& element.propertyIsEnumerable(k)
+ && !reflectProperty.blacklist[name]) {
+ var prop = reflect(element, name);
+ }
+ return prop;
+}
+
+reflectProperty.blacklist = {isToolkitElement: 1};
+
+function reflectProperties(element) {
+ var props = [];
+ if (element) {
+ var found = {};
+ var p = element.__proto__;
+ while (p && p !== HTMLElement.prototype/*&& p.isToolkitElement*/) {
+ var k = Object.keys(p);
+ k.forEach(function(k) {
+ if (found[k]) {
+ return;
+ }
+ var prop = reflectProperty(element, k);
+ if (prop) {
+ props.push(prop);
+ found[k] = true;
+ }
+ });
+ p = p.__proto__;
+ }
+ //
+ var more = [];
+ if (!element.firstElementChild) {
+ more.push('textContent');
+ }
+ more.push('id');
+ more.forEach(function(k) {
+ var v = element[k];
+ if (typeof v !== 'function' && typeof v !== 'object') {
+ props.push(reflect(element, k));
+ }
+ });
+ }
+ return props;
+}
+
+window.Reflection = {
+ properties: reflectProperties
+};
+
+})();
Oops, something went wrong.

0 comments on commit 02e45eb

Please sign in to comment.