0

I have this JS file

function APIAccess(){
    this.LoadScreen = function(){
        var loadScreen = $('#loadScreen');
        if(loadScreen.html() == undefined){
            loadScreen = '<div id="loadScreen" style="display: none;width: 100%; height: 100%; top: 0pt;left: 0pt;">' + 
                             '<div id="loadScr" style="filter: alpha(opacity = 65);  z-index: 9999;border: medium none; margin: 0pt; padding: 0pt; width: 100%; height: 100%; top: 0pt;left: 0pt; background-color: rgb(0, 0, 0); opacity: 0.2; cursor: wait; position: fixed;"></div>' +
                             '<div id="loader"  style="z-index: 10000; position: fixed; padding: 0px; margin: 0px;width: 30%; top: 40%; left: 35%; text-align: center;cursor: wait; ">' +
                             '<img src="img/ajax-loader.gif" alt="loading" /></div></div>';
            $(document.body).append(loadScreen);
        }
    };

    this.APICall = function(url, params, method, callback){
        this.LoadScreen();  
        var postData = null;
        if(params != null){
            postData = JSON.stringify(params);
        }   
        if(url.toLowerCase().indexOf("http") < 0){
            url = "http://" + url;
        }   
        $('#loadScreen').show(function(){
            $.ajax({
              url: url,
              async: true,
              type: method,
              data: postData,
              success: function(data){
                $('#loadScreen').hide();
                callback(data);
              },
              error:function(data){
                  alert("failure");
                  return false;
              }   
            }); 
        });
    };
}

function Domain(reqCallback){
    this.url = 'http://beta.test123.net/api/domain';
    this.params = null;
    this.method = 'GET';
    this.callback = function(data){
        setCookie("domain", data);
        if(typeof reqCallback != null){
            reqCallback(data);
        }
    };
    this.request = this.APICall(this.url, this.params, this.method, this.callback);
}
Domain.prototype = new APIAccess;

function Login(usermail, pass, reqCallback){
    var domainUrl = getCookie("domain");
    if(domainUrl == null)
        return false;
    else
        domainUrl += '/api/login';

    this.url = domainUrl;
    this.params = {"email": usermail, "password": password};
    this.method = 'POST';
    this.callback = function(data){
        setCookie("login", data);
        if(typeof reqCallback != null){
            reqCallback(data);
        }
    };
    this.request = this.APICall(this.url, this.params, this.method, this.callback);
}
Login.prototype = new APIAccess;

If you see the method this.request = this.APICall(this.url, this.params, this.method, this.callback); will be repeated everytime. I wish it could be placed in APIAccess function. can you please suggest what can be done.

I use this in my html as this

$(document).ready(function(){
            var domain = new Domain(function(data){
                alert(data);
            });
            domain.request;
        });

2 Answers 2

1

I'm not sure about if this is what you are asking for, The most important part of the code below is that I have used Object.create() instead of object prototype to "inherit" from the base class If you want to learn why? visit https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/create

hope it helps :)

//Base class
var APIAccess = {

    LoadScreen : function () {
        var loadScreen = $('#loadScreen');
        if (loadScreen.html() == undefined) {
            loadScreen = '<div id="loadScreen" style="display: none;width: 100%; height: 100%; top: 0pt;left: 0pt;">' +
                             '<div id="loadScr" style="filter: alpha(opacity = 65);  z-index: 9999;border: medium none; margin: 0pt; padding: 0pt; width: 100%; height: 100%; top: 0pt;left: 0pt; background-color: rgb(0, 0, 0); opacity: 0.2; cursor: wait; position: fixed;"></div>' +
                             '<div id="loader"  style="z-index: 10000; position: fixed; padding: 0px; margin: 0px;width: 30%; top: 40%; left: 35%; text-align: center;cursor: wait; ">' +
                             '<img src="img/ajax-loader.gif" alt="loading" /></div></div>';
            $(document.body).append(loadScreen);
        }
    },

    APICall : function (url, params, method, callback) {
        this.LoadScreen();
        var postData = null;
        if (params != null) {
            postData = JSON.stringify(params);
        }
        if (url.toLowerCase().indexOf("http") < 0) {
            url = "http://" + url;
        }
        $('#loadScreen').show(function () {
            $.ajax({
                url: url,
                async: true,
                type: method,
                data: postData,
                success: function (data) {
                    $('#loadScreen').hide();
                    callback(data);
                },
                error: function (data) {
                    alert("failure");
                    return false;
                }
            });
        });
    },

    //added to base class
    url : null,
    params : null,
    method : null,
    callback : null,
    request : function(){
        //TODO validate url, params and method here
        APICall(this.url, this.params, this.method, this.callback);
    }
}


var Domain = function(reqCallback) {
    var obj = Object.create(APIAccess);
    //obj.prototype = APIAccess;
    obj.url = 'http://beta.test123.net/api/domain';
    obj.params = null;
    obj.method = 'GET';
    obj.callback = function (data) {
        setCookie("domain", data);
        if (typeof reqCallback != null) {
            reqCallback(data);
        }
    };
    return obj;
}

var Login = function (usermail, password, reqCallback) {
    var domainUrl = getCookie("domain");
    if (domainUrl == null){
        return false;
    }
    else{
        domainUrl += '/api/login';
    }

    var obj = Object.create(APIAccess);
    //obj.prototype = APIAccess;
    obj.url = domainUrl;
    obj.params = { "email": usermail, "password": password };
    obj.method = 'POST';
    obj.callback = function (data) {
        setCookie("login", data);
        if (typeof reqCallback != null) {
            reqCallback(data);
       }
    }
    return obj;
}


//Code below is just for testing
function getCookie(str){
    return 'test';
}

console.log(
    new Domain(function(data){alert(data);}), //domain
    new Login( //loging
        'user',
        'passwd',
        function(data){alert(data);}
    )
)
Sign up to request clarification or add additional context in comments.

Comments

1

OweRReLoaDeD's answer is correct, but to put it more succinctly:

You should not instantiate the base class just to setup inheritance.

Domain.prototype = new APIAccess;

Should be

Domain.prototype = Object.create(APIAccess);

Having said this, what you're modeling looks a little weird with inheritance, wish I had time to suggest a different way.

2 Comments

didnt helped by doing this way
"Didn't help" without explaining what the problem was is not very helpful

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.