fix samples in playground
This commit is contained in:
ido
parent
bf3c5d550a
commit
6bdd57cec2
|
|
@ -22,12 +22,12 @@ define(['react', 'lodash', 'jquery', './libs/codemirror-4.8/lib/codemirror'], fu
|
|||
var GUTTER_ID = 'rt-annotations';
|
||||
|
||||
function annotate(editor, annot) {
|
||||
if (annot.index) {
|
||||
//posFromIndex
|
||||
var pos = editor.findPosH({line: 0, ch: 0}, 25, 'char');
|
||||
var range = editor.findWordAt(pos);
|
||||
editor.markText(range.anchor, range.head, {className: 'editor-error'});
|
||||
}
|
||||
//if (annot.index) {
|
||||
// //posFromIndex
|
||||
// var pos = editor.findPosH({line: 0, ch: 0}, 25, 'char');
|
||||
// var range = editor.findWordAt(pos);
|
||||
// editor.markText(range.anchor, range.head, {className: 'editor-error'});
|
||||
//}
|
||||
var tipLabel = /*state.hasGutter &&*/ document.createDocumentFragment();
|
||||
var ann = {severity: 'error', message: annot.message};
|
||||
tipLabel.appendChild(annotationTooltip(ann));
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ define(['lodash', 'react', './examples.rt',
|
|||
// return {templateProps: tuple[0], templateHTML: tuple[1]};
|
||||
//});
|
||||
Object.keys(samples).forEach(function (k) {
|
||||
samples[k] = {name: k, templateProps: samples[k][0], templateHTML: samples[k][1]};
|
||||
samples[k] = {name: k, templateProps: _.template(samples[k][0], {name: k}), templateHTML: samples[k][1]};
|
||||
});
|
||||
|
||||
var Examples = React.createClass({
|
||||
|
|
|
|||
|
|
@ -8,7 +8,8 @@ requirejs.config({
|
|||
//ace: '../ace-builds-1.1.8/src-min/ace',
|
||||
fiddle: './fiddle',
|
||||
text: 'libs/requirejs-plugins/text',
|
||||
json: 'libs/requirejs-plugins/json'
|
||||
json: 'libs/requirejs-plugins/json',
|
||||
bootstrap: 'libs/bootstrap/bootstrap.min',
|
||||
//codeMirror: 'libs/codemirror-4.8/lib/codemirror',
|
||||
//htmlmixed: 'libs/codemirror-4.8/mode/htmlmixed/htmlmixed',
|
||||
//javascript: 'libs/codemirror-4.8/mode/javascript/javascript'
|
||||
|
|
@ -28,7 +29,7 @@ requirejs.config({
|
|||
}
|
||||
});
|
||||
|
||||
requirejs(['jquery', 'react', 'fiddle'], function ($, React, fiddle) {
|
||||
requirejs(['jquery', 'react', 'fiddle', 'bootstrap'], function ($, React, fiddle) {
|
||||
'use strict';
|
||||
window.fiddle = React.render(fiddle(), document.getElementById('container'));
|
||||
$(function () {
|
||||
|
|
|
|||
|
|
@ -62,7 +62,7 @@ define(['react', 'firebase', 'lodash', './fiddle.rt', 'jquery'], function (React
|
|||
$.get('playground/samples/' + name + '.code', null, function (data2, textStatus2, jqXHR2) {
|
||||
var currentState = {
|
||||
templateHTML: rt,
|
||||
templateProps: data2
|
||||
templateProps: _.template(data2, {name: 'template'})
|
||||
};
|
||||
//this.updateSample(currentState);
|
||||
playground.setState(currentState);
|
||||
|
|
|
|||
|
|
@ -31,6 +31,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<ul class="nav-site">
|
||||
<li><a href="index.html">HOME</a></li>
|
||||
<li><a href="https://github.com/wix/react-templates">docs</a></li>
|
||||
<!--<li><a href="https://github.com/wix/react-templates">support</a></li>-->
|
||||
<li><a href="https://github.com/wix/react-templates">download</a></li>
|
||||
|
|
|
|||
|
|
@ -90,7 +90,7 @@ define([
|
|||
'tabIndex': '-1',
|
||||
'href': '#',
|
||||
'onClick': onClick7.bind(this)
|
||||
}, 'Weather'))))), React.createElement('ul', { 'className': 'nav-site' }, React.createElement('li', {}, React.createElement('a', { 'href': 'https://github.com/wix/react-templates' }, 'docs')) /* <li><a href="https://github.com/wix/react-templates">support</a></li> */, React.createElement('li', {}, React.createElement('a', { 'href': 'https://github.com/wix/react-templates' }, 'download')) /* <li><a href="https://github.com/wix/react-templates/">blog</a></li> */, React.createElement('li', {}, React.createElement('a', { 'href': 'https://github.com/wix/react-templates' }, 'github')))), React.createElement('div', { 'className': 'playground-container' }, React.createElement(playground, {
|
||||
}, 'Weather'))))), React.createElement('ul', { 'className': 'nav-site' }, React.createElement('li', {}, React.createElement('a', { 'href': 'index.html' }, 'HOME')), React.createElement('li', {}, React.createElement('a', { 'href': 'https://github.com/wix/react-templates' }, 'docs')) /* <li><a href="https://github.com/wix/react-templates">support</a></li> */, React.createElement('li', {}, React.createElement('a', { 'href': 'https://github.com/wix/react-templates' }, 'download')) /* <li><a href="https://github.com/wix/react-templates/">blog</a></li> */, React.createElement('li', {}, React.createElement('a', { 'href': 'https://github.com/wix/react-templates' }, 'github')))), React.createElement('div', { 'className': 'playground-container' }, React.createElement(playground, {
|
||||
'ref': 'playground',
|
||||
'direction': 'vertical',
|
||||
'fiddle': true
|
||||
|
|
|
|||
|
|
@ -0,0 +1,181 @@
|
|||
/*!
|
||||
* Bootstrap v3.3.1 (http://getbootstrap.com)
|
||||
* Copyright 2011-2014 Twitter, Inc.
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||
*/
|
||||
|
||||
/*!
|
||||
* Generated using the Bootstrap Customizer (http://getbootstrap.com/customize/?id=b3a553f0244f7a115bca)
|
||||
* Config saved to config.json and https://gist.github.com/b3a553f0244f7a115bca
|
||||
*/
|
||||
if (typeof jQuery === 'undefined') {
|
||||
throw new Error('Bootstrap\'s JavaScript requires jQuery')
|
||||
}
|
||||
+function ($) {
|
||||
var version = $.fn.jquery.split(' ')[0].split('.')
|
||||
if ((version[0] < 2 && version[1] < 9) || (version[0] == 1 && version[1] == 9 && version[2] < 1)) {
|
||||
throw new Error('Bootstrap\'s JavaScript requires jQuery version 1.9.1 or higher')
|
||||
}
|
||||
}(jQuery);
|
||||
|
||||
/* ========================================================================
|
||||
* Bootstrap: dropdown.js v3.3.1
|
||||
* http://getbootstrap.com/javascript/#dropdowns
|
||||
* ========================================================================
|
||||
* Copyright 2011-2014 Twitter, Inc.
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||
* ======================================================================== */
|
||||
|
||||
|
||||
+function ($) {
|
||||
'use strict';
|
||||
|
||||
// DROPDOWN CLASS DEFINITION
|
||||
// =========================
|
||||
|
||||
var backdrop = '.dropdown-backdrop'
|
||||
var toggle = '[data-toggle="dropdown"]'
|
||||
var Dropdown = function (element) {
|
||||
$(element).on('click.bs.dropdown', this.toggle)
|
||||
}
|
||||
|
||||
Dropdown.VERSION = '3.3.1'
|
||||
|
||||
Dropdown.prototype.toggle = function (e) {
|
||||
var $this = $(this)
|
||||
|
||||
if ($this.is('.disabled, :disabled')) return
|
||||
|
||||
var $parent = getParent($this)
|
||||
var isActive = $parent.hasClass('open')
|
||||
|
||||
clearMenus()
|
||||
|
||||
if (!isActive) {
|
||||
if ('ontouchstart' in document.documentElement && !$parent.closest('.navbar-nav').length) {
|
||||
// if mobile we use a backdrop because click events don't delegate
|
||||
$('<div class="dropdown-backdrop"/>').insertAfter($(this)).on('click', clearMenus)
|
||||
}
|
||||
|
||||
var relatedTarget = { relatedTarget: this }
|
||||
$parent.trigger(e = $.Event('show.bs.dropdown', relatedTarget))
|
||||
|
||||
if (e.isDefaultPrevented()) return
|
||||
|
||||
$this
|
||||
.trigger('focus')
|
||||
.attr('aria-expanded', 'true')
|
||||
|
||||
$parent
|
||||
.toggleClass('open')
|
||||
.trigger('shown.bs.dropdown', relatedTarget)
|
||||
}
|
||||
|
||||
return false
|
||||
}
|
||||
|
||||
Dropdown.prototype.keydown = function (e) {
|
||||
if (!/(38|40|27|32)/.test(e.which) || /input|textarea/i.test(e.target.tagName)) return
|
||||
|
||||
var $this = $(this)
|
||||
|
||||
e.preventDefault()
|
||||
e.stopPropagation()
|
||||
|
||||
if ($this.is('.disabled, :disabled')) return
|
||||
|
||||
var $parent = getParent($this)
|
||||
var isActive = $parent.hasClass('open')
|
||||
|
||||
if ((!isActive && e.which != 27) || (isActive && e.which == 27)) {
|
||||
if (e.which == 27) $parent.find(toggle).trigger('focus')
|
||||
return $this.trigger('click')
|
||||
}
|
||||
|
||||
var desc = ' li:not(.divider):visible a'
|
||||
var $items = $parent.find('[role="menu"]' + desc + ', [role="listbox"]' + desc)
|
||||
|
||||
if (!$items.length) return
|
||||
|
||||
var index = $items.index(e.target)
|
||||
|
||||
if (e.which == 38 && index > 0) index-- // up
|
||||
if (e.which == 40 && index < $items.length - 1) index++ // down
|
||||
if (!~index) index = 0
|
||||
|
||||
$items.eq(index).trigger('focus')
|
||||
}
|
||||
|
||||
function clearMenus(e) {
|
||||
if (e && e.which === 3) return
|
||||
$(backdrop).remove()
|
||||
$(toggle).each(function () {
|
||||
var $this = $(this)
|
||||
var $parent = getParent($this)
|
||||
var relatedTarget = { relatedTarget: this }
|
||||
|
||||
if (!$parent.hasClass('open')) return
|
||||
|
||||
$parent.trigger(e = $.Event('hide.bs.dropdown', relatedTarget))
|
||||
|
||||
if (e.isDefaultPrevented()) return
|
||||
|
||||
$this.attr('aria-expanded', 'false')
|
||||
$parent.removeClass('open').trigger('hidden.bs.dropdown', relatedTarget)
|
||||
})
|
||||
}
|
||||
|
||||
function getParent($this) {
|
||||
var selector = $this.attr('data-target')
|
||||
|
||||
if (!selector) {
|
||||
selector = $this.attr('href')
|
||||
selector = selector && /#[A-Za-z]/.test(selector) && selector.replace(/.*(?=#[^\s]*$)/, '') // strip for ie7
|
||||
}
|
||||
|
||||
var $parent = selector && $(selector)
|
||||
|
||||
return $parent && $parent.length ? $parent : $this.parent()
|
||||
}
|
||||
|
||||
|
||||
// DROPDOWN PLUGIN DEFINITION
|
||||
// ==========================
|
||||
|
||||
function Plugin(option) {
|
||||
return this.each(function () {
|
||||
var $this = $(this)
|
||||
var data = $this.data('bs.dropdown')
|
||||
|
||||
if (!data) $this.data('bs.dropdown', (data = new Dropdown(this)))
|
||||
if (typeof option == 'string') data[option].call($this)
|
||||
})
|
||||
}
|
||||
|
||||
var old = $.fn.dropdown
|
||||
|
||||
$.fn.dropdown = Plugin
|
||||
$.fn.dropdown.Constructor = Dropdown
|
||||
|
||||
|
||||
// DROPDOWN NO CONFLICT
|
||||
// ====================
|
||||
|
||||
$.fn.dropdown.noConflict = function () {
|
||||
$.fn.dropdown = old
|
||||
return this
|
||||
}
|
||||
|
||||
|
||||
// APPLY TO STANDARD DROPDOWN ELEMENTS
|
||||
// ===================================
|
||||
|
||||
$(document)
|
||||
.on('click.bs.dropdown.data-api', clearMenus)
|
||||
.on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
|
||||
.on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle)
|
||||
.on('keydown.bs.dropdown.data-api', toggle, Dropdown.prototype.keydown)
|
||||
.on('keydown.bs.dropdown.data-api', '[role="menu"]', Dropdown.prototype.keydown)
|
||||
.on('keydown.bs.dropdown.data-api', '[role="listbox"]', Dropdown.prototype.keydown)
|
||||
|
||||
}(jQuery);
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
/*!
|
||||
* Bootstrap v3.3.1 (http://getbootstrap.com)
|
||||
* Copyright 2011-2014 Twitter, Inc.
|
||||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
||||
*/
|
||||
|
||||
/*!
|
||||
* Generated using the Bootstrap Customizer (http://getbootstrap.com/customize/?id=b3a553f0244f7a115bca)
|
||||
* Config saved to config.json and https://gist.github.com/b3a553f0244f7a115bca
|
||||
*/
|
||||
if("undefined"==typeof jQuery)throw new Error("Bootstrap's JavaScript requires jQuery");+function(t){var o=t.fn.jquery.split(" ")[0].split(".");if(o[0]<2&&o[1]<9||1==o[0]&&9==o[1]&&o[2]<1)throw new Error("Bootstrap's JavaScript requires jQuery version 1.9.1 or higher")}(jQuery),+function(t){"use strict";function o(o){o&&3===o.which||(t(n).remove(),t(a).each(function(){var e=t(this),n=r(e),a={relatedTarget:this};n.hasClass("open")&&(n.trigger(o=t.Event("hide.bs.dropdown",a)),o.isDefaultPrevented()||(e.attr("aria-expanded","false"),n.removeClass("open").trigger("hidden.bs.dropdown",a)))}))}function r(o){var r=o.attr("data-target");r||(r=o.attr("href"),r=r&&/#[A-Za-z]/.test(r)&&r.replace(/.*(?=#[^\s]*$)/,""));var e=r&&t(r);return e&&e.length?e:o.parent()}function e(o){return this.each(function(){var r=t(this),e=r.data("bs.dropdown");e||r.data("bs.dropdown",e=new i(this)),"string"==typeof o&&e[o].call(r)})}var n=".dropdown-backdrop",a='[data-toggle="dropdown"]',i=function(o){t(o).on("click.bs.dropdown",this.toggle)};i.VERSION="3.3.1",i.prototype.toggle=function(e){var n=t(this);if(!n.is(".disabled, :disabled")){var a=r(n),i=a.hasClass("open");if(o(),!i){"ontouchstart"in document.documentElement&&!a.closest(".navbar-nav").length&&t('<div class="dropdown-backdrop"/>').insertAfter(t(this)).on("click",o);var d={relatedTarget:this};if(a.trigger(e=t.Event("show.bs.dropdown",d)),e.isDefaultPrevented())return;n.trigger("focus").attr("aria-expanded","true"),a.toggleClass("open").trigger("shown.bs.dropdown",d)}return!1}},i.prototype.keydown=function(o){if(/(38|40|27|32)/.test(o.which)&&!/input|textarea/i.test(o.target.tagName)){var e=t(this);if(o.preventDefault(),o.stopPropagation(),!e.is(".disabled, :disabled")){var n=r(e),i=n.hasClass("open");if(!i&&27!=o.which||i&&27==o.which)return 27==o.which&&n.find(a).trigger("focus"),e.trigger("click");var d=" li:not(.divider):visible a",s=n.find('[role="menu"]'+d+', [role="listbox"]'+d);if(s.length){var p=s.index(o.target);38==o.which&&p>0&&p--,40==o.which&&p<s.length-1&&p++,~p||(p=0),s.eq(p).trigger("focus")}}}};var d=t.fn.dropdown;t.fn.dropdown=e,t.fn.dropdown.Constructor=i,t.fn.dropdown.noConflict=function(){return t.fn.dropdown=d,this},t(document).on("click.bs.dropdown.data-api",o).on("click.bs.dropdown.data-api",".dropdown form",function(t){t.stopPropagation()}).on("click.bs.dropdown.data-api",a,i.prototype.toggle).on("keydown.bs.dropdown.data-api",a,i.prototype.keydown).on("keydown.bs.dropdown.data-api",'[role="menu"]',i.prototype.keydown).on("keydown.bs.dropdown.data-api",'[role="listbox"]',i.prototype.keydown)}(jQuery);
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
/*eslint-env browser*/
|
||||
define(['react', 'jquery', 'lodash', './playground-fiddle.rt', './playground.rt', './CMLint'], function (React, $, _, pgFiddleTemplate, playgroundTemplate, CMLint) {
|
||||
define(['react', 'jquery', 'lodash', './playground-fiddle.rt', './playground.rt'], function (React, $, _, pgFiddleTemplate, playgroundTemplate) {
|
||||
'use strict';
|
||||
function emptyFunc() {
|
||||
return null;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
var hello = React.createClass({
|
||||
var <%= name %> = React.createClass({
|
||||
render: function () {
|
||||
return helloRT.apply(this);
|
||||
return <%= name %>RT.apply(this);
|
||||
}
|
||||
});
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
var rtIf = React.createClass({
|
||||
var <%= name %> = React.createClass({
|
||||
getInitialState: function () {
|
||||
return {open: false};
|
||||
},
|
||||
|
|
@ -6,6 +6,6 @@ var rtIf = React.createClass({
|
|||
this.setState({open: !this.state.open});
|
||||
},
|
||||
render: function () {
|
||||
return rtIfRT.apply(this);
|
||||
return <%= name %>RT.apply(this);
|
||||
}
|
||||
});
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
var props = React.createClass({
|
||||
var <%= name %> = React.createClass({
|
||||
mixins: [React.addons.LinkedStateMixin],
|
||||
getInitialState: function() {
|
||||
return { key: 'color', val: 'blue' };
|
||||
|
|
@ -13,6 +13,6 @@ var props = React.createClass({
|
|||
return ret;
|
||||
},
|
||||
render: function () {
|
||||
return propsRT.apply(this);
|
||||
return <%= name %>RT.apply(this);
|
||||
}
|
||||
});
|
||||
|
|
@ -1,10 +1,10 @@
|
|||
var repeat = React.createClass({
|
||||
var <%= name %> = React.createClass({
|
||||
getInitialState: function () {
|
||||
return {
|
||||
items: ['One', 'Two', 'Three']
|
||||
};
|
||||
},
|
||||
render: function () {
|
||||
return repeatRT.apply(this);
|
||||
return <%= name %>RT.apply(this);
|
||||
}
|
||||
});
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
var todo = React.createClass({
|
||||
var <%= name %> = React.createClass({
|
||||
mixins: [React.addons.LinkedStateMixin],
|
||||
getInitialState: function () {
|
||||
return {edited: '', todos: [], counter: 0};
|
||||
|
|
@ -22,6 +22,6 @@ var todo = React.createClass({
|
|||
this.setState({todos: _.filter(this.state.todos, {done: false})});
|
||||
},
|
||||
render: function () {
|
||||
return todoRT.apply(this);
|
||||
return <%= name %>RT.apply(this);
|
||||
}
|
||||
});
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
var weather = React.createClass({
|
||||
var <%= name %> = React.createClass({
|
||||
mixins: [React.addons.LinkedStateMixin],
|
||||
getInitialState: function() {
|
||||
this.cityIds = [5391959,293397,2643743];
|
||||
|
|
@ -31,6 +31,6 @@ var weather = React.createClass({
|
|||
this.setState({ loading:false, info: result.list });
|
||||
},
|
||||
render: function () {
|
||||
return weatherRT.apply(this);
|
||||
return <%= name %>RT.apply(this);
|
||||
}
|
||||
});
|
||||
Loading…
Reference in New Issue