Just In Time folder structure loading

"Chunked" mode speed optimization. (#15) This loads the side folder structures as needed, and not all at once on application load
adobe · Jul 25, 2017 · 77e7567 · 77e7567
1 parent b587d24
commit 77e7567
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 23 deletions.
diff --git a/app/elements/folder-structure.html b/app/elements/folder-structure.html
@@ -66,36 +66,42 @@
  }
  </style>
  <template>
- <paper-menu attr-for-selected="data-route" selected="{{route}}" class="menu-content">
- <a data-route="create{{indent}}" href="{{baseUrl}}create" class="noselect" create-location="{{createLocation}}" style="padding-left: {{indent}}px" on-tap="_setLocation">
- <iron-icon class="iconsize" icon="add"></iron-icon>
- <span style="white-space: nowrap;">New</span>
- </a>
- <template is="dom-repeat" items="{{secrets}}" filter="_filterFolders" sort="_sort">
- <paper-submenu attr-for-selected="data-route" selected="{{route}}">
- <a data-route="{{item.type}}/{{item.location}}" href="{{baseUrl}}folder/{{item.location}}" class="noselect menu-trigger" style="padding-left: {{indent}}px">
- <iron-icon class="iconsize" icon="folder-open"></iron-icon>
- <span style="white-space: nowrap;">{{item.parsedname}}</span>
- </a>
- <paper-menu class="menu-content">
- <folder-structure secrets="[[secrets]]" route="{{route}}" base-url="{{baseUrl}}" base-folder="{{item.location}}" indent="{{spacing}}" create-location="{{createLocation}}"></folder-structure>
- </paper-menu>
- </paper-submenu>
- </template>
- <template is="dom-repeat" items="{{secrets}}" filter="_filterSecrets" sort="_sort">
- <a data-route="{{item.type}}/{{item.location}}" href="{{baseUrl}}secret/{{item.location}}" class="noselect" style="padding-left: {{indent}}px">
- <iron-icon class="iconsize" icon="communication:vpn-key"></iron-icon>
- <span style="white-space: nowrap;">{{item.parsedname}}</span>
+ <template is="dom-if" if="{{print}}">
+ <paper-menu attr-for-selected="data-route" selected="{{route}}" class="menu-content">
+ <a data-route="create{{indent}}" href="{{baseUrl}}create" class="noselect" create-location="{{createLocation}}" style="padding-left: {{indent}}px" on-tap="_setLocation">
+ <iron-icon class="iconsize" icon="add"></iron-icon>
+ <span style="white-space: nowrap;">New</span>
  </a>
- </template>
- </paper-menu>
+ <template is="dom-repeat" items="{{secrets}}" filter="_filterFolders" sort="_sort">
+ <paper-submenu attr-for-selected="data-route" selected="{{route}}">
+ <a data-route="{{item.type}}/{{item.location}}" href="{{baseUrl}}folder/{{item.location}}" class="noselect menu-trigger" style="padding-left: {{indent}}px">
+ <iron-icon class="iconsize" icon="folder-open"></iron-icon>
+ <span style="white-space: nowrap;">{{item.parsedname}}</span>
+ </a>
+ <paper-menu class="menu-content">
+ <folder-structure secrets="[[secrets]]" route="{{route}}" folder-route="{{folderRoute}}" base-url="{{baseUrl}}" base-folder="{{item.location}}" indent="{{spacing}}" create-location="{{createLocation}}"></folder-structure>
+ </paper-menu>
+ </paper-submenu>
+ </template>
+ <template is="dom-repeat" items="{{secrets}}" filter="_filterSecrets" sort="_sort">
+ <a data-route="{{item.type}}/{{item.location}}" href="{{baseUrl}}secret/{{item.location}}" class="noselect" style="padding-left: {{indent}}px">
+ <iron-icon class="iconsize" icon="communication:vpn-key"></iron-icon>
+ <span style="white-space: nowrap;">{{item.parsedname}}</span>
+ </a>
+ </template>
+ </paper-menu>
+ </template>
  </template>
 
  <script>
  Polymer({
  is: "folder-structure",
  properties: {
  route: String,
+ folderRoute: {
+ type: String,
+ observer: '_watchFolderRoute'
+ },
  baseURL: String,
  secrets: Array,
  baseFolder: String,
@@ -108,8 +114,16 @@
  createLocation: {
  value: '',
  notify: true
+ },
+ print: {
+ type: Boolean,
+ value: false,
+ notify: true
  }
  },
+ _watchFolderRoute: function(){
+ if (this.baseFolder == this.folderRoute) this.print = true;
+ },
  _watchIndent: function(){
  this.spacing = this.indent + 20;
  },

diff --git a/app/index.html b/app/index.html
@@ -64,7 +64,7 @@
  </paper-menu>
 
  <span id="drawerMenuText" class="noselect">SECRETS</span>
- <folder-structure secrets="[[secrets]]" route="{{route}}" base-url="{{baseUrl}}" base-folder="secret" indent="20" create-location="{{createLocation}}"></folder-structure>
+ <folder-structure secrets="[[secrets]]" route="{{route}}" folder-route="{{folderRoute}}" base-url="{{baseUrl}}" base-folder="secret" indent="20" create-location="{{createLocation}}" print></folder-structure>
  </div>
 
  <div class="bottom-corner" style="color: #737373;">