https://github.com/0xtlt/simplejs
SimpleJs is made for simplify your javascript code without use jquery
https://github.com/0xtlt/simplejs
Last synced: over 1 year ago
JSON representation
SimpleJs is made for simplify your javascript code without use jquery
- Host: GitHub
- URL: https://github.com/0xtlt/simplejs
- Owner: 0xtlt
- License: mit
- Created: 2018-05-14T20:06:10.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2018-06-22T07:04:01.000Z (about 8 years ago)
- Last Synced: 2025-03-20T05:51:41.481Z (over 1 year ago)
- Language: JavaScript
- Homepage: https://thomast404.github.io/SimpleJs/
- Size: 65.4 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Simple-JS
Simple js is made for simplify your javascript code without use jquery
# Functions ss.
### Post and Get request
```javascript
ss.get('data.html', {
params: [{name: 'ss', value: 'js'}],
success: function(result){
alert(result)
}
});
ss.get('data.html', {
success: function(html){
//Callback function
}
});
ss.get('data.html', {
params: [{name: 'ss', value: 'js'}],
success: function(result){
alert(result)
}
});
ss.post('data.html', {
params: [{name: 'ss', value: 'js'}],
success: function(result){
alert(result)
}
});
ss.post('data.html', {
params: [],
timeout: 4000,
success: function(result){
},
error: function(result){
}
});
```
### DOM manipulation
```javascript
ss.el('#container').toggleClass('superclass') //toggle one class
ss.el('#container').toggleClass('multiple super class') //toggle several class
ss.el('#container').html() //Return the html of the element
ss.el('#container').html('
Hello world !
') //Change the content of element
ss.el('#pseudo').val() //Return the value of the input pseudo
ss.el('#pseudo').val('Hello') //Change the value of the input pseudo | Let empty for remove the content
ss.el('#element').press(function(){
// Callback function when #element is pressed
})
ss.el('#myID').change('
My html
') //If a change in the html between the given value and the previous value then the id will be updated |only works with IDs and with html
```
### Pages manipulation
If you want to create a multiples interfaces in your webapp, you can use the functions ss.pages and ss.page
```javascript
//initialize the pages with ss.pages | the first value will be display automatically when script will be terminated
ss.pages([
{
name: 'home',
el: '#myhomepage'
},
{
name: 'login',
el: '#myloginpage'
}//etc...
])
//now you can change the displayed page
ss.page('login')
ss.page('home') //etc...
```
### Form manipulation
```javascript
ss.el('#myinput').check_input({
min_letters: 5,
max_letters: 10,
forbidden_characters: ['super', 'input']
}) // Return true if all conditions are okay
```
### Mobile manipulation
```javascript
ss.mobileswipe({
toLeft: function(){
//callback function
},
toRight: function(){
//callback function
},
toTop: function(){
//callback function
},
toBottom: function(){
//callback function
}
}) //This function can be used once
```
# Beta Functions
### TurboOn ~ Make page transitions on your website faster
Why use TurboOn ?
`TurboOn was created to free up your browser resources and server bandwidth by reloading only what is important for the navigation.`
```javascript
ss.turboOn(); // Just add this on your javascript code for launch the beast
```
If you didn't want to reload your javascript resources you can add a property to indicate this
```html
ss.turboOn();
```
### onTurbo Event
If you want to execute a function each time a page is loaded, you can do it with this function
```javascript
ss.onTurbo(function(beforeBody, pageName){
console.log(pageName);
});
```
### scrollToThis
`scrollToThis is a function to scroll the page up to your element`
```javascript
ss.el('#element').scrollToThis();
```
### isVisible
`isVisible is a function that returns true if the item is displayed on the screen or false if it is not`
```javascript
ss.el('#element').isVisible(); //return true or false
ss.el('#element').isVisible(true); // returns 1 if the element is totally visible or 0.5 if it is partially visible or 0 if it is not visible
```
### write
`write does a little animation as if the user is writing`
```javascript
const speed = 1000; //ms
const callback = function(element, text){
};
ss.el('#element').write('Text', speed, callback)
```
### rand
`make a random chain`
```javascript
const params = {
length: 10,
alphabet: true, // abcdefghijklmnopqrstuvwxyzAZERTYUIOPQSDFGHJKLMWXCVBN
numbers: true, // 0123456789
extra: true // &@*µ£$./°
};
ss.rand(params); // params is not necessary
```