SimpleJs is made for simplify your javascript code without use jquery
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
samples
.gitignore
LICENSE
README.md
_config.yml
simple.js
simple.min.js

README.md

Simple-JS

Simple js is made for simplify your javascript code without use jquery

Functions ss.

Post and Get request

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

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('<h1>Hello world !</h1>') //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('<h1>My html</h1>') //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

//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

ss.el('#myinput').check_input({
  min_letters: 5,
  max_letters: 10,
  forbidden_characters: ['super', 'input']
}) // Return true if all conditions are okay

Mobile manipulation

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.

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

<script ss-turbo-reload="false">
    ss.turboOn();
</script>
<!-- ss-turbo-reload="false" indicate to turboOn to don't reload this resource -->

onTurbo Event

If you want to execute a function each time a page is loaded, you can do it with this function

ss.onTurbo(function(beforeBody, pageName){
  console.log(pageName);
});

scrollToThis

scrollToThis is a function to scroll the page up to your element

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

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

const speed = 1000; //ms
const callback = function(element, text){

};
ss.el('#element').write('Text', speed, callback)

rand

make a random chain

const params = {
  length: 10,
  alphabet: true, // abcdefghijklmnopqrstuvwxyzAZERTYUIOPQSDFGHJKLMWXCVBN
  numbers: true, // 0123456789
  extra: true // &@*µ£$./°
};
ss.rand(params); // params is not necessary