2012年10月21日 星期日

[JavaScript] 燈箱效果 ── Lytebox

  先前開發公司專案時,被要求使用類似「燈箱特效」顯示相關聯結的內容。藉由「燈箱」作為關鍵字搜尋,發現已有強者寫好的 JS 可利用,且大多數使用者推薦 lightbox2。使用 lightbox2 相當簡單,藉由下載官方網站整包檔案,解壓縮並加入專案,即可立即使用!只不過, lightbox2 僅可嵌入圖檔,無法嵌入網頁,所以不符合需求。

國父革命十一次才成功,一次的失敗不算什麼!在努力不懈搜尋之下,發現另一套 JS ── Lytebox 可嵌入網頁內容,這不就是符合我們所要的需求嗎?!在這兒,我將記錄如何安裝與使用 Lytebox,達到「燈箱」效果並嵌入靜態網頁。

2012年6月26日 星期二

[Django] Installing Django with Apache & mod_wsgi

在 Django 安裝及簡介 文章中曾介紹如何安裝 Django。

不過,若要將開發的網頁透過 domain 分享給世界各地的人欣賞,

則需要設定 apache 以達到這個目的。

下面將一步一步介紹如何在 apache 上安裝 Django:

PART 1 - Server 的部署

安裝 Apache 及 mod_wsgi
> sudo apt-get install apache2 libapache2-mod-wsgi

安裝 Django 請參考這裡

建立一資料夾儲存網站資料〈此為筆者存放位置,讀者可自行決定〉
> sudo mkdir /opt/www

PART 2 - 設定 domain name

> sudo vi /etc/hosts

並加入下列內容:

192.168.1.1 domainname 〈此為筆者之假設,請讀者自行決定〉

PART 3 - Django 測試

建立 Django 專案
> cd /opt/www
> sudo django-admin.py startproject helloworld

產生一個 wsgi 的檔案
> sudo mkdir /opt/www/helloworld/apache
> sudo vi /opt/www/helloworld/apache/django.wsgi

在 django.wsgi 檔案中編輯下列內容:

import os
import sys

path = '/opt/www'
if path not in sys.path:
    sys.path.insert(0, '/opt/www')

os.environ['DJANGO_SETTING_MODULE'] = 'helloworld.settings'

import django.core.handlers.wsgi
application = django.core.handlers.wsgi.WSGIHandler( )


修改 apache 設定
> sudo vi /etc/apache2/sites-available/default

於 default 檔案中‧‧‧

修改下列內容:

DocumentRoot /var/www -> /opt/www/helloworld

<Directory /var/www> -> <Directory /opt/www/helloworld>


增加下列內容:

WSGIScriptAlias / /opt/www/helloworld/apache/django.wsgi

啟動 site
> sudo a2ensite default
> sudo service apache2 reload


最後,打開網址,並輸入 http://domainname 就會看到 Django 安裝完成的畫面囉!

2012年6月14日 星期四

[OpenStack] 如何透過 dashboard import keypair?

在 OpenStack dashboard 中存在一項功能 ── import keypair。

But, how to import a keypiar via dashboard 一直困擾著我!囧

經由上網發問,總算得知正確的使用方式。

因此,藉由這裡記錄在 OpenStack dashboard import keypair 的方法。

首先,什麼是 keypair?下面是 OpenStack 初學者手冊中的定義。

You will also need to generate a keypair consisting of private key/public key to be able to launch instances on OpenStack. These keys are injected into the instances to make password-less SSH access to the instance. This depends on the way the necessary tools are bundled into the images.

接下來,將說明如何操作 import keypair。

STEP 1. 在主機上建立公鑰 (public key)
# ssh-keygen

建立過程中詢問之事項皆 Enter 帶過。

STEP 2. 進入 .ssh 資料夾
# cd .ssh

將會發現資料夾中存在 id_rsa 以及 id_rsa.pub 檔案。

STEP 3. 開啟公鑰
# cat ~/.ssh/id_rsa.pub

STEP 4. 複製工要內容,並貼入 dashboard 中 public key 欄位

恭喜你,順利完成 import keypair 的艱難任務! :D

參考資料:
1. OpenStack Compute Starter Guide -Essex

2012年6月2日 星期六

[Ubuntu] 在 Ubuntu 上安裝 Samba 分享檔案

用習慣圖形介面管理檔案的我,

一開始接觸 Ubuntu 相當不習慣!( Crtl+C Crtl+V 不是很好用嗎?! )

幸好公司的前輩為我開啟 Samba 這套分享檔案套件,

使我順利在 Windows 上管理 Ubuntu 的檔案。

話不多說,下面咱們就來看看如何在 Ubuntu 上安裝這套好用的套件。:D

STEP 1 安裝 Samba
sudo apt-get install samba

STEP 2 設定 Samba 設定檔
sudo vi /etc/samba/smb.conf

STEP 3 增加「分享資料夾」
在 smb.conf 尾端加上

[Sharename]
    path = /
    browseable = yes
    read only = no
    create mask = 0644
    directory mask = 0755

STEP 4 重新啟動 Samba 服務
sudo /etc/init.d/smbd restart

STEP 5 建立 Samba 帳號密碼
sudo smbpasswd -a username

2012年5月15日 星期二

[Django] Generating file to download with Django

最近在開發 Django 時遇到需產生檔案進行下載,

經閱讀 Django 官方文件與 Google 後整理如下。

要產生下載的動作需設定 Content-Disposition 標頭。

from django.http import HttpResponse

# 產生檔案
response = HttpResponse(mimetype='application/binary')
response['Content-Disposition'] = \
'attachment; filename=%s.pem' % filename
return response

2012年5月10日 星期四

[JavaScript] location.href 用法

最近在開發 Web 介面時發現,

實作點擊按鍵後進行頁面轉換 ex: demo.html --> temp.html

使用先前所學 onclick="location.href('temp.html')" 技術,

在 IE 瀏覽器中可執行。

但, Google Chrom & Firefox 卻無效果 ( 攤手 )

經「估狗」大神指導,發現將程式寫法改成 onclick="location.href='temp.html'"

一切問題就解決啦!!! ( 灑花 )




實際體驗區:

下面按鍵使用 Google Chrom 跟 Firefox 無效果!



下面按鍵使用 IE, Chrom & Firefox 皆可!

2012年4月18日 星期三

[Ubuntu] 在 Ubuntu 11.10 上安裝 SVN Server

在安裝 SVN 前,假設您的 Apache 伺服器已安裝完成。

若未安裝 Apache ,請參考

https://help.ubuntu.com/community/ApacheHTTPserver

1. 安裝 SVN

sudo apt-get install subversion
sudo apt-get install libapache2-svn

假設安裝的過程中,出現錯誤訊息: E: Unable to locate package libapache2-svn

請您這樣做: sudo apt-get update 即可解決上述問題!

2. 配置 Apache 的 httpd.conf 文件

vi /etc/apache2/httpd.conf

<Location /svn>
DAV svn
SVNParentPath /svn
AuthType Basic   
AuthName "subversion repository"
AuthUserFile /svn/passwd 
AuthzSVNAccessFile /svn/auth
Require valid-user
</Location>

3. 創建 SVN 根目錄,並創建 myproject 版本庫


mkdir /svn/
mkdir /svn/myproject
svnadmin create /svn/myproject
chmod 777 -R /svn/myproject


4. 配置使用者帳號、密碼

在第 2 步時,我們已經指定使用者密碼配置文件為: /svn/passwd

htpasswd -c /svn/passwd admin

5. 配置使用者群組權限

在第 2 步時,我們已經指定使用者群組權限配置文件為: /svn/auth

vi /svn/auth

[groups]
developers=admin

[/]
developers=rw
*=r

6. 重新啟動 Apache

sudo /etc/init.d/apache2 restart