Upgrade to Pro — share decks privately, control downloads, hide ads and more …

OpenCWB, coscup 2012 lightning talk

OpenCWB, coscup 2012 lightning talk

Chia-liang Kao

August 18, 2012
Tweet

More Decks by Chia-liang Kao

Other Decks in Programming

Transcript

  1. @clkao
    Perl Hacker
    Emacs User
    Paraglider Pilot
    OpenCWB.tw
    12年8月18日星期六

    View full-size slide

  2. 12年8月18日星期六

    View full-size slide

  3. New Spine
    New Life
    New Project
    New Language
    New Editor
    12年8月18日星期六

    View full-size slide

  4. 12年8月18日星期六

    View full-size slide

  5. 12年8月18日星期六

    View full-size slide

  6. 12年8月18日星期六

    View full-size slide

  7. 12年8月18日星期六

    View full-size slide

  8. 12年8月18日星期六

    View full-size slide

  9. 12年8月18日星期六

    View full-size slide

  10. 12年8月18日星期六

    View full-size slide

  11. 12年8月18日星期六

    View full-size slide

  12. Where’s the data?
    12年8月18日星期六

    View full-size slide

  13. {
    area: "232",
    issued: "2012-08-18T03:00:00.000Z",
    time: "2012-08-18T04:00:00.000Z",
    forecast: {
    WeatherDes: "Occasional showers or thunderstorms. Temperature 31
    centigrade. hot. Northeast wind 3 m/s. Chance of precipitation is 70%.",
    CI: "hot",
    Td: "30.0",
    RH: "92",
    WindDir: "NE",
    WindLevel: "2",
    WindSpeed: "3",
    Temperature: "31",
    WeatherIcon: "Weather36.bmp",
    Wx: "Occasional showers or thunderstorms",
    MinCI: "30",
    MaxCI: "30",
    MinT: "31",
    MaxT: "31",
    PoP: 70
    }
    }
    12年8月18日星期六

    View full-size slide

  14. Tools
    • LiveScript
    • ZappaJS, Mongoose
    • AngularJS
    • jade, less
    • brunch
    12年8月18日星期六

    View full-size slide

  15. Lines of Code
    19 77 625 src/app.ls
    51 161 1541 src/main.ls
    70 238 2166 total
    74 266 2382 app/app/controllers.ls
    19 40 300 app/app/directives.ls
    23 72 506 app/app/filters.ls
    80 252 2773 app/app/services.ls
    14 58 566 app/app.ls
    3 4 74 app/init.ls
    283 930 8767 total
    Server
    Client
    12年8月18日星期六

    View full-size slide

  16. Templates and Styles
    43 72 1474 app/assets/index.jade
    30 56 1525 app/assets/partials/app/forecasts.jade
    8 10 279 app/assets/partials/app/nav.jade
    136 254 2446 app/styles/styles.less
    217 392 5724 total
    12年8月18日星期六

    View full-size slide

  17. 500 Lines
    30% are styles
    12年8月18日星期六

    View full-size slide

  18. Brunch and zappa
    % brunch build
    # generates _public/
    % node src/app.js
    # REST endpoint and _public (static)
    12年8月18日星期六

    View full-size slide

  19. Brunch and zappa
    % brunch build
    # generates _public/
    % node src/app.js
    # REST endpoint and _public (static)
    live autoreload!
    12年8月18日星期六

    View full-size slide

  20. 12年8月18日星期六

    View full-size slide

  21. 12年8月18日星期六

    View full-size slide

  22. AngularJS
    12年8月18日星期六

    View full-size slide

  23. AngularJS
    form.navbar-search.pull-left#navSearch
    input.search-query(type='search',ng-model='search')
    section.area-select(ng-controller='AreaSelect')
    select.areas(multiple,ng-change='change()', ng-
    model='currentArea', ng-options='a.name group by a.county for
    a in areas | filter:search')
    AreaSelect = function($scope, $http) {
    var s = $scope;
    s.change = function() { s.$emit(‘area-changed’, s.currentArea) }
    $http.get(‘/1/area’).success(function(it) {
    s.areas = it;
    })
    }
    12年8月18日星期六

    View full-size slide

  24. AngularJS
    form.navbar-search.pull-left#navSearch
    input.search-query(type='search',ng-model='search')
    section.area-select(ng-controller='AreaSelect')
    select.areas(multiple,ng-change='change()', ng-
    model='currentArea', ng-options='a.name group by a.county for
    a in areas | filter:search')
    AreaSelect = ($scope, $http) ->
    s = $scope
    s.change = -> s.$emit \area-changed, s.currentArea
    $http.get(‘/1/area’).success ->
    s.areas = it
    12年8月18日星期六

    View full-size slide

  25. AngularJS
    form.navbar-search.pull-left#navSearch
    input.search-query(type='search',ng-model='search')
    section.area-select(ng-controller='AreaSelect')
    select.areas(multiple,ng-change='change()', ng-
    model='currentArea', ng-options='a.name group by a.county for
    a in areas | filter:search')
    AreaSelect = ($scope, $http) ->
    s = $scope
    s.change = -> s.$emit \area-changed, s.currentArea
    $http.get(‘/1/area’).success ->
    s.areas = it
    12年8月18日星期六

    View full-size slide

  26. DEMO
    12年8月18日星期六

    View full-size slide

  27. TODO
    • rain statistics
    • forecasts accuracy statistics
    • forecasts update subscription/notification
    • what weather info visualization do you
    want to see?
    12年8月18日星期六

    View full-size slide

  28. Thank you!
    • http://github.com/clkao/opencwb
    • http://github.com/clkao/cwbtw
    • Come to livescript talk tomorrow
    afternoon!
    12年8月18日星期六

    View full-size slide