added some method in orbit helper and some mods

app/controllers/pages_controller.rb

@@ -289,9 +289,9 @@ class PagesController < ApplicationController
                OrbitHelper.set_widget_custom_value custom_value
             end
             if @editmode
-               partials << "<div class='editmode-ps' title='#{subpart.module}'> " + render_widget_for_frontend(subpart.module,subpart.widget_method,subpart.widget_type) + "<a href='/page_parts/edit_sub_part?page_id=#{page.id.to_s}&part_id=#{part.id.to_s}&sub_part_id=#{subpart.id.to_s}#{(!$mobile.blank? ? '&mobile_view=1' : '')}'> </a></div>"
+               partials << "<div class='editmode-ps' title='#{subpart.module}'> " + render_widget_for_frontend(subpart.module,subpart.widget_method,subpart.widget_type,subpart.id.to_s) + "<a href='/page_parts/edit_sub_part?page_id=#{page.id.to_s}&part_id=#{part.id.to_s}&sub_part_id=#{subpart.id.to_s}#{(!$mobile.blank? ? '&mobile_view=1' : '')}'> </a></div>"
             else
-                partials << render_widget_for_frontend(subpart.module,subpart.widget_method,subpart.widget_type)
+                partials << render_widget_for_frontend(subpart.module,subpart.widget_method,subpart.widget_type,subpart.id.to_s)
             end
           elsif subpart.kind == "text"
               if @editmode

app/helpers/orbit_helper.rb

@@ -12,6 +12,24 @@ module OrbitHelper
     @tags = tags;
   end
 
+  def self.register_subpart(subpart_id)
+      subpart = SubPart.find(subpart_id) rescue nil
+      if !subpart.nil?
+        self.set_current_widget subpart
+        self.set_widget_data_count subpart.data_count
+        self.set_widget_categories subpart.categories
+        self.set_widget_module_app subpart.module
+        self.set_widget_item_url subpart
+        self.set_widget_title subpart.title
+        self.set_widget_categories subpart.categories || []
+        self.set_widget_tags subpart.tags || []
+        custom_value = subpart.custom_string_field || subpart.custom_array_field rescue nil
+        if !custom_value.nil?
+           self.set_widget_custom_value custom_value
+        end
+      end
+  end
+
   def self.set_page_role_status(role_status)
     @role_status = role_status;
   end
@@ -182,7 +200,7 @@ module OrbitHelper
     self.set_widget_module_app module_app
      @url_widget_for_show = ""
       pages = Page.where(:module => module_app)
-      widget_categories = self.get_current_widget.categories
+      widget_categories = self.get_current_widget.categories rescue []
       finalpage = nil
       pages.each do |p|
         if p.categories == widget_categories

app/helpers/pages_helper.rb

@@ -11,7 +11,7 @@ module PagesHelper
     doc.to_html
   end
 
-  def render_widget_for_frontend(controller_name, widget_method, widget_file)
+  def render_widget_for_frontend(controller_name, widget_method, widget_file, subpart_id=nil)
     def widget_parsing_repeats_again(elements,d,level)
         newhtml = []
         oldhtml = []
@@ -45,6 +45,7 @@ module PagesHelper
         end
         [oldhtml,newhtml]
       end
+      @key = Site.first.template if @key.nil?
     controller_name = controller_name.downcase.singularize
     f = File.join(Rails.root, 'app', 'templates', "#{@key}", 'modules', "#{controller_name}", "_#{widget_file}.html.erb");
     if !File.exists?f
@@ -64,6 +65,9 @@ module PagesHelper
     end
     s = render_to_string(f)
     doc = Nokogiri::HTML(s, nil, "UTF-8")
+    if !subpart_id.nil?
+       doc.css("body").children.first.set_attribute("data-subpart-id", subpart_id) rescue nil
+    end
     wrap_elements = doc.css("*[data-repeat]")
     controller = "#{controller_name.capitalize.pluralize}_controller".classify.constantize.new
     OrbitHelper.set_current_widget_module controller_name

app/templates/orbit_bootstrap/assets/stylesheets/template/base/_tab.scss

@@ -0,0 +1,166 @@
+.w-annc-weblink {
+  .pagination {
+    position: absolute;
+    top: 8px;
+    right: 0;
+    margin: 0;
+    a {
+      text-indent: -9999px;
+      display: inline-block;
+      width: 14px;
+      height: 14px;
+      border-radius: 3px;
+      margin-left: -2px;
+      color: #cc0033;
+      background-color: #fff;
+      border: 1px solid #dcdcdc;
+      font-family: 'entypo';
+      text-align: center;
+      position: relative;
+      &.next {
+        &:before {
+          content: "\e0d4";
+        }
+      }
+      &.prev {
+        color: #6C6C6C;
+        &:before {
+          content: "\e0d1";
+        }
+      }
+      &:before {
+        text-indent: 0;
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 12px;
+        height: 12px;
+        line-height: 12px;
+      }
+    }
+  }
+  .tab {
+    padding: 1em;
+    position: relative;
+    z-index: 1;
+    min-height: 240px;
+  }
+  .tab-list {
+    position: relative;
+    .tab-item {
+      position: relative;
+      width: 105px;
+      padding: 0.5em 0;
+      z-index: 2;
+      a {
+        display: block;
+        padding: 0.3em 0.5em;
+        margin-right: 1em;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        color: #333;
+        text-decoration: none;
+        line-height: 14px;
+      }
+      &.active,
+      &:hover {
+        a {
+          color: #000;
+          font-weight: bold;
+          background: transparent url(/assets/tag.png) left -6px no-repeat;
+          &:after {
+            content: "";
+            position: absolute;
+            top: 0.5em;
+            right: 0;
+            width: 1em;
+            height: 21px;
+            background: transparent url(/assets/tag.png) right -6px no-repeat;
+          }
+        }
+      }
+      &:hover {
+        a {
+          background: transparent url(/assets/tag.png) left -36px no-repeat;
+          &:after {
+            background: transparent url(/assets/tag.png) right -36px no-repeat;
+          }
+        }
+      }
+    }
+  }
+  .tab-body {
+    display: none;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: 0;
+    &.active {
+      display: block;
+      z-index: 1;
+    }
+  }
+  .annc-content {
+    position: absolute;
+    top: 0;
+    right: 140px;
+    left: 115px;
+    background-color: #fff;
+    .annc-heading {
+      line-height: 1.5em;
+      height: 1.6em;
+      margin: 0;
+      font-size: 18px;
+      border-bottom: 1px solid #C2C2C2;
+      .annc-more {
+        padding-top: 0;
+        color: #6C6C6C;
+        text-align: left;
+        font-weight: normal;
+      }
+    }
+  }
+  .wlink-content {
+    position: absolute;
+    top: 0;
+    right: 0;
+    width: 120px;
+    .wlink-heading {
+      height: 1.6em;
+      margin: 0;
+      line-height: 1.6em;
+      font-size: 18px;
+      padding-bottom: 0.3em;
+      border-bottom: 1px solid #C2C2C2;
+    }
+  }
+  .list {
+    margin: 0;
+    padding: 0;
+    list-style: none;
+    .list-item {
+      display: none;
+      padding: 0.5em 0;
+      width: 100%;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      border-bottom: 1px solid #ccc;
+      & > a {
+        color: #333;
+        &:hover {
+          color: #cc0033;
+        }
+      }
+    }
+  }
+  a {
+    display: inline;
+    color: #6C6C6C;
+    line-height: 2em;
+    outline: none;
+  }
+}

app/templates/orbit_bootstrap/assets/stylesheets/template/template.scss

@@ -5,6 +5,7 @@
 @import "base/mixins";
 @import "base/variables";
 @import "base/unity";
+@import "base/tab";
 
 // Layout
 @import "layout/header";

app/templates/orbit_bootstrap/widgets/announcement_link_widget/_content.html.erb

@@ -0,0 +1,35 @@
+ <div class="tab">
+    <div class="tab-list" data-list="tags" data-level="0">
+      <div class="tab-item">
+        <a href="#{{tag-id}}" class="tab-link">{{tag-name}}</a>
+      </div>
+      <div class="tab-body">
+        <div class="annc-content">
+          <h3 class="annc-heading">
+            <a href="" class="annc-more">{{heading-announcements}}</a>
+          </h3>
+          <div class="pagination" data-quant="1">
+            <a href="{{annc-prev}}" class="prev" rel="prev">{{Prev}}</a>
+            <a href="{{annc-next}}" class="next" rel="next">{{Next}}</a>
+          </div>
+          <ul class="list" data-list="announcements" data-level="1">
+            <li class="list-item">
+              <a href="{{link}}">{{title}}</a>
+            </li>
+          </ul>
+        </div>
+        <div class="wlink-content">
+          <h3 class="wlink-heading">{{heading-links}}</h3>
+          <div class="pagination" data-quant="1">
+            <a href="{{wlink-prev}}" class="prev" rel="prev">{{Prev}}</a>
+            <a href="{{wlink-next}}" class="next" rel="next">{{Next}}</a>
+          </div>
+          <ul class="list" data-list="links" data-level="1">
+            <li class="list-item">
+              <a href="{{url}}" target="_blank">{{title}}</a>
+            </li>
+          </ul>
+        </div>
+      </div>
+    </div>
+  </div>

app/templates/orbit_bootstrap/widgets/announcement_link_widget/_widget1.html.erb

@@ -1,37 +1,81 @@
-<div class="w-annc-weblink">
+<div class="w-annc-weblink" id="annoucement_link_widget">
-    <div class="tab">
-        <ul class="tab-list" data-list="tags" data-level="0">
-            <li class="tab-item">
-                <a href="#{{tag-id}}" class="tab-link  active">{{tag-name}}</a>
-            </li>
-             <div class="annc-content">
-                <h3 class="annc-heading">
-                    <a href="" class="annc-more">{{heading-announcements}}</a>
-                </h3>
-                <ul class="annc-list" data-list="announcements" data-level="1">
-                    <li class="annc-item">
-                        <a class="annc-link" href="{{link}}">{{title}}</a>
-                    </li>
-                </ul>
-                 <div class="annc-pagination">
-                    <a href="{{annc-prev}}" class="annc-prev" rel="next">{{Prev}}</a>
-                    <a href="{{annc-next}}" class="annc-next" rel="next">{{Next}}</a>
-                </div>
-            </div>
-            <div class="wlink-content">
-                <h3 class="wlink-heading">{{heading-links}}</h3>
-                <ul class="wlink-list" data-list="links" data-level="1">
-                    <li class="wlink-item">
-                        <a href="{{url}}" target="_blank">{{title}}</a>
-                    </li>
-                    
-                </ul>
-                <div class="wlink-pagination">
-                    <a href="{{wlink-prev}}" class="wlink-prev" rel="next">{{Prev}}</a>
-                    <a href="{{wlink-next}}" class="wlink-next" rel="next">{{Next}}</a>
-                </div>
-            </div>
-        </ul>
-    </div>
  
 </div>
+<script>
+  $(document).ready(function() {
+    $.ajax({
+        "type" : "get",
+        "dataType" : "html",
+        "data" : {"sub_part_id" : $("#annoucement_link_widget").data("subpart-id")},
+        "url" : "/xhr/announcement_link_widget/content"
+    }).done(function(data){
+        $("#annoucement_link_widget").html(data);
+        bindHandlers()
+    })
+   
+  });
+
+  var bindHandlers = function(){
+     var quant = 5,
+        $pagination = $('.pagination');
+
+    var itemSelect = function(r, el) {
+      var range = (r * quant);
+      $(el).children('.list-item').hide();
+      for (var i = range - quant; i < range; i++) {
+        $(el).children('.list-item').eq(i).show();
+      };
+    }
+
+    var pagination = function(q, m, el) {
+      if(q == 1 && m > 1) {
+        $(el).children('.prev').css({'color': '#6C6C6C'});
+        $(el).children('.next').css({'color': '#cc0033'});
+      } else if(q > 1 && q < m) {
+        $(el).children('a').css({'color': '#cc0033'});
+      } else if(q == m && m > 1) {
+        $(el).children('.prev').css({'color': '#cc0033'});
+        $(el).children('.next').css({'color': '#6C6C6C'});
+      } else if(m == 1) {
+        $(el).children('.next').css({'color': '#6C6C6C'});
+      }
+    }
+    $pagination.each(function(index, el) {
+      var max = Math.ceil($(el).next('.list').children('.list-item').length / 5),
+          quant = $(el).data('quant')
+      pagination(quant, max, $(el));
+    });
+
+    $('.list').each(function(index, el) {
+      itemSelect(1, el);
+    });
+    $('.tab-item').eq(0).addClass('active');
+    $('.tab-body').eq(0).addClass('active');
+    $('.tab-item').on('click', function(e) {
+      $('.tab-item').removeClass('active').next('.tab-body').removeClass('active');
+      $(this).addClass('active').next('.tab-body').addClass('active');
+      e.preventDefault();
+    });
+    $('.pagination').on('click', '.prev, .next', function(event) {
+      var tragetClass = $(this).attr('class'),
+          max = Math.ceil($(this).closest('.pagination').next('.list').children('.list-item').length / 5),
+          quant = $(this).closest('.pagination').data('quant'),
+          $pagination = $(this).closest('.pagination'),
+          $el = $(this).closest('.pagination').next('.list');
+      switch(tragetClass) {
+        case 'next':
+          quant += 1;
+          quant > max ? quant = max : null;
+          break;
+        case 'prev':
+          quant -= 1;
+          quant < 1 ? quant = 1 : null;
+          break;
+      }
+      $(this).closest('.pagination').data('quant', quant);
+      pagination(quant, max, $pagination);
+      itemSelect(quant, $el);
+      event.preventDefault();
+    });
+  }
+</script>

config/initializers/keyword_constraint.rb

@@ -1,6 +1,6 @@
 class KeywordConstraint
   def matches?(request)
-    keywords = ["/admin/", "/desktop", "/users/"]
+    keywords = ["/admin/", "/desktop", "/users/", "/xhr/"]
     keywords.all? { |k| !request.url.include?(k) }
   end
 end