星期一, 7月 25, 2016

[MAMP] Mac的php版本改用MAMP的php版本的方法

直接用MAMP來取代mac原本裝裝php5版本,

請參考下面流程,請注意MAMP_PHP改為你要使用的版本號即可

open terminal, type
touch ~/.bash_profile; open ~/.bash_profile
edit as follows below, save, quite and restart terminal or alternately
source ~/.bash_profile
to execute new PATH without restarting terminal
and in the fashion of the DavidYell's post above, also add the following. You can stack various variables by exporting them followed by a single PATH export which I demonstrated below
export MAMP_PHP=/Applications/MAMP/bin/php/php5.6.10/bin
export MAMP_BINS=/Applications/MAMP/Library/bin
export USERBINS=~/bins
export PATH="$USERBINS:$MAMP_PHP:$MAMP_BINS:$PATH"
http://stackoverflow.com/questions/4145667/how-to-override-the-path-of-php-to-use-the-mamp-path

星期四, 6月 23, 2016

[php] 用命令提示字元檢查語法是否有誤

今天寫物件發生一些sytax錯誤,
開了display_errors, error_reporting都沒什麼錯誤印出來。
於是直接使用cmd line語法檢查..

php -l UserScoreGradeDAO.class.php 
No syntax errors detected in UserScoreGradeDAO.class.php

就會告訴你錯在哪一行了,真的方便多了。

星期二, 6月 21, 2016

[CSS 3] 描繪路徑

http://codepen.io/paintbycode/pen/JDbcF/
下拉Iron Man範例

如果要用Stroke效果來描述的話,需要計算path的數值。
以下記錄一下計算的方法

純JS
var path = document.querySelector('path');
var length = path.getTotalLength();

jQuery的方法
var path = $('#目的元素').get(0);
var pathLen = path.getTotalLength();

星期一, 6月 13, 2016

[ubuntu] 調整系統時間與時區

最近在裝VM踩到系統時間未設定正確的雷,導致API的授權認證一直過期。
記錄一下這個腦洞的錯誤。


#查看系統時間 (發現時間錯誤)
date


Sun Apr 10 19:12:58 CST 2016 

#國家時間與頻率標準實驗室
sudo ntpdate time.stdtime.gov.tw
Tue Jun 14 10:20:14 CST 2016

#將硬體時間與系統時間同步
sudo hwclock -w

#重設時區 (需為root的權限)
sudo dpkg-reconfigure tzdata

Local time is now:      Sun Apr 10 19:14:39 CST 2016.
Universal Time is now:  Sun Apr 10 11:14:39 UTC 2016.


星期日, 6月 12, 2016

[C] error: unknown type name 'bool'這種錯誤

error: unknown type name 'bool'這種錯誤
可以加入#include

或換編譯 C99之後才有 http://zh.wikipedia.org/wiki/Stdbool.h

[ubuntu] 常用的指令


記錄一下常用的指令集

安裝SMB


#安裝
apt-get install samba


#安裝完畢後,先暫停服務修改設定檔.
/etc/init.d/samba stop


#編輯設定檔
sudo vim /etc/samba/smb.conf


#測試設定檔有無錯誤 (不用在指定的目錄下執行即可)
testparm





#重新啟動
/etc/init.d/samba restart

#顯示目前smb的狀態

sudo smbstatus


#新版後的ubuntu

sudo service smbd start
Stop
sudo service smbd stop
Restart
sudo service smbd restart

網路設定


[CSS] 使用css transition 做出underline的效果

作者示範了各種underline的動畫效果,有需要的朋友可以參考一下。
我的案例需要下圖中記錄的SlideIn效果。


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

星期二, 5月 24, 2016

[PHP] php-extension: 範例練習

經過前幾次的練習與說明,筆記一下因為自已的需求測試的範例


範例: 從自已建一個額外的C語言的檔案呼叫



1.修正一下config.m4指定載入額外的C語言

dnl config.m4 for extension


PHP_ARG_ENABLE(foo, whether to enable foo extension support,
  [--enable-foo Enable foo extension support])

dnl 檢測extension是否已被啟動
if test $PHP_FOO != "no"; then

 AC_MSG_CHECKING("start to enable extension");

  dnl PHP_NEW_EXTENSION(foo, php_foo.c, $ext_shared)

  dnl 注意多引用了自定義C語言func
    PHP_NEW_EXTENSION(foo, php_foo.c hello_world_c.c, $ext_shared)


fi


2.先建立自已的C的實作與標頭檔
hello_world_c.h, hello_world_c.c

int hello_world_c_add(int, int);


/*Hello World program*/

#include <stdio.h>
#include "hello_world_c.h"

int hello_world_c_add(int a,int b){
 int sum = 0;
 printf("hello_world_c_add is coming Orz\n");
 printf("%d\n", a);
 printf("%d\n", b);
 sum = a+b;
 printf("sum=%d\n", sum);

 return sum;
}
int main(){
 printf("Hello World C :D");
 printf("sum=%d",hello_world_c_add(10,10));
 return 0;
}


3. 在php_foo.c裡面include hello_world_c.h檔


#include "hello_world_c.h"//內部的c func

#include "php_foo.h"

#if COMPILE_DL_FOO
ZEND_GET_MODULE(foo)
#endif

....

3. 新增一個PHP_FUNCTION: 呼叫剛剛的hello_world_c_add


//呼叫自定義的c函數,來處理加法

PHP_FUNCTION(foo_hello_add) {

  php_printf("run foo_hello_add\n");

  int val1;
  int val2;
  int sum;

  //parse parameters
  if (zend_parse_parameters(ZEND_NUM_ARGS() TSRMLS_CC, "ll", &val1,&val2 ) == FAILURE) {
      RETURN_FALSE;
  }

  php_printf("val1=%d\n",val1);
  php_printf("val2=%d\n",val2);

  sum = hello_world_c_add(val1,val2);

  RETURN_DOUBLE(sum);
}




範例: C實作/標頭檔搬到子資料夾




接著想把不同自定義的C函式庫分裝到不同的sub-folder後就爆了以下訊息:



目前這個範例卡關中...

範例: 全域變數的操作




範例: 回傳resouce



參考




  • https://github.com/jheth/hello-php-extension
  • 在 PHP Extension 中加入 static 和 dynamic library
  • Linux静态链接库与动态链接库的区别及动态库的创建
  • Linux中创建静态库和动态库
  • http://php.net/manual/en/internals2.structure.globals.php
  • https://github.com/walu/phpbook/blob/master/12.5.md


星期一, 5月 23, 2016

[PHP] php-extension編譯C++


如有c++函式庫需要處理,請在config.m4加入以下指令:

PHP_REQUIRE_CXX()

PHP_SUBST(YOUREXTENSION_SHARED_LIBADD)

PHP_ADD_LIBRARY_WITH_PATH(stdc++, "", YOUREXTENSION_SHARED_LIBADD)

PHP_ADD_LIBRARY(stdc++,EXTRA_LDFLAGS)

dnl 上面設定好了,PHP_NEW_EXTENSION的第二個參數就可以輸入 c++的檔案了,下面的例子還是C
PHP_NEW_EXTENSION(foo, php_foo.c, $ext_shared)

[PHP] config.m4 指令集筆記

記錄一下一定會忘記的php-ext常用的指令說明。

指令集

  • AC_MSG_CHECKING 
畫面輸出訊息 checking whether to enable foo extension support 
 
  • PHP_SUBST 


PHP_SUBST(XXXX_SHARED_LIBADD), 其中 XXXX 為 PHP Extension 的名稱 (全大寫)


  • PHP_ADD_LIBRARY_WITH_PATH 
  • PHP_CHECK_LIBRARY
  • PHP_ADD_INCLUDE 
  • PHP_ADD_BUILD_DIR 

  • PHP_ADD_LIBRARY_WITH_PATH 


完整指令

XXXX: 你想要載入的extension name


PHP_ADD_LIBRARY_WITH_PATH([library name], [library path], XXXX_SHARED_LIBADD)


例如我們想加入 libabc.so, 而該檔案在 /usr/lib, 則我們會加入: PHP_ADD_LIBRARY_WITH_PATH(abc, /usr/lib, XXXX_SHARED_LIBADD)

  • PHP_NEW_EXTENSION 
完整指令 PHP_NEW_EXTENSION(extname, sources [, shared [,sapi_class[, extra-cflags]]])
範例 PHP_NEW_EXTENSION(foo, foo.c bar.c baz.cpp, $ext_shared)

參考
http://tglcowcow.blogspot.tw/2008/05/php-extension-static-dynamic-library.html

星期五, 5月 20, 2016

[Flickrlinkr] phpFlickr: The web service endpoint returned a "HTTP/1.1 403 Forbidden" response


今天在VM重建flickrlinkr偵錯時發生了以下錯誤:


The web service endpoint returned a "HTTP/1.1 403 Forbidden" response


由於使用phpFlickr類別時,有用到curl,所以請安裝curl for php元件


安裝方法如下


sudo apt-get install php5-curl


安裝完畢後,請重啟apache2

sudo service apache2 restart

[GIT] server certificate verification failed. 錯誤排除

fatal: unable to access 'https://bigd@bitbucket.org/shark_tech/thegrand.git/': server certificate verification failed. CAfile: /etc/ssl/certs/ca-certificates.crt CRLfile: none


bigd@ubuntu:/var/www/thegrand$  export GIT_SSL_NO_VERIFY=1

bigd@ubuntu:/var/www/thegrand$  git submodule update --init --recursive

星期三, 5月 18, 2016

[CSS 3動畫] animation 語法動畫筆記

最近一些case需要使用大量的css動畫,把一些處理到的指令筆記一下


animation的短指令

animation: name duration timing-function delay iteration-count direction;



定義動畫結束後如何停止最後一個狀態

animation-fill-mode : none | forwards | backwards | both;


none:不改变默认行为。

forwards :当动画完成后,保持最后一个属性值(在最后一个关键帧中定义)。

backwards:在 animation-delay 所指定的一段时间内,在动画显示之前,应用开始属性值(在第一个关键帧中定义)。

both:向前和向后填充模式都被应用。

星期一, 5月 16, 2016

[PHP] php extension 初試: extension parser parameter (接收參數)


接續先前的基本範例,接著要來練習怎麼接收帶入extension的參數:


zend_parse_parameters方法

zend_parse_parameters提供不同的接收變數的方式, 變數1: ZEND_NUM_ARGS() TSRMLS_CC, 二個值中間是空白,ZEND_NUM_ARGS表示傳入參數的個數 變數2: 傳入變數的格式化字串

星期五, 5月 13, 2016

[PHP] php extension 初試

拜讀完php-extension骨架練習,
如果C語言忘得差不多錄影檔有從基本的C語言開始教起:D


如果C語言已經很熟的話,可以跳至26:38秒開始

測試環境

  1. MacOSX EI
  2. MAMP (所以流程中有其他錯誤要處理一下:D)

ZVal是什麼

http://php.net/manual/en/internals2.variables.intro.php



Note:


PHP is a dynamic, loosely typed language, that uses copy-on-write and reference counting.
所有的php變數型態都是定義在一個zval的struct,並且使用copy-on-write(寫入時複製)與reference counting(來判斷變數是否還有被使用)。

Null-Terminated String



初始化 ZVAL



簡化


ZVAL設定值

ZVAL_STRING
ZVAL_LONG
ZVAL_BOOL

星期二, 5月 10, 2016

星期五, 5月 06, 2016

[PHP] ffmepg 相關筆記

最近工作需要用到一些audio的處理,記錄一下相關的ffmpeg討論資源。

php 使用exec 執行 ffmpeg指令
http://www.phpro.org/tutorials/Video-Conversion-With-FFMPEG.html

Binary data 處理
http://blog-en.openalfa.com/how-to-work-with-binary-data-in-php

Audio codec:
https://trac.ffmpeg.org/wiki/audio%20types

讀取WAV檔
http://www.mcpressonline.com/web-languages/easily-manage-wav-files-with-php.html

WAV file/read
https://gist.github.com/Xeoncross/3515883
https://github.com/boyhagemann/Wave

音频格式详解:WAV
http://www.aliog.com/39896.html

READ WAV
http://www.bloggingzeal.com/how-to-read-a-wav-file-with-php/

pack/unpack format
a - NUL-padded string
A - SPACE-padded string
h - Hex string, low nibble first
H - Hex string, high nibble first
c - signed char
C - unsigned char
s - signed short (always 16 bit, machine byte order)
S - unsigned short (always 16 bit, machine byte order)
n - unsigned short (always 16 bit, big endian byte order)
v - unsigned short (always 16 bit, little endian byte order)
i - signed integer (machine dependent size and byte order)
I - unsigned integer (machine dependent size and byte order)
l - signed long (always 32 bit, machine byte order)
L - unsigned long (always 32 bit, machine byte order)
N - unsigned long (always 32 bit, big endian byte order)
V - unsigned long (always 32 bit, little endian byte order)
f - float (machine dependent size and representation)
d - double (machine dependent size and representation)
x - NUL byte
X - Back up one byte
@ - NUL-fill to absolute position

a一个填充空的字节串
A一个填充空格的字节串
b一个位串,在每个字节里位的顺序都是升序
B一个位串,在每个字节里位的顺序都是降序
c一个有符号char(8位整数)值
C一个无符号char(8位整数)值;关于Unicode参阅U
d本机格式的双精度浮点数
f本机格式的单精度浮点数
h一个十六进制串,低四位在前
H一个十六进制串,高四位在前
i一个有符号整数值,本机格式
I一个无符号整数值,本机格式
l一个有符号长整形,总是32位
L一个无符号长整形,总是32位
n一个16位短整形,“网络”字节序(大头在前)
N一个32位短整形,“网络”字节序(大头在前)
p一个指向空结尾的字串的指针
P一个指向定长字串的指针
q一个有符号四倍(64位整数)值
Q一个无符号四倍(64位整数)值
s一个有符号短整数值,总是16位
S一个无符号短整数值,总是16位,字节序跟机器芯片有关
u一个无编码的字串
U一个Unicode字符数字
v一个“VAX”字节序(小头在前)的16位短整数
V一个“VAX”字节序(小头在前)的32位短整数
w一个BER压缩的整数
x一个空字节(向前忽略一个字节)
X备份一个字节
Z一个空结束的(和空填充的)字节串

星期五, 4月 29, 2016

[PHP] Composer 教學筆記

現在寫php一定要會用的套件管理工具composer

安裝

參考一下這篇
http://iambigd.blogspot.tw/2013/07/php-composer.html

快速安裝使用

1. 首先要在專案下建立composer.json,加入你要引用的套件(管理套件相依性)

{
    "require": {
        "monolog/monolog": "1.2.*"
    }
}

2. 然後執行composer install

3. 接著就會在專案下產生composer.lock檔案以及vendor目錄

composer.lock

在首次安裝套件完畢後,會產生這個檔案,裡面記錄了所安裝套件的資訊。這個檔案的真正作用是:如果目錄中有這個檔案,執行安裝時,就不會去搜尋更新的版本,而是依照這個檔案中記錄的版本來安裝。這個設計很重要,因為新版的套件很有可能與目前使用的版本不相容,如果不是使用同樣版本,很難保證系統的穩定。過去在使用pear來管理套件時,如果不注意,就有可能發生升級導致的慘劇。

vendor目錄(預設目錄)

主要含以下內容

  • vender/autoload.php
只要引用這個檔案,就可以載入套件中所有對外公開的類別。

require 'vendor/autoload.php';
  • vender/composer
自動載入的載入器與快取檔

  • 各套件資料夾目錄
依造命名規則/

場景應用注意(From 大澤小木鐵phpconf簡報):


  1. Git只需要加入composer.json 與composer.lock,方便其他成員使用
  2. 請由專案負責人進行composer的第一次安裝與之後的更新
  3. 不要將vendor資料夾送入Git,其他團隊成員應該只要透過composer install安裝
  4. Library的composer.lock不要加入Git




參考

  1. https://speakerdeck.com/jaceju/begining-composer
  2. http://ithelp.ithome.com.tw/question/10136653


星期四, 4月 28, 2016

[EC2] 安裝 ffmpeg

記錄一下成功安裝ffmepg在EC2的步驟。


1. 首先建立ffmepg資料夾


$cd /usr/local/bin/

$sudo mkdir ffmpeg

$cd ffmpeg


2. weget下載stable 包



$sudo wget http://ffmpeg.gusari.org/static/64bit/ffmpeg.static.64bit.2014-07-16.tar.gz

3. 解開下載的tar檔



$sudo tar -xzf ffmpeg.static.64bit.2014-07-16.tar.gz

之後會解出ffmpeg與ffprobe二個資料夾

$ls -al
ffmpeg  ffmpeg.static.64bit.2014-07-16.tar.gz  ffprobe


4. 執行測試

$./ffmpeg -version

列出這一版的資訊

ffmpeg version N-63893-gc69defd
built on Jul 16 2014 05:38:01 with gcc 4.6 (Debian 4.6.3-1)
configuration: --prefix=/root/ffmpeg-static/64bit --extra-cflags='-I/root/ffmpeg-static/64bit/include -static' --extra-ldflags='-L/root/ffmpeg-static/64bit/lib -static' --extra-libs='-lxml2 -lexpat -lfreetype' --enable-static --disable-shared --disable-ffserver --disable-doc --enable-bzlib --enable-zlib --enable-postproc --enable-runtime-cpudetect --enable-libx264 --enable-gpl --enable-libtheora --enable-libvorbis --enable-libmp3lame --enable-gray --enable-libass --enable-libfreetype --enable-libopenjpeg --enable-libspeex --enable-libvo-aacenc --enable-libvo-amrwbenc --enable-version3 --enable-libvpx
libavutil      52. 89.100 / 52. 89.100
libavcodec     55. 66.101 / 55. 66.101
libavformat    55. 43.100 / 55. 43.100
libavdevice    55. 13.101 / 55. 13.101
libavfilter     4.  8.100 /  4.  8.100
libswscale      2.  6.100 /  2.  6.100
libswresample   0. 19.100 /  0. 19.100
libpostproc    52.  3.100 / 52.  3.100

5. 如果要在每個路徑下都能使用請做一下symbol link


$sudo ln -s /usr/local/bin/ffmpeg/ffmpeg /usr/bin/ffmpeg

TIP: 軟連結請勿打錯路徑,否則在/usr/bin/ffmpeg 會顯示紅色!!

參考資源


官網stable build
http://ffmpeg.gusari.org/static/64bit/

本文參考
http://stackoverflow.com/questions/15057151/installing-ffmpeg-on-amazon-linux-cpp-gcc-libstdc-dependancies

星期三, 4月 27, 2016

[快快樂樂學WordPress] 記錄一些wordpress plugin需要用的資料

Google到的Wordpress plugin教學蒐集

//好像很老的玩家lol
http://blog.wpjam.com/article/write-plugin-by-yourself/

//官方
http://codex.wordpress.org/Writing_a_Plugin
http://codex.wordpress.org/Adding_Administration_Menus
http://codex.wordpress.org/Plugin_API

星期二, 4月 26, 2016

fullpage.js 一頁式的網站樣版工具

如果你需要一頁式的網站樣版,可以參考一下fullpage.js這個套件


http://alvarotrigo.com/fullPage/#firstPage

[CSS3] CSS transform/transition/animation 初學筆記

最近幫朋友弄了一個網站,需要使用很多CSS transition與animation的效果,
順道找了一些不錯的資訊學習,看完就可以馬上上手許多:D,很適合初學者們

短語法


可用屬性



參考如下:

https://www.openfoundry.org/tw/tech-column/9233-css3-animation
http://www.ruanyifeng.com/blog/2014/02/css_transition_and_animation.html
http://blog.iwege.com/posts/the-different-between-transform-transition-animation.html

超強transform解說:
https://desandro.github.io/3dtransforms/

[CSS] 讓youtube影片放入DIV後能夠填滿寬高的解法

如果你有需要使用youtube連結當背景播放影片的話,可以參考以下網址的解法,
試過是可行的:D 有需要的朋友可以看看。

https://www.h3xed.com/web-development/how-to-make-a-responsive-100-width-youtube-iframe-embed

[jQuery] scroll animation 外掛

快速上手的scroll animation外掛

https://github.com/mpalpha/animate-scroll

星期四, 3月 31, 2016

[Apache] Could not reliably determine the server's fully qualified domain name 錯誤訊息

AH00558: apache2: Could not reliably determine the server's fully qualified domain name, using 127.0.1.1. Set the 'ServerName' directive globally to suppress this message

只要在
sudo vim /etc/apache2/apache2.conf

加入ServerName localhost

即可

星期日, 3月 27, 2016

[快快樂樂學Wordpress] wordpress來指定某個用戶登入以實作SSO(單點登入)

最近實作了一個wp的SSO機制,
主要用了get_user_by的方法來取得用戶的資訊後,
再透過wp_set_current_user與wp_set_auth_cookie設定用戶的session並執行wp_login的hook即可。

if($user){

   //do the single sing on
   wp_set_current_user( $user_id, $user->user_login );
      wp_set_auth_cookie( $user_id );
      
      //email
      // echo $user->user_login;

      do_action( 'wp_login', $user->user_login,$user );
  }
 

REF

http://carlofontanos.com/auto-login-to-wordpress-from-another-website/

星期一, 3月 21, 2016

Markdown-Cheatsheet 參考表

現在流行使用Markdown來寫文件了了,
有興趣的朋友可以看一下下面這個github repo。
看一下就可以快速入門了。

https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet

update:

這裡有更多語法
http://pages.tzengyuxio.me/pandoc/

[WordPress] Woocomerce login hook筆記

記錄一下woocommerce hook的筆記

//一般wp_login的hook
function so_26675676_your_function($user_login, $user) {
 // your code
}
add_action('wp_login', 'so_26675676_your_function', 10, 2);


//woocommerce login hook,你可以自訂_wp_http_referer參數
add_filter( 'woocommerce_login_redirect', 'krex_redirect'); add_filter( 'woocommerce_registration_redirect', 'krex_redirect'); function krex_redirect( $redirect_to ) { if ( ! empty( $_REQUEST['_wp_http_referer'] ) ){ $ref = wp_unslash( $_REQUEST['_wp_http_referer'] ); } return $ref; }


//shortcode
[woo_social_login redirect_url="轉頁的網址"]

/*----------------------------------------------------
------------------------*/
// redirects for login / logout
/*----------------------------------------------------------------------------*/
add_filter('woocommerce_login_redirect', 'login_redirect');

function login_redirect($redirect_to) {

 $location = $_SERVER['HTTP_REFERER'];
wp_safe_redirect($location);
exit();

}

add_action('wp_logout','logout_redirect');

function logout_redirect(){

$location = $_SERVER['HTTP_REFERER'];
wp_safe_redirect($location);
exit();

}

  • https://www.skyverge.com/blog/advanced-woocommerce-social-login/
  • https://github.com/woothemes/woocommerce/commit/014e31952828377bf7a1ebf4e812a43d0bcefa67#commitcomment-3351995

[Wordpress Plugin] 多國語言插件

好用但要付錢的WPML多國語言插件 :D
有提供一些變數的常數
ConstantDescriptionExample
ICL_LANGUAGE_CODECode for the current languagefr
ICL_LANGUAGE_NAMEName of current language, in the current languageFrançais
ICL_LANGUAGE_NAME_ENName of the current language name in EnglishFrench

REF
https://wpml.org/
https://wpml.org/documentation/support/wpml-coding-api/

星期二, 3月 08, 2016

[CSS] 使用Media Query來處理不同裝置所需的樣式筆記

記錄一下相關media query的筆記。

  • media query可用來依據裝置特性套用樣式。
  • min-width (而不是 min-device-width) 以確保獲得最通用的體驗。
  • 針對元素使用相對大小,避免版面走樣。

實作方法

使用link標籤

使用import語法

查詢語法

一般RWD最常使用以下屬性
屬性結果
min-width任何超過查詢中指定寬度的瀏覽器都會套用規則。
max-width任何未超過查詢中指定寬度的瀏覽器都會套用規則。
min-height任何超過查詢中指定高度的瀏覽器都會套用規則。
max-height任何未超過查詢中指定高度的瀏覽器都會套用規則。
orientation=portrait任何高度大於或等於寬度的瀏覽器都會套用規則。
orientation=landscape任何寬度大於高度的瀏覽器都會套用規則

[CSS] 重設 絕對定位的值

今天在試media query重新定位某個icon時,發現一直無法清掉left,
查了一下google大神,可以在覆寫的css中改加上 left:auto; ,瀏覽器即會使用預設的值。

星期日, 3月 06, 2016

[Html5]多國語系 i18n 字串符設定


新版的lang設定值已進化成以下的列表了,有需求要朋友可以參考一下。

Lang對應清單

zh-Hans 簡體中文

zh-Hans-CN 大陸地區使用的簡體中文

zh-Hans-HK 香港地區使用的簡體中文

zh-Hans-MO 澳門使用的簡體中文

zh-Hans-SG 新加坡使用的簡體中文

zh-Hans-TW 臺灣使用的簡體中文

zh-Hant 繁體中文

zh-Hant-CN 大陸地區使用的繁體中文

zh-Hant-HK 香港地區使用的繁體中文

zh-Hant-MO 澳門使用的繁體中文

zh-Hant-SG 新加坡使用的繁體中文

zh-Hant-TW 臺灣使用的繁體中文

其他舊式用法,PS:不符合RFC 4646規範

zh-hakka 客家話

zh-cmn 普通話

星期五, 3月 04, 2016

[快快樂樂學Wordpress] 自訂樣版: 基礎架構 (1)

記錄一下新增wordpress樣版的筆記


樣版基本需求檔案

請在theme folder之下新增下面三個檔案

index.php
style.css
function.php

之後後台就會出現你的樣版了



DEMO

因為index.php與function.php什麼都沒寫,因此網站會呈現一片空白 Orz

完成的佈景主題所需要的檔案

 style.css

 header.php

 footer.php

 index.php

 single.php

 page.php

 sidebar.php

 comments.php

 archives.php

 search.php

 searchform.php

 404.php

 functions.php





星期四, 3月 03, 2016

[Html5] 在網頁播放midi音樂檔

因為工作需求需要在網頁上播放midi
查了一下使用html5 audio的播放器是無法播放的,
使用舊式的object tag chrome會跳出禁用的警告,
最後使用https://github.com/chenx/MidiPlayer 這個方法是最簡單處理的,
只需要下載一個js檔就可以簡單使用了!!

Features

Can specify these in constructor parameter list: midi, target, loop, maxLoop, end_callback.
  • - midi: MIDI file path. 
  • - target: Target html element that this MIDI player is attached to. 
  • - loop: Optinoal. Whether loop the play. Value is true/false, default is false. 
  • - maxLoop: Optional. max number of loops to play when loop is true. Negative or 0 means infinite. Default is 1. 
  • - end_callback: Optional. Callback function when MIDI ends. 
  • e.g., use this to reset target button value from "stop" back to "play".
  • Can specify a debug div, to display debug message: setDebugDiv(debug_div_id).
  • Start/stop MIDI by: start(), stop().
  • If a MIDI started play, call start() again will stop and then restart from beginning.

範例


//初始化
 // * @param midi    MIDI file path.
                    // * @param target  Target html element that this MIDI player is attached to.
                    // * @param loop    Optinoal. Whether loop the play. Value is true/false, default is false.
                    // * @param maxLoop Optional. max number of loops to play when loop is true.
                    // *                Negative or 0 means infinite. Default is 1.
                    // * @param end_callback Optional. Callback function when MIDI ends.
                    midiPlayer = new MidiPlayer(url, MIDI_ELEM_ID, true, 1, function() {
                        console.log('midi done');
                    });

//播放
 midiPlayer.play();
//停止
 midiPlayer.stop();

參考連結


https://github.com/mudcube/MIDI.js => 功能最強大的midi庫
https://developer.mozilla.org/zh-TW/docs/Web_Audio_API
http://stackoverflow.com/questions/5789734/does-the-html5-audio-tag-encompass-mid-midi-unofficially
http://homeofcox-cs.blogspot.tw/2015/04/play-midi-in-browser-by-javascript-only.html
https://github.com/chenx/MidiPlayer

星期三, 3月 02, 2016

[Bootstrap 3] 變更modal overlay的背景色方法

本文記錄一下如何修改bootstrap modal overlay的背景色
To change the color via:

CSS

Put these styles in your stylesheet after the bootstrap styles:
.modal-backdrop {
   background-color: red;
}

Less

Changes the bootstrap-variables to:
@modal-backdrop-bg:           red;

Sass

Changes the bootstrap-variables to:
$modal-backdrop-bg:           red;

其他你感興趣的文章

Related Posts with Thumbnails