isotope embedded inside desktop kernel

app/assets/javascripts/desktop/desktop.js

@@ -17,4 +17,5 @@
 //= require desktop/jquery.gridster
 //= require desktop/books_pages
 //= require select2
+//= require jquery.isotope.min.js
 //= require orbit_js_1.0.1-front-end

app/assets/javascripts/desktop/orbitdesktop.js

@@ -330,13 +330,9 @@ var orbitDesktop = function(dom){
     });
 
     $(window).resize(function(){
-      // var ww = $(window).width();
-      // $("img#thmbackground").attr({"width":ww});
-      // if( $('.tinycanvas').length > 0 ){
-        $('.tinycanvas').tinyscrollbar_update('relative'); 
-      // }
-      if($(o.contentHolder).find("div.app_frame").length > 0){
-        $(o.contentHolder).find("div.app_frame").each(function(){
+      $('.tinycanvas').tinyscrollbar_update('relative'); 
+      if($("body").find("div.app_frame").length > 0){
+        $("body").find("div.app_frame").each(function(){
           var app_holder_height = $(this).height() - 60;
           var app_holder_width = $(this).width();
           $(this).find("div.app_holder").height(app_holder_height);
@@ -361,14 +357,6 @@ var orbitDesktop = function(dom){
     var extractLast = function( term ) {
         return split( term ).pop();
     }
-
-
-    // $("body").on("keydown","*[autocomplete]", function( event ) {
-    //   var autocompleteList = $(this).attr("autocomplete-list");
-    //   console.log($(this));
-        
-    // });
-    // 
   };
 
   this.layout_data = function(h){
@@ -460,13 +448,51 @@ var orbitDesktop = function(dom){
     $("div[container=true] div.overview").html(f.markup);
     var settings = {main : ".tinycanvas"};
     var tsettings = {};
+
+    var ist = function(){
+      $('#holder').css('height', $('#container').height() - 72);
+      $('.tinycanvas').css('height', $('#panel_r').height() - 36);
+      var dom = $("*[isotope=true]").isotope({
+         layoutMode: 'fitColumns',
+         onLayout: function($elems, instance){
+          $elems.width(base_width);
+          setTimeout(function(){
+            dom.isotope('reLayout',function(){
+              $("div[container=true] div.overview").width(dom.width());
+              o.tinyscrollbar.tinyscrollbar_update("relative");
+            })
+          },500);
+         }
+      });
+      
+
+      $(window).resize(function(){
+        if($("*[isotope=true]").length > 0){
+          $('#holder').css('height', $('#container').height() - 72);
+          $('.tinycanvas').css('height', $('#panel_r').height() - 36);
+          $(".isotope").isotope('reLayout',function(){
+            $("div[container=true] div.overview").width($(".isotope").width());
+            o.tinyscrollbar.tinyscrollbar_update("relative");
+          });
+        }
+      });
+      $('.s_grid_h_full').parent().css('height','100%');
+     
+      return dom;
+    }
+
+    if($("*[isotope=true]").length > 0){
+      var dom = ist();
+      f.width = dom.width();
+    }
+
     if(f.width){
       settings.fill = f.width;
     }
     if(pagination_variable){
       var page_no = 1;
-      tsettings.onMove = function(x){
-        if(x < 50){
+      tsettings.onMove = function(e){
+        if(e < 50){
           if(!pagination_link)
             pagination_link = o.lastlink;
           if(o.paging){
@@ -477,6 +503,8 @@ var orbitDesktop = function(dom){
         }
       }
     }
+
+  
     // call other functions here
     o.tinyscrollbar_ext(settings,tsettings);
     o.simple_drop_down();
@@ -484,6 +512,7 @@ var orbitDesktop = function(dom){
     o.use_select2();
     o.check_simple_layout();
   }
+
   this.paging = true;
   this.pagination = function(link,variable,page_no){
     var retvalue = null;
@@ -492,17 +521,31 @@ var orbitDesktop = function(dom){
       type : "get",
       success : function(html){
         var f = o.layout_data.generate_layout_html(html);
-        // console.log(f.total)
-        if(f.total > 0){
-          $("div[container=true] .overview").append(f.markup);
-          if(f.width){
-            var w = $("div[container=true] .overview").width();
-            $("div[container=true] .overview").width(w+f.width);
+        if($("*[isotope=true]").length > 0){
+          var $ul = $(f.markup),
+              elems = $ul.children("li[item=true]");
+          if(elems.length > 1)
+            o.paging = true;
+          else
+            o.paging = false;
+          $(".isotope").append(elems).isotope("appended",elems,function(){
+            $(".isotope").isotope("reLayout",function(){
+              $("div[container=true] div.overview").width($(".isotope").width()+50);
+              o.tinyscrollbar.tinyscrollbar_update("relative");
+            })
+          });
+        }else{
+          if(f.total > 0){
+            $("div[container=true] .overview").append(f.markup);
+            if(f.width){
+              var w = $("div[container=true] .overview").width();
+              $("div[container=true] .overview").width(w+f.width);
+            }
+            o.tinyscrollbar.tinyscrollbar_update("relative");
+            o.paging = true;
+          } else {
+            o.paging = false;
           }
-          o.tinyscrollbar.tinyscrollbar_update("relative");
-          o.paging = true;
-        } else {
-          o.paging = false;
         }
       }
     });

app/assets/javascripts/jquery.isotope.min.js

@@ -0,0 +1,13 @@
+/**
+ * Isotope v1.5.25
+ * An exquisite jQuery plugin for magical layouts
+ * http://isotope.metafizzy.co
+ *
+ * Commercial use requires one-time purchase of a commercial license
+ * http://isotope.metafizzy.co/docs/license.html
+ *
+ * Non-commercial use is licensed under the MIT License
+ *
+ * Copyright 2013 Metafizzy
+ */
+(function(a,b,c){"use strict";var d=a.document,e=a.Modernizr,f=function(a){return a.charAt(0).toUpperCase()+a.slice(1)},g="Moz Webkit O Ms".split(" "),h=function(a){var b=d.documentElement.style,c;if(typeof b[a]=="string")return a;a=f(a);for(var e=0,h=g.length;e<h;e++){c=g[e]+a;if(typeof b[c]=="string")return c}},i=h("transform"),j=h("transitionProperty"),k={csstransforms:function(){return!!i},csstransforms3d:function(){var a=!!h("perspective");if(a){var c=" -o- -moz- -ms- -webkit- -khtml- ".split(" "),d="@media ("+c.join("transform-3d),(")+"modernizr)",e=b("<style>"+d+"{#modernizr{height:3px}}"+"</style>").appendTo("head"),f=b('<div id="modernizr" />').appendTo("html");a=f.height()===3,f.remove(),e.remove()}return a},csstransitions:function(){return!!j}},l;if(e)for(l in k)e.hasOwnProperty(l)||e.addTest(l,k[l]);else{e=a.Modernizr={_version:"1.6ish: miniModernizr for Isotope"};var m=" ",n;for(l in k)n=k[l](),e[l]=n,m+=" "+(n?"":"no-")+l;b("html").addClass(m)}if(e.csstransforms){var o=e.csstransforms3d?{translate:function(a){return"translate3d("+a[0]+"px, "+a[1]+"px, 0) "},scale:function(a){return"scale3d("+a+", "+a+", 1) "}}:{translate:function(a){return"translate("+a[0]+"px, "+a[1]+"px) "},scale:function(a){return"scale("+a+") "}},p=function(a,c,d){var e=b.data(a,"isoTransform")||{},f={},g,h={},j;f[c]=d,b.extend(e,f);for(g in e)j=e[g],h[g]=o[g](j);var k=h.translate||"",l=h.scale||"",m=k+l;b.data(a,"isoTransform",e),a.style[i]=m};b.cssNumber.scale=!0,b.cssHooks.scale={set:function(a,b){p(a,"scale",b)},get:function(a,c){var d=b.data(a,"isoTransform");return d&&d.scale?d.scale:1}},b.fx.step.scale=function(a){b.cssHooks.scale.set(a.elem,a.now+a.unit)},b.cssNumber.translate=!0,b.cssHooks.translate={set:function(a,b){p(a,"translate",b)},get:function(a,c){var d=b.data(a,"isoTransform");return d&&d.translate?d.translate:[0,0]}}}var q,r;e.csstransitions&&(q={WebkitTransitionProperty:"webkitTransitionEnd",MozTransitionProperty:"transitionend",OTransitionProperty:"oTransitionEnd otransitionend",transitionProperty:"transitionend"}[j],r=h("transitionDuration"));var s=b.event,t=b.event.handle?"handle":"dispatch",u;s.special.smartresize={setup:function(){b(this).bind("resize",s.special.smartresize.handler)},teardown:function(){b(this).unbind("resize",s.special.smartresize.handler)},handler:function(a,b){var c=this,d=arguments;a.type="smartresize",u&&clearTimeout(u),u=setTimeout(function(){s[t].apply(c,d)},b==="execAsap"?0:100)}},b.fn.smartresize=function(a){return a?this.bind("smartresize",a):this.trigger("smartresize",["execAsap"])},b.Isotope=function(a,c,d){this.element=b(c),this._create(a),this._init(d)};var v=["width","height"],w=b(a);b.Isotope.settings={resizable:!0,layoutMode:"masonry",containerClass:"isotope",itemClass:"isotope-item",hiddenClass:"isotope-hidden",hiddenStyle:{opacity:0,scale:.001},visibleStyle:{opacity:1,scale:1},containerStyle:{position:"relative",overflow:"hidden"},animationEngine:"best-available",animationOptions:{queue:!1,duration:800},sortBy:"original-order",sortAscending:!0,resizesContainer:!0,transformsEnabled:!0,itemPositionDataEnabled:!1},b.Isotope.prototype={_create:function(a){this.options=b.extend({},b.Isotope.settings,a),this.styleQueue=[],this.elemCount=0;var c=this.element[0].style;this.originalStyle={};var d=v.slice(0);for(var e in this.options.containerStyle)d.push(e);for(var f=0,g=d.length;f<g;f++)e=d[f],this.originalStyle[e]=c[e]||"";this.element.css(this.options.containerStyle),this._updateAnimationEngine(),this._updateUsingTransforms();var h={"original-order":function(a,b){return b.elemCount++,b.elemCount},random:function(){return Math.random()}};this.options.getSortData=b.extend(this.options.getSortData,h),this.reloadItems(),this.offset={left:parseInt(this.element.css("padding-left")||0,10),top:parseInt(this.element.css("padding-top")||0,10)};var i=this;setTimeout(function(){i.element.addClass(i.options.containerClass)},0),this.options.resizable&&w.bind("smartresize.isotope",function(){i.resize()}),this.element.delegate("."+this.options.hiddenClass,"click",function(){return!1})},_getAtoms:function(a){var b=this.options.itemSelector,c=b?a.filter(b).add(a.find(b)):a,d={position:"absolute"};return c=c.filter(function(a,b){return b.nodeType===1}),this.usingTransforms&&(d.left=0,d.top=0),c.css(d).addClass(this.options.itemClass),this.updateSortData(c,!0),c},_init:function(a){this.$filteredAtoms=this._filter(this.$allAtoms),this._sort(),this.reLayout(a)},option:function(a){if(b.isPlainObject(a)){this.options=b.extend(!0,this.options,a);var c;for(var d in a)c="_update"+f(d),this[c]&&this[c]()}},_updateAnimationEngine:function(){var a=this.options.animationEngine.toLowerCase().replace(/[ _\-]/g,""),b;switch(a){case"css":case"none":b=!1;break;case"jquery":b=!0;break;default:b=!e.csstransitions}this.isUsingJQueryAnimation=b,this._updateUsingTransforms()},_updateTransformsEnabled:function(){this._updateUsingTransforms()},_updateUsingTransforms:function(){var a=this.usingTransforms=this.oLine truncated

app/assets/stylesheets/desktop/desktop-component.css

@@ -1,4 +1,4 @@
-.noSelect {
+.noSelect, .noSelect * {
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;
@@ -220,7 +220,7 @@
   .s_form .s_table td {
     vertical-align: middle; }
   .s_form .s_table thead th {
-    border-bottom: solid 1px #eeeeee; }
+    border-bottom: solid 1px #eee; }
 
 /* simple select */
 .s_select_g {
@@ -311,7 +311,7 @@
         width: 16px;
         height: 20px;
         background-color: #000;
-        border: solid 2px white;
+        border: solid 2px #fff;
         cursor: pointer;
         -webkit-transition: left 0.3s ease;
         -moz-transition: left 0.3s ease;
@@ -366,7 +366,7 @@
       width: 100%; }
     .tinycanvas .overview > .column {
       float: left;
-      border-right: solid 1px #eeeeee;
+      border-right: solid 1px #eee;
       padding: 0 12px 0 0;
       margin: 0 12px 0 0;
       height: 100%; }

app/assets/stylesheets/desktop/desktop-component.scss

@@ -1,6 +1,6 @@
 @import "desktop-helper";
 
-.noSelect {
+.noSelect, .noSelect * {
 	@include no-select;
 }
 

app/assets/stylesheets/desktop/desktop-main.css

@@ -223,7 +223,8 @@ a.admtxt.admbg2:hover {
   width: 100%; }
 
 .pw {
-  width: 540px; }
+  /*width: 540px;*/
+}
 
 .h1 {
   height: 120px; }
@@ -375,7 +376,8 @@ a.admtxt.admbg2:hover {
   background-color: #fff;
   margin-left: 252px;
   position: relative;
-  width: auto; }
+  width: calc(100% - 272px);
+}
 
 /* Desktop Notification */
 #orbitnote {
@@ -798,7 +800,7 @@ a.admtxt.admbg2:hover {
 /*Tooltip popup */
 .desktop_toolpopup {
   position: absolute;
-  z-index: 10px;
+  z-index: 10;
   display: none;
   padding: 12px;
   cursor: default;

app/assets/stylesheets/desktop/desktop-main.scss

@@ -824,7 +824,7 @@ a:focus { outline: none; }
 /*Tooltip popup */
 .desktop_toolpopup {
 	position: absolute;
-	z-index: 10px;
+	z-index: 10;
 	display: none;
 	padding: 12px;
 	cursor: default;

app/assets/stylesheets/desktop/desktop-media.css

@@ -1,10 +1,10 @@
 @media only screen and (min-width: 1240px){
 
-	#panel_r.pw { width: 800px; }
+	/*#panel_r.pw { width: 800px; }*/
 
 }
 @media only screen and (min-width: 1900px){
 
-	#panel_r.pw { width: 1400px; }
+	/*#panel_r.pw { width: 1400px; }*/
 
 }

app/assets/stylesheets/desktop/desktop.css

@@ -14,4 +14,5 @@
  *= require desktop/desktop-media
  *= require desktop/desktop-select2
  *= require desktop/desktop-timeline
+ *= require desktop/isotope.css
 */

app/assets/stylesheets/desktop/isotope.css

@@ -0,0 +1,72 @@
+ #side {
+    height: auto;
+    min-height: 516px;
+    right: 0;
+    bottom: 12px;
+  }
+  #rwidget {
+    height: 100%;
+  }
+  #container {
+    padding: 0;
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 12px;
+    left: 0;
+    min-height: 588px;
+  }
+  #panel_l, #panel_r {
+    height: 100%;
+  }
+  .isotope {
+    height: 100%;
+  }
+  .isotope .s_grid_row {
+    width: 420px;
+    margin: 0 24px 12px 0;
+  }
+  .s_grid_row .s_grid_h_full {
+    height: 100%;
+  }
+  .list_t_item {
+    float: left;
+    display: inline;
+  }
+  .isotope,
+.isotope .isotope-item {
+  /* change duration value to whatever you like */
+  -webkit-transition-duration: 0.8s;
+     -moz-transition-duration: 0.8s;
+      -ms-transition-duration: 0.8s;
+       -o-transition-duration: 0.8s;
+          transition-duration: 0.8s;
+}
+
+.isotope {
+  -webkit-transition-property: height, width;
+     -moz-transition-property: height, width;
+      -ms-transition-property: height, width;
+       -o-transition-property: height, width;
+          transition-property: height, width;
+}
+
+.isotope .isotope-item {
+  -webkit-transition-property: -webkit-transform, opacity;
+     -moz-transition-property:    -moz-transform, opacity;
+      -ms-transition-property:     -ms-transform, opacity;
+       -o-transition-property:      -o-transform, opacity;
+          transition-property:         transform, opacity;
+}
+
+/**** disabling Isotope CSS3 transitions ****/
+
+.isotope.no-transition,
+.isotope.no-transition .isotope-item,
+.isotope .isotope-item.no-transition {
+  -webkit-transition-duration: 0s;
+     -moz-transition-duration: 0s;
+      -ms-transition-duration: 0s;
+       -o-transition-duration: 0s;
+          transition-duration: 0s;
+}

vendor/built_in_modules/personal_book/app/helpers/panel/personal_book/desktop/personal_books_helper.rb

@@ -65,11 +65,11 @@ module Panel::PersonalBook::Desktop::PersonalBooksHelper
   def link_publication_file publication
     publication.writing_book_files.map{|file|
       link_to(image_tag(check_file_type(file.file.url)) + \
-      content_tag(:span, file.file_title_translations[I18n.locale.to_s], :class => "filetitle"),
+      content_tag(:span, file.title_translations[I18n.locale.to_s], :class => "filetitle"),
         file.file.url,
         :class => "file",
         "target" => "_blank",
-        "title" => file.file_title_translations[I18n.locale.to_s])
+        "title" => file.title_translations[I18n.locale.to_s])
     }.inject(:+)
   end
 

vendor/built_in_modules/personal_conference/app/helpers/panel/personal_conference/desktop/conference_pages_helper.rb

@@ -65,11 +65,11 @@ module Panel::PersonalConference::Desktop::ConferencePagesHelper
   def link_publication_file publication
     publication.writing_conference_files.map{|file|
       link_to(image_tag(check_file_type(file.file.url)) + \
-        content_tag(:span, file.file_title_translations[I18n.locale.to_s], :class => "filetitle"),
+        content_tag(:span, file.title_translations[I18n.locale.to_s], :class => "filetitle"),
         file.file.url,
         :class => "file",
         "target" => "_blank",
-        "title" => file.file_title_translations[I18n.locale.to_s])
+        "title" => file.title_translations[I18n.locale.to_s])
     }.inject(:+)
   end
 

vendor/built_in_modules/personal_diploma/app/helpers/panel/personal_diploma/desktop/personal_diplomas_helper.rb

@@ -65,11 +65,11 @@ module Panel::PersonalDiploma::Desktop::PersonalDiplomasHelper
   def link_publication_file publication
     publication.writing_conference_files.map{|file|
       link_to(image_tag(check_file_type(file.file.url)) + \
-        content_tag(:span, file.file_title_translations[I18n.locale.to_s], :class => "filetitle"),
+        content_tag(:span, file.title_translations[I18n.locale.to_s], :class => "filetitle"),
         file.file.url,
         :class => "file",
         "target" => "_blank",
-        "title" => file.file_title_translations[I18n.locale.to_s])
+        "title" => file.title_translations[I18n.locale.to_s])
     }.inject(:+)
   end
 

vendor/built_in_modules/personal_experience/app/helpers/panel/personal_experience/desktop/personal_experiences_helper.rb

@@ -65,11 +65,11 @@ module Panel::PersonalExperience::Desktop::PersonalExperiencesHelper
   def link_publication_file publication
     publication.writing_conference_files.map{|file|
       link_to(image_tag(check_file_type(file.file.url)) + \
-        content_tag(:span, file.file_title_translations[I18n.locale.to_s], :class => "filetitle"),
+        content_tag(:span, file.title_translations[I18n.locale.to_s], :class => "filetitle"),
         file.file.url,
         :class => "file",
         "target" => "_blank",
-        "title" => file.file_title_translations[I18n.locale.to_s])
+        "title" => file.title_translations[I18n.locale.to_s])
     }.inject(:+)
   end
 

vendor/built_in_modules/personal_honor/app/helpers/panel/personal_honor/desktop/personal_honors_helper.rb

@@ -58,11 +58,11 @@ module Panel::PersonalHonor::Desktop::PersonalHonorsHelper
   def link_publication_file publication
     publication.writing_book_files.map{|file|
       link_to(image_tag(check_file_type(file.file.url)) + \
-        content_tag(:span, file.file_title_translations[I18n.locale.to_s], :class => "filetitle"),
+        content_tag(:span, file.title_translations[I18n.locale.to_s], :class => "filetitle"),
         file.file.url,
         :class => "file",
         "target" => "_blank",
-        "title" => file.file_title_translations[I18n.locale.to_s])
+        "title" => file.title_translations[I18n.locale.to_s])
     }.inject(:+)
   end
 

vendor/built_in_modules/personal_journal/app/helpers/panel/personal_journal/desktop/journal_pages_helper.rb

@@ -9,6 +9,22 @@ module Panel::PersonalJournal::Desktop::JournalPagesHelper
       end
   end
 
+  def get_height view
+    case view
+    when "journal_title"
+     height = "50px"
+    when "keywords"
+     height = "100px"
+    when "abstract"
+     height = "200px"
+    when "file"
+      height = "200px"
+    else
+      height = "50px"
+    end
+    height
+  end
+
   def marker
     content_tag :div,
      :class => "list_item_action" do
@@ -66,11 +82,11 @@ module Panel::PersonalJournal::Desktop::JournalPagesHelper
   def link_publication_file publication
     publication.writing_journal_files.map{|file|
       link_to(image_tag(check_file_type(file.file.url)) + \
-        content_tag(:span, file.file_title_translations[I18n.locale.to_s], :class => "filetitle"),
+        content_tag(:span, file.title_translations[I18n.locale.to_s], :class => "filetitle"),
         file.file.url,
         :class => "file",
         "target" => "_blank",
-        "title" => file.file_title_translations[I18n.locale.to_s])
+        "title" => file.title_translations[I18n.locale.to_s])
     }.inject(:+)
   end
 

vendor/built_in_modules/personal_journal/app/views/panel/personal_journal/desktop/journal_pages/_form.html.erb

@@ -30,10 +30,8 @@
     </div>
   </div>
   <div class="viewport"> -->
-    <div class="overview" content-layout="column" base-width="420">
-      <div column="true">
-        <div class="s_form">
-          <ul>
+    <div class="overview" content-layout="simple" base-width="420">
+          <ul class="s_form" isotope="true">
             <% @site_valid_locales.each_with_index do |locale, i| %>
               <% style = locale != I18n.locale.to_s ? 'style=display:none;' : "" %>
               <% data = "data-language=" + locale  %>
@@ -94,12 +92,7 @@
             <label class="s_grid_1 s_grid" for="">共</label>
             <%= f.text_field :total_pages, size: "20", class: "s_grid_2 s_grid"%>
             </li>
-          </ul>
-        </div>
-      </div>
-      <div column="true">
-        <div class="s_form">
-          <ul>
+      
             <li class="s_grid_row">
             <%= f.text_area :author_tokens,
               class: "s_grid_12 s_grid",
@@ -173,12 +166,7 @@
     <li class="s_grid_row">
     <%= label_tag("", t("personal_journal.url"), class: "s_grid_4 s_grid") %><%= f.text_field :url, size: "20", class: "s_grid_8 s_grid"%>
     </li>
-          </ul>
-        </div>
-      </div>
-    <div column="true">
-      <div class="s_form">
-        <ul>
+        
           <li class="s_grid_row">
           <table class="s_table">
             <thead>
@@ -208,23 +196,13 @@
             </tbody>
           </table>
           </li>
-        </ul>
-      </div>
-    </div>
-      <div column="true">
-        <div class="s_form">
-          <ul>
+  
             <li class="s_grid_row">
-            <%= f.text_area :note, size: "20x22", placeholder: t("personal_journal.note"), class: "s_grid_12 s_grid s_grid_h_10"%>
+            <%= f.text_area :note, size: "20x22", placeholder: t("personal_journal.note"), class: "s_grid_12 s_grid s_grid_h_10 s_grid_h_full"%>
             </li>
-          </ul>
-        </div>
-      </div>
-      <div column="true">
-        <div class="s_form">
-          <ul>
+      
             <li class="s_grid_row">
-            <%= f.text_area :abstract, size: "20x22", placeholder: t("personal_journal.abstract"), class: "s_grid_12 s_grid s_grid_h_10"%>
+            <%= f.text_area :abstract, size: "20x22", placeholder: t("personal_journal.abstract"), class: "s_grid_12 s_grid s_grid_h_10 s_grid_h_full"%>
             </li>
           </ul>
         </div>

vendor/built_in_modules/personal_journal/app/views/panel/personal_journal/desktop/journal_pages/index.html.erb

@@ -77,8 +77,10 @@
     <div class="sdm_t hh1"><span class="icon-question-sign"></span></div>
   </div>
 </div>
-    <div class="overview" page-name="journal_p_list" content-layout="datalist" base-width="300" per-column="<%= @per_column.to_s %>" pagination-var="view=<%= @view_by %>&page" >
+    <div class="overview" page-name="journal_p_list" content-layout="simple" base-width="300" per-column="<%= @per_column.to_s %>" pagination-var="view=<%= @view_by %>&page" >
+      <ul isotope="true">
       <% @writing_journals.each do |w| %>
         <%= publication_record w, @view_by%>
       <% end %>
+    </ul>
     </div>

vendor/built_in_modules/personal_lab/app/helpers/panel/personal_lab/desktop/personal_labs_helper.rb

@@ -65,11 +65,11 @@ module Panel::PersonalLab::Desktop::PersonalLabsHelper
   def link_publication_file publication
     publication.lab_files.map{|file|
       link_to(image_tag(check_file_type(file.file.url)) + \
-        content_tag(:span, file.file_title_translations[I18n.locale.to_s], :class => "filetitle"),
+        content_tag(:span, file.title_translations[I18n.locale.to_s], :class => "filetitle"),
         file.file.url,
         :class => "file",
         "target" => "_blank",
-        "title" => file.file_title_translations[I18n.locale.to_s])
+        "title" => file.title_translations[I18n.locale.to_s])
     }.inject(:+)
   end
 

vendor/built_in_modules/personal_patent/app/helpers/panel/personal_patent/desktop/personal_patents_helper.rb

@@ -65,11 +65,11 @@ module Panel::PersonalPatent::Desktop::PersonalPatentsHelper
   def link_publication_file publication
     publication.writing_patent_files.map{|file|
       link_to(image_tag(check_file_type(file.file.url)) + \
-        content_tag(:span, file.file_title_translations[I18n.locale.to_s], :class => "filetitle"),
+        content_tag(:span, file.title_translations[I18n.locale.to_s], :class => "filetitle"),
         file.file.url,
         :class => "file",
         "target" => "_blank",
-        "title" => file.file_title_translations[I18n.locale.to_s])
+        "title" => file.title_translations[I18n.locale.to_s])
     }.inject(:+)
   end
 

vendor/built_in_modules/personal_project/app/helpers/panel/personal_project/desktop/personal_projects_helper.rb

@@ -65,11 +65,11 @@ module Panel::PersonalProject::Desktop::PersonalProjectsHelper
   def link_publication_file publication
     publication.project_files.map{|file|
       link_to(image_tag(check_file_type(file.file.url)) + \
-        content_tag(:span, file.file_title_translations[I18n.locale.to_s], :class => "filetitle"),
+        content_tag(:span, file.title_translations[I18n.locale.to_s], :class => "filetitle"),
         file.file.url,
         :class => "file",
         "target" => "_blank",
-        "title" => file.file_title_translations[I18n.locale.to_s])
+        "title" => file.title_translations[I18n.locale.to_s])
     }.inject(:+)
   end
 

vendor/built_in_modules/personal_research/app/helpers/panel/personal_research/desktop/personal_researchs_helper.rb

@@ -65,11 +65,11 @@ module Panel::PersonalResearch::Desktop::PersonalResearchsHelper
   def link_publication_file publication
     publication.research_files.map{|file|
       link_to(image_tag(check_file_type(file.file.url)) + \
-       content_tag(:span, file.file_title_translations[I18n.locale.to_s], :class => "filetitle"),
+       content_tag(:span, file.title_translations[I18n.locale.to_s], :class => "filetitle"),
         file.file.url,
         :class => "file",
         "target" => "_blank",
-        "title" => file.file_title_translations[I18n.locale.to_s])
+        "title" => file.title_translations[I18n.locale.to_s])
     }.inject(:+)
   end