2015年5月25日 星期一

Setup VCS Using Redmine + Git

We all know that Git is a very good VCS, with redmine, like Bugzilla, we have even better control and graphical view on our repository, and this is undoubtedly aid development. The following is how to make the whole VCS system happens.

What we need
1) Git (of course!)
2) Redmine
3) Apache Server

Procedure
1) Install all the necessary components respectively
sudo apt-get install apache2
sudo apt-get install mysql-server
sudo apt-get install redmine-mysql
sudo apt-get install libapache2-mod-passenger
sudo apt-get install redmine
sudo apt-get install git-core

2) Set up soft link from redmine source to the Apache source
sudo ln -s /usr/share/redmine/public /var/www/redmine

3) mod passenger needs www-data to execute, add the following to /etc/apache2/mods-available/passenger.conf
vi /etc/apache2/mods-available/passenger.conf
PassengerDefaultUser www-data

 4) Add redmine's web directory to Apache2's sites-available/default

                RailsBaseURI /redmine
                PassengerAppRoot /usr/share/redmine
                RailsEnv production
                PassengerResolveSymlinksInDocumentRoot on
5) Setup plugin linkage
 ln -s /var/cache/redmine/default/plugin_assets /usr/share/redmine/public/

6) Create new repository (server side), note that the directory should be with owner "www-data"
cd /var/www
mkdir test-repo.git
cd test-repo.git
git --bare init
git update-server-info
chown -R www-data.www-data .

 7) Enable webDAV
a2enmod dav_fs
a2enmod dav

If high security is required, carry on, if not, restart apache and all services will be done

8) Create the following file
/etc/apache2/conf.d/git.conf

9) Configure the repository path for authentication
        DAV on
        AuthType Basic
        AuthName "Git"
        AuthUserFile /etc/apache2/passwd.git
        Require valid-user

10) Create user which can access the repository
 htpasswd -c /etc/apache2/passwd.git

11) Restart Apache service
/etc/init.d/apache2 restart

Done! You have made a git VCS with redmine geared!

Almost forgot, modifying the config file in .git directory is necessary for authentication when pushing
[remote "origin"]
fetch = +refs/heads/*:refs/remotes/origin/*
url = http://username:password@git.repository.url/repo.git

References:
- Linking git remote server to Apache
http://blog.bobbyallen.me/2012/07/23/installing-a-git-server-using-apache-webdav-on-ubuntu-server-12-04/

- Installing Apache + Git + Redmine
http://blog.chiichen.com/2014/05/raspberry-pi-redmine.html

- Git config fix on http/https authentication
http://stackoverflow.com/questions/5264949/cannot-push-git-to-remote-repository-with-http-https

- Others
https://randomthoughtsgr.wordpress.com/2011/10/17/redmine-sub-uri-and-apache-configuration/

2015年5月12日 星期二

cxfreeze Python program (Linux) - Wrapping the Python Program to Single Executable

I would like to note down here because Googling results frustrating with

  • Large amount of Windows environment Python application wrapping
  • Misleading and lack of example of cxfreeze API

But thanks for Stackoverflow, I finally get the solution despite various failure on different problems during the wrapping of my wxPython application.


Here is my situation
    I have written a wxpython program, and the program consist of not only .py files but with images and xml files, I want to 

  1. Wrap all these stuffs to one executable program in Ubuntu
  2. Deploy this program with deb installer

Solutions
  1. Download and install cxfreeze
  2. Please let me know but I cannot find relative commands on how to include external files, therefore I use the officially provided py script
    http://cx-freeze.readthedocs.org/en/latest/script.html
  3. Follow the below official guide and write the setup script to build the program
    http://cx-freeze.readthedocs.org/en/latest/distutils.html
  4. Run python setup.py build and your program will be built
  5. Follow the file structure to build the deb

  • mpstoolbox is the app name, name your own one
  • DEBIAN/control, DEBIAN/postinst is files to configure the deb package
  • usr/bin/..., this is the installed path, you should make your own path, all the files installed will follow this path structure
  • Finally, cd back to the folder (your app name), use dpkg -b yourAppName
  • A deb package will be generated
  • Use dpkg -i to install

Here comes the MOST important part, my problem

    It seems simple to follow the above to build the program, but indeed it doesn't, the guide does not teach you clearly on how to include the required modules to let you bring your program to other Linux machine to run, you need to follow the followings


  • binpathincludes parameter is important, please include all system library like /usr/lib, /usr/local/lib, or you may encounter this error libwx_gtk2u import error, ImportError: libwx_gtk2u_adv-2.8 etc. This is deal to the missing of wxPython library, you therefore need to include all required system library when building the app
  • About the setup.py, the api is not very clear in cxfreeze, follow stackoverflow's guide, thanks to the bro there, he also suffered from the lack of clearance of the api
    http://stackoverflow.com/questions/15486292/cx-freeze-doesnt-find-all-dependencies

    One thing here to pay attention to, the "include_files" attribute should be a list of tuples instead of single name only!! Your external files and other required images should also put it here.

2015年2月1日 星期日

[VLC] Solving Gibberish Subtitles when Using VLC


  1. Make sure the sub file is in utf-8 or unicode

  2. Navigate to VLC>Tools>Reference>Subtitle/OSD

  3. Change the "Default Encoding" to uft-8 and the font to "Microsoft Yahei"

  4. Enjoy the nice sub!

2015年1月23日 星期五

Dual/Multiple OS Installation

We often need to install multiple OS in one system, for example
  1. Windows 8 & Ubuntu 12
  2. Ubuntu 12 & Ubuntu 14
  3. Windows 8 & Ubuntu 12 & Ubuntu 14...
We often follow the below instructions to achieve (assuming you have ONE Windows pre-installed and ONE Ubuntu pre-installed and you want to install the third OS, also Ubuntu)

  1. Navigate to the BIOS, set the USB Ubuntu stick as the booting machine
  2. Turn off the security boot to prevent the laptop not loading the USB (subjected to change on different BIOS)
  3. Turn off the EUFI boot specifically for Windows 8 to avoid always booting to Windows instead of Ubuntu
  4. Boot overriding the USB drive (subjected to change on different BIOS), if no boot overriding exists, just follow the old school boot priority function
  5. Make a new partition for your Ubuntu, remember if you lack disk space, you will need to do partition resizing and  be-careful not to override the Windows partition or you may not be able to boot into Windows again!! Before installing the new OS, make sure you which partition which OS refers to.
  6. After adding/resizing the partition, format it with ext4
  7. You will need to provide the mounting point (I usually pick "/") and create a very small bootloader partition called "Reserved BIOS Boot Area" for GRUB's code, this is VERY IMPORTANT, grub provides a boot menu for you to navigate to different OS, we need to provide it with some space (normally as small as 1MB), after creating both partitions, you are okay to proceed to the installation processes.
  8. Follow the Ubuntu install guide to finish the installation. 
  9. In the final step, Ubuntu will ask you to restart the machine, just do so.
  10. Luckily you will find a Linux boot menu listing all the partitions included (e.g. /dev/sda1,sda2.... etc.) but we will miss our newly installed OS partition, we need to update the grub file to reflect the changes (OS addition)
  11. Boot into the pre-installed Ubuntu (the one before our third OS installation), navigate to /etc/default/grub and use text editior to edit it.
  12. We only interest in GRUB_DEFAULT, this controls which OS the default OS should boot in, choose the one you want and save the setting
  13. Remember after updating the file, you will need to UPDATE by sudo update-grub , if not the newly installed OS will not appear in the grub menu
  14. Reboot the machine and you will see the newly installed OS appeared.
Reference:
  1. http://askubuntu.com/questions/16042/how-to-get-to-the-grub-menu-at-boot-time
  2. http://askubuntu.com/questions/343268/how-to-use-manual-partitioning-during-installation 
 

2015年1月16日 星期五

[requireJS] define VS require

Difference between define and require

We often see define and require in requireJS, but what's their difference? I try to elaborate as below.

require
  1. When you want to load some stuff, you need to use require, like jquery, bootstrap etc.
  2. It has NO return statement
e.g.:
require(["jquery", "bootstrap", "bootstrap_select"], function() {
 //requirejs sugar function
 var angular = require('angular');
});


define
  1. As the name implies, it helps you define module that will be depend by other modules or applications
  2. It has return statement for inclusion by other modules
e.g.:
define(["angular", "angular-route", "angular-animate"],function(angular){
 var insiderApp = angular.module("insiderApp",["ngRoute", "ngAnimate"]);
 //routing
 insiderApp.config(['$routeProvider','$locationProvider',function($scope,$routeProvider,$locationProvider){
  
 }]);
 
 return insiderApp;
});

This is official explanation
 /**
     * The function that handles definitions of modules. Differs from
     * require() in that a string for the module should be the first argument,
     * and the function to execute after dependencies are loaded should
     * return a value to define the module corresponding to the first argument's
     * name.
     */

2015年1月15日 星期四

[requireJS] Case Study: Working With AngularJS

Struggling for 2 days, I finally make myself clear with the combination of angularJS and requireJS. I will note down with examples.


Target
  • To load controllers, directives of AngularJS through requireJS.

  • Enjoy the benefits of requireJS on AngularJS

Files Included
  • main.js
    • Centralize all the js loading by one single main js file.

    • Specifying the dependencies of each module when loaded. E.g.: Bootstrap depends on jQuery

  • insiderApp.js
    • To define the Angular main insiderApp module

  • controller.js
    • To define the Angular controller module

  • step0.html
    • The Angular view

Coding

main.js
require.config({
 paths: {
  'jquery' : 'lib/jquery.min',
  'bootstrap' : 'lib/bootstrap.min',
  'bootstrap_select' : 'lib/bootstrap-select',
  'stepOne' : 'core/stepOne',
  'angular' : 'lib/angular',
  'angular-animate' : 'lib/angular-animate',
  'angular-route' : 'lib/angular-route',
  'controller' : 'controllers/controller'
 },
 
 //we do not add AMD-compliant script here!!
 shim: {
  "bootstrap" : { "deps" : ['jquery'] },
  'bootstrap_select' : { "deps" : ['jquery', 'bootstrap'] },
  'stepOne' :  { "deps" : ['jquery','bootstrap_select'] },
  'angular' : {
   exports : 'angular'
  },
  'angular-animate' : {
   "deps" : ['angular'],
   exports : 'angular-animate'
  },
  'angular-route' : { 
   "deps" : ['angular'],
   exports : 'angular-route'
  },
 },
 //for debug
 urlArgs: "bust=" + (new Date()).getTime() 
});


require(["jquery", "bootstrap", "bootstrap_select", "stepOne", "insiderApp", "angular", "controller"], function() {
 //requirejs sugar function >> Avoid putting all modules to the parameters
 var angular = require('angular')

 var csArr = ["/css/bootstrap-select.min.css", "/css/bootstrap.min.css", "/css/psliteM.css"];
 
 //manually start over insiderApp for angularJS, no need to put ng-app in html file
 angular.bootstrap(document,["insiderApp"]);
});
insiderApp.js
define(["angular", "angular-route", "angular-animate"],function(angular){
 var insiderApp = angular.module("insiderApp",["ngRoute", "ngAnimate"]);
 //routing
 insiderApp.config(['$routeProvider','$locationProvider',function($scope,$routeProvider,$locationProvider){
  
 }]);
 
 return insiderApp;
});

controller.js
//controller
define(['insiderApp'],function(insiderApp){
 insiderApp.controller('insiderControl', ['$scope', function($scope){
  //store all the required images path here
  $scope.menuImages = [
                     {
                      lm : './images/info.png',
                      width : '200px', 
                     },
                     {
                      mid : './images/setting.png',
                      width : '200px',
                     },
                     {
                      rm : './images/tv.png',
                      width : '200px',
                     },
                    ];
 }]);
});
step0.html







Smart Moment (Menu)


 
 
 




Points to Note
  • main.js
    • Some tutorials will use require.config and we may also have requirejs.config, they are basically the same

    • Requirejs object is used to setup 
      • Dependencies of different modules
        • Remember only non-AMD script is allowed to put in the deps parameters for dependency loading.

      • Module exports as global variables for use of other modules

      • Define the exact path of the js files

    • require(["jquery", "bootstrap", "bootstrap_select", "stepOne", "insiderApp", "angular", "controller"]....
      • jquery, bootstrap etc. is the self-defined name of js scripts to load, they are loaded in order

      • We must load the controller module for the AngularJS controller to work properly

    • Inside require function we have a second require function,which is called sugar function, it only loads the required modules for use inside the function, if you don't need it, you are NOT required to include in function parameters.

    • angular.bootstrap is to manually trigger the start of angularJS, which is highly recommended to use when cooperate with requireJS
      • When this was set, NO exists in the html view or AngularJS will throw errors

  • insiderApp.js
    • define(["angular", "angular-route", "angular-animate"],function(angular){
      • Normally, we will ignore the first parameter of the define function and let requireJS to use the file name as the module name (recommended)

      • Second array parameter tells requireJS that insiderApp module requires angular, angular-route and angular-animate to be loaded before executing the insiderApp module

      • function parameter "angular" is returned by the angular function, this object is for the implementation of insiderApp

      • Return the insiderApp variable or not depends on whether or not other modules need insiderApp, normally you need to return it.

      • var insiderApp = angular.module("insiderApp",["ngRoute", "ngAnimate"]);
        Just like usual, start the angular module, we can do any configuration of the angular object in this file.

  • controller.js
    • Just like usual, controller of the Angular object

    • define(['insiderApp'],function(insiderApp)...
      • Controller rely on insiderApp for adding controller to the Angular module, so we need to put insiderApp to the array and use it inside the function

    • insiderApp.controller('insiderControl', ['$scope', function($scope){...
      • Do all the work of Angular controller as usual

  • step0.html
    • Main view

    • NO here as we have already bootstrapped it manually in main.js

Others
  •   How to determine whether a module is AMD-compatibile module
    • Check the source code to see whether it has keyword like "define", "require"

References
  1. http://segmentfault.com/blog/moejser/1190000000492238 
  2. http://camnpr.com/archives/1563.html
  3. http://tech.pro/blog/1561/five-helpful-tips-when-using-requirejs
  4. http://stackoverflow.com/questions/17366073/requirejs-define-vs-require
  5. http://kielczewski.eu/2013/04/integrating-angularjs-with-requirejs/
  6. http://stackoverflow.com/questions/14619239/require-js-shim-not-working-for-this-code

2015年1月14日 星期三

[AngularJS] Basic Concepts

Here are the basic concepts of Angularjs, these concepts are barely well documented by the officials.

  1. angular.config only accepts providers
  2. Every service and factory are the instances of the providers

    e.g.
    angular.module('myApp')
      .service('FooService', function(){
        //...etc
      })
      .config(function(FooServiceProvider){
        //...etc
      });
    
    
    
    Reference: http://stackoverflow.com/questions/17485900/injecting-dependencies-in-config-modules-angularjs