Update for template page

app/controllers/admin/sites_controller.rb

@@ -151,7 +151,6 @@ class Admin::SitesController < OrbitBackendController
       result = "success"
       Bundler.with_clean_env { `cd #{Rails.root} && bundle install && touch tmp/restart.txt` }
     end
-    %x(git stash pop) unless need_stash
 
     render :text => result
   end

app/views/admin/authorizations/index.html.erb

@@ -35,6 +35,6 @@
 <div class="bottomnav clearfix">
   <div class="action pull-right">
     <%= link_to content_tag(:i, nil, class: "icons-plus") + ' ' + t(:add), '#', class: 'btn btn-primary select_user_modal', rel: admin_modal_select_authorizations_path(@module_app.key, @type, @object) %>
-    <%= link_to content_tag(:i, nil, class: "icon-trash") + ' ' + t(:delete), '#', id: 'remove_users', class: 'btn btn-danger', rel: admin_remove_users_authorizations_path(@module_app.key, @type, @object) %>
+    <%= link_to content_tag(:i, nil, class: "icon-trash") + ' ' + t(:delete_), '#', id: 'remove_users', class: 'btn btn-danger', rel: admin_remove_users_authorizations_path(@module_app.key, @type, @object) %>
   </div>
 </div>

app/views/admin/designs/_design.html.erb

@@ -1,15 +1,20 @@
-<tr class="with_action">
+<tr>
-	<td class="span1"><%= check_box_tag 'to_delete[]', design.id, false, :class => "checkbox_in_list" %></td>
+   <td class="detail-row">
-	<td class="span2">
+    	<h5 class="mt_title">
-		<%= design.title %>
+    		<span><%= design.title %></span>
-		<div class="quick-edit">
+    	</h5>
-			<ul class="nav nav-pills hide">
+    	
+    </td>
+	<td>
+    	<p class="mt_dev"><%= design.author %></p>
+    </td>
+    <td>
+    	<div class="quick-edit">
+			<ul class="nav nav-pills">
 				<li><%= link_to t(:edit), edit_admin_design_path(design), :class => 'edit'  %></li>
 				<li class="dropdown"><%= link_to t(:delete_), admin_design_path(design), :confirm => t('sure?'), :method => :delete, :class => 'delete' %></li>
 			</ul>
 		</div>
 	</td>
-  <td class="span7"><%= design.intro %></td>
+	<td class="active"><%= radio_button_tag 'design_default', design.id, (@site.design && @site.design.id.to_s.eql?(design.id.to_s) ? true : false), :class => 'design_default toggle-check', :rel => admin_sites_path %></td> 
-  <td class="span2"><%= design.author %></td>
-  <td class="span1 active"><%= radio_button_tag 'design_default', design.id, (@site.design && @site.design.id.to_s.eql?(design.id.to_s) ? true : false), :class => 'design_default toggle-check', :rel => admin_sites_path %></td>
 </tr>

app/views/admin/designs/_designs.html.erb

@@ -1,25 +1,12 @@
 <thead>
 <tr class="sort-header">
-  <th></th>
+  <th class="first span2"><a href="#">Templates Title</a></th>
-  <th class="first span3"><a href="#">Templates Title</a></th>
+  <th class="active span3">Designer</th>
-  <th data-hide="phone" class="active span3">Active</th>
+  <th class="span3">Actions</th>
-  <th data-hide="phone" class="active span3">Date of purchase</th>
+  <th class="span1">Status</th>
-  <th data-hide="phone" class="active span3">Designer</th>
-  <th class="span1"></th>
 </tr>
 </thead>
 <tbody>
 <tbody id="tbody_designs" class="sort-holder">
 	<%= render :partial => 'design', :collection => @designs %>
 </tbody>
-
-<% content_for :page_specific_javascript do %>
-  <script>
-    $(document).ready(function(){
-      $(document).on('change', '.design_default', function(){
-        $(this).attr('value');
-        $.getScript($(this).attr('rel') + '/' + $(this).val() + '/change_design');
-      }); 
-    }); 
-  </script>
-<% end %>

app/views/admin/designs/index.html.erb

@@ -12,16 +12,225 @@
     <%= javascript_include_tag 'lib/footable-0.1' %>
     <%= javascript_include_tag 'lib/all-list' %>  
     <%= javascript_include_tag 'lib/retina' %>   
-    <%= javascript_include_tag 'lib/mudole_templates_status' %>  
+     <style type="text/css">
+      .container{
+        /*max-width: 600px;*/
+      }
 
+      .panel{
+        border-radius: 5px;
+        overflow: hidden;
+        border: 1px solid #DFDFDF;
+        background: #FFF;
+        box-shadow: 0px 0px 10px #CCC;
+      }
+
+      .break{
+        border-left: 1px solid #FCFCFC;
+        border-right: 1px solid #DDD;
+        padding: 10px 0;
+        margin: 0 15px;
+      }
+
+      .panel-heading{
+        font-size: 16px;
+        color: #666;
+        padding: 10px 20px;
+        height: 20px;
+
+        background-color: #fafafa;
+        background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
+        background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2));
+        background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
+        background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
+        background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
+        background-repeat: repeat-x;
+        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
+        *zoom: 1;
+        border-bottom:  1px solid #DDD;
+      }
+
+      .table{
+        margin: 0;
+        -webkit-border-radius: 5px;
+        border-radius: 5px;
+      }
+
+  /*    .table td, .table th, .table .quick-edit{
+        vertical-align: middle;
+        text-align: center;
+      }
+*/
+      /*.table td img{
+        background: #666;
+        border: 3px solid #AAA;
+        padding: 2px;
+        border-radius: 5px;
+        box-shadow: 0px 0px 10px #000 inset;
+      }
+*/
+      .pannel-body{
+        min-height:  400px;
+        overflow: scroll;
+        overflow-x: hidden;
+        overflow-y: hidden;
+        padding: 15px;
+      }
+
+      .pannel-footer{
+        background: #f2f2f2; /* Old browsers */
+        background: -moz-linear-gradient(top,  #f2f2f2 0%, #ffffff 76%, #ededed 100%); /* FF3.6+ */
+        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(76%,#ffffff), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
+        background: -webkit-linear-gradient(top,  #f2f2f2 0%,#ffffff 76%,#ededed 100%); /* Chrome10+,Safari5.1+ */
+        background: -o-linear-gradient(top,  #f2f2f2 0%,#ffffff 76%,#ededed 100%); /* Opera 11.10+ */
+        background: -ms-linear-gradient(top,  #f2f2f2 0%,#ffffff 76%,#ededed 100%); /* IE10+ */
+        background: linear-gradient(to bottom,  #f2f2f2 0%,#ffffff 76%,#ededed 100%); /* W3C */
+        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
+        
+        border: 1px solid #EEE;
+        border-top: 1px solid #CCC;
+        padding: 10px;
+
+        height: 30px;
+      }
+
+      #apply_change_btn{
+        display: none;
+      }
+
+      #alert_wrap{
+        display: none;
+        position: absolute;
+        width: 93%;
+        top: 30%;
+        z-index: 1045;
+      }
+
+      .alert{
+        width: 400px;
+        text-align: center;
+        z-index: 1050;
+        margin: 0 auto;
+        padding: 10px 0;
+      }
+
+      .modal-backdrop{
+        display: none;
+      }
+
+      .icons-faq:before{ content: "\e086"; }
+      .icons-ask:before { content: "\e062"; }
+    </style>
 </head>
 
 
-<%= render 'filter' %>
+<%#= render 'filter' %>
-<table class="table main-list">
+<%#= flash[:notice] rescue nil%>
-	<%= render 'designs' %>
+<div id="alert_wrap">
+  <div class="alert alert-success">
+    <h4><span id="module_msg_title">Please wait...</span></h4><br/>
+    <span id="module_msg_content">Theme changes taking effect</span><br/>
+    <img src="http://ridepal.com/images/homeimg/preloader_transparent.gif" width="50">
+  </div>
+</div>
+
+ <div class="container row-fluid">
+
+  <div class="span4">
+    <div class="panel">
+      <div class="panel-heading"><i class="icons-download"></i><span class="break"></span><%= t(:installed_templates) %></div>
+      <div class="pannel-body">
+        <table class="table table-striped">
+          <tbody id="extensions_table">
+              <%= render 'designs' %>
+          </tbody>
+      </table>
+      </div>  
+      <div class="pannel-footer">
+        <button id="apply_change_btn" onclick="apply_change();" class="btn btn-primary btn-small pull-right">Appy Change</button>
+      </div>
+    </div>
+   </div>
+
+   <div class="span8 pull-right">
+     <div class="panel">
+        <div class="panel-heading"><i class="icon-shopping-cart"></i><span class="break"></span><%= t(:template_store) %></div>
+        <div class="pannel-body">
+
+          <table id="mt-list" class="table main-list">
+            <tbody>
+                <tr id="loading">
+                    <td>
+	                   <img src="http://ridepal.com/images/homeimg/preloader_transparent.gif" width="50">
+                        <span>Loading template store...</span>
+                    <td>
+                </tr>
+            </tbody>
+         </table>
+
+        </div>  
+        <div class="pannel-footer">
+        </div>
+      </div>
+   </div>
+ </div>
+ <div class="modal-backdrop"></div>
 </table>
 
 <div class="form-actions form-fixed pagination-right">
     <%= link_to content_tag(:i, nil, :class => 'icon-plus icon-white') + t(:upload), upload_package_admin_designs_path, :class => 'btn btn-primary pull-right' %>
 </div>
+
+<script type="text/javascript">
+    $.ajax({
+        url : "<%= admin_template_store_path %>",
+        type : "get",
+        datatType : "html"
+    }).done(function(data){
+        $("#loading").addClass('hide');
+        $("#mt-list").html(data);
+        bindHandlers();
+    }).fail(function(){
+        $("#loading").addClass('hide');
+        $("#mt-list").html("<tr><td>Error loading template store</td></tr>");
+    })
+     $(document).on('change', '.design_default', function(){
+        $("#alert_wrap").show();
+        $(".modal-backdrop").show();
+        $(this).attr('value');
+        $.getScript($(this).attr('rel') + '/' + $(this).val() + '/change_design',function(){
+            $("#alert_wrap").hide();
+           $(".modal-backdrop").hide();
+        });
+    });
+
+    var bindHandlers = function(){
+        $("a.download-link").on(clickEvent,function(){
+          if($(this).attr("disabled") == "disabled")return false;
+          var el = $(this);
+          el.removeClass("btn-primary").addClass("btn-info").text("Installing").attr('disabled',"disabled");
+          $.ajax({
+            url : "<%= admin_template_store_download_theme_path %>",
+            data : el.data(),
+            dataType : "json",
+            type : "post"
+          }).done(function(data){
+             if(data.success){
+                el.removeClass('btn-info').addClass('btn-success').text("Installed");
+                $.ajax({
+                    url: '<%= admin_design_list_path %>',
+                    type: 'get',
+                    dataType: 'html'
+                })
+                .done(function(data) {
+                    $("#tbody_designs").html(data);
+                    $(".toggle-check").togglebox();
+                });
+              }
+          }).fail(function(){
+              el.removeClass('btn-info').addClass('btn-danger').text("Error, please try again.").removeAttr('disabled');
+          })
+        })
+    }
+</script>
+