Jarvis Voice

http://www.zedge.net/ringtones/0-1-1-jarvis/

Android 藍芽 Bluetooth Headset

1.Voice Input
http://stackoverflow.com/questions/14991158/using-the-android-recognizerintent-with-a-bluetooth-headset

http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2015/1007/3548.html

http://www.cnblogs.com/wsfjlagr/p/3896087.html

http://stackoverflow.com/questions/8583406/saving-audio-input-of-android-stock-speech-recognition-engine

http://stackoverflow.com/questions/28450355/how-to-record-audio-from-bluetooth-headset-startbluetoothsco

https://developer.android.com/guide/topics/media/audio-capture.html

Sony tutorial:
https://developer.sony.com/develop/wearables/smarteyeglass-sdk/guides/use-bluetooth-for-audio-io/

http://blog.csdn.net/charein/article/details/12184835



2.藍芽 volume up & down event catching:

SettingsContentObserver mSettingsContentObserver = new SettingsContentObserver( new Handler() );
this.getApplicationContext().getContentResolver().registerContentObserver(
    android.provider.Settings.System.CONTENT_URI, true,
    mSettingsContentObserver );

class SettingsContentObserver extends ContentObserver {

   public SettingsContentObserver(Handler handler) {
      super(handler);
   }

   @Override
   public boolean deliverSelfNotifications() {
      return super.deliverSelfNotifications();
   }

   @Override
   public void onChange(boolean selfChange) {
      super.onChange(selfChange);

    ///do it
   }
}

一般交際 技巧

1.無欲則剛

2.勿得失心

3.誠意

工具軟體

Winmerge 比較與Merge:
  a.解決中文 編碼問題:
編輯 > 選項 > 編碼頁 > 自訂編碼頁 65001


aida64 硬體偵測:

 process explorer 資料夾解鎖:
 a.Ctrl + f :搜尋folder name 查看何程序使用其folder
 

2016 各家網頁技術

網頁技術名詞:
   
laravel : 為網頁藝術家創造的 PHP 框架, 簡潔語法

Node.JS : 執行於server端的 工具,具備實際邏輯處理流程

Yeoman : web app開發工具,提供粗貌的架構 ,減少處理瑣碎的事情

AngularJS : javascript撰寫語法 之 Model View Control 的整合

BootStrap : 畫面縮放layout

Ionic : for mobile app UI

AngularJS 技術

(A)angularjs 執行順序:
app.config()
app.run()
directive's compile functions (if they are found in the dom)
app.controller()
directive's link functions (again, if found)

(B)angularjs 超連結做法:

 (b-1) <a ui-sref="profile"><i class="fa fa-fw fa-user"></i> Profile</a>
  裡面的profile 找到對應的 App.js裡面的
  .state('profile', {
            url: '/profile',
            templateUrl: '/views/profile.html',
            parent: 'master',
            requireAuth: true
        })
     
  (b-2)如果有傳遞參數則
    <a ui-sref="home({foo: 'fooVal1', bar: 'barVal1'})">
    對到$stateParams
    .controller('MainRootCtrl', function($scope, $state, $stateParams) {
    //..
    var foo = $stateParams.foo; //getting fooVal
    var bar = $stateParams.bar; //getting barVal
    //..
    $scope.state = $state.current
    $scope.params = $stateParams;
})


(C)services的使用:

http://www.w3schools.com/angular/tryit.asp?filename=try_ng_services_custom

AngularJS 與 Node JS 融合

範例1 :
https://scotch.io/tutorials/creating-a-single-page-todo-app-with-node-and-angular

bootstrap layout設計

1.navbar

  <nav id="top_menu_1"class="navbar navbar-default navbar-static-top" role="navigation"     style="top:125px;background:white;">
 
   固定頂端:  navbar-fixed-top

   不固定:  navbar-static-top



2.各物件範例:
http://v4-alpha.getbootstrap.com/components/popovers/

旅行必帶

1.隔日穿著衣物

2.晚上過夜衣物

3.拖鞋,充電器, 換洗用具,健保卡, 身分證+駕照(租車)

android bluetooth 技術相關

1.http://androidsourcehelp.com/bluetooth-auto-connection-in-android-devices/


2.問題: android.app.ServiceConnectionLeaked was originally bound here

  須看logcat訊息中 位於在更前面的exception訊息是什麼

Google Map 設計

1.沿路動畫
http://stackoverflow.com/questions/11519386/animate-a-route-with-google-map-js-api-v3

https://developers.google.com/maps/documentation/javascript/examples/polyline-simple
2.雙模式
https://developers.google.com/maps/documentation/javascript/examples/streetview-simple

 https://developers.google.com/maps/documentation/javascript/examples/streetview-simple?hl=zh-tw

http://alves.im/gmaps-animated-route/


3.設定地圖的畫面位置(Drag):
var mapOptions = {
    center: new google.maps.LatLng(45, -122),
    zoom: 4,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};

var map = new google.maps.Map(document.getElementById("map_canvas"),
                              mapOptions);

function moveToLocation(lat, lng){
    var center = new google.maps.LatLng(lat, lng);
    map.panTo(center);  //重點!
}
$('#recenter').click( function() {
    moveToLocation( -34, 150 );
});

藝術材質

1.飯店磚塊
Ledgestone

temp

http://www.nodebeginner.org/index-zh-tw.html

案/tmp/test.png內容展示到瀏覽器中。當然了，首先需要將該圖片儲存到這個位置

Ubuntu 14.04

1.安裝google chrome
http://www.computernetworkingnotes.com/ubuntu-12-04-tips-and-tricks/how-to-run-chrome-as-root-user-in-ubuntu.html

NodeJS 教學

1.安裝nodejs
sudo apt-get install node

https://www.digitalocean.com/community/tutorials/how-to-install-node-js-on-an-ubuntu-14-04-server

1-2 支援模組 Express
https://expressjs.com/en/guide/routing.html

2.範例

file upload
https://codeforgeek.com/2014/11/file-uploads-using-node-js/

chat room
http://socket.io/get-started/chat/

3.async
http://book.mixu.net/node/ch7.html

Z.安裝模組與使用

npm install formidable

var formidable = require("formidable");

SVG範例

1.動畫設計(SVG)-
https://css-tricks.com/guide-svg-animations-smil/

https://docs.webplatform.org/wiki/svg/tutorials/smarter_svg_animation

http://interactjs.io/

http://svg.dabbles.info/snaptut-dragplugin

http://www.jqueryrain.com/?OQTEB5Jx


http://tympanus.net/codrops/2016/04/13/interactive-3d-mall-map/  多層地圖


2.觸發動畫-

http://stackoverflow.com/questions/8455773/svg-trigger-animation-with-event

http://web.archive.org/web/20140228202850/http://dev.opera.com/articles/view/advanced-svg-animation-techniques

http://stackoverflow.com/questions/31856890/svg-trigger-a-click-event-on-animatetransform-after-clicking-a-button?answertab=votes#tab-top

http://www.hongkiat.com/blog/svg-animations/

居家生活

1.滅蟑文章
  http://www.letu.life/b5/125663/%E8%9F%91%E8%9E%82%E4%B8%80%E6%AC%A1%E7%94%A2%E5%8D%B5%E6%95%B8%E7%99%BE%E9%9A%BB%EF%BC%8C%E4%BD%A0%E5%AE%B6%E5%BA%8A%E5%BA%95%E4%B8%80%E5%AE%9A%E6%9C%89%EF%BC%81%E3%80%8C%E5%B9%BE%E6%8B%9B%E3%80%8D/

CSS 設計技巧

1.置中-  margin:  auto;

2.漸層色塊
http://www.cssmatic.com/gradient-generator#'\-moz\-linear\-gradient\%28left\%2C\%20rgba\%28248\%2C80\%2C50\%2C1\%29\%200\%25\%2C\%20rgba\%28241\%2C111\%2C92\%2C1\%29\%2050\%25\%2C\%20rgba\%28246\%2C41\%2C12\%2C1\%29\%2051\%25\%2C\%20rgba\%28240\%2C47\%2C23\%2C1\%29\%2071\%25\%2C\%20rgba\%28231\%2C56\%2C39\%2C1\%29\%20100\%25\%29\%3B'


3.id的命名 不可以數字為開頭

4.css的style內部屬性設定時 須注意 先後次序

5.設定class內容的中心layout
 margin: auto;

6.將物件放在垂直中心
   style="line-height:80px;"

7.物件編排放在右側
   float:right;width:40px

8.兩個物件排在同一列
<div style="display:inline-block"> A</div>
<div style="display:inline-block"> B</div>

CSS Menu 下拉式選單(drop down)

1.下拉式選單設定

<!DOCTYPE html>
<html>
<head>
<style>
.dropbtn {
    background-color: #4CAF50;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

.dropbtn:hover, .dropbtn:focus {
    background-color: #3e8e41;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dropdown-content a {
    color: black;
    text-decoration: none;
    padding: 12px 16px;
    display: block;
// 造成 下拉式選單 的影響
}

.dropdown a:hover {background-color: #f1f1f1}

.show {display:block;}
</style>
</head>
<body>

<h2>Clickable Dropdown</h2>
<p>Click on the button to open the dropdown menu.</p>

<div class="dropdown">
<button onclick="myFunction()" class="dropbtn">Dropdown</button>
  <div id="myDropdown" class="dropdown-content">
    <a href="#home">Home</a>
    <a href="#about">About</a>
    <a href="#contact">Contact</a>
  </div>
</div>

<script>
/* When the user clicks on the button,
toggle between hiding and showing the dropdown content */
function myFunction() {
    document.getElementById("myDropdown").classList.toggle("show");
}

// Close the dropdown if the user clicks outside of it
window.onclick = function(event) {
  if (!event.target.matches('.dropbtn')) {

    var dropdowns = document.getElementsByClassName("dropdown-content");
    var i;
    for (i = 0; i < dropdowns.length; i++) {
      var openDropdown = dropdowns[i];
      if (openDropdown.classList.contains('show')) {
        openDropdown.classList.remove('show');
      }
    }
  }
}
</script>

</body>
</html>


2. 直線動畫

http://bradsknutson.com/blog/css-sliding-underline/

RWD網站設計

經典 標準  免費-
https://dcrazed.com/free-responsive-html5-css3-templates/


css menu
http://www.newmediacampaigns.com/blog/nicer-navigation-with-css-transitions-part-2

http://codepen.io/shshaw/pen/gsFch


欄位動態調整
http://demos.jquerymobile.com/1.4.0/rwd/

網頁 重要設計元素 或 效果

1.image slider

2.cssmenu

3.banner



線上google 字體:
https://www.google.com/fonts/earlyaccess


字體下載
https://fonts.google.com/earlyaccess


SliderShow Example
http://www.menucool.com/slider/javascript-image-slider-demo2

http://www.menucool.com/slider/thumbnail-slider-demo-3

振奮音樂

https://www.youtube.com/watch?v=5ohXZCdNgtk

https://www.youtube.com/watch?v=WU7SGn0MeP0

https://www.youtube.com/watch?v=Jp9C06er9-c

https://www.youtube.com/watch?v=_ptzKdBlv0I

https://www.youtube.com/watch?v=MbNxu5_b1kQ

Two Steps from Hell:
https://www.youtube.com/watch?v=0RVIgZRRlmk&spfreload=5

Wechat與微博 研究紀錄

微博
http://open.weibo.com/wiki/%E6%96%B0%E6%89%8B%E6%8C%87%E5%8D%97

https://github.com/sinaweibosdk/weibo_android_sdk

http://open.weibo.com/wiki/Android_SDK%E8%AF%B4%E6%98%8E%E6%96%87%E6%A1%A3

wechat
http://dev.wechat.com/wechatapi/documentation#android-
(byte[]) headImgData
WXImageObject


http://stackoverflow.com/questions/17165972/android-how-to-open-a-specific-folder-via-intent-and-show-its-content-in-a-file

健身方法

http://mf.techbang.com/posts/623-sportsman-gym-wearing-a-t-shirt-more-attractive-6-training?page=3

機車投保

機車強制險-
本駕駛人造成  別人 或 被載者 傷害之 保險公司賠償

駕駛人傷害險-
自身導致的 本身傷害 獲得賠償

交通事故傷害險-
搭乘國內汽機車,大眾運輸工具 或 走路 造成本身受傷 所給的保障

Python 語言教學

教學網站-

http://pydoing.blogspot.tw/2012/12/Python-Understanding-of-Python-Progamming-Language.html

由Windows編譯執行程式:

--所需軟體
python原生執行環境-  https://www.python.org/downloads/release/python-2711/
下載Windows x86 MSI installer

exe製造程式- http://www.pyinstaller.org/
下載PyInstaller 3.1.1 (zip)

wxpython視窗圖形套件- http://www.wxpython.org/download.php
下載

wxPython3.0-win64-py27

--範例程式

example.py

https://drive.google.com/file/d/0B1cKGi6s-QMTVm1odW1VU1VxZ3M/view?usp=sharing

--環境設定

 設定 環境變數 -> PATH   -  C:\Python27

--安裝步驟

1.安裝python2.711(Windows x86 MSI installer) 

2. 安裝wxpython(會抓取python2.711的安裝路徑)

3.使用pyinstaller

    a.使用python command 指令視窗   

    b.將路徑切換到 pyinstaller解壓縮資料夾   , example.py也放入此folder底下

    c.使用pyinstaller.py --onefile example.py 指令

    d.之後會產生一個example資料夾 ,會產生一個獨立的exe檔案

由Ubuntu編譯執行程式:

--所需軟體
python原生執行環境-
ubuntu14.04 安裝好後就已經附帶

exe製造程式- http://www.pyinstaller.org/

使用terminal指令:   sudo pip install PyInstaller   (當然pip指令要先裝好)

wxpython視窗圖形套件- http://www.wxpython.org/download.php
下載

使用terminal指令:  sudo apt-get update  

              sudo apt-get install python-wxgtk2.8 python-wxtools wx2.8-i18n

--範例程式

example.py

https://drive.google.com/file/d/0B1cKGi6s-QMTVm1odW1VU1VxZ3M/view?usp=sharing

--環境設定

不須變數設定

--安裝步驟

上述安裝指令好,使用pyinstaller --onefile example.py

--開啟exe權限
    使用右鍵將exe檔案compress,產生tar.gz ,這樣移動到其他ubuntu系統解壓後即可直接執行

(以上為大約處理步驟)

視窗軟體設計

BCB, QT(c++), wxWidgets, GTK+(跨平台 但windows需要runtime)


UI/UX   ,   Raize  , QML ,JUCE,WPF(頗絢麗,具黑色系)

XBMC(kodi) You should be proficient in C/C++ programming language, and although not really required knowledge of DirextX and Direct3D

wxPython - 跨平台GUI設計

Python跨平台GUI設計的五大種類-
http://insights.dice.com/2014/11/26/5-top-python-guis-for-2015/

Python跨平台GUI
http://stackoverflow.com/questions/520015/cross-platform-gui-toolkit-for-deploying-python-applications
http://insights.dice.com/2014/11/26/5-top-python-guis-for-2015/
http://docs.python-guide.org/en/latest/scenarios/gui/



各種工具參考網址-
http://www.atai.org/guitool/

網域註冊

申請網址:http://www.noip.com/

申請好帳號 登入,manage DNS ->  設定 dns

port 號占用的處理方式

On Windows, from command prompt: netstat -a -n -o

check for port 8080 use:

TCP 0.0.0.0:8080 0.0.0.0:0 LISTENING 2128

In my case, PID 2128 was using 8080. 

Go to task manager to find process 2128. 

Go to view / select columns / command line

Find the offending process and see what is running it. In my case, it as a local oracle express edition that I just killed.

Spring Tool Suite(STS) - Spring framework 開發工具

1.中文顯示亂碼解決-
在web.xml 放入
 <filter>
    <filter-name>encodingFilter</filter-name>
    <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
    <init-param>
       <param-name>encoding</param-name>
       <param-value>UTF-8</param-value>
    </init-param>
    <init-param>
       <param-name>forceEncoding</param-name>
       <param-value>true</param-value>
    </init-param>
</filter>
<filter-mapping>
    <filter-name>encodingFilter</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>


2.新增project-
    new -> spring legacy project -> spring mvc project

3.做成war檔後,放入tomcat/webapp產生的缺乏jar檔的問題-
    在sts專案中,新增對應的WEB-INF/lib folder,放入mysql-connector.....jar等等 ;
  等到解war檔的時候,就有對應的lib folder

4.在STS中執行時,於url輸入網址的名稱為pom.xml中的artifactId
ex: http://localhost:8080/springmvc/register

Spring+Hibernate+Struts

IOC 依賴關係的轉移 - 高層模組不應該依賴低層模組,而是模組都必須依賴於抽象

Struts 著重的是控制物件的設計

JSF    著重於頁面流程的設計

RMI (Remote Method Invocation)  讓客戶端在使用遠端物件提供的服務時,就如同使用本地物件一樣. - 序列化格式傳遞


DAO 具備增刪改查的java類別 - ICarDAO(interface) CarDAO(class)

web.xml
-->DIspatcherServlet
    /WEB-INF/web-config.xml (View, Controller)
     /WEB-INF/model-config.xml (Model)
--------------

Hessian Burlap 透過http實現的遠程服務
Hessian - 將物件以中性的二進位訊息使用HTTP進行傳送, 頻寬較小是其優點
Burlap- 物件以XML文件格式 進行傳送,高可讀性
以上可透過Spring web框架 來使用DispatcherServlet

電腦常識

1.自動修復dll檔案:
 使用cmd的 sfc /scannow 指令
(須注意讓windows破解程序被 逆向)


2.獲得Window 7的　 Files, Folders, and Drives 修改權限:
 http://www.sevenforums.com/18494-post281.html

醫療保健

CT-Computed Tomography 斷層掃描

MRI 磁核共振