20181128_jeffrey - silenceuncrio/diary GitHub Wiki

0905

review

0920

M300 補一下 online manual

commit 66631b2061d9a284bb978c90f35d6a1d3486e087
Author: jeffrey <[email protected]>
Date:   Wed Nov 28 09:20:12 2018 +0800

    add the online manual: Management > Web

 .../prosrc/www/src/manual/management_web.h.html    | 29 +++++++++++++++++++++-
 1 file changed, 28 insertions(+), 1 deletion(-)

0955

把 M300 online manual 的 color picker 也搬到 M360 來

commit 92f52b96d4e5c58c73631b8a34e584dda0cd733f
Date:   Wed Nov 28 09:55:49 2018 +0800

    add the color picker for online manual

 proscend/prosrc/www/Makefile                       |    2 +-
 proscend/prosrc/www/manual/css/fontawesome.css     | 3983 ++++++++++++++++++++
 proscend/prosrc/www/manual/css/solid.css           |   15 +
 proscend/prosrc/www/manual/js/fontawesome.js       |    5 -
 proscend/prosrc/www/manual/js/solid.js             |    5 -
 proscend/prosrc/www/manual/style.css               |   11 +-
 .../prosrc/www/manual/webfonts/fa-solid-900.woff2  |  Bin 0 -> 73852 bytes
 proscend/prosrc/www/src/manual.html.src            |   88 +-
 proscend/prosrc/www/src/manual/sidebar.h.html      |   17 +
 9 files changed, 4089 insertions(+), 37 deletions(-)

1000

來自 PI 的小修改

commit 469a85d1526788b53a771ac8bbb37454c041dcfb
Author: jeffrey <[email protected]>
Date:   Wed Nov 28 09:59:21 2018 +0800

    modify the tab name at 'Dual APN' web page

 proscend/prosrc/www/app/locale-en.json    | 10 +++++-----
 proscend/prosrc/www/app/locale-fr.json    | 10 +++++-----
 proscend/prosrc/www/app/locale-zh-tw.json | 10 +++++-----
 3 files changed, 15 insertions(+), 15 deletions(-)

1005

M360 nobrand 也要有 online manual

commit 74c1f2d5398ceeb92a72cf5bcdfc5f545a710ca8
Author: jeffrey <[email protected]>
Date:   Wed Nov 28 10:06:48 2018 +0800

    nobrand also has a link to online manual at top banner

 proscend/prosrc/www/brand_nobrand/src/brand/top.html.src | 2 ++
 1 file changed, 2 insertions(+)

1020

GRE NHRP 可以繼續前進了

先 build 一版 M300 develop branch 的 image

Products/Vendor 選 M300/0_GENERIC

build code 吧

等待的時間再幫 monkeyjj 練一下 calendar 的基本功

1030

M300 building 出現錯誤訊息

...
mkfs.ubifs -r ./rootfs.x -m 2048 -e 126976 -c 766 -o ubifs.img ...
/home/user/build_small/tmp/work/m300-poky-linux-gnueabi/core-image-minimal/1.0-r0/temp/create_image.nandflash: 216: /home/user/build_small/tmp/work/m300-poky-linux-gnueabi/core-image-minimal/1.0-r0/temp/create_$
mage.nandflash: mkfs.ubifs: not found
WARNING: exit code 127 from a shell command.

ERROR: Function failed: do_rootfs
...

想起來 winston 有為了 M300 修改 build image 相關的流程改善 firmware upgrade 的速度

他有 mail 給大家

Dear All,

    The new upgrade method need mkfs.ubifs.

    You can install it by 'apt-gte install mtd-utils'

先不管跟 docker 相關的 issue

先裝 mtd-utils 再說

user@be6d814a16da:~/build_small$ sudo apt install mtd-utils
Reading package lists... Done
Building dependency tree
Reading state information... Done
The following NEW packages will be installed:
  mtd-utils
0 upgraded, 1 newly installed, 0 to remove and 14 not upgraded.
Need to get 296 kB of archives.
After this operation, 822 kB of additional disk space will be used.
Get:1 http://archive.ubuntu.com/ubuntu/ trusty/universe mtd-utils amd64 1:1.5.0-1 [296 kB]
Fetched 296 kB in 13s (21.9 kB/s)
Selecting previously unselected package mtd-utils.
(Reading database ... 80298 files and directories currently installed.)
Preparing to unpack .../mtd-utils_1%3a1.5.0-1_amd64.deb ...
Unpacking mtd-utils (1:1.5.0-1) ...
Setting up mtd-utils (1:1.5.0-1) ...

再 build 一次... ok

用 mfgtool 燒錄... ok

1105

先幫忙 M300 hotfix/v1.75 的 online manual verify

解開 [ICG-2420G-LTE_013600021752C388_mfgtools.zip]

再準備一片 M300 CPU board with nandflash 來做燒錄

online manual 發現一個小問題

左側 Diagnosis > Traceroute 按了以後沒有跳到該連結

這是因為該 page 的 id 錯了

commit c759c9d36e2e34d06a790061361474324a1e7b40
Author: jeffrey <[email protected]>
Date:   Wed Nov 28 11:26:03 2018 +0800

    correct the internal link of 'Diagnosis > Traceroute'

 proscend/prosrc/www/src/manual/diagnosis_traceroute.h.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

1130

M360 也是一樣的問題

diff --git a/proscend/prosrc/www/src/manual/diagnosis_traceroute.h.html b/proscend/prosrc/www/src/manual/diagnosis_traceroute.h.html
index be3e466..03bcf5b 100644
--- a/proscend/prosrc/www/src/manual/diagnosis_traceroute.h.html
+++ b/proscend/prosrc/www/src/manual/diagnosis_traceroute.h.html
@@ -1,6 +1,6 @@

 <!-- Diagnosis - Traceroute -->
-<h2 id="diagnosis_ping">
+<h2 id="diagnosis_traceroute">
   <i class="fas fa-wrench"></i>
   Diagnosis > Traceroute
 </h2>

commit

commit c1695b70e210ce6ba75708c3ff72912f71e1c6f5
Author: jeffrey <[email protected]>
Date:   Wed Nov 28 11:31:40 2018 +0800

    correct the internal link of 'Diagnosis > Traceroute'

 proscend/prosrc/www/src/manual/diagnosis_traceroute.h.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

1135

monkdyjj 的行事曆功力就先找【React教学】Step by Step 教你写一个日历控件這一篇練練手

起手式 - create-react-app react-calendar-01

➜  ~ create-react-app react-calendar-01

Creating a new React app in /home/jeffrey/react-calendar-01.

Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...

+ [email protected]
+ [email protected]
+ [email protected]
added 1701 packages from 661 contributors and audited 35639 packages in 147.611s
found 0 vulnerabilities


Initialized a git repository.

Success! Created react-calendar-01 at /home/jeffrey/react-calendar-01
Inside that directory, you can run several commands:

  npm start
    Starts the development server.

  npm run build
    Bundles the app into static files for production.

  npm test
    Starts the test runner.

  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

  cd react-calendar-01
  npm start

Happy hacking!
➜  ~

第二式

cd react-calendar
npm start

1300

M300 要 release 給 QA 測的 [ICG-2420G-LTE_013600021752C388_mfgtools.zip] 再 verify 一次 online manual

1305

monkeyjj calendar 直接開一個 github repository - react-calendar-01

clone 之後直接再使用 create-react-app

➜  ~ git clone https://github.com/silenceuncrio/react-calendar-01.git
Cloning into 'react-calendar-01'...
Username for 'https://github.com': silenceuncrio
Password for 'https://[email protected]':
remote: Enumerating objects: 3, done.
remote: Counting objects: 100% (3/3), done.
remote: Total 3 (delta 0), reused 0 (delta 0), pack-reused 0
Unpacking objects: 100% (3/3), done.
Checking connectivity... done.
➜  ~ cd react-calendar-01
➜  react-calendar-01 git:(master) cd ..
➜  ~ create-react-app react-calendar-01

Creating a new React app in /home/jeffrey/react-calendar-01.

Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...

+ [email protected]
+ [email protected]
+ [email protected]
added 1701 packages from 661 contributors and audited 35639 packages in 106.509s
found 0 vulnerabilities


Success! Created react-calendar-01 at /home/jeffrey/react-calendar-01
Inside that directory, you can run several commands:

  npm start
    Starts the development server.

  npm run build
    Bundles the app into static files for production.

  npm test
    Starts the test runner.

  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

  cd react-calendar-01
  npm start

You had a `README.md` file, we renamed it to `README.old.md`

Happy hacking!
➜  ~

可以準備第一次的 commit

➜  react-calendar-01 git:(master) ✗ git status
On branch master
Your branch is up-to-date with 'origin/master'.
Changes not staged for commit:
  (use "git add <file>..." to update what will be committed)
  (use "git checkout -- <file>..." to discard changes in working directory)

        modified:   README.md

Untracked files:
  (use "git add <file>..." to include in what will be committed)

        .gitignore
        README.old.md
        package-lock.json
        package.json
        public/
        src/

no changes added to commit (use "git add" and/or "git commit -a")
➜  react-calendar-01 git:(master) ✗

為了不需要每次都要敲 github 的帳密

參考一下 Connecting to GitHub with SSH

參考 Checking for existing SSH keys

再 generate key 之前先 check 我有沒有現成的

➜  react-calendar-01 git:(master) ✗ ls -al ~/.ssh
total 20
drwx------  2 jeffrey jeffrey 4096  六   5 09:56 .
drwxr-xr-x 36 jeffrey jeffrey 4096 十一 28 13:12 ..
-rw-------  1 jeffrey jeffrey 1679  六   5 09:48 id_rsa
-rw-r--r--  1 jeffrey jeffrey  394  六   5 09:48 id_rsa.pub
-rw-r--r--  1 jeffrey jeffrey  222  六   5 09:56 known_hosts

看來是有的 - id_rsa.pub

參考 Adding a new SSH key to your GitHub account

1325

M300 要 release 給 QA 測的 [ICG-2420G-LTE_013600021752C388_mfgtools.zip] online manual verify... PASS

再幫忙 verify HYTEC 的 [HWL-2501-DS_013600531752C388_mfgtools.zip] 的 online manual 的 Management > Administration 部分

HYTEC 沒有 read-only 這個 user level

1330

monkeyjj

進行 Testing your SSH connection

我可能需要再重新 clone 一次 SSH

➜  ~ rm -rf react-calendar-01
➜  ~ git clone [email protected]:silenceuncrio/react-calendar-01.git
Cloning into 'react-calendar-01'...
remote: Enumerating objects: 3, done.
remote: Counting objects: 100% (3/3), done.
remote: Total 3 (delta 0), reused 0 (delta 0), pack-reused 0
Receiving objects: 100% (3/3), done.
Checking connectivity... done.
➜  ~

再使用 create-react-app

➜  ~ create-react-app react-calendar-01

Creating a new React app in /home/jeffrey/react-calendar-01.

Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...

+ [email protected]
+ [email protected]
+ [email protected]
added 1701 packages from 661 contributors and audited 35639 packages in 72.949s
found 0 vulnerabilities


Success! Created react-calendar-01 at /home/jeffrey/react-calendar-01
Inside that directory, you can run several commands:

  npm start
    Starts the development server.

  npm run build
    Bundles the app into static files for production.

  npm test
    Starts the test runner.

  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

  cd react-calendar-01
  npm start

You had a `README.md` file, we renamed it to `README.old.md`

Happy hacking!

commit b14538916e92f4116f311bf408e4d0023ab1c92f
Author: jeffrey <[email protected]>
Date:   Wed Nov 28 13:40:54 2018 +0800

    first commit after 'create-react-app'

 .gitignore           |    23 +
 package-lock.json    | 14844 +++++++++++++++++++++++++++++++++++++++++++++++++
 package.json         |    25 +
 public/favicon.ico   |   Bin 0 -> 3870 bytes
 public/index.html    |    40 +
 public/manifest.json |    15 +
 src/App.css          |    32 +
 src/App.js           |    28 +
 src/App.test.js      |     9 +
 src/index.css        |    14 +
 src/index.js         |    12 +
 src/logo.svg         |     7 +
 src/serviceWorker.js |   135 +
 13 files changed, 15184 insertions(+)

1345

M300 要 release 給 QA 測的 [HWL-2501-DS_013600531752C388_mfgtools.zip] 的 online manual check... PASS

Management > Administration 部分 HYTEC 沒有 read-only 這個 user level... PASS

1350

monkeyjj

把 react-calendat-01 移除再重先從 github clone 下來驗證 npm start 是否正常

➜  ~ rm -rf react-calendar-01
➜  ~ git clone [email protected]:silenceuncrio/react-calendar-01.git
Cloning into 'react-calendar-01'...
remote: Enumerating objects: 20, done.
remote: Counting objects: 100% (20/20), done.
remote: Compressing objects: 100% (18/18), done.
remote: Total 20 (delta 0), reused 17 (delta 0), pack-reused 0
Receiving objects: 100% (20/20), 136.18 KiB | 0 bytes/s, done.
Checking connectivity... done.

記住這次做得不是 create-react-app 而是 npm install

➜  ~ cd react-calendar-01
➜  react-calendar-01 git:(master) npm install
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

added 1701 packages from 661 contributors and audited 35639 packages in 27.884s
found 0 vulnerabilities

npm start

➜  react-calendar-01 git:(master) ✗ npm start
...
Compiled successfully!

You can now view react-calendar-01 in the browser.

  Local:            http://localhost:3000/
  On Your Network:  http://192.168.217.128:3000/

Note that the development build is not optimized.
To create a production build, use npm run build.

可以參考【React教学】Step by Step 教你写一个日历控件邊前進邊留下足跡

1430

monkeyjj react-calendar-01

commit daac63ee81fc6d54347dfae5b1e865fadbdf04f9
Author: jeffrey <[email protected]>
Date:   Wed Nov 28 14:27:26 2018 +0800

    use the same style ad the following URL:
    - https://www.robinwieruch.de/complete-firebase-authentication-react-tutorial/

 package-lock.json           | 28 +++++++++++++++++++++-------
 src/App.css                 | 32 --------------------------------
 src/App.js                  | 28 ----------------------------
 src/App.test.js             |  9 ---------
 src/components/App/index.js | 15 +++++++++++++++
 src/index.js                |  2 +-
 src/logo.svg                |  7 -------
 7 files changed, 37 insertions(+), 84 deletions(-)

這是仿照 A Firebase in React Tutorial for Beginners [2018] 作者的起手式

每個 components 都有一個 folder

其下都有 index.js

先以這樣的概念作重構

目前只有一個 App component

1440

參考【React教学】Step by Step 教你写一个日历控件

新增兩個 components

CalendarHeader
CalendarBody

commit f2e652b5a5d9ea6b6a3ab36de0edea819a67d4c5
Author: jeffrey <[email protected]>
Date:   Wed Nov 28 14:36:24 2018 +0800

    add the components 'CalendarHeader' and 'CalendarBody'

 src/components/App/index.js            |  7 ++++++-
 src/components/CalendarBody/index.js   | 36 ++++++++++++++++++++++++++++++++++
 src/components/CalendarHeader/index.js | 18 +++++++++++++++++
 3 files changed, 60 insertions(+), 1 deletion(-)

commit b1922e4d03ff5a2380ad78e57c00eba5435a639a
Author: jeffrey <[email protected]>
Date:   Wed Nov 28 14:48:24 2018 +0800

    apply CSS

 src/index.css | 75 ++++++++++++++++++++++++++++++++++++++++++++++++++---------
 1 file changed, 64 insertions(+), 11 deletions(-)

commit e84995316a7a026aebf330cd73273af77f035417
Author: jeffrey <[email protected]>
Date:   Wed Nov 28 14:56:28 2018 +0800

    add the onClick handler

 src/components/CalendarHeader/index.js | 32 +++++++++++++++++++++++---------
 1 file changed, 23 insertions(+), 9 deletions(-)

1515

這次的 commit 還多了一個 formatDate() class method

commit 0f9ca7bbb35e4a60a3f9850ad16db7f25b4e3fb1
Author: jeffrey <[email protected]>
Date:   Wed Nov 28 15:15:55 2018 +0800

    change the year and month

 src/components/CalendarHeader/index.js | 106 +++++++++++++++++++++++++++++++--
 1 file changed, 101 insertions(+), 5 deletions(-)

1555

1600

這一步驟可以好好看一下【React教学】Step by Step 教你写一个日历控件的說明

commit b20a0abfc521c42a9d2b3eeb4bfc9b11b4ac711c
Author: jeffrey <[email protected]>
Date:   Wed Nov 28 15:57:03 2018 +0800

    prepare to render the CalendarBody

 src/components/App/index.js            | 110 ++++++++++++++++++++++++++++++---
 src/components/CalendarBody/index.js   |  73 +++++++++++++---------
 src/components/CalendarHeader/index.js |  86 +++-----------------------
 3 files changed, 155 insertions(+), 114 deletions(-)

1610

commit 05b9235120716be34407b3fa4c0efe7ec3b12126
Author: jeffrey <[email protected]>
Date:   Wed Nov 28 16:06:14 2018 +0800

    render the CanlendarBody

 src/components/CalendarBody/index.js | 50 ++++++++++++++++++++++++++++--------
 1 file changed, 40 insertions(+), 10 deletions(-)

真心覺得這篇教學值得我好好整理一下

1640

發現 calendar 有個神奇的點發生在 CSS

可以參考 How TO - CSS Calendar

day 的部分是由 <li></li> 所形成的 array

但七天構成一排卻是直接使用 CSS 的 width: 13.6%; 來達成 - 7 * 13.6% = 95.2%

真是神奇ㄚ

參考 35 CSS Calendars - Free Frontend

可以看到很多漂亮的作品

看來 CSS 是可以好好投資的

不過現階段只要用個簡單的 CSS 來達成即可

1750

研究 How TO - CSS Calendar 的同時發現自己對 CSS 越來越不熟

不過也了解到有些 CSS 可以處理得很好的事情我就可以先不去考慮相關的細節