var webpack = require('webpack'); var path = require('path') varHtmlWebpackPlugin = require('html-webpack-plugin'); var paths = require('./webpack.paths') var loaders = require('./webpack.loaders')
connection.on("error", function () { if (connection.type == "control") { var indexControl = controlArr.indexOf(connection); if (indexControl != -1) { controlArr.splice(indexControl, 1);
} } if (connection.type == "show") { var indexShow = controlArr.indexOf(connection); if (indexShow != -1) { controlArr.splice(indexShow, 1);
var gulp = require('gulp'); var ts = require('gulp-typescript'); var shell = require('gulp-shell'); var argv = require('yargs').argv; var image = require('gulp-imagemin');
gulp.task('default', function () { // 将你的默认的任务代码放在这 console.log("hello gulp"); });
var gulp = require('gulp'); var ts = require('gulp-typescript'); var shell = require('gulp-shell'); var argv = require('yargs').argv; var image = require('gulp-imagemin'); var pngquant = require('imagemin-pngquant');
gulp.task('default', function () { // 将你的默认的任务代码放在这 console.log("hello gulp"); });
var gulp = require('gulp'); var ts = require('gulp-typescript'); var shell = require('gulp-shell'); var argv = require('yargs').argv; var image = require('gulp-imagemin'); var pngquant = require('imagemin-pngquant'); var cache = require('gulp-cache');
gulp.task('default', function () { // 将你的默认的任务代码放在这 console.log("hello gulp"); });
肯特·贝克和沃德·坎宁安在1987年，利用克里斯托佛·亚历山大在建筑设计领域里的思想开发了设计模式并把此思想应用在Smalltalk中的图形用户接口（GUI）的生成中。一年后埃里希·伽玛在他的苏黎世大学博士毕业论文中开始尝试把这种思想改写为适用于软件开发。与此同时James Coplien 在1989年至1991年也在利用相同的思想致力于C++的开发，而后于1991年发表了他的著作Advanced C++ Programming Styles and Idioms。同年Erich Gamma 得到了博士学位，然后去了美国，在那与Richard Helm, Ralph Johnson ,John Vlissides 合作出版了《设计模式：可复用面向对象软件的基础》（Design Patterns - Elements of Reusable Object-Oriented Software） 一书，在此书中共收录了23个设计模式。
这四位作者在软件开发领域里以“四人帮”（英语，Gang of Four，简称GoF）而闻名，并且他们在此书中的协作导致了软件设计模式的突破。有时，GoF也会用于代指《设计模式》这本书。[维基百科]
// String interpolation "var name = "Bob", time = "today"; `Hello ${name}, how are you ${time}?`"
// Construct an HTTP request prefix is used to interpret the replacements and construction POST`http://foo.org/bar?a=${a}&b=${b} Content-Type: application/json X-Credentials: ${credentials} { "foo": ${foo}, "bar": ${bar}}`(myOnReadyStateChangeHandler);
function f(x, y=12) { // y is 12 if not passed (or passed as undefined) return x + y; } f(3) == 15 function f(x, ...y) { // y is an Array return x * y.length; } f(3, "hello", true) == 6 function f(x, y, z) { return x + y + z; } // Pass each elem of array as argument f(...[1,2,3]) == 6
function f() { { let x; { // okay, block scoped name const x = "sneaky"; // error, const x = "foo"; } // error, already declared in block let x = "inner"; } }
// Proxying a normal object var target = {}; var handler = { get: function (receiver, name) { return `Hello, ${name}!`; } };
var p = new Proxy(target, handler); p.world === 'Hello, world!'; // Proxying a function object var target = function () { return 'I am the target'; }; var handler = { apply: function (receiver, ...args) { return 'I am the proxy'; } };
var p = new Proxy(target, handler); p() === 'I am the proxy';
// generates a new Universally unique identify (UUID) // the UUID is used to identify each of the tasks public static uuid() : string { /*jshint bitwise:false */ var i, random; var uuid = '';
for (i = 0; i < 32; i++) { random = Math.random() * 16 | 0; if (i === 8 || i === 12 || i === 16 || i === 20) { uuid += '-'; } uuid += (i === 12 ? 4 : (i === 16 ? (random & 3 | 8) : random)) .toString(16); }
return uuid; }
// adds 's' to the end of a given world when count > 1 public static pluralize(count, word) { return count === 1 ? word : word + 's'; }
// stores data using the localStorage API public static store(namespace, data?) { if (data) { return localStorage.setItem(namespace, JSON.stringify(data)); }
var store = localStorage.getItem(namespace); return (store && JSON.parse(store)) || []; }
// just a helper for inheritance public static extend(...objs : any[]) : any { var newObj = {}; for (var i = 0; i < objs.length; i++) { var obj = objs[i]; for (var key in obj) { if (obj.hasOwnProperty(key)) { newObj[key] = obj[key]; } } } return newObj; }
public toggleAll(checked) { // Note: it's usually better to use immutable // data structures since they're easier to // reason about and React works very // well with them. That's why we use // map() and filter() everywhere instead of // mutating the array or todo items themselves. this.todos = this.todos.map<ITodo>((todo : ITodo) => { return app.miscelanious.Utils.extend( {}, todo, {completed: checked} ); });
this.inform(); }
public toggle(todoToToggle) { this.todos = this.todos.map<ITodo>((todo : ITodo) => { return todo !== todoToToggle ? todo : app.miscelanious.Utils.extend( {}, todo, {completed: !todo.completed} ); });
export class TodoItem extends React.Component<ITodoItemProps, ITodoItemState> {
constructor(props : ITodoItemProps){ super(props); // set initial state this.state = { editText: this.props.todo.title }; }
public handleSubmit(event) { var val = this.state.editText.trim(); if (val) { this.props.onSave(val); this.setState({editText: val}); } else { this.props.onDestroy(); } }
public handleEdit() { this.props.onEdit(); this.setState({editText: this.props.todo.title}); }
public handleKeyDown(event) { if (event.which === app.constants.ESCAPE_KEY) { this.setState({editText: this.props.todo.title}); this.props.onCancel(event); } else if (event.which === app.constants.ENTER_KEY) { this.handleSubmit(event); } }
public handleChange(event) { this.setState({editText: event.target.value}); }
// This is a completely optional performance enhancement // that you can implement on any React component. If you // were to delete this method the app would still work // correctly (and still be very performant!), we just use it // as an example of how little code it takes to get an order // of magnitude performance improvement. public shouldComponentUpdate(nextProps, nextState) { return ( nextProps.todo !== this.props.todo || nextProps.editing !== this.props.editing || nextState.editText !== this.state.editText ); }
// Safely manipulate the DOM after updating the state // when invoking this.props.onEdit() in the handleEdit // method above. public componentDidUpdate(prevProps) { if (!prevProps.editing && this.props.editing) { var node = React.findDOMNode<HTMLInputElement>(this.refs["editField"]); node.focus(); node.setSelectionRange(node.value.length, node.value.length); } }
// We should have installed a type declaration file but // for the director npm package but it is not available // so we will use this declaration to avoid compilation // errors for now. declare var Router : any;
var TodoModel = app.models.TodoModel; var TodoFooter = app.components.TodoFooter; var TodoItem = app.components.TodoItem;
namespace app.components {
export class TodoApp extends React.Component<IAppProps, IAppState> {
public componentDidMount() { var setState = this.setState; // we will configure the Router here // our router is provided by the // director npm module // the router observes changes in the URL and // triggers some component's event accordingly var router = Router({ '/': setState.bind(this, {nowShowing: app.constants.ALL_TODOS}), '/active': setState.bind(this, {nowShowing: app.constants.ACTIVE_TODOS}), '/completed': setState.bind(this, {nowShowing: app.constants.COMPLETED_TODOS}) }); router.init('/'); }
public handleNewTodoKeyDown(event) { if (event.keyCode !== app.constants.ENTER_KEY) { return; }
event.preventDefault();
var val = React.findDOMNode<HTMLInputElement>(this.refs["newField"]).value.trim();
if (val) { this.props.model.addTodo(val); React.findDOMNode<HTMLInputElement>(this.refs["newField"]).value = ''; } }
public toggleAll(event) { var checked = event.target.checked; this.props.model.toggleAll(checked); }
public toggle(todoToToggle) { this.props.model.toggle(todoToToggle); }
public destroy(todo) { this.props.model.destroy(todo); }
public edit(todo) { this.setState({editing: todo.id}); }
public save(todoToSave, text) { this.props.model.save(todoToSave, text); this.setState({editing: null}); }
public cancel() { this.setState({editing: null}); }
public clearCompleted() { this.props.model.clearCompleted(); }
// the JSX syntax is quite intuitive but check out // https://facebook.github.io/react/docs/jsx-in-depth.html // if you need additional help public render() { var footer; var main; var todos = this.props.model.todos;
var shownTodos = todos.filter(function (todo) { switch (this.state.nowShowing) { case app.constants.ACTIVE_TODOS: return !todo.completed; case app.constants.COMPLETED_TODOS: return todo.completed; default: return true; } }, this);
public startBtn:eui.Button; 这里定义了一个共有变量,取名为startBtn，类型为eui.Button.注意 这里的名称很重要，可以对比图中的图层，一个Button组件，ID为startBtn. 这两者就同一个同一个ID关联起来了。即面板中的Button组件，游戏开始按钮，在逻辑代码中，我们操作startBtn这个代码中的逻辑，那么显示效果就跟着发生变化。
private sceneEvent: SceneEvent = new SceneEvent(SceneEvent.ChangeScene); 这里定义一个场景切换事件变量。
1 2 3 4 5 6
public childrenCreated() { this.startBtn.addEventListener(egret.TouchEvent.TOUCH_TAP,this.onTouchTab,this) this.sceneEvent.eventType = SceneEvent.GAME_PLAYING; }
