mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-07-13 03:27:39 +03:00
More responsive interface with auto resize (#10)
This commit is contained in:
parent
acf80b96a3
commit
17b2afcf22
32 changed files with 1093 additions and 296 deletions
1
vendors/ssm/CNAME
vendored
Normal file
1
vendors/ssm/CNAME
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
www.simplestatemanager.com
|
||||
70
vendors/ssm/README.md
vendored
Normal file
70
vendors/ssm/README.md
vendored
Normal file
|
|
@ -0,0 +1,70 @@
|
|||
# Simple State Manager
|
||||
|
||||
[](https://travis-ci.org/SimpleStateManager/SimpleStateManager)
|
||||
|
||||
Simple State Manager (SSM for short) is a javascript state manager for responsive websites. It is built to be light weight, has no dependencies (except javascript of course) and aims to be really easy to simply drop into your project ready to use.
|
||||
|
||||
As a state manager, SSM allows you to target different javascript towards different states of your site. It allows you to define as many states as your site requires and allows you to have independent Enter, Leave and Resize events for each of the states.
|
||||
|
||||
##Getting started
|
||||
|
||||
To get started with SSM the first step is to include it in your project, you can do this in two ways
|
||||
|
||||
* Download and add the ssm.js (or ssm.min.js) file to your site
|
||||
* Use Bower to add to your project using bower install SimpleStateManager
|
||||
|
||||
##Documentation
|
||||
Documentation can be found at http://www.simplestatemanager.com
|
||||
|
||||
##Release Log
|
||||
|
||||
###2.1.0 - December 23, 2013
|
||||
* Added config option API which allows you to add your own SimpleStateManager config options along with the test to see if they are valid
|
||||
* Rewrote how testing of minWidth and maxWidth is handled to use the new config option API
|
||||
* Added new unit tests to improve code coverage
|
||||
|
||||
###2.0.3 - October 7, 2013
|
||||
* Fixed issue where browser width was not updated correctly
|
||||
|
||||
###2.0.2 - September 26, 2013
|
||||
* Fixed issue where leave events fired incorrectly
|
||||
|
||||
###2.0.1 - September 18, 2013
|
||||
* Fixed issue where ssm.js could not be placed in the head of the document
|
||||
|
||||
###2.0.0 - September 13, 2013
|
||||
* Major API changes to all states mangement methods, please read through the new API documention if upgrading
|
||||
* Ability to overlap your states
|
||||
* Debug mode removed - replaced with a new debug tool (currently early alpha) which will continue to be expanded to allow better responsive debugging
|
||||
* Define min-width and max-width values for each state
|
||||
* Easier to extend SSM (it is now encouraged)
|
||||
|
||||
###1.3.0 - August 10, 2013
|
||||
* Added .removeStates method
|
||||
* Added unit tests using QUnit
|
||||
* Integrated Travis CI
|
||||
|
||||
###1.2.0 - August 9, 2013
|
||||
* Added .getState method
|
||||
|
||||
###1.1.0 - August 9, 2013
|
||||
* Added .removeAllStates method
|
||||
|
||||
###1.0.2 - August 6, 2013
|
||||
* AMD Support
|
||||
* Replaced Debounce with timeout
|
||||
* New Site
|
||||
|
||||
###1.0.1 - Jun 24, 2013
|
||||
* Added Debounce to SSM (Thanks Kevin)
|
||||
|
||||
###1.0.0 - Jun 22, 2013
|
||||
* Initial release
|
||||
|
||||
## Planned Features
|
||||
|
||||
* Improve documentation
|
||||
|
||||
## License
|
||||
|
||||
License: MIT (http://www.opensource.org/licenses/mit-license.php)
|
||||
16
vendors/ssm/bower.json
vendored
Normal file
16
vendors/ssm/bower.json
vendored
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
{
|
||||
"name": "SimpleStateManager",
|
||||
"version": "2.1.0",
|
||||
"main": "src/ssm.js",
|
||||
"ignore": [
|
||||
"**/.*",
|
||||
"node_modules",
|
||||
"components"
|
||||
],
|
||||
"devDependencies": {
|
||||
"sass-bootstrap": "~2.3.2",
|
||||
"jquery": "~1.10.2",
|
||||
"modernizr": "~2.6.2",
|
||||
"respond": "~1.3.0"
|
||||
}
|
||||
}
|
||||
6
vendors/ssm/eslint.json
vendored
Normal file
6
vendors/ssm/eslint.json
vendored
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
{
|
||||
"rules": {
|
||||
"no-use-before-define": 0,
|
||||
"strict": 2
|
||||
}
|
||||
}
|
||||
40
vendors/ssm/package.json
vendored
Normal file
40
vendors/ssm/package.json
vendored
Normal file
|
|
@ -0,0 +1,40 @@
|
|||
{
|
||||
"name": "SimpleStateManager",
|
||||
"description": "SimpleStateManager ==================",
|
||||
"version": "2.1.0",
|
||||
"main": "src/ssm.js",
|
||||
"scripts": {
|
||||
"test": "grunt travis --verbose"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://jonathan-fielding@github.com/jonathan-fielding/SimpleStateManager.git"
|
||||
},
|
||||
"keywords": [
|
||||
"Responsive",
|
||||
"State",
|
||||
"Resize"
|
||||
],
|
||||
"author": "Jonathan Fielding",
|
||||
"contributors": [
|
||||
{
|
||||
"name": "Iszak Bryan",
|
||||
"url": "http://iszak.net/"
|
||||
},
|
||||
{
|
||||
"name": "Jonathan Fielding",
|
||||
"url": "http://www.jonathanfielding.com"
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"grunt": "~0.4.1",
|
||||
"grunt-contrib-qunit": "~0.2.2",
|
||||
"grunt-contrib-watch": "~0.5.2",
|
||||
"grunt-contrib-uglify": "~0.2.2",
|
||||
"grunt-cli": "~0.1.6",
|
||||
"grunt-contrib-compass": "~0.5.0",
|
||||
"grunt-contrib-copy": "~0.4.1",
|
||||
"grunt-contrib-jshint": "~0.7.2"
|
||||
}
|
||||
}
|
||||
348
vendors/ssm/ssm.js
vendored
Normal file
348
vendors/ssm/ssm.js
vendored
Normal file
|
|
@ -0,0 +1,348 @@
|
|||
/*global window document clearTimeout setTimeout */
|
||||
|
||||
;(function (window, document, undefined) {
|
||||
"use strict";
|
||||
|
||||
var ssm = {},
|
||||
states = [],
|
||||
browserWidth = 0,
|
||||
currentStates = [],
|
||||
resizeTimeout = 10,
|
||||
resizeTimer = null,
|
||||
configOptions = [];
|
||||
|
||||
var browserResizeDebounce = function () {
|
||||
clearTimeout(resizeTimer);
|
||||
resizeTimer = setTimeout(browserResizeWrapper, resizeTimeout);
|
||||
};
|
||||
|
||||
//Added wrapper for the resize method
|
||||
var browserResizeWrapper = function() {
|
||||
browserWidth = getWidth();
|
||||
browserResize(browserWidth);
|
||||
};
|
||||
|
||||
var browserResize = function (localBrowserWidth) {
|
||||
var totalStates = states.length,
|
||||
totalConfigOptions = configOptions.length,
|
||||
leaveMethods = [],
|
||||
resizeMethods = [],
|
||||
enterMethods = [],
|
||||
validState = true,
|
||||
tempObj = ssm;
|
||||
|
||||
for (var i = 0; i < totalStates; i++) {
|
||||
|
||||
validState = true;
|
||||
tempObj.state = states[i];
|
||||
tempObj.browserWidth = localBrowserWidth;
|
||||
|
||||
for (var j = 0; j < totalConfigOptions; j++) {
|
||||
tempObj.callback = configOptions[j].test;
|
||||
if(tempObj.callback() === false){
|
||||
validState = false;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if(validState){
|
||||
|
||||
if(objectInArray(currentStates, states[i])){
|
||||
resizeMethods.push(states[i].onResize);
|
||||
}
|
||||
else{
|
||||
currentStates.push(states[i]);
|
||||
enterMethods.push(states[i].onEnter);
|
||||
}
|
||||
}
|
||||
else{
|
||||
if(objectInArray(currentStates, states[i])){
|
||||
leaveMethods.push(states[i].onLeave);
|
||||
currentStates = removeObjectInArray(currentStates,states[i]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
fireAllMethodsInArray(leaveMethods);
|
||||
fireAllMethodsInArray(enterMethods);
|
||||
fireAllMethodsInArray(resizeMethods);
|
||||
};
|
||||
|
||||
ssm.browserResize = browserResize;
|
||||
|
||||
ssm.getBrowserWidth = function(){
|
||||
return browserWidth;
|
||||
};
|
||||
|
||||
//Add a new state
|
||||
ssm.addState = function (options) {
|
||||
//Setting sensible defaults for a state
|
||||
//Max width is set to 99999 for comparative purposes, is bigger than any display on market
|
||||
var defaultOptions = {
|
||||
id: makeID(),
|
||||
minWidth: 0,
|
||||
maxWidth: 99999,
|
||||
onEnter: function () {},
|
||||
onLeave: function () {},
|
||||
onResize: function () {}
|
||||
};
|
||||
|
||||
//Merge options with defaults
|
||||
options = mergeOptions(defaultOptions, options);
|
||||
|
||||
//Add state to the master states array
|
||||
states.push(options);
|
||||
|
||||
//Sort
|
||||
states = sortByKey(states, "minWidth");
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
//Allow updating of an already added state
|
||||
ssm.updateState = function (stateId, options) {
|
||||
for (var i = states.length - 1; i >= 0; i--) {
|
||||
if (states[i].id === stateId) {
|
||||
states[i] = mergeOptions(states[i], options);
|
||||
}
|
||||
}
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
//Find and remove the state from the array
|
||||
ssm.removeState = function (stateId) {
|
||||
for (var i = states.length - 1; i >= 0; i--) {
|
||||
if (states[i].id === stateId) {
|
||||
states.splice(i, 1);
|
||||
}
|
||||
}
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
//Remove multiple states from an array
|
||||
ssm.removeStates = function (statesArray) {
|
||||
for (var i = statesArray.length - 1; i >= 0; i--) {
|
||||
ssm.removeState(statesArray[i]);
|
||||
}
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
//Find and remove the state from the array
|
||||
ssm.removeAllStates = function () {
|
||||
states = currentStates = [];
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
//Add multiple states from an array
|
||||
ssm.addStates = function (statesArray) {
|
||||
for (var i = statesArray.length - 1; i >= 0; i--) {
|
||||
ssm.addState(statesArray[i]);
|
||||
}
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
ssm.getStates = function(idArr){
|
||||
var idCount = null, returnArr = [];
|
||||
|
||||
if(typeof(idArr) === "undefined"){
|
||||
return states;
|
||||
}
|
||||
else{
|
||||
idCount = idArr.length;
|
||||
|
||||
for (var i = 0; i < idCount; i++) {
|
||||
returnArr.push(getStateByID(idArr[i]));
|
||||
}
|
||||
|
||||
return returnArr;
|
||||
}
|
||||
};
|
||||
|
||||
ssm.addConfigOption = function(options){
|
||||
var defaultOptions = {
|
||||
name: "",
|
||||
test: null
|
||||
};
|
||||
|
||||
//Merge options with defaults
|
||||
options = mergeOptions(defaultOptions, options);
|
||||
|
||||
if(options.name !== "" && options.test !== null){
|
||||
configOptions.push(options);
|
||||
}
|
||||
};
|
||||
|
||||
ssm.getConfigOption = function(name){
|
||||
if(typeof name === "string"){
|
||||
for (var i = configOptions.length - 1; i >= 0; i--) {
|
||||
if(configOptions[i].name === name){
|
||||
return configOptions[i];
|
||||
}
|
||||
}
|
||||
}
|
||||
else{
|
||||
return configOptions;
|
||||
}
|
||||
};
|
||||
|
||||
ssm.removeConfigOption = function(name){
|
||||
for (var i = configOptions.length - 1; i >= 0; i--) {
|
||||
if (configOptions[i].name === name) {
|
||||
configOptions.splice(i, 1);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
ssm.getCurrentStates = function(){
|
||||
return currentStates;
|
||||
};
|
||||
|
||||
//Change the timeout before firing the resize function
|
||||
ssm.setResizeTimeout = function (milliSeconds) {
|
||||
resizeTimeout = milliSeconds;
|
||||
};
|
||||
|
||||
//Change the timeout before firing the resize function
|
||||
ssm.getResizeTimeout = function () {
|
||||
return resizeTimeout;
|
||||
};
|
||||
|
||||
ssm.ready = function () {
|
||||
//Update browser width
|
||||
browserWidth = getWidth();
|
||||
|
||||
//Attach event for resizing
|
||||
if (window.attachEvent) {
|
||||
window.attachEvent("onresize", browserResizeDebounce);
|
||||
} else if (window.addEventListener) {
|
||||
window.addEventListener("resize", browserResizeDebounce, true);
|
||||
}
|
||||
|
||||
browserResize(browserWidth);
|
||||
|
||||
return this;
|
||||
};
|
||||
|
||||
var makeID = function () {
|
||||
var text = "";
|
||||
var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
|
||||
|
||||
for (var i = 0; i < 10; i++) {
|
||||
text += possible.charAt(Math.floor(Math.random() * possible.length));
|
||||
}
|
||||
return text;
|
||||
};
|
||||
|
||||
var getWidth = function () {
|
||||
var x = 0;
|
||||
if (typeof(document.body.clientWidth) === "number") {
|
||||
// newest gen browsers
|
||||
x = document.body.clientWidth;
|
||||
}
|
||||
else if( typeof( window.innerWidth ) === "number" ) {
|
||||
//Non-IE
|
||||
x = window.innerWidth;
|
||||
}
|
||||
else if( document.documentElement && document.documentElement.clientWidth ) {
|
||||
//IE 6+ in 'standards compliant mode'
|
||||
x = document.documentElement.clientWidth;
|
||||
}
|
||||
|
||||
return x;
|
||||
};
|
||||
|
||||
|
||||
var mergeOptions = function (obj1, obj2) {
|
||||
var obj3 = {};
|
||||
|
||||
for (var attrname in obj1) {
|
||||
obj3[attrname] = obj1[attrname];
|
||||
}
|
||||
|
||||
for (var attrname2 in obj2) {
|
||||
obj3[attrname2] = obj2[attrname2];
|
||||
}
|
||||
|
||||
return obj3;
|
||||
};
|
||||
|
||||
|
||||
var sortByKey = function (array, key) {
|
||||
return array.sort(function (a, b) {
|
||||
var x = a[key];
|
||||
var y = b[key];
|
||||
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
|
||||
});
|
||||
};
|
||||
|
||||
//Method to get a state based on the ID
|
||||
var getStateByID = function(id){
|
||||
for (var i = states.length - 1; i >= 0; i--) {
|
||||
if(states[i].id === id){
|
||||
return states[i];
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
var objectInArray = function(arr, obj){
|
||||
for (var i = 0; i < arr.length; i++) {
|
||||
if(arr[i] === obj){
|
||||
return true;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
var removeObjectInArray = function(arr,obj){
|
||||
var length = arr.length;
|
||||
|
||||
for (var i = 0; i < length; i++) {
|
||||
if (arr[i] === obj) {
|
||||
arr.splice(i, 1);
|
||||
}
|
||||
}
|
||||
|
||||
return arr;
|
||||
};
|
||||
|
||||
var fireAllMethodsInArray = function(arr){
|
||||
var arrLength = arr.length;
|
||||
|
||||
for (var i = 0; i < arrLength; i++) {
|
||||
arr[i]();
|
||||
}
|
||||
};
|
||||
|
||||
//define the built in methods (required for compatabilty)
|
||||
ssm.addConfigOption({name:"minWidth", test: function(){
|
||||
if(typeof this.state.minWidth === "number" && this.state.minWidth <= this.browserWidth){
|
||||
return true;
|
||||
}
|
||||
else{
|
||||
return false;
|
||||
}
|
||||
}});
|
||||
|
||||
ssm.addConfigOption({name:"maxWidth", test: function(){
|
||||
if(typeof this.state.maxWidth === "number" && this.state.maxWidth >= this.browserWidth){
|
||||
return true;
|
||||
}
|
||||
else{
|
||||
return false;
|
||||
}
|
||||
}});
|
||||
|
||||
//Expose Simple State Manager
|
||||
window.ssm = ssm;
|
||||
|
||||
if (typeof window.define === "function" && window.define.amd) {
|
||||
window.define("ssm", [], function () {
|
||||
return window.ssm;
|
||||
});
|
||||
}
|
||||
|
||||
})(window, document);
|
||||
2
vendors/ssm/ssm.min.js
vendored
Normal file
2
vendors/ssm/ssm.min.js
vendored
Normal file
|
|
@ -0,0 +1,2 @@
|
|||
/*! 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);
|
||||
Loading…
Add table
Add a link
Reference in a new issue