From eb8e6a64b45cb59c7b871c8b63a24484c8ed489d Mon Sep 17 00:00:00 2001
From: kyg516 <kyg_516@naver.com>
Date: Fri, 23 Sep 2016 18:28:53 +0900
Subject: [PATCH] Update top, footer

---
 app/controllers/application_controller.rb | 129 +++---
 app/controllers/home_controller.rb        |  59 +--
 app/controllers/volume_controller.rb      |  76 ++--
 app/helpers/application_helper.rb         |  50 ++
 app/helpers/volume_helper.rb              |  50 +-
 app/views/home/index.html.erb             | 527 ++++++++++------------
 app/views/partials/_footer.html.erb       |  17 +-
 app/views/partials/_topnav.html.erb       |  78 +---
 app/views/volume/index.html.erb           | 397 ++++++++--------
 script/setup.sh                           |  16 -
 10 files changed, 659 insertions(+), 740 deletions(-)

diff --git a/app/controllers/application_controller.rb b/app/controllers/application_controller.rb
index 801da4b..42ff39c 100644
--- a/app/controllers/application_controller.rb
+++ b/app/controllers/application_controller.rb
@@ -1,63 +1,80 @@
 class ApplicationController < ActionController::Base
-  # Prevent CSRF attacks by raising an exception.
-  # For APIs, you may want to use :null_session instead.
-  # protect_from_forgery with: :exception
+    # Prevent CSRF attacks by raising an exception.
+    # For APIs, you may want to use :null_session instead.
+    # protect_from_forgery with: :exception
 
-  def get_conf
-    @config = Hash.new
-    
-    one_node = Node.take
-    if !one_node.nil?
-      @config["host_name"] = one_node.host_name
-      @config["host_ip"] = one_node.host_ip
-      @config["user_name"] = one_node.user_name
-      @config["user_password"] = one_node.user_password
+    def get_conf
+        config = Hash.new
+        one_node = Node.take
+        if !one_node.nil?
+            config["host_name"] = one_node.host_name
+            config["host_ip"] = one_node.host_ip
+            config["user_name"] = one_node.user_name
+            config["user_password"] = one_node.user_password
+        end
+        return config
     end
-    
-    # output = `cat configure.conf`.split("\n")
-    # output.each do |t|
-    #   if t.include? "project_path="
-	  #   @config["project_path"] = t.split("project_path=")[1]
-    #   elsif t.include? "server_name="
-    #     @config["server_name"] = t.split("server_name=")[1]
-    #   elsif t.include? "host_user="
-    #     @config["host_user"] = t.split("host_user=")[1]
-    #   elsif t.include? "host_ip="
-    #     @config["host_ip"] = t.split("host_ip=")[1]
-    #   elsif t.include? "host_port=" and !t.split("host_port=")[1].nil?
-    #     @config["host_port"] = t.split("host_port=")[1] + " "
-    #   elsif t.include? "host_password="
-    #     @config["host_password"] = t.split("host_password=")[1]
-    #   end
-    # end
-    
-    
-    return @config
-  end
 
-  def file_directory(dir)
-    @current_dir = dir
-    dir_list = `ls #{@current_dir} -l`
-    parsing_list = dir_list.split("\n")
-    @files = Array.new
-    file = Hash.new
-
-    @total_list = parsing_list[0]
-    for t in 1..(parsing_list.length-1)
-      parsing_file = parsing_list[t].split(" ")
-      file["auth"] = parsing_file[0]
-      file["size"] = parsing_file[4]
-      file["date"] = parsing_file[5] + " " + parsing_file[6] + " " + parsing_file[7]
-      file["name"] = parsing_file[8]
-      @files << file
-      file = Hash.new
+    def get_conf_all
+        config = Array.new
+        config_each = Hash.new
+        all_node = Node.all
+        all_node.each do |one_node|
+            config_each["host_name"] = one_node.host_name
+            config_each["host_ip"] = one_node.host_ip
+            config_each["user_name"] = one_node.user_name
+            config_each["user_password"] = one_node.user_password
+            config << config_each
+            config_each = Hash.new
+        end
+        return config
     end
-    puts @files
-    return @files
-  end
 
-  def checkDir
-    files = file_directory(params[:path])
-    render :json => {:file => files , :current => @current_dir}
-  end
+    def get_df
+        df = Array.new
+        df_each = Hash.new
+        command = String.new
+        command << "df -hP"
+        puts command
+        output = `#{command}`.split("\n")
+        output.each do |t|
+            next if t.equal? output.first
+            s = t.split(' ')
+            df_each['Filesystem'] = s[0]
+            df_each['Size'] = s[1]
+            df_each['Used'] = s[2]
+            df_each['Avail'] = s[3]
+            df_each['Use%'] = s[4]
+            df_each['Mounted on'] = s[5]
+            df << df_each
+            df_each = Hash.new
+        end
+        return df
+    end
+
+    def file_directory(dir)
+        @current_dir = dir
+        dir_list = `ls #{@current_dir} -l`
+        parsing_list = dir_list.split("\n")
+        @files = Array.new
+        file = Hash.new
+
+        @total_list = parsing_list[0]
+        for t in 1..(parsing_list.length-1)
+            parsing_file = parsing_list[t].split(" ")
+            file["auth"] = parsing_file[0]
+            file["size"] = parsing_file[4]
+            file["date"] = parsing_file[5] + " " + parsing_file[6] + " " + parsing_file[7]
+            file["name"] = parsing_file[8]
+            @files << file
+            file = Hash.new
+        end
+        puts @files
+        return @files
+    end
+
+    def checkDir
+        files = file_directory(params[:path])
+        render :json => {:file => files , :current => @current_dir}
+    end
 end
diff --git a/app/controllers/home_controller.rb b/app/controllers/home_controller.rb
index c3d0cc0..1b0f11b 100644
--- a/app/controllers/home_controller.rb
+++ b/app/controllers/home_controller.rb
@@ -1,31 +1,38 @@
 class HomeController < ApplicationController
-  def index
-    @current_dir = "/mnt"
-    file_directory(@current_dir)
-  end
 
-  def file_download
-      @file_name = params[:file_name].gsub(" ", "/")
-      if !@file_name.nil?
-          send_file @file_name
-      else
-          puts "file name is nil"
-          redirect_to '/home/index'
-      end
-  end
+    def index
+        @current_dir = "/mnt"
+        file_directory(@current_dir)
+    end
 
-  def make_directory
-	  current_dir = params[:current_dir]
-	  directory_name = params[:directory_name]
-	  puts "mkdir #{current_dir}/#{directory_name}"
-	  `sudo mkdir #{current_dir}/#{directory_name}`
-	  redirect_to '/home/index'
-  end
+    def file_download
+        @file_name = params[:file_name].gsub(" ", "/")
+        if !@file_name.nil?
+            send_file @file_name
+        else
+            puts "file name is nil"
+            redirect_to '/home/index'
+        end
+    end
 
-  def delete_file
-	  file_name = params[:file_name]
-	  puts "rm #{file_name} -rf"
-	  `sudo rm #{file_name} -rf`
-	  redirect_to '/home/index'
-  end
+    def make_directory
+        current_dir = params[:current_dir]
+        directory_name = params[:directory_name]
+        # make directory
+        command = String.new
+        command << "sudo mkdir #{current_dir}/#{directory_name}"
+        puts command
+        `#{command}`
+        redirect_to '/home/index'
+    end
+
+    def delete_file
+        file_name = params[:file_name]
+        # delete file
+        command = String.new
+        command << "sudo rm -rf #{file_name}"
+        puts command
+        `#{command}`
+        redirect_to '/home/index'
+    end
 end
diff --git a/app/controllers/volume_controller.rb b/app/controllers/volume_controller.rb
index ada0be3..86d380f 100644
--- a/app/controllers/volume_controller.rb
+++ b/app/controllers/volume_controller.rb
@@ -2,11 +2,6 @@ class VolumeController < ApplicationController
 
     def index
         file_directory("/mnt")
-        get_conf
-    end
-
-    def get_df
-        return `df -P`
     end
 
     def file_upload
@@ -14,64 +9,71 @@ class VolumeController < ApplicationController
         mnt_dir = String.new
         mnt_dest = String.new
         file = params[:file]
-        s = df.split("\n")
-        s.each do |t|
-            if t.include? params[:volume_name]
-                mnt_dir = t.split(" ")[5]
+        df.each do |t|
+            if t['Filesystem'].include? params[:volume_name]
+                mnt_dir = t['Mounted on']
             end
         end
         mnt_dest = mnt_dir + "/" + file.original_filename
         # change permission
         command = String.new
-        command << "sudo chmod 777 " + mnt_dir
+        command << "sudo chmod 777 #{mnt_dir}"
         puts command
         `#{command}`
+        # upload file
         u = AvatarUploader.new(mnt_dir)
         u.store!(file)
         redirect_to '/volume/index'
     end
 
     def volume_mount
-        get_conf
+        conf = get_conf
         volume_name = params[:volume_name]
         mount_point = params[:mount_point]
         # make command string
         command = String.new
-        command << "sudo mount -t glusterfs " + @config["host_ip"].to_s + ":/" + volume_name + " " + mount_point
+        command << "sudo mount -t glusterfs #{conf['host_ip']}:/#{volume_name} #{mount_point}"
         puts command
         `#{command}`
         redirect_to '/volume/index'
     end
 
     def volume_unmount
-        get_conf
+        conf = get_conf
         volume_name = params[:volume_name]
         # make command string
         command = String.new
-        command << "sudo umount " + @config["host_ip"].to_s + ":/" + volume_name
+        command << "sudo umount #{conf['host_ip']}:/#{volume_name}"
         puts command
         `#{command}`
         redirect_to '/volume/index'
     end
 
     def volume_create
-        get_conf
+        conf = get_conf
         volume_name = params[:volume_name]
         volume_type = params[:volume_type]
         num_of_brick = params[:num_of_brick]
         bricks = params[:bricks]
         # make command string
         command = String.new
-        command << "sshpass -p" + @config["user_password"].to_s
-        command << " ssh "
-        
-        command << @config["user_name"].to_s + "@" + @config["host_ip"].to_s
-        command << " gluster volume create " + volume_name + " "
+        command << "sshpass -p#{conf['user_password']} "
+        command << "ssh #{conf['user_name']}@#{conf['host_ip']} "
+        command << "gluster volume create #{volume_name} "
         if !volume_type.include? "Distribute"
-            command << volume_type.downcase + " " + num_of_brick + " "
+            command << "#{volume_type.downcase} #{num_of_brick}"
         end
+        conf_all = get_conf_all
         bricks.each do |t|
-            command << t + " "
+            host_name = t.split(":/")[0]
+            brick_name = t.split(":/")[1]
+            host_ip = ""
+            conf_all.each do |u|
+                next if !u['host_name'].eql? host_name
+                host_ip = u['host_ip']
+            end
+            brick = "#{host_ip}:/#{brick_name}"
+            command << "#{brick} "
         end
         command << "force"
         puts command
@@ -80,45 +82,39 @@ class VolumeController < ApplicationController
     end
 
     def volume_stop
-        get_conf
+        conf = get_conf
         volume_name = params[:volume_name]
         # make command string
         command = String.new
-        command << "yes | sshpass -p" + @config["user_password"].to_s
-        command << " ssh "
-       
-        command << @config["user_name"].to_s + "@" + @config["host_ip"].to_s
-        command << " gluster volume stop " + volume_name
+        command << "yes | sshpass -p#{conf['user_password']} "
+        command << "ssh #{conf['user_name']}@#{conf['host_ip']} "
+        command << "gluster volume stop #{volume_name}"
         puts command
         `#{command}`
         redirect_to '/volume/index'
     end
 
     def volume_start
-        get_conf
+        conf = get_conf
         volume_name = params[:volume_name]
         # make command string
         command = String.new
-        command << "sshpass -p" + @config["user_password"].to_s
-        command << " ssh "
-     
-        command << @config["user_name"].to_s + "@" + @config["host_ip"].to_s
-        command << " gluster volume start " + volume_name.to_s
+        command << "sshpass -p#{conf['user_password']} "
+        command << "ssh #{conf['user_name']}@#{conf['host_ip']} "
+        command << " gluster volume start #{volume_name}"
         puts command
         `#{command}`
         redirect_to '/volume/index'
     end
 
     def volume_delete
-        get_conf
+        conf = get_conf
         volume_name = params[:volume_name]
         # make command string
         command = String.new
-        command << "yes | sshpass -p" + @config["user_password"].to_s
-        command << " ssh "
- 
-        command << @config["user_name"].to_s + "@" + @config["host_ip"].to_s
-        command << " gluster volume delete " + volume_name
+        command << "yes | sshpass -p#{conf['user_password']} "
+        command << "ssh #{conf['user_name']}@#{conf['host_ip']} "
+        command << " gluster volume delete #{volume_name}"
         puts command
         `#{command}`
         redirect_to '/volume/index'
diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb
index de6be79..674c794 100644
--- a/app/helpers/application_helper.rb
+++ b/app/helpers/application_helper.rb
@@ -1,2 +1,52 @@
 module ApplicationHelper
+
+    def get_conf
+        config = Hash.new
+        one_node = Node.take
+        if !one_node.nil?
+            config["host_name"] = one_node.host_name
+            config["host_ip"] = one_node.host_ip
+            config["user_name"] = one_node.user_name
+            config["user_password"] = one_node.user_password
+        end
+        return config
+    end
+
+    def get_conf_all
+        config = Array.new
+        config_each = Hash.new
+        all_node = Node.all
+        all_node.each do |one_node|
+            config_each["host_name"] = one_node.host_name
+            config_each["host_ip"] = one_node.host_ip
+            config_each["user_name"] = one_node.user_name
+            config_each["user_password"] = one_node.user_password
+            config << config_each
+            config_each = Hash.new
+        end
+        return config
+    end
+
+    def get_df
+        df = Array.new
+        df_each = Hash.new
+        command = String.new
+        command << "df -hP"
+        puts command
+        output = `#{command}`.split("\n")
+        output.each do |t|
+            next if t.equal? output.first
+            s = t.split(' ')
+            df_each['Filesystem'] = s[0]
+            df_each['Size'] = s[1]
+            df_each['Used'] = s[2]
+            df_each['Avail'] = s[3]
+            df_each['Use%'] = s[4]
+            df_each['Mounted on'] = s[5]
+            df << df_each
+            df_each = Hash.new
+        end
+        return df
+    end
+
 end
diff --git a/app/helpers/volume_helper.rb b/app/helpers/volume_helper.rb
index 0e37078..eef9b81 100644
--- a/app/helpers/volume_helper.rb
+++ b/app/helpers/volume_helper.rb
@@ -1,43 +1,28 @@
 module VolumeHelper
 
-    def get_conf
-      @config = Hash.new
-
-      one_node = Node.take
-      if !one_node.nil?
-        @config["host_name"] = one_node.host_name
-        @config["host_ip"] = one_node.host_ip
-        @config["user_name"] = one_node.user_name
-        @config["user_password"] = one_node.user_password
-      end
-      return @config
-    end
-
-    def get_volumes
+    def volumes
         volumes = Array.new
         volume = Hash.new
-        command = "df -P"
-        df = `#{command}`
         conf = get_conf
-        command = "sshpass -p#{conf['user_password']} ssh #{conf['user_name']}@#{conf['host_ip']} gluster volume info"
-        info = `#{command}`.split("\n")
-        info << "\n"
-        info.each do |t|
-            next if t.equal? info.first
+        df = get_df
+        command = String.new
+        command << "sshpass -p#{conf['user_password']} "
+        command << "ssh #{conf['user_name']}@#{conf['host_ip']} "
+        command << "gluster volume info"
+        puts command
+        output = `#{command}`.split("\n")
+        output << "\n"
+        output.each do |t|
+            next if t.equal? output.first
             if t.include? ":"
                 temp = t.split(":")
                 volume[temp[0]] = temp[1]
             else
-                String state = (df.include? volume['Volume Name'].delete(' ')) ? "mounted" : "unmounted"
-                volume['Mount State'] = state
-                if state.eql? "mounted"
-                    s = df.split("\n")
-                    s.each do |t|
-                        if t.include? volume['Volume Name'].delete(' ')
-                            mnt_point = t.split(" ")[5]
-                            volume['Mount Point'] = mnt_point
-                        end
-                    end
+                volume['Mount State'] = "unmounted"
+                df.each do |u|
+                    next if !u['Filesystem'].include? volume['Volume Name'].delete(' ')
+                    volume['Mount State'] = "mounted"
+                    volume['Mount Point'] = u['Mounted on']
                 end
                 volumes << volume
                 volume = Hash.new
@@ -47,8 +32,7 @@ module VolumeHelper
     end
 
     def volume_info(volume)
-        params = ['Type', 'Volume ID', 'Status', 'Number of Bricks', 'Transport-type',
-            'Bricks', 'Options Reconfigured', 'Mount State', 'Mount Point']
+        params = ['Type', 'Volume ID', 'Status', 'Number of Bricks', 'Transport-type', 'Bricks', 'Options Reconfigured', 'Mount State', 'Mount Point']
         html = ''
         html << "<div>"
         params.each do |t|
diff --git a/app/views/home/index.html.erb b/app/views/home/index.html.erb
index 96abcc8..c8907b8 100644
--- a/app/views/home/index.html.erb
+++ b/app/views/home/index.html.erb
@@ -1,19 +1,9 @@
-<!-- right click menu -->
-<div class="contextmenu Del_dir">
-	<ul>
-		<li class="menuitem"><i class="fa fa-trash"></i>Delete</li>
-		<input id="delete_name" type="hidden"></input>
-	</ul>
-</div>
-
 <!-- create overlay page -->
 <div id="popup_mkdir" class="overlay">
 	<div class="popup">
 		<h2> Make Directory </h2>
 		<a class="close" href="#">&times;</a>
-
 		<form id="form_make_directory" data-parsley-validate class="form-horizontal form-label-left" action="/home/mkdir" method="post">
-
 			<div class="form-group">
 				<label class="control-label col-md-3 col-sm-3 col-xs-12" for="current-dir">Current Directory <span class="required">*</span>
 				</label>
@@ -35,202 +25,251 @@
 				</div>
 			</div>
 		</form>
-
 	</div>
 </div>
 
 <!-- page content -->
 <div class="right_col" role="main">
-	<div class="">
-		<div class="page-title">
-			<div class="title_left">
-				<h3>Dash Board</h3>
+	<div class="page-title">
+	</div>
+	<div class="clearfix"></div>
+	<div class="row">
+		<!-- top tiles -->
+		<div class="row tile_count">
+			<div class="animated flipInY col-md-2 col-sm-4 col-xs-4 tile_stats_count">
+				<div class="left"></div>
+				<div class="right">
+					<span class="count_top"><i class="fa fa-user"></i> Total Users</span>
+					<div class="count">2500</div>
+					<span class="count_bottom"><i class="green">4% </i> From last Week</span>
+				</div>
 			</div>
-			<div class="title_right">
-				<div class="col-md-5 col-sm-5 col-xs-12 form-group pull-right top_search">
-					<div class="input-group">
-						<input type="text" class="form-control" placeholder="Search for...">
-						<span class="input-group-btn">
-							<button class="btn btn-default" type="button">Go!</button>
-						</span>
+			<div class="animated flipInY col-md-2 col-sm-4 col-xs-4 tile_stats_count">
+				<div class="left"></div>
+				<div class="right">
+					<span class="count_top"><i class="fa fa-clock-o"></i> Average Time</span>
+					<div class="count">123.50</div>
+					<span class="count_bottom"><i class="green"><i class="fa fa-sort-asc"></i>3% </i> From last Week</span>
+				</div>
+			</div>
+			<div class="animated flipInY col-md-2 col-sm-4 col-xs-4 tile_stats_count">
+				<div class="left"></div>
+				<div class="right">
+					<span class="count_top"><i class="fa fa-user"></i> Total Males</span>
+					<div class="count green">2,500</div>
+					<span class="count_bottom"><i class="green"><i class="fa fa-sort-asc"></i>34% </i> From last Week</span>
+				</div>
+			</div>
+			<div class="animated flipInY col-md-2 col-sm-4 col-xs-4 tile_stats_count">
+				<div class="left"></div>
+				<div class="right">
+					<span class="count_top"><i class="fa fa-user"></i> Total Females</span>
+					<div class="count">4,567</div>
+					<span class="count_bottom"><i class="red"><i class="fa fa-sort-desc"></i>12% </i> From last Week</span>
+				</div>
+			</div>
+			<div class="animated flipInY col-md-2 col-sm-4 col-xs-4 tile_stats_count">
+				<div class="left"></div>
+				<div class="right">
+					<span class="count_top"><i class="fa fa-user"></i> Total Collections</span>
+					<div class="count">2,315</div>
+					<span class="count_bottom"><i class="green"><i class="fa fa-sort-asc"></i>34% </i> From last Week</span>
+				</div>
+			</div>
+			<div class="animated flipInY col-md-2 col-sm-4 col-xs-4 tile_stats_count">
+				<div class="left"></div>
+				<div class="right">
+					<span class="count_top"><i class="fa fa-user"></i> Total Connections</span>
+					<div class="count">7,325</div>
+					<span class="count_bottom"><i class="green"><i class="fa fa-sort-asc"></i>34% </i> From last Week</span>
+				</div>
+			</div>
+		</div>
+		<!-- /top tiles -->
+
+		<!-- file manager -->
+		<div class="col-md-12 col-sm-12 col-xs-12">
+			<div class="x_panel">
+				<div class="x_title">
+					<h2>File Manager</h2>
+					<ul class="nav navbar-right panel_toolbox">
+						<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
+						</li>
+						<li class="dropdown">
+							<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
+							<ul class="dropdown-menu" role="menu">
+								<li><a href="#">Settings 1</a>
+								</li>
+								<li><a href="#">Settings 2</a>
+								</li>
+							</ul>
+						</li>
+					</ul>
+					<div class="clearfix"></div>
+				</div>
+
+				<div class="x_content">
+					<div class="col-md-12 col-sm-12 col-xs-12" id="table_div">
+						<table id="datatable" class="table table-striped table-bordered jambo_table">
+							<thead>
+								<tr class="headings">
+									<th>Name</th>
+									<th>auth</th>
+									<th>Size</th>
+									<th>Date</th>
+								</tr>
+							</thead>
+							<tbody id="datatable_body">
+								<tr>
+									<td>
+										<a style='cursor: pointer' onclick="change_upper('<%=@current_dir%>')"><i class="fa fa-reply"></i></a>
+										<%= @current_dir %>
+										<a class='pull-right' href="#popup_mkdir"><i class="fa fa-plus"></i><i class="fa fa-folder"></i></a>
+									</td>
+									<td></td>
+									<td></td>
+									<td></td>
+								</tr>
+								<% @files.each do |t| %>
+								<tr class="dir_delete">
+									<% if t["auth"][0]=='d'%>
+									<td style="color:#0d8ade;"><i class="fa fa-folder-open-o"></i>
+										<a style="cursor: pointer" onclick="change_directory('<%=@current_dir + "/" + t["name"]%>')"> <%=t["name"]%></a>
+									</td>
+									<% else %>
+									<td><i class="fa fa-file-o"></i>
+										<a href="/file_download?file_name=<%=(@current_dir+'/'+t['name']).gsub("/", "+")%>"><%=t['name']%></a>
+									</td>
+									<% end %>
+									<td><%=t["auth"]%></td>
+									<td><%=t["size"]%></td>
+									<td><%=t["date"]%></td>
+								</tr>
+								<% end %>
+							</tbody>
+						</table>
 					</div>
 				</div>
 			</div>
 		</div>
+		<!-- /file manager -->
 
-		<div class="clearfix"></div>
-
-		<div class="row">
-			<div class="col-md-12">
-				<div class="x_panel">
-					<div class="x_title">
-						<h2>Input knob</h2>
-						<ul class="nav navbar-right panel_toolbox">
-							<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a></li>
-							<li class="dropdown">
-								<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
-								<ul class="dropdown-menu" role="menu">
-									<li><a href="#">Settings 1</a></li>
-									<li><a href="#">Settings 2</a></li>
-								</ul>
-							</li>
-							<li><a class="close-link"><i class="fa fa-close"></i></a></li>
-						</ul>
-						<div class="clearfix"></div>
-					</div>
-					<div class="x_content">
-						<div class="col-md-2">
-							<p>Display value</p>
-							<input class="knob" data-width="100" data-height="120" data-min="-100" data-displayPrevious=true data-fgColor="#26B99A" value="44">
-						</div>
-						<div class="col-md-2">
-							<p>&#215; 'cursor' mode</p>
-							<input class="knob" data-width="100" data-height="120" data-cursor=true data-fgColor="#34495E" value="29">
-						</div>
-						<div class="col-md-2">
-							<p>Step 0.1</p>
-							<input class="knob" data-width="100" data-height="120" data-min="-10000" data-displayPrevious=true data-fgColor="#26B99A" data-max="10000" data-step=".1" value="0">
-						</div>
-						<div class="col-md-2">
-							<p>Angle arc</p>
-							<input class="knob" data-width="100" data-height="120" data-angleOffset=-125 data-angleArc=250 data-fgColor="#34495E" data-rotation="anticlockwise" value="35">
-						</div>
-						<div class="col-md-2">
-							<p>Alternate design</p>
-							<input class="knob" data-width="110" data-height="120" data-displayPrevious=true data-fgColor="#26B99A" data-skin="tron" data-thickness=".2" value="75">
-						</div>
-						<div class="col-md-2">
-							<p>Angle offset</p>
-							<input class="knob" data-width="100" data-height="120" data-angleOffset=90 data-linecap=round data-fgColor="#26B99A" value="35">
-						</div>
-					</div>
+		<!-- disk usage -->
+		<div class="col-md-4 col-sm-4 col-xs-12">
+			<div class="x_panel tile fixed_height_320">
+				<div class="x_title">
+					<h2>App Versions</h2>
+					<ul class="nav navbar-right panel_toolbox">
+						<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
+						</li>
+						<li class="dropdown">
+							<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
+							<ul class="dropdown-menu" role="menu">
+								<li><a href="#">Settings 1</a>
+								</li>
+								<li><a href="#">Settings 2</a>
+								</li>
+							</ul>
+						</li>
+						<li><a class="close-link"><i class="fa fa-close"></i></a>
+						</li>
+					</ul>
+					<div class="clearfix"></div>
 				</div>
-			</div>
-			<div class="col-md-12 col-sm-12 col-xs-12">
-				<div class="x_panel">
-					<div class="x_title">
-						<h2>File Manager</h2>
-						<ul class="nav navbar-right panel_toolbox">
-							<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
-							</li>
-							<li class="dropdown">
-								<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
-								<ul class="dropdown-menu" role="menu">
-									<li><a href="#">Settings 1</a>
-									</li>
-									<li><a href="#">Settings 2</a>
-									</li>
-								</ul>
-							</li>
-							<li><a class="close-link"><i class="fa fa-close"></i></a>
-							</li>
-						</ul>
+				<div class="x_content">
+					<h4>App Usage across versions</h4>
+					<div class="widget_summary">
+						<div class="w_left w_25">
+							<span>0.1.5.2</span>
+						</div>
+						<div class="w_center w_55">
+							<div class="progress">
+								<div class="progress-bar bg-green" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 66%;">
+									<span class="sr-only">60% Complete</span>
+								</div>
+							</div>
+						</div>
+						<div class="w_right w_20">
+							<span>123k</span>
+						</div>
 						<div class="clearfix"></div>
 					</div>
 
-					<div class="x_content">
-
-						<div class="col-md-12 col-sm-12 col-xs-12" id="table_div">
-							<p class="text-muted font-13 m-b-30"> <code> Current directory : <span id="select_dir"><%=@current_dir%></span></code></p>
-							<p style="text-align:right;" >
-								<a class="btn btn-default" href="#popup_mkdir"><i class="fa fa-plus"></i> Make Directory</a>
-							</p>
-							<table id="datatable" class="table table-striped table-bordered jambo_table">
-								<thead>
-									<tr class="headings">
-										<th>Name</th>
-										<th>auth</th>
-										<th>Size</th>
-										<th>Date</th>
-									</tr>
-								</thead>
-
-								<tbody id="datatable_body">
-									<tr>
-										<td><i class="fa fa-reply"></i>
-											<a style='cursor: pointer' onclick="change_upper('<%=@current_dir%>')"> ..</a>
-										</td>
-										<td></td>
-										<td></td>
-										<td></td>
-									</tr>
-									<%@files.each do |t|%>
-									<tr class="dir_delete">
-										<% if t["auth"][0]=='d'%>
-										<td style="color:#0d8ade;"><i class="fa fa-folder-open-o"></i>
-											<a style="cursor: pointer" onclick="change_directory('<%=@current_dir + "/" + t["name"]%>')"> <%=t["name"]%></a>
-										</td>
-										<% else %>
-										<td><i class="fa fa-file-o"></i>
-											<a href="/file_download?file_name=<%=(@current_dir+'/'+t['name']).gsub("/", "+")%>"><%=t['name']%></a>
-										</td>
-										<% end %>
-										<td><%=t["auth"]%></td>
-										<td><%=t["size"]%></td>
-										<td><%=t["date"]%></td>
-									</tr>
-									<%end%>
-								</tbody>
-							</table>
+					<div class="widget_summary">
+						<div class="w_left w_25">
+							<span>0.1.5.3</span>
 						</div>
+						<div class="w_center w_55">
+							<div class="progress">
+								<div class="progress-bar bg-green" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 45%;">
+									<span class="sr-only">60% Complete</span>
+								</div>
+							</div>
+						</div>
+						<div class="w_right w_20">
+							<span>53k</span>
+						</div>
+						<div class="clearfix"></div>
 					</div>
+					<div class="widget_summary">
+						<div class="w_left w_25">
+							<span>0.1.5.4</span>
+						</div>
+						<div class="w_center w_55">
+							<div class="progress">
+								<div class="progress-bar bg-green" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 25%;">
+									<span class="sr-only">60% Complete</span>
+								</div>
+							</div>
+						</div>
+						<div class="w_right w_20">
+							<span>23k</span>
+						</div>
+						<div class="clearfix"></div>
+					</div>
+					<div class="widget_summary">
+						<div class="w_left w_25">
+							<span>0.1.5.5</span>
+						</div>
+						<div class="w_center w_55">
+							<div class="progress">
+								<div class="progress-bar bg-green" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 5%;">
+									<span class="sr-only">60% Complete</span>
+								</div>
+							</div>
+						</div>
+						<div class="w_right w_20">
+							<span>3k</span>
+						</div>
+						<div class="clearfix"></div>
+					</div>
+					<div class="widget_summary">
+						<div class="w_left w_25">
+							<span>0.1.5.6</span>
+						</div>
+						<div class="w_center w_55">
+							<div class="progress">
+								<div class="progress-bar bg-green" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 2%;">
+									<span class="sr-only">60% Complete</span>
+								</div>
+							</div>
+						</div>
+						<div class="w_right w_20">
+							<span>1k</span>
+						</div>
+						<div class="clearfix"></div>
+					</div>
+
 				</div>
 			</div>
-
 		</div>
+		<!-- /disk usage -->
+
 	</div>
 </div>
 <!-- /page content -->
 
-<script type="text/javascript">
-$(document).ready(function() {
-	$('#datatable').dataTable();
-	right_click();
-});
-</script>
-<script>
-
-function right_click(){
-	/* right click */
-	$(".menuitem").mouseover(function(e){
-		var $el = $(this);
-		if ( !$el.hasClass('hover'))
-		$el.addClass('hover');
-	}).mouseout(function(e){
-		var $el = $(this);
-		if($el.hasClass('hover'))
-		$el.removeClass('hover');
-	});
-
-	//Contextmenu
-	$(".dir_delete").on('contextmenu', function(event) {
-		ShowContextMenu("Del_dir");
-		var Row = this;
-		var Cells = Row.getElementsByTagName("td");
-		var file_name = Cells[0].innerText;
-		file_name = file_name.replace(' ', '');
-		$("#delete_name").val($("#select_dir").text() + "/" + file_name);
-		CheckLocation();
-		return false;
-	});
-}
-
-$(".Del_dir").click(function(e){
-	$(location).attr('href', "#loading");
-	$.ajax({
-		method: "POST",
-		url: "/home/delete",
-		data: { file_name: $("#delete_name").val() },
-		success  : function(result){
-			change_directory($("#select_dir").text());
-			$(location).attr('href', "#");
-		}
-	})
-	$(".contextmenu").hide();
-	$(document).unbind('mousedown');
-});
-</script>
-<!-- file manager functions -->
+<!-- File manager functions -->
 <script>
 function change_upper(directory){
 	if(directory == "/") return;
@@ -238,7 +277,6 @@ function change_upper(directory){
 	if(lastindex == 0) lastindex++;
 	change_directory(directory.substring(0, lastindex));
 }
-
 function change_directory(directory){
 	$.ajax({
 		method: "POST",
@@ -248,8 +286,6 @@ function change_directory(directory){
 			$("#current-dir").val(directory);
 			$("#table_div").empty();
 			var new_table = "";
-			new_table += "<p class='text-muted font-13 m-b-30'><code>Current directory : <span id='select_dir'>" + directory+"</span></code></p>";
-			new_table += "<p style='text-align:right;'><a class='btn btn-default' href='#popup_mkdir'><i class='fa fa-plus'></i> Make Directory</a></p>";
 			new_table += "<table id='datatable' class='table table-striped table-bordered jambo_table'>";
 			new_table += "<thead>";
 			new_table += "<tr class='headings'>";
@@ -262,10 +298,12 @@ function change_directory(directory){
 			new_table += "<tbody id='datatable_body'>";
 
 			var new_tr = "";
-			new_tr += "<tr role='row' class='odd'> <td><i class='fa fa-reply'></i>";
-			new_tr += "<a style='cursor: pointer' onclick='change_upper(" + '"' + directory + '"' +")'> ..</a>";
-			new_tr += "</td><td> </td><td> </td><td> </td></tr>";
-
+			new_tr += "<tr role='row' class='odd'>";
+			new_tr += "<td><a style='cursor: pointer' onclick='change_upper(" + '"' + directory + '"' +")'><i class='fa fa-reply'></i></a>";
+			new_tr += "&nbsp" + directory
+			new_tr += "<a class='pull-right' href='#popup_mkdir'><i class='fa fa-plus'></i><i class='fa fa-folder'></i></a></td>";
+			new_tr += "<td></td> <td></td> <td></td>"
+			new_tr += "</tr>";
 			for( var i = 0; i < result.file.length; i++){
 				var row_class = i % 2 == 0 ? 'odd' : 'even';
 				var cur = result.current != "/" ? result.current : '';
@@ -287,118 +325,15 @@ function change_directory(directory){
 			new_table += new_tr;
 			new_table += "</tbody></table>"
 			$("#table_div").append(new_table);
-			$('#datatable').dataTable();
-			right_click();
+			$('#datatable').dataTable( {"bSort": false});
 		}
 	})
 }
 </script>
 
+<!-- On document ready -->
 <script>
-$("document").ready(function(){
-})
-</script>
-
-<!--Test Page specific JS -->
-<script type="text/javascript">
-
-//alert ('Test Page specific JS')
-$(function($) {
-
-	$(".knob").knob({
-		change: function(value) {
-			//console.log("change : " + value);
-		},
-		release: function(value) {
-			//console.log(this.$.attr('value'));
-			console.log("release : " + value);
-		},
-		cancel: function() {
-			console.log("cancel : ", this);
-		},
-		/*format : function (value) {
-		return value + '%';
-	},*/
-	draw: function() {
-
-		// "tron" case
-		if (this.$.data('skin') == 'tron') {
-
-			this.cursorExt = 0.3;
-
-			var a = this.arc(this.cv) // Arc
-			,
-			pa // Previous arc
-			, r = 1;
-
-			this.g.lineWidth = this.lineWidth;
-
-			if (this.o.displayPrevious) {
-				pa = this.arc(this.v);
-				this.g.beginPath();
-				this.g.strokeStyle = this.pColor;
-				this.g.arc(this.xy, this.xy, this.radius - this.lineWidth, pa.s, pa.e, pa.d);
-				this.g.stroke();
-			}
-
-			this.g.beginPath();
-			this.g.strokeStyle = r ? this.o.fgColor : this.fgColor;
-			this.g.arc(this.xy, this.xy, this.radius - this.lineWidth, a.s, a.e, a.d);
-			this.g.stroke();
-
-			this.g.lineWidth = 2;
-			this.g.beginPath();
-			this.g.strokeStyle = this.o.fgColor;
-			this.g.arc(this.xy, this.xy, this.radius - this.lineWidth + 1 + this.lineWidth * 2 / 3, 0, 2 * Math.PI, false);
-			this.g.stroke();
-
-			return false;
-		}
-	}
-});
-
-// Example of infinite knob, iPod click wheel
-var v, up = 0,
-down = 0,
-i = 0,
-$idir = $("div.idir"),
-$ival = $("div.ival"),
-incr = function() {
-	i++;
-	$idir.show().html("+").fadeOut();
-	$ival.html(i);
-},
-decr = function() {
-	i--;
-	$idir.show().html("-").fadeOut();
-	$ival.html(i);
-};
-$("input.infinite").knob({
-	min: 0,
-	max: 20,
-	stopper: false,
-	change: function() {
-		if (v > this.cv) {
-			if (up) {
-				decr();
-				up = 0;
-			} else {
-				up = 1;
-				down = 0;
-			}
-		} else {
-			if (v < this.cv) {
-				if (down) {
-					incr();
-					down = 0;
-				} else {
-					down = 1;
-					up = 0;
-				}
-			}
-		}
-		v = this.cv;
-	}
-});
+$(document).ready(function() {
+	$('#datatable').dataTable( {"bSort": false});
 });
 </script>
diff --git a/app/views/partials/_footer.html.erb b/app/views/partials/_footer.html.erb
index 8c850c0..ce954c2 100644
--- a/app/views/partials/_footer.html.erb
+++ b/app/views/partials/_footer.html.erb
@@ -1,19 +1,18 @@
 
 <!-- footer content -->
 <footer>
-  <div class="pull-right">
-    Gentelella - Bootstrap Admin Template by <a href="https://colorlib.com">Colorlib</a>
-  </div>
-  <div class="clearfix"></div>
+    <div class="pull-right">
+        Gluster Web Interface by <a href="https://github.com/oss2016summer/gluster-web-interface">WEB</a>
+    </div>
+    <div class="clearfix"></div>
 </footer>
 <!-- /footer content -->
 </div>
 </div>
 
 <div id="custom_notifications" class="custom-notifications dsp_none">
-  <ul class="list-unstyled notifications clearfix" data-tabbed_notifications="notif-group">
-  </ul>
-  <div class="clearfix"></div>
-  <div id="notif-group" class="tabbed_notifications"></div>
+    <ul class="list-unstyled notifications clearfix" data-tabbed_notifications="notif-group">
+    </ul>
+    <div class="clearfix"></div>
+    <div id="notif-group" class="tabbed_notifications"></div>
 </div>
-
diff --git a/app/views/partials/_topnav.html.erb b/app/views/partials/_topnav.html.erb
index 5e6bee3..0659e46 100644
--- a/app/views/partials/_topnav.html.erb
+++ b/app/views/partials/_topnav.html.erb
@@ -1,69 +1,21 @@
 <!-- top navigation -->
 <div class="top_nav">
+    <div class="nav_menu">
+        <nav class="" role="navigation">
+            <div class="nav toggle">
+                <a id="menu_toggle"><i class="fa fa-bars"></i></a>
+            </div>
 
-  <div class="nav_menu">
-    <nav class="" role="navigation">
-      <div class="nav toggle">
-        <a id="menu_toggle"><i class="fa fa-bars"></i></a>
-      </div>
-
-      <ul class="nav navbar-nav navbar-right">
-        <li class="">
-          <a href="javascript:;" class="user-profile dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
-            <%= image_tag "img.jpg" %>John Doe
-            <span class=" fa fa-angle-down"></span>
-          </a>
-          <ul class="dropdown-menu dropdown-usermenu pull-right">
-            <li><a href="javascript:;">  Profile</a>
-            </li>
-            <li>
-              <a href="javascript:;">
-                <span class="badge bg-red pull-right">50%</span>
-                <span>Settings</span>
-              </a>
-            </li>
-            <li>
-              <a href="javascript:;">Help</a>
-            </li>
-            <li><a href="/users/sign_out"><i class="fa fa-sign-out pull-right"></i> Log Out</a>
-            </li>
-          </ul>
-        </li>
-
-        <li role="presentation" class="dropdown">
-          <a href="javascript:;" class="dropdown-toggle info-number" data-toggle="dropdown" aria-expanded="false">
-            <i class="fa fa-envelope-o"></i>
-            <span class="badge bg-green">6</span>
-          </a>
-          <ul id="menu1" class="dropdown-menu list-unstyled msg_list" role="menu">
-            <li>
-              <a>
-                <span class="image">
-                  <%= image_tag "img.jpg" %>
-                </span>
-                <span>
-                <span>John Smith</span>
-                <span class="time">3 mins ago</span>
-                </span>
-                <span class="message">
-                  Film festivals used to be do-or-die moments for movie makers. They were where...
-                </span>
-              </a>
-            </li>
-            <li>
-              <div class="text-center">
-                <a>
-                  <strong>See All Alerts</strong>
-                  <i class="fa fa-angle-right"></i>
-                </a>
-              </div>
-            </li>
-          </ul>
-        </li>
-
-      </ul>
-    </nav>
-  </div>
+            <ul class="nav navbar-nav navbar-right">
+                <li class="">
+                    <a href="javascript:;" class="user-profile" aria-expanded="false">
+                        <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
+                        Hello, admin!
+                    </a>
+                </li>
+            </ul>
+        </nav>
+    </div>
 
 </div>
 <!-- /top navigation -->
diff --git a/app/views/volume/index.html.erb b/app/views/volume/index.html.erb
index 3c86b96..1386e88 100644
--- a/app/views/volume/index.html.erb
+++ b/app/views/volume/index.html.erb
@@ -39,7 +39,9 @@
                     </label>
                     <div class="col-md-3 col-sm-3 col-xs-4">
                         <select class="form-control">
-                            <option><%=@config["server_name"]%></option>
+                            <% get_conf_all.each do |t| %>
+                            <option><%= t['host_name'] %></option>
+                            <% end %>
                         </select>
                     </div>
                     <div class="col-md-1 col-sm-1 col-xs-1">
@@ -77,26 +79,26 @@
             </thead>
             <tbody id="datatable_body">
                 <tr>
-                    <td><i class="fa fa-reply"></i> <a style="cursor: pointer" onclick="change_upper('<%=@current_dir%>')"> ..</a></td>
+                    <td><i class="fa fa-reply"></i> <a style="cursor: pointer" onclick="change_upper('<%= @current_dir %>')"> ..</a></td>
                     <td></td>
                     <td></td>
                 </tr>
-                <%@files.each do |t|%>
-                <% if t["auth"][0]=='d'%>
+                <% @files.each do |t| %>
+                <% if t["auth"][0]=='d' %>
                 <tr>
                     <td style="color:#0d8ade;"><i class="fa fa-folder-open-o"></i>
-                        <a style="cursor: pointer" onclick="change_directory('<%=@current_dir + "/" + t["name"]%>')"> <%=t["name"]%></a>
+                        <a style="cursor: pointer" onclick="change_directory('<%= @current_dir + "/" + t["name"] %>')"> <%= t["name"] %></a>
                     </td>
                     <td><%=t["auth"]%></td>
                     <td>
                         <form data-parsley-validate>
-                            <input type="hidden" value='<%=@current_dir + "/" + t["name"]%>'>
+                            <input type="hidden" value='<%= @current_dir + "/" + t["name"] %>'>
                             <button type="submit" class="btn btn-primary pull-right">select</botton>
-                        </form>
-                    </td>
-                </tr>
-                <%end%>
-                <%end%>
+                            </form>
+                        </td>
+                    </tr>
+                    <% end %>
+                    <% end %>
                 </tbody>
             </table>
         </div>
@@ -115,7 +117,7 @@
         </div>
         <div class="clearfix"></div>
         <div class="row">
-            <% get_volumes.each_with_index do |t, index| %>
+            <% volumes.each_with_index do |t, index| %>
             <div class="col-md-6 col-sm-6 col-xs-12">
                 <div class="x_panel">
                     <div class="x_title">
@@ -165,215 +167,208 @@
                     </div>
                     <% if index == 0 %>
                     <div class="x_content">
-                    <% else %>
-                    <div class="x_content" style="display: none;">
-                    <% end %>
-                        <!-- left content -->
-                        <div class="col-md-6 col-sm-6 col-xs-12">
-                            <div style="margin: 10px">
-                                <p class="text-muted font-13 m-b-30"><span class="badge bg-blue">Volume Info</span></p>
-                                <%= volume_info t %>
+                        <% else %>
+                        <div class="x_content" style="display: none;">
+                            <% end %>
+                            <!-- left content -->
+                            <div class="col-md-6 col-sm-6 col-xs-12">
+                                <div style="margin: 10px">
+                                    <p class="text-muted font-13 m-b-30"><span class="badge bg-blue">Volume Info</span></p>
+                                    <%= volume_info t %>
+                                </div>
+                                <% if t["Mount State"] == "mounted" %>
+                                <a class="btn btn-app" href="/volume/unmount/<%=t['Volume Name'].delete(' ')%>"><i class="fa fa-upload"></i> Unmount</a>
+                                <% elsif t["Status"] == " Started" %>
+                                <a class="btn btn-app" href="/volume/stop/<%=t['Volume Name'].delete(' ')%>">
+                                    <i class="fa fa-pause" style="color:#d9534f;"></i>
+                                    <p style="color:#d9534f;">Stop</p>
+                                </a>
+                                <a class="btn btn-app" href="?volume_name=<%=t['Volume Name'].delete(' ')%>#popup_mount"><i class="fa fa-download"></i> Mount</a>
+                                <% else %>
+                                <a class="btn btn-app" href="/volume/start/<%=t['Volume Name'].delete(' ')%>">
+                                    <i class="fa fa-play" style="color:#26B99A;"></i>
+                                    <p style="color:#26B99A;">Start</p>
+                                </a>
+                                <a class="btn btn-app" href="/volume/delete/<%=t['Volume Name'].delete(' ')%>">
+                                    <i class="fa fa-trash"></i> Delete
+                                </a>
+                                <% end %>
+                            </div>
+                            <!-- right content -->
+                            <div class="col-md-6 col-sm-6 col-xs-12">
+                                <% if t["Mount State"] == "mounted" %>
+                                <p class="text-muted font-13 m-b-30"><span class="badge bg-green">Uploader</span> Activated</p>
+                                <form action="/file_upload/<%=t['Volume Name'].delete(' ')%>" method="post" enctype="multipart/form-data" class="dropzone" style="border: 1px solid #e5e5e5; height: 300px; overflow:auto;">
+                                </form>
+                                <br/>
+                                <% else %>
+                                <p class="text-muted font-13 m-b-30"><span class="badge bg-red">Uploader</span> Inactivated</p>
+                                <form style="border: 1px solid #e5e5e5; height: 300px; overflow:auto;">
+                                </form>
+                                <br/>
+                                <% end %>
                             </div>
-                            <% if t["Mount State"] == "mounted" %>
-                            <a class="btn btn-app" href="/volume/unmount/<%=t['Volume Name'].delete(' ')%>"><i class="fa fa-upload"></i> Unmount</a>
-                            <% elsif t["Status"] == " Started" %>
-                            <a class="btn btn-app" href="/volume/stop/<%=t['Volume Name'].delete(' ')%>">
-                                <i class="fa fa-pause" style="color:#d9534f;"></i>
-                                <p style="color:#d9534f;">Stop</p>
-                            </a>
-                            <a class="btn btn-app" href="?volume_name=<%=t['Volume Name'].delete(' ')%>#popup_mount"><i class="fa fa-download"></i> Mount</a>
-                            <% else %>
-                            <a class="btn btn-app" href="/volume/start/<%=t['Volume Name'].delete(' ')%>">
-                                <i class="fa fa-play" style="color:#26B99A;"></i>
-                                <p style="color:#26B99A;">Start</p>
-                            </a>
-                            <a class="btn btn-app" href="/volume/delete/<%=t['Volume Name'].delete(' ')%>">
-                                <i class="fa fa-trash"></i> Delete
-                            </a>
-                            <% end %>
-                        </div>
-                        <!-- right content -->
-                        <div class="col-md-6 col-sm-6 col-xs-12">
-                            <% if t["Mount State"] == "mounted" %>
-                            <p class="text-muted font-13 m-b-30"><span class="badge bg-green">Uploader</span> Activated</p>
-                            <form action="/file_upload/<%=t['Volume Name'].delete(' ')%>" method="post" enctype="multipart/form-data" class="dropzone" style="border: 1px solid #e5e5e5; height: 300px; overflow:auto;">
-                            </form>
-                            <br/>
-                            <% else %>
-                            <p class="text-muted font-13 m-b-30"><span class="badge bg-red">Uploader</span> Inactivated</p>
-                            <form style="border: 1px solid #e5e5e5; height: 300px; overflow:auto;">
-                            </form>
-                            <br/>
-                            <% end %>
                         </div>
                     </div>
                 </div>
+                <%end%>
             </div>
-            <%end%>
         </div>
-    </div>
-    <!-- /page content -->
+        <!-- /page content -->
 
-    <!-- File manager functions -->
-    <script>
-    function change_upper(directory){
-        if(directory == "/") return;
-        var lastindex = directory.lastIndexOf("/");
-        if(lastindex == 0) lastindex++;
-        change_directory(directory.substring(0, lastindex));
-    }
-    function change_directory(directory){
-        $.ajax({
-            method: "POST",
-            url: "/application/changeDir",
-            data: { path: directory },
-            success  : function(result){
-                $("#datatable_body").empty();
-                var new_tr = "";
-                new_tr += "<tr role='row' class='odd'> <td><i class='fa fa-reply'></i>";
-                new_tr += "<a style='cursor: pointer' onclick='change_upper(" + '"' + directory + '"' +")'> ..</a>";
-                new_tr += "</td><td> </td><td>";
-                for( var i = 0; i < result.file.length; i++){
-                    if(result.file[i].auth[0] != "d") continue;
-                    var row_class = i % 2 == 0 ? 'odd' : 'even';
-                    var cur = result.current != "/" ? result.current : '';
-                    new_tr += "<tr role='row' class='" + row_class + "'>";
-                    new_tr += "<td style='color:#0d8ade;' class='sorting_1'><i class='fa fa-folder-open-o'></i> ";
-                    new_tr += "<a  style='cursor: pointer'  onclick='change_directory(" +'"' + cur + "/" + result.file[i].name +'"'+ ")'>" + result.file[i].name + "</a></td>";
-                    new_tr += "<td>"+result.file[i].auth+"</td>";
-                    new_tr += "<td><form data-parsley-validate>";
-                    new_tr += "<input type='hidden' value='" + cur + "/" + result.file[i].name + "'>";
-                    new_tr += "<button type='submit' class='btn btn-primary pull-right'>select</botton>";
-                    new_tr += "</form></td>"
-                    new_tr += "</tr>";
-                }
-                $("#datatable_body").append(new_tr);
-                // Add mount overlay functions again
-                $("#popup_mount #datatable_body form").submit(function(){
-                    var mnt_point = $(this).find("input").val();
-                    var url = window.location + '';
-                    var vol_name = url.match(/volume_name=([^#]+)/)[1];
-                    $.ajax({
-                        type: 'post',
-                        url: '/volume/mount',
-                        data: {mount_point: mnt_point, volume_name: vol_name},
-                        success: function(result){
-                        }
-                    });
-                })
-            }
-        })
-    }
-    </script>
-
-    <!-- On document ready -->
-    <script>
-    $("document").ready(function(){
-        // Mount overlay functions
-        $("#popup_mount #datatable_body form").submit(function(){
-            var mnt_point = $(this).find("input").val();
-            var url = window.location + '';
-            var vol_name = url.match(/volume_name=([^#]+)/)[1];
+        <!-- File manager functions -->
+        <script>
+        function change_upper(directory){
+            if(directory == "/") return;
+            var lastindex = directory.lastIndexOf("/");
+            if(lastindex == 0) lastindex++;
+            change_directory(directory.substring(0, lastindex));
+        }
+        function change_directory(directory){
             $.ajax({
-                type: 'post',
-                url: '/volume/mount',
-                data: {mount_point: mnt_point, volume_name: vol_name},
-                success: function(result){
+                method: "POST",
+                url: "/application/changeDir",
+                data: { path: directory },
+                success  : function(result){
+                    $("#datatable_body").empty();
+                    var new_tr = "";
+                    new_tr += "<tr role='row' class='odd'> <td><i class='fa fa-reply'></i>";
+                    new_tr += "<a style='cursor: pointer' onclick='change_upper(" + '"' + directory + '"' +")'> ..</a>";
+                    new_tr += "</td><td> </td><td>";
+                    for( var i = 0; i < result.file.length; i++){
+                        if(result.file[i].auth[0] != "d") continue;
+                        var row_class = i % 2 == 0 ? 'odd' : 'even';
+                        var cur = result.current != "/" ? result.current : '';
+                        new_tr += "<tr role='row' class='" + row_class + "'>";
+                        new_tr += "<td style='color:#0d8ade;' class='sorting_1'><i class='fa fa-folder-open-o'></i> ";
+                        new_tr += "<a  style='cursor: pointer'  onclick='change_directory(" +'"' + cur + "/" + result.file[i].name +'"'+ ")'>" + result.file[i].name + "</a></td>";
+                        new_tr += "<td>"+result.file[i].auth+"</td>";
+                        new_tr += "<td><form data-parsley-validate>";
+                        new_tr += "<input type='hidden' value='" + cur + "/" + result.file[i].name + "'>";
+                        new_tr += "<button type='submit' class='btn btn-primary pull-right'>select</botton>";
+                        new_tr += "</form></td>"
+                        new_tr += "</tr>";
+                    }
+                    $("#datatable_body").append(new_tr);
+                    // Add mount overlay functions again
+                    $("#popup_mount #datatable_body form").submit(function(){
+                        var mnt_point = $(this).find("input").val();
+                        var url = window.location + '';
+                        var vol_name = url.match(/volume_name=([^#]+)/)[1];
+                        $.ajax({
+                            type: 'post',
+                            url: '/volume/mount',
+                            data: {mount_point: mnt_point, volume_name: vol_name},
+                            success: function(result){
+                            }
+                        });
+                    })
                 }
+            })
+        }
+        </script>
+
+        <!-- On document ready -->
+        <script>
+        $(document).ready(function(){
+            // Mount overlay functions
+            $("#popup_mount #datatable_body form").submit(function(){
+                var mnt_point = $(this).find("input").val();
+                var url = window.location + '';
+                var vol_name = url.match(/volume_name=([^#]+)/)[1];
+                $.ajax({
+                    type: 'post',
+                    url: '/volume/mount',
+                    data: {mount_point: mnt_point, volume_name: vol_name},
+                    success: function(result){
+                    }
+                });
             });
-        });
-        // Create overlay functions
-        $("#popup_create #form_volume_create").submit(function(){
-            var volume_name = $(this).find(".form-group:eq(0) input").val(),
+            // Create overlay functions
+            $("#popup_create #form_volume_create").submit(function(){
+                var volume_name = $(this).find(".form-group:eq(0) input").val(),
                 volume_type = $(this).find(".form-group:eq(1) option:selected").val(),
                 num_of_brick = $(this).find(".form-group:eq(2) option:selected").val() * 1, // convert to Number type
                 bricks = [];
-            if(volume_name.indexOf(' ') >= 0){
-                alert("Volume name can't contains white spaces");
-                return;
-            }
-            <% get_volumes.each do |t| %>
-            if(volume_name == "<%=t["Volume Name"].delete(' ')%>"){
-                alert("Already has a volume which name is same");
-                return;
-            }
-            <% end %>
-            for(var i = 0; i < num_of_brick; i++){
-                var server_name = $(this).find(".form-group .row").eq(i).find("option:selected").val();
-                var brick_name = $(this).find(".form-group .row").eq(i).find("input").val();
-                if(brick_name.indexOf(' ') >= 0) {
-                    alert("Brick name can't contain white spaces");
+                if(volume_name.indexOf(' ') >= 0){
+                    alert("Volume name can't contains white spaces");
                     return;
                 }
-                if(brick_name.indexOf('/') == 0) {
-                    alert("Brick name can't start with slash");
+                <% volumes.each do |t| %>
+                if(volume_name == "<%=t["Volume Name"].delete(' ')%>"){
+                    alert("Already has a volume which name is same");
                     return;
                 }
-                var brick = "";
-                if(server_name == "<%=@config['server_name']%>"){
-                    brick += "<%=@config['host_ip']%>";
-                    brick += ":/";
-                    brick += brick_name;
+                <% end %>
+                for(var i = 0; i < num_of_brick; i++){
+                    var host_name = $(this).find(".form-group .row").eq(i).find("option:selected").val();
+                    var brick_name = $(this).find(".form-group .row").eq(i).find("input").val();
+                    if(brick_name.indexOf(' ') >= 0) {
+                        alert("Brick name can't contain white spaces");
+                        return;
+                    }
+                    if(brick_name.indexOf('/') == 0) {
+                        alert("Brick name can't start with slash");
+                        return;
+                    }
+                    var brick = host_name + ":/" + brick_name;
                     bricks.push(brick);
                     console.log(brick);
                 }
-                else{
-                    alert("Something goes wrong!");
-                    return;
-                }
-            }
-            $.ajax({
-                method: "POST",
-                url: "/volume/create",
-                data: { volume_name : volume_name, volume_type : volume_type, num_of_brick : num_of_brick, bricks : bricks },
-                success  : function(result){
+                $.ajax({
+                    method: "POST",
+                    url: "/volume/create",
+                    data: { volume_name : volume_name, volume_type : volume_type, num_of_brick : num_of_brick, bricks : bricks },
+                    success  : function(result){
+                    }
+                });
+            });
+            // Volume type changed
+            $("#popup_create #form_volume_create .form-group").eq(1).change(function (){
+                var $type = $(this).find("option:selected").val();
+                switch ($type) {
+                    case "Distribute":
+                    case "Stripe":
+                    case "Replica":
+                    case "Disperse":
+                    case "Disperse-data":
+                    case "Redundancy":
+                    console.log($type);
+                    break;
+                    default:
+                    console.log("something goes wrong");
+                    break;
                 }
             });
+            // Number of bricks changed
+            $("#popup_create #form_volume_create .form-group").eq(2).change(function (){
+                var $num_of_brick = $(this).find("option:selected").val();
+                var $body = $("#form_volume_create .form-group").eq(3);
+                $body.empty();
+                var new_body = "";
+                for(var i = 0; i < $num_of_brick; ++i) {
+                    new_body += "<div class='row' style='margin:0 0 10px 0'>";
+                    new_body += "<label class='control-label col-md-3 col-sm-3 col-xs-12'>";
+                    if(i == 0)
+                    new_body += "Bricks <span class='required'>*</span>";
+                    new_body += "</label>";
+                    new_body += "<div class='col-md-3 col-sm-3 col-xs-4'>";
+                    new_body += "<select class='form-control'>";
+                    <% get_conf_all.each do |t| %>
+                    new_body += "<option><%= t['host_name'] %></option>";
+                    <% end %>
+                    new_body += "</select>";
+                    new_body += "</div>";
+                    new_body += "<div class='col-md-1 col-sm-1 col-xs-1'>"
+                    new_body += "<label class='control-label col-md-12 col-sm-12 col-xs-12'>/"
+                    new_body += "</label>"
+                    new_body += "</div>"
+                    new_body += "<div class='col-md-5 col-sm-5 col-xs-7'>";
+                    new_body += "<input type='text' required='required' class='form-control col-md-7 col-xs-12'>";
+                    new_body += "</div>";
+                    new_body += "</div>";
+                }
+                $body.append(new_body);
+            });
         });
-        // Volume type changed
-        $("#popup_create #form_volume_create .form-group").eq(1).change(function (){
-            var $type = $(this).find("option:selected").val();
-            switch ($type) {
-                case "Distribute":
-                case "Stripe":
-                case "Replica":
-                case "Disperse":
-                case "Disperse-data":
-                case "Redundancy":
-                console.log($type);
-                break;
-                default:
-                console.log("something goes wrong");
-                break;
-            }
-        });
-        // Number of bricks changed
-        $("#popup_create #form_volume_create .form-group").eq(2).change(function (){
-            var $num_of_brick = $(this).find("option:selected").val();
-            var $body = $("#form_volume_create .form-group").eq(3);
-            $body.empty();
-            var new_body = "";
-            for(var i = 0; i < $num_of_brick; ++i) {
-                new_body += "<div class='row' style='margin:0 0 10px 0'>";
-                new_body += "<label class='control-label col-md-3 col-sm-3 col-xs-12'>";
-                if(i == 0)
-                new_body += "Bricks <span class='required'>*</span>";
-                new_body += "</label>";
-                new_body += "<div class='col-md-3 col-sm-3 col-xs-4'>";
-                new_body += "<select class='form-control'>";
-                new_body += "<option><%=@config['server_name']%></option>";
-                new_body += "</select>";
-                new_body += "</div>";
-                new_body += "<div class='col-md-1 col-sm-1 col-xs-1'>"
-                new_body += "<label class='control-label col-md-12 col-sm-12 col-xs-12'>/"
-                new_body += "</label>"
-                new_body += "</div>"
-                new_body += "<div class='col-md-5 col-sm-5 col-xs-7'>";
-                new_body += "<input type='text' required='required' class='form-control col-md-7 col-xs-12'>";
-                new_body += "</div>";
-                new_body += "</div>";
-            }
-            $body.append(new_body);
-        });
-    });
-    </script>
+        </script>
diff --git a/script/setup.sh b/script/setup.sh
index 85a1847..1ed0737 100755
--- a/script/setup.sh
+++ b/script/setup.sh
@@ -13,19 +13,3 @@ sudo --askpass bower install --allow-root
 gem install bundler
 bundle install
 bin/rake db:migrate
-
-# make configuration file
-
-CONF_PATH=`pwd`/configure.conf
-
-if ls `pwd` | grep configure.conf; then
-echo "configure.conf exist"
-else
-touch $CONF_PATH
-echo "project_path=`pwd`" >> $CONF_PATH
-echo "server_name=gluster" >> $CONF_PATH
-echo "host_ip=127.0.0.1" >> $CONF_PATH
-echo "host_port=" >> $CONF_PATH
-echo "host_user=root" >> $CONF_PATH
-echo "host_password=secret" >> $CONF_PATH
-fi