More responsive interface with auto resize (#10)

2026-08-30 12:39:20 +03:00 · 2013-12-30 01:13:35 +04:00 · 2013-12-30 01:13:35 +04:00 · 17b2afcf22
commit 17b2afcf22
parent acf80b96a3
32 changed files with 1093 additions and 296 deletions
--- a/rainloop/v/0.0.0/app/templates/Index.html
+++ b/rainloop/v/0.0.0/app/templates/Index.html
@ -64,12 +64,8 @@
 			<div id="rl-popups"></div>
 			<div id="rl-center">
 				<div id="rl-top"></div>
-				<div id="rl-top-resizer-left">
-					<div id="rl-left"></div>
-				</div>
-				<div id="rl-top-resizer-right">
-					<div id="rl-right"></div>
-				</div>
+				<div id="rl-left"></div>
+				<div id="rl-right"></div>
 				<div id="rl-bottom"></div>
 			</div>
 		</div>
--- a/rainloop/v/0.0.0/app/templates/Views/MailMessageList.html
+++ b/rainloop/v/0.0.0/app/templates/Views/MailMessageList.html
@ -1,4 +1,4 @@
-<div id="rl-resizer-left">
+<div id="rl-sub-left">
 	<div class="messageList g-ui-user-select-none" data-bind="css: {'message-selected': isMessageSelected, 'loading': messageListCompleteLoadingThrottle, 'hideMessageListCheckbox': !useCheckboxesInList() }">
 		<div class="toolbar">
 			<div class="btn-toolbar">
--- a/rainloop/v/0.0.0/app/templates/Views/MailMessageView.html
+++ b/rainloop/v/0.0.0/app/templates/Views/MailMessageView.html
@ -1,4 +1,4 @@
-<div id="rl-resizer-right">
+<div id="rl-sub-right">
 	<div class="messageView" data-bind="css: {'message-selected': isMessageSelected}">
 		<div class="toolbar g-ui-user-select-none">
 			<div class="messageButtons btn-toolbar">
--- a/rainloop/v/0.0.0/app/templates/Views/SettingsContacts.html
+++ b/rainloop/v/0.0.0/app/templates/Views/SettingsContacts.html
@ -49,7 +49,7 @@
 		</div>
 		<div class="control-group">
 			<div class="controls">
-				<div class="alert alert-info span8" style="margin-left: 0">
+				<div class="alert alert-info span6" style="margin-left: 0">
 					<p>
 						<span class="i18n" data-i18n-text="SETTINGS_CONTACTS/DESC_FULL_PAB_URL"></span>
 					</p>
--- a/rainloop/v/0.0.0/static/css/app.css
+++ b/rainloop/v/0.0.0/static/css/app.css
@ -5928,6 +5928,14 @@ select:focus {
 html.mobile * {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
+#rl-bg {
+  z-index: -1;
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+}
 #rl-content {
  height: 100%;
  width: 100%;
@ -5942,7 +5950,7 @@ html.mobile * {
  margin: 0;
  border: 0;
  z-index: 0;
-  min-width: 900px;
+  min-width: 700px;
  min-height: 400px;
 }
 #rl-top {
@ -5982,7 +5990,7 @@ html.mobile * {
  border: 0;
  z-index: 0;
  right: auto;
-  width: 100%;
+  width: 200px;
 }
 #rl-right {
  position: absolute;
@ -5995,62 +6003,102 @@ html.mobile * {
  border: 0;
  z-index: 0;
  z-index: 1;
+  left: 200px;
 }
-#rl-resizer-right {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  right: 0;
-  left: 35%;
-}
-#rl-resizer-left {
+#rl-sub-left {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
-  right: 65%;
-  min-width: 350px;
-}
-#rl-top-resizer-right {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  right: 0;
-  left: 230px;
-}
-#rl-top-resizer-left {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: auto;
-  min-width: 120px;
-}
-#rl-bg {
-  z-index: -1;
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 0;
-  bottom: 0;
-}
-html.mobile #rl-top-resizer-left {
-  width: 170px;
-}
-html.mobile #rl-top-resizer-right {
-  left: 170px;
-}
-html.mobile #rl-resizer-left {
  width: 350px;
 }
-html.mobile #rl-resizer-right {
+#rl-sub-right {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  right: 0;
  left: 350px;
 }
-html.rl-no-preview-pane #rl-resizer-left {
+html.ssm-state-desktop-large #rl-left {
+  width: 220px;
+}
+html.ssm-state-desktop-large #rl-right {
+  left: 220px;
+}
+html.ssm-state-desktop-large #rl-sub-left {
+  width: 500px;
+}
+html.ssm-state-desktop-large #rl-sub-right {
+  left: 500px;
+}
+html.ssm-state-desktop-large .b-compose.modal {
+  width: 1000px;
+}
+html.ssm-state-desktop-large .b-contacts-content.modal {
+  width: 1000px;
+}
+html.ssm-state-desktop #rl-left {
+  width: 200px;
+}
+html.ssm-state-desktop #rl-right {
+  left: 200px;
+}
+html.ssm-state-desktop #rl-sub-left {
+  width: 350px;
+}
+html.ssm-state-desktop #rl-sub-right {
+  left: 350px;
+}
+html.ssm-state-tablet #rl-left {
+  width: 150px;
+}
+html.ssm-state-tablet #rl-right {
+  left: 150px;
+}
+html.ssm-state-tablet #rl-sub-left {
+  width: 320px;
+}
+html.ssm-state-tablet #rl-sub-left .messageList .inputSearch {
+  width: 230px;
+}
+html.ssm-state-tablet #rl-sub-right {
+  left: 320px;
+}
+html.ssm-state-tablet .b-compose.modal {
+  width: 700px;
+}
+html.ssm-state-tablet .b-contacts-content.modal {
+  width: 700px;
+}
+html.ssm-state-mobile #rl-left {
+  width: 120px;
+}
+html.ssm-state-mobile #rl-right {
+  left: 120px;
+}
+html.ssm-state-mobile #rl-sub-left {
+  width: 280px;
+}
+html.ssm-state-mobile #rl-sub-left .messageList .inputSearch {
+  width: 200px;
+}
+html.ssm-state-mobile #rl-sub-right {
+  left: 280px;
+}
+html.ssm-state-mobile .b-compose.modal {
+  width: 600px;
+}
+html.ssm-state-mobile .b-contacts-content.modal {
+  width: 600px;
+}
+html.rl-no-preview-pane #rl-sub-left {
  right: 5px !important;
  width: inherit;
 }
-html.rl-no-preview-pane #rl-resizer-right {
+html.rl-no-preview-pane #rl-sub-left .messageList .inputSearch {
+  width: 300px !important;
+}
+html.rl-no-preview-pane #rl-sub-right {
  left: 0 !important;
 }
 html.rl-no-preview-pane #rl-right .ui-resizable-handle {
@ -6130,12 +6178,13 @@ html.rl-no-preview-pane #rl-right .ui-resizable-handle {
 .rl-view-model.RL-Login,
 .rl-view-model.RL-LoginNew,
 .rl-view-model.RL-AdminLogin {
+  position: relative;
  height: 100%;
+  z-index: 5;
 }
 .b-login-content {
  height: 100%;
  text-align: center;
-  margin-left: -230px;
 }
 .b-login-content .loginFormWrapper {
  display: inline-block;
@ -6405,7 +6454,6 @@ html.rl-no-preview-pane .messageList.message-selected {
  left: 0;
  height: 30px;
  padding: 10px 1px;
-  min-width: 280px;
  z-index: 102;
 }
 .messageList .b-footer {
@ -6415,7 +6463,6 @@ html.rl-no-preview-pane .messageList.message-selected {
  left: 0;
  height: 30px;
  padding: 7px;
-  min-width: 300px;
  z-index: 101;
  background-color: #eee;
  -webkit-border-bottom-right-radius: 5px;
@ -6464,7 +6511,6 @@ html.rl-no-preview-pane .messageList.message-selected {
  left: 0;
  height: 29px;
  padding: 10px 8px 10px 11px;
-  min-width: 280px;
  z-index: 101;
  background-color: #eee;
  -webkit-border-top-right-radius: 5px;
@ -6501,7 +6547,6 @@ html.rl-no-preview-pane .messageList.message-selected {
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 101;
-  min-width: 300px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
@ -7221,21 +7266,21 @@ html.rl-message-fullscreen .messageView .b-content .buttonFull {
  padding: 0;
  height: 45px;
  text-align: center;
-  width: 270px;
+  width: 250px;
  -webkit-box-shadow: inset 0 -1px 0 #cccccc;
  -moz-box-shadow: inset 0 -1px 0 #cccccc;
  box-shadow: inset 0 -1px 0 #cccccc;
 }
 .b-contacts-content.modal .b-list-toopbar .e-search {
  margin-top: 7px;
-  width: 245px;
+  width: 225px;
 }
 .b-contacts-content.modal .b-list-footer-toopbar {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 105px;
-  width: 270px;
+  width: 250px;
  background-color: #eee;
  -webkit-box-shadow: inset 0 1px 0 #cccccc;
  -moz-box-shadow: inset 0 1px 0 #cccccc;
@ -7249,7 +7294,7 @@ html.rl-message-fullscreen .messageView .b-content .buttonFull {
  top: 45px;
  bottom: 105px;
  left: 0;
-  width: 270px;
+  width: 250px;
  overflow: hidden;
  overflow-y: auto;
 }
@ -7372,7 +7417,7 @@ html.rl-message-fullscreen .messageView .b-content .buttonFull {
  position: absolute;
  top: 0;
  bottom: 60px;
-  left: 270px;
+  left: 250px;
  right: 0;
  overflow: hidden;
  overflow-y: auto;
@ -8307,6 +8352,31 @@ html.rl-started-trigger.no-mobile #rl-content {
  -o-transition: opacity 0.5s linear;
  transition: opacity 0.5s linear;
 }
+.rl-anim.csstransitions.no-mobile #rl-left {
+  -webkit-transition: width 0.3s ease-out;
+  -moz-transition: width 0.3s ease-out;
+  -o-transition: width 0.3s ease-out;
+  transition: width 0.3s ease-out;
+}
+.rl-anim.csstransitions.no-mobile #rl-right {
+  -webkit-transition: left 0.3s ease-out;
+  -moz-transition: left 0.3s ease-out;
+  -o-transition: left 0.3s ease-out;
+  transition: left 0.3s ease-out;
+}
+.rl-anim.csstransitions.no-mobile #rl-sub-left,
+.rl-anim.csstransitions.no-mobile #rl-sub-left .messageList .inputSearch {
+  -webkit-transition: width 0.3s ease-out;
+  -moz-transition: width 0.3s ease-out;
+  -o-transition: width 0.3s ease-out;
+  transition: width 0.3s ease-out;
+}
+.rl-anim.csstransitions.no-mobile #rl-sub-right {
+  -webkit-transition: left 0.3s ease-out;
+  -moz-transition: left 0.3s ease-out;
+  -o-transition: left 0.3s ease-out;
+  transition: left 0.3s ease-out;
+}
 .rl-anim.csstransitions.no-mobile #rl-content {
  -webkit-transition: opacity 0.3s ease-out;
  -moz-transition: opacity 0.3s ease-out;
--- a/rainloop/v/0.0.0/static/css/app.min.css
+++ b/rainloop/v/0.0.0/static/css/app.min.css
--- a/rainloop/v/0.0.0/static/js/admin.js
+++ b/rainloop/v/0.0.0/static/js/admin.js
@ -5050,7 +5050,7 @@ PopupsAskViewModel.prototype.onBuild = function ()
 */
 function AdminLoginViewModel()
 {
-	KnoinAbstractViewModel.call(this, 'Right', 'AdminLogin');
+	KnoinAbstractViewModel.call(this, 'Center', 'AdminLogin');

 	this.login = ko.observable('');
 	this.password = ko.observable('');
@ -7274,6 +7274,56 @@ AbstractApp.prototype.bootstart = function ()
 	_.delay(function () {
 		Utils.windowResize();
 	}, 1000);
+
+	ssm.addState({
+		id: 'mobile',
+		maxWidth: 767,
+		onEnter: function(){
+			$html.addClass('ssm-state-mobile');
+		},
+		onLeave: function(){
+			$html.removeClass('ssm-state-mobile');
+		}
+	});
+
+	ssm.addState({
+		id: 'tablet',
+		minWidth: 768,
+		maxWidth: 1023,
+		onEnter: function(){
+			$html.addClass('ssm-state-tablet');
+		},
+		onLeave: function(){
+			$html.removeClass('ssm-state-tablet');
+		}
+	});
+
+	ssm.addState({
+		id: 'desktop',
+		minWidth: 1000,
+		maxWidth: 1366,
+		onEnter: function(){
+			$html.addClass('ssm-state-desktop');
+		},
+		onLeave: function(){
+			$html.removeClass('ssm-state-desktop');
+		}
+	});
+	
+	ssm.addState({
+		id: 'desktop-large',
+		minWidth: 1367,
+		onEnter: function(){
+			$html.addClass('ssm-state-desktop-large');
+		},
+		onLeave: function(){
+			$html.removeClass('ssm-state-desktop-large');
+		}
+	});
+
+	_.delay(function () {
+		ssm.ready();
+	}, 500);
 };

 /**
@ -7498,13 +7548,13 @@ AdminApp.prototype.bootstart = function ()

 			kn.startScreens([AdminSettingsScreen]);

-			if (!Globals.bMobileDevice)
-			{
-				_.defer(function () {
-					Utils.initLayoutResizer('#rl-top-resizer-left', '#rl-top-resizer-right', '#rl-center',
-						120, 300, 200, 600, Enums.ClientSideKeyName.FolderListSize);
-				});
-			}
+//			if (!Globals.bMobileDevice)
+//			{
+//				_.defer(function () {
+//					Utils.initLayoutResizer('#rl-top-resizer-left', '#rl-top-resizer-right', '#rl-center',
+//						120, 300, 200, 600, Enums.ClientSideKeyName.FolderListSize);
+//				});
+//			}
 		}
 		else
 		{
--- a/rainloop/v/0.0.0/static/js/admin.min.js
+++ b/rainloop/v/0.0.0/static/js/admin.min.js
--- a/rainloop/v/0.0.0/static/js/app.js
+++ b/rainloop/v/0.0.0/static/js/app.js
@ -10572,7 +10572,7 @@ PopupsAskViewModel.prototype.onBuild = function ()
 */
 function LoginViewModel()
 {
-	KnoinAbstractViewModel.call(this, 'Right', 'Login');
+	KnoinAbstractViewModel.call(this, 'Center', 'Login');

 	var oData = RL.data();

@ -15929,16 +15929,16 @@ MailBoxScreen.prototype.onStart = function ()
 	}, this);
 };

-MailBoxScreen.prototype.onBuild = function ()
-{
-	if (!Globals.bMobileDevice)
-	{
-		_.defer(function () {
-			Utils.initLayoutResizer('#rl-resizer-left', '#rl-resizer-right', '#rl-right',
-				350, 800, 350, 350, Enums.ClientSideKeyName.MailBoxListSize);
-		});
-	}
-};
+//MailBoxScreen.prototype.onBuild = function ()
+//{
+//	if (!Globals.bMobileDevice)
+//	{
+//		_.defer(function () {
+//			Utils.initLayoutResizer('#rl-resizer-left', '#rl-resizer-right', '#rl-right',
+//				350, 800, 350, 350, Enums.ClientSideKeyName.MailBoxListSize);
+//		});
+//	}
+//};

 /**
 * @return {Array}
@ -16269,6 +16269,56 @@ AbstractApp.prototype.bootstart = function ()
 	_.delay(function () {
 		Utils.windowResize();
 	}, 1000);
+
+	ssm.addState({
+		id: 'mobile',
+		maxWidth: 767,
+		onEnter: function(){
+			$html.addClass('ssm-state-mobile');
+		},
+		onLeave: function(){
+			$html.removeClass('ssm-state-mobile');
+		}
+	});
+
+	ssm.addState({
+		id: 'tablet',
+		minWidth: 768,
+		maxWidth: 1023,
+		onEnter: function(){
+			$html.addClass('ssm-state-tablet');
+		},
+		onLeave: function(){
+			$html.removeClass('ssm-state-tablet');
+		}
+	});
+
+	ssm.addState({
+		id: 'desktop',
+		minWidth: 1000,
+		maxWidth: 1366,
+		onEnter: function(){
+			$html.addClass('ssm-state-desktop');
+		},
+		onLeave: function(){
+			$html.removeClass('ssm-state-desktop');
+		}
+	});
+	
+	ssm.addState({
+		id: 'desktop-large',
+		minWidth: 1367,
+		onEnter: function(){
+			$html.addClass('ssm-state-desktop-large');
+		},
+		onLeave: function(){
+			$html.removeClass('ssm-state-desktop-large');
+		}
+	});
+
+	_.delay(function () {
+		ssm.ready();
+	}, 500);
 };

 /**
@ -17119,13 +17169,13 @@ RainLoopApp.prototype.bootstart = function ()
 				window.SimplePace.set(100);
 			}

-			if (!Globals.bMobileDevice)
-			{
-				_.defer(function () {
-					Utils.initLayoutResizer('#rl-top-resizer-left', '#rl-top-resizer-right', '#rl-center',
-						120, 300, 200, 600, Enums.ClientSideKeyName.FolderListSize);
-				});
-			}
+//			if (!Globals.bMobileDevice)
+//			{
+//				_.defer(function () {
+//					Utils.initLayoutResizer('#rl-top-resizer-left', '#rl-top-resizer-right', '#rl-center',
+//						120, 300, 200, 600, Enums.ClientSideKeyName.FolderListSize);
+//				});
+//			}
 			
 		}, this));
 	}
--- a/rainloop/v/0.0.0/static/js/app.min.js
+++ b/rainloop/v/0.0.0/static/js/app.min.js
--- a/rainloop/v/0.0.0/static/js/libs.js
+++ b/rainloop/v/0.0.0/static/js/libs.js
@ -198,6 +198,9 @@ See the Apache Version 2.0 License for specific language governing permissions a
 */
 !function(a){"use strict";function b(a,b,c,d,e,f,g){this.inputItem=b,this.stateArrayIndex=c,this.mapping=e,this.arrayOfState=f,this.outputObservableArray=g,this.outputArray=this.outputObservableArray.peek(),this.isIncluded=null,this.suppressNotification=!1,this.outputArrayIndex=a.observable(d),this.mappedValueComputed=a.computed(this.mappingEvaluator,this),this.mappedValueComputed.subscribe(this.onMappingResultChanged,this),this.previousMappedValue=this.mappedValueComputed.peek()}function c(a,b){if(!a)return null;switch(a.status){case"added":return a.index;case"deleted":return a.index+b;default:throw new Error("Unknown diff status: "+a.status)}}function d(a,c,d,e,f,g,h,i,j){var k="number"==typeof c.moved,l=k?d[c.moved]:new b(a,c.value,e,f,g,h,i);return h.splice(e,0,l),l.isIncluded&&j.splice(f,0,l.mappedValueComputed.peek()),k&&(l.stateArrayIndex=e,l.setOutputArrayIndexSilently(f)),l}function e(a,b,c,d,e){var f=b.splice(c,1)[0];f.isIncluded&&e.splice(d,1),"number"!=typeof a.moved&&f.dispose()}function f(a,b,c){return a.stateArrayIndex=b,a.setOutputArrayIndexSilently(c),c+(a.isIncluded?1:0)}function g(a,b){for(var c={},d=0;d<a.length;d++){var e=a[d];"added"===e.status&&"number"==typeof e.moved&&(c[e.moved]=b[e.moved])}return c}function h(a,b,c){return c.length&&b[a.index]?b[a.index].outputArrayIndex.peek():c.length}function i(a,b,i,j,k,l){return b.subscribe(function(b){if(b.length){for(var m=g(b,i),n=0,o=b[0],p=0,q=o&&h(o,i,j),r=o.index;o||r<i.length;r++)if(c(o,p)===r){switch(o.status){case"added":var s=d(a,o,m,r,q,l,i,k,j);s.isIncluded&&q++,p++;break;case"deleted":e(o,i,r,q,j),p--,r--;break;default:throw new Error("Unknown diff status: "+o.status)}n++,o=b[n]}else r<i.length&&(q=f(i[r],r,q));k.valueHasMutated()}},null,"arrayChange")}function j(a,c){for(var d=this,e=[],f=[],g=a.observableArray(f),h=d.peek(),j=0;j<h.length;j++){var k=h[j],l=new b(a,k,j,f.length,c,e,g),n=l.mappedValueComputed.peek();e.push(l),l.isIncluded&&f.push(n)}var o=i(a,d,e,f,g,c),p=a.computed(g).extend({trackArrayChanges:!0}),q=p.dispose;return p.dispose=function(){o.dispose(),a.utils.arrayForEach(e,function(a){a.dispose()}),q.call(this,arguments)},m(a,p),p}function k(a,b){return j.call(this,a,function(a){return b(a)?a:p})}function l(a){function b(a,b){return function(){return b.apply(this,[a].concat(Array.prototype.slice.call(arguments,0)))}}a[q]={map:b(a,j),filter:b(a,k)}}function m(a,b){return a.utils.extend(b,a[q]),b}function n(a){a.projections={_exclusionMarker:p},l(a),m(a,a.observableArray.fn)}function o(){if("undefined"!=typeof module){var b=require("knockout");n(b),module.exports=b}else"ko"in a&&n(a.ko)}var p={};b.prototype.dispose=function(){this.mappedValueComputed.dispose()},b.prototype.mappingEvaluator=function(){var a=this.mapping(this.inputItem,this.outputArrayIndex),b=a!==p;return this.isIncluded!==b&&(null!==this.isIncluded&&this.moveSubsequentItemsBecauseInclusionStateChanged(b),this.isIncluded=b),a},b.prototype.onMappingResultChanged=function(a){a!==this.previousMappedValue&&(this.isIncluded&&this.outputArray.splice(this.outputArrayIndex.peek(),1,a),this.suppressNotification||this.outputObservableArray.valueHasMutated(),this.previousMappedValue=a)},b.prototype.moveSubsequentItemsBecauseInclusionStateChanged=function(a){var b,c,d=this.outputArrayIndex.peek();if(a)for(this.outputArray.splice(d,0,null),b=this.stateArrayIndex+1;b<this.arrayOfState.length;b++)c=this.arrayOfState[b],c.setOutputArrayIndexSilently(c.outputArrayIndex.peek()+1);else for(this.outputArray.splice(d,1),b=this.stateArrayIndex+1;b<this.arrayOfState.length;b++)c=this.arrayOfState[b],c.setOutputArrayIndexSilently(c.outputArrayIndex.peek()-1)},b.prototype.setOutputArrayIndexSilently=function(a){this.suppressNotification=!0,this.outputArrayIndex(a),this.suppressNotification=!1};var q="_ko.projections.cache";o()}(this);

+/*! SimpleStateManager | license: MIT | version: 2.1.0 | build date: 2013-12-23 */
+!function(a,b){"use strict";var c={},d=[],e=0,f=[],g=10,h=null,i=[],j=function(){clearTimeout(h),h=setTimeout(k,g)},k=function(){e=n(),l(e)},l=function(a){for(var b=d.length,e=i.length,g=[],h=[],j=[],k=!0,l=c,m=0;b>m;m++){k=!0,l.state=d[m],l.browserWidth=a;for(var n=0;e>n;n++)if(l.callback=i[n].test,l.callback()===!1){k=!1;break}k?r(f,d[m])?h.push(d[m].onResize):(f.push(d[m]),j.push(d[m].onEnter)):r(f,d[m])&&(g.push(d[m].onLeave),f=s(f,d[m]))}t(g),t(j),t(h)};c.browserResize=l,c.getBrowserWidth=function(){return e},c.addState=function(a){var b={id:m(),minWidth:0,maxWidth:99999,onEnter:function(){},onLeave:function(){},onResize:function(){}};return a=o(b,a),d.push(a),d=p(d,"minWidth"),this},c.updateState=function(a,b){for(var c=d.length-1;c>=0;c--)d[c].id===a&&(d[c]=o(d[c],b));return this},c.removeState=function(a){for(var b=d.length-1;b>=0;b--)d[b].id===a&&d.splice(b,1);return this},c.removeStates=function(a){for(var b=a.length-1;b>=0;b--)c.removeState(a[b]);return this},c.removeAllStates=function(){return d=f=[],this},c.addStates=function(a){for(var b=a.length-1;b>=0;b--)c.addState(a[b]);return this},c.getStates=function(a){var b=null,c=[];if("undefined"==typeof a)return d;b=a.length;for(var e=0;b>e;e++)c.push(q(a[e]));return c},c.addConfigOption=function(a){var b={name:"",test:null};a=o(b,a),""!==a.name&&null!==a.test&&i.push(a)},c.getConfigOption=function(a){if("string"!=typeof a)return i;for(var b=i.length-1;b>=0;b--)if(i[b].name===a)return i[b]},c.removeConfigOption=function(a){for(var b=i.length-1;b>=0;b--)i[b].name===a&&i.splice(b,1)},c.getCurrentStates=function(){return f},c.setResizeTimeout=function(a){g=a},c.getResizeTimeout=function(){return g},c.ready=function(){return e=n(),a.attachEvent?a.attachEvent("onresize",j):a.addEventListener&&a.addEventListener("resize",j,!0),l(e),this};var m=function(){for(var a="",b="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",c=0;10>c;c++)a+=b.charAt(Math.floor(Math.random()*b.length));return a},n=function(){var c=0;return"number"==typeof b.body.clientWidth?c=b.body.clientWidth:"number"==typeof a.innerWidth?c=a.innerWidth:b.documentElement&&b.documentElement.clientWidth&&(c=b.documentElement.clientWidth),c},o=function(a,b){var c={};for(var d in a)c[d]=a[d];for(var e in b)c[e]=b[e];return c},p=function(a,b){return a.sort(function(a,c){var d=a[b],e=c[b];return e>d?-1:d>e?1:0})},q=function(a){for(var b=d.length-1;b>=0;b--)if(d[b].id===a)return d[b]},r=function(a,b){for(var c=0;c<a.length;c++)if(a[c]===b)return!0},s=function(a,b){for(var c=a.length,d=0;c>d;d++)a[d]===b&&a.splice(d,1);return a},t=function(a){for(var b=a.length,c=0;b>c;c++)a[c]()};c.addConfigOption({name:"minWidth",test:function(){return"number"==typeof this.state.minWidth&&this.state.minWidth<=this.browserWidth?!0:!1}}),c.addConfigOption({name:"maxWidth",test:function(){return"number"==typeof this.state.maxWidth&&this.state.maxWidth>=this.browserWidth?!0:!1}}),a.ssm=c,"function"==typeof a.define&&a.define.amd&&a.define("ssm",[],function(){return a.ssm})}(window,document);
+
 (function(){function a(a){function l(){if(g&&d<a){var b=g,c=b[0],f=Array.prototype.slice.call(b,1),m=b.index;g===h?g=h=null:g=g.next,++d,f.push(function(a,b){--d;if(i)return;a?e&&k(i=a,e=j=g=h=null):(j[m]=b,--e?l():k(null,j))}),c.apply(null,f)}}var c={},d=0,e=0,f=-1,g,h,i=null,j=[],k=b;return arguments.length<1&&(a=Infinity),c.defer=function(){if(!i){var a=arguments;a.index=++f,h?(h.next=a,h=h.next):g=h=a,++e,l()}return c},c.await=function(a){return k=a,e||k(i,j),c},c}function b(){}typeof module=="undefined"?self.queue=a:module.exports=a,a.version="0.0.2"})();var e=!0,f=null,h=!1,j,k=jQuery,l=window,m=queue;function q(a){return"undefined"===typeof a}function r(a){0<a&&clearTimeout(a)}function u(a){a=a&&(a.originalEvent?a.originalEvent:a)||l.event;return a.dataTransfer?a:f}function v(a,b,c){return!a||!b||q(a[b])?c:a[b]}function w(){for(var a=16,b="",a=q(a)?32:parseInt(a||0,10);b.length<a;)b+="0123456789abcdefghijklmnopqrstuvwxyz".substr(Math.round(36*Math.random()),1);return"jua-uid-"+b+"-"+(new Date).getTime().toString()}
 function z(a,b){return{FileName:q(a.fileName)?q(a.name)?f:a.name:a.fileName,Size:q(a.fileSize)?q(a.size)?f:a.size:a.fileSize,Type:q(a.type)?f:a.type,Folder:q(b)?"":b,File:a}}
 function A(a,b,c,g,d,i){function n(a,b,s,c){if(a&&!q(a.name))if(b=b||"",a.isFile)a.file(function(a){!x||0<=--d?s(z(a,b)):x&&!y&&(0>d&&i)&&(y=e,i(t))});else if(g&&a.isDirectory&&a.createReader){var p=a.createReader(),o=0,C=0;p&&p.readEntries&&p.readEntries(function(d){if(d&&d&&d.length&&0<d.length){o=0;for(C=d.length;o<C;o++)n(d[o],b+a.name+"/",s,c)}})}}var t=0,s=0,p=0,o=f,o=f,x=h,y=h,g=q(g)?e:!!g,c=q(c)?h:!!c,t=d=q(d)?B.o:parseInt(d||0,10),x=0<d;if(a=a&&0<a.length?a:f){p=0;for(s=a.length;p<s;p++)if(o=