20160905_jeffrey - silenceuncrio/diary GitHub Wiki

Index

  • 0935 - review
  • 0955 - 從 index.html 出發 先不管 login 的功能
  • 1015 - commit - Add index.html for DigiComm
  • 1145 - commit - improve lanst.html - Modify lanst.html - Modify wanst_eth.html.html
  • 1615 - engineering notebook
  • 1735 - AngularJS 的 ngRoute 與 ngView

0935

先 review

上禮拜做了不少

0955

可以從 index.html 出發

先不管 login 的功能

1015

Revision: 509
Author: jeffrey
Date: 2016年9月5日 上午 10:11:04
Message:
Add index.html for DigiComm
index_579x.html is the original index.html for 579x

----
Added : /fsl-release-bsp/proscend/prosrc/www/assets/digicomm_logo_02.png
Modified : /fsl-release-bsp/proscend/prosrc/www/index.html
Added : /fsl-release-bsp/proscend/prosrc/www/index_579x.html

1145

Revision: 510
Author: jeffrey
Date: 2016年9月5日 上午 10:51:27
Message:
improve lanst.html
- use angular-translate to support multi-language
- offer a method to get the debug information

----
Added : /fsl-release-bsp/proscend/prosrc/www/assets/angular-translate.min.js
Modified : /fsl-release-bsp/proscend/prosrc/www/assets/myApp.js
Modified : /fsl-release-bsp/proscend/prosrc/www/lanst.html

Revision: 511
Author: jeffrey
Date: 2016年9月5日 上午 11:10:38
Message:
Modify lanst.html
- base on ISO 639 to define the language code
  - EN - ENGLISH
  - ZH-TW - CHINESE Taiwan
  - AR - ARABIC

----
Modified : /fsl-release-bsp/proscend/prosrc/www/lanst.html

Revision: 512
Author: jeffrey
Date: 2016年9月5日 上午 11:44:02
Message:
Modify wanst_eth.html.html
- use angular-translate to support multi-language

----
Modified : /fsl-release-bsp/proscend/prosrc/www/wanst_eth.html

1615

engineering notebook

<!DOCTYPE html>
<html>
<head>
<title>lanst</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="assets/bootstrap.min.css">
<style>
[ng\:cloak], [ng-cloak], .ng-cloak {
  display: none !important;
}
</style>

<script src="assets/angular.min.js"></script>
<script src="assets/angular-translate.min.js"></script>
<script src="assets/myApp.js"></script>
<script>

app.config(function($translateProvider) {
  // EN - ENGLISH
  $translateProvider.translations('en', {
    LANST: "LAN Static",
    ADDR: "IP Address",
    MASK: "Subnet Mask",
    RESET: "Reset",
    APPLY: "Apply",
  });

  //ZH-TW - CHINESE Taiwan
  $translateProvider.translations('zh-tw', {
    LANST: "LAN 端 靜態設定",
    ADDR: "IP 位址",
    MASK: "子網路遮罩",
    RESET: "重設",
    APPLY: "套用",
  });

  //AR - ARABIC
  $translateProvider.translations('ar', {
    LANST: "LANST",
    ADDR: "ADDR",
    MASK: "MASK",
    RESET: "RESET",
    APPLY: "APPLY",
  });

  $translateProvider.preferredLanguage('en');

});

app.controller('myCtrl', function($scope, $http, $translate) {

  $http.get("cgi-bin/lanst.cgi?act=get")
  .then(function(response) {
    $scope.master = response.data.config;
    $scope.reset();
  });

  $scope.reset = function() {
    $scope.user = angular.copy($scope.master);
  }

  $scope.apply = function() {
    var config = JSON.stringify($scope.user);
    var data = { 'act': 'apply', 'config': config};
    $http.post("cgi-bin/lanst.cgi", data)
    .then(function(response) {
      console.log(response);
    });
  };

  $scope.regex_ipv4 = /^(?:(?:25[0-5]|2[0-4][0-9]|1[0-9][0-9]|[1-9]?[0-9])\.){3}(?:25[0-5]|2[0-4][0-9]|1[0-9][0-9]|[1-9]?[0-9])$/;

  $scope.regex_netmask = /^((128|192|224|240|248|252|254)\.0\.0\.0)|(255\.(((0|128|192|224|240|248|252|254)\.0\.0)|(255\.(((0|128|192|224|240|248|252|254)\.0)|255\.(0|128|192|224|240|248|252|254)))))$/;

  $scope.changeLanguage = function (langKey) {
    $translate.use(langKey);
  };

  var match_debug = window.location.href.match(/debug(=*)(\d*)/);
  if (match_debug != null && match_debug.length == 3) {
    $scope.debug = match_debug[2];
  }

});
</script>

</head>

<body>



<div class="container" ng-app="myApp" ng-controller="myCtrl">

<div class="panel panel-primary" ng-cloak>
  <div class="panel-heading">{{ 'LANST' | translate }}</div>
  <div class="panel-body">

<form class="form-horizontal" name="form">

  <div class="form-group" ng-class="{ 'has-error': form.addr.$invalid }">
    <label for="addr" class="col-sm-3 control-label">{{ 'ADDR' | translate }}</label>
    <div class="col-sm-9">
      <input type="text" class="form-control" id="addr" name="addr"
        placeholder="xxx.xxx.xxx.xxx" 
        ng-model="user.addr" required ng-pattern="regex_ipv4">
    </div>
  </div>
  <div class="form-group" ng-class="{ 'has-error': form.mask.$invalid }">
    <label for="mask" class="col-sm-3 control-label">{{ 'MASK' | translate }}</label>
    <div class="col-sm-9">
      <input type="text" class="form-control" id="mask" name="mask" 
        placeholder="xxx.xxx.xxx.xxx"
        ng-model="user.mask" required ng-pattern="regex_netmask">
    </div>
  </div>

  <div class="form-group"> 
    <div class="col-sm-offset-3 col-sm-9">
      <button type="submit" class="btn btn-primary" 
        ng-click="reset()">{{ 'RESET' | translate }}</button>
      <button type="submit" class="btn btn-primary" 
        ng-click="apply()" ng-disabled="form.$invalid">{{ 'APPLY' | translate }}</button>
    </div>
  </div>

</form>

  </div>
</div>



<div ng-show="debug" ng-cloak>
<p>debug = {{debug}}</p>
<p>form = {{user}}</p>
<p>master = {{master}}</p>
<p>form.addr.$valid = {{form.addr.$valid}}</p>
<p>form.mask.$valid = {{form.mask.$valid}}</p>
<p>form.$invalid = {{form.$invalid}}</p>
<button ng-click="changeLanguage('en')" translate="BUTTON_TEXT_EN"></button>
<button ng-click="changeLanguage('zh-tw')" translate="BUTTON_TEXT_ZH-TW"></button>
</div>



</div>



</body>
</html>

1735

來看一下 AngularJS 的 ngRoute 與 ngView

Add a custom footer
⚠️ **GitHub.com Fallback** ⚠️