Skip to content

Instantly share code, notes, and snippets.

@flq
Last active October 10, 2015 23:45

Revisions

  1. flq revised this gist Aug 27, 2015. 4 changed files with 94 additions and 0 deletions.
    9 changes: 9 additions & 0 deletions EntryPoint.ts
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,9 @@
    import {assign} from 'lodash'

    function startModule() {
    //etc.
    }

    global['Project'] = assign(global['Project'] || {}, {
    startModule
    });
    15 changes: 15 additions & 0 deletions GulpfileBundling.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,15 @@
    var start = require('gulp-start-process');
    ...
    gulp.task('js_app', ['build_ts'], function() {
    var b = browserify({
    entries: ["ts_modules/area1/App.js", "ts_modules/area2/App.js"], debug: doMapFiles
    })
    .external(externalCommonModules.concat(['charting']))
    .bundle()
    .pipe(source('app.js'))
    .pipe(gulp.dest(targetRoot));
    });

    gulp.task('build_ts', function(cb) {
    return start('npm run compile_ts', cb);
    })
    49 changes: 49 additions & 0 deletions ReactComponentBeforeAndAfter.ts
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,49 @@
    //Before:
    var Button = React.createClass({
    render: function() {
    className = "fa " + this.props.icon;
    return (
    <button type="button" className="btn btn-primary" onClick={this._handleClick}>
    <span className={className} /> {this.props.caption}
    </button>
    );
    },

    _handleClick() {
    var shouldClose = this.props.handler();
    if (shouldClose)
    {
    this.props.onCloseRequest();
    }
    }
    });

    //After:
    import * as React from "react";
    type ReactProps = React.Props<React.DOMComponent<any>>;

    interface ButtonProps extends ReactProps {
    icon : string;
    caption : string;
    handler : ()=>boolean;
    onCloseRequest? : ()=>void;
    }

    class Button extends React.Component<ButtonProps,{}> {
    render() {
    var className = "fa " + this.props.icon;
    return (
    <button type="button" className="btn btn-primary" onClick={this.handleClick.bind(this)}>
    <span className={className} /> {this.props.caption}
    </button>
    );
    }

    private handleClick() {
    var shouldClose = this.props.handler();
    if (shouldClose)
    {
    this.props.onCloseRequest();
    }
    }
    }
    21 changes: 21 additions & 0 deletions ReactInitialStateBeforeAndAfter.ts
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,21 @@
    //Before:

    var AutoComplete = React.createClass({
    ...
    getInitialState() {
    var value = Common.coerceFieldValue(this.props);
    return { value: value };
    }
    });

    //After:

    export class AutoComplete extends React.Component<AutoCompleteProps, State> {

    constructor(props : AutoCompleteProps, context) {
    super(props,context);
    var value = HubConnectivity.coerceFieldValue(props);
    this.state = { value: value };
    }
    ...
    }
  2. flq revised this gist Aug 26, 2015. 1 changed file with 22 additions and 0 deletions.
    22 changes: 22 additions & 0 deletions Externals_shallow.d.ts
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,22 @@
    interface JQuery {
    autocomplete(options: any): JQuery;
    datepicker(options: any): JQuery;
    modal(arg : any) : JQuery; //From bootstrap
    ejChart(arg : any) : JQuery // From syncfusion
    }

    declare module ReactRouter {
    interface RouteHandlerProp {
    key : string | number;
    hub : any;
    state : Object;
    }

    interface RouteProp {
    hub? : any;
    }

    interface LinkProp {
    className : string;
    }
    }
  3. flq revised this gist Aug 26, 2015. 1 changed file with 4 additions and 4 deletions.
    8 changes: 4 additions & 4 deletions tsconfig.json
    Original file line number Diff line number Diff line change
    @@ -7,9 +7,9 @@
    },
    "files": [
    "./typings/tsd.d.ts",
    "./Trekspace/ts/Externals_shallow.d.ts",
    "./Trekspace/ts/components/UI/UIModules.ts",
    "./Trekspace/ts/people/App.tsx",
    "./Trekspace/ts/areas/App.tsx"
    "./Project/ts/Externals_shallow.d.ts",
    "./Project/ts/components/UI/UIModules.ts",
    "./Project/ts/area1/App.tsx",
    "./Project/ts/area2/App.tsx"
    ]
    }
  4. flq revised this gist Aug 26, 2015. 1 changed file with 17 additions and 0 deletions.
    17 changes: 17 additions & 0 deletions currentlocation.ts
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,17 @@
    import {Url,parse} from "url";

    interface MvcUrl extends Url {
    controller : string;
    }

    function extractFirstPart(url : Url) : string {
    var url2 = url.path.substring(1);
    if (url2.indexOf('/') == -1)
    return url2;
    return url2.substring(0, url2.indexOf('/'))
    }

    var theUrl = <MvcUrl>parse(window.location.href);
    theUrl.controller = extractFirstPart(theUrl);

    export = theUrl;
  5. flq created this gist Aug 26, 2015.
    15 changes: 15 additions & 0 deletions tsconfig.json
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,15 @@
    {
    "compilerOptions": {
    "jsx": "react",
    "outDir": "./ts_modules",
    "target": "es5",
    "module": "commonjs"
    },
    "files": [
    "./typings/tsd.d.ts",
    "./Trekspace/ts/Externals_shallow.d.ts",
    "./Trekspace/ts/components/UI/UIModules.ts",
    "./Trekspace/ts/people/App.tsx",
    "./Trekspace/ts/areas/App.tsx"
    ]
    }