New to API's

James,

Thanks for the post. I understand not wanting to dig through documentation for something specific, but when learning a new language such as WIRE, it isn't a bad idea to get acquainted with the basics. 

I would encourage you to look at this snippet for a basic JSON implementation: https://files.rarewire.com/wordpress/2013/05/json-...

Also you should watch this video on how to set up an integration with a json feed that allows you to modify the url to get different info: http://player.vimeo.com/video/62367352

As for your has value needing to change based on user, if you can pull that value from another source, you can set it as a variable and plug it in to the URL like this: 

<assign property="var:hash" value="12121212" />
...
<assign property="datasource:feed.source" value="http://school.bitspayment.com/search_action/search..." />

I have an OK understanding of Wire. I have managed to put together a small Wire from the tutorials.
I am trying to create a list of json format to display through the app. This is to mainly test the API. Could I maybe get a pointer or two on what is wrong with my Wire and why I do not get expected an expected list of json. If I use the arstechnica API example in the tutorial I was following, I get expected results. The URL for the value in the action that has been implemetened on initialization is an example URL provided by the API development team. If the URL is put into your browsers search bar, the expected json return is given.

Where did I go wrong. Sorry for questions. This is just an urgent testing project for me. I don't have the time to read/watch tutorials. Otherwise I would love to! I like this Wire language.

<wire>
<datasources>

<!-- datasources go here -->
<datasource name="default" source="" providertype="json" query="result_rows" parsenamespace="yes">
</datasource>

</datasources>

<styles>

<!-- styles go here -->

</styles>

<classes>

<!-- classes go here -->
<class name="jsonList">
<panel name="" width="95%" height="20%" lheight="25%" dataSourceIndex="" align="center" background="#ff0000" bordercolor="00ee00" borderwidth="3">
<text name="merchant" width="100%" height="50%" color="#eeeeee" font="helvetica" size="20" align="center" valign="top" alignment="center" text=""></text>
<text name="clip" width="90%" height="50%" color="#eeeeee" font="helvetica" size="15" align="center" valign="bottom" alignment="center" text=""></text>
</panel>
</class>

</classes>

<main>

<!-- main wire hierarchy -->
<panel name="background" width="100%" height="100%" background="#000000"></panel>
<panel name="list" width="100%" height="95%" align="center" valign="center" background="#ffffff">
<list name="json-results" datasource="default" width="85%" height="100%" orientation="vertical" paginate="no">
<object dataSourceIndex="[ds:dataSourceIndex]" headline="[ds:result_rows.name]" author="[ds:result_rows.merchant_id]"></object>
</list>
</panel>

</main>

<actions>

<!-- actions go here -->
<action name="oninit" datasource="default" oninit="yes">
">http://school.bitspayment.com/search_action/search...
</action>

</actions>
</wire>

James, 

I would love to troubleshoot this, the URL in your action cut off when you posted it, can you post it again as text? 

Short on an actual URL, I took the original URL at the top, which contained one error entry and threw it into your code. I will highlight a few errors you had. 

For starters, you did not have params set for the text objects in your class, this is what the datasource uses to replace the data. 

Second, you didn't have a class defined in your object tag to populate. Once these were in place, I added a querycomplete action to confirm that the datasource was getting polled properly and then adjusted the query on the datasource tag for this data feed. Then I was able to get data back. Once I see your URL, I can adjust this example to work with your feed. It usually comes down to the query and pathing to the right portion of the feed you want to pull in.

<wire>
<datasources>
   <datasource name="default" source="" providertype="json" query="/" parsenamespace="yes"></datasource>
</datasources>


<classes>
   <class name="jsonList">
      <panel name="[param:dataSourceIndex]" width="95%" height="20%" lheight="25%" dataSourceIndex="[param:dataSourceIndex]" align="center" background="#ff0000" bordercolor="00ee00" borderwidth="3">
         <text name="merchant" width="100%" height="50%" color="#eeeeee" font="helvetica" size="20" align="center" valign="top" alignment="center" text="[param:headline]"></text>
         <text name="clip" width="90%" height="50%" color="#eeeeee" font="helvetica" size="15" align="center" valign="bottom" alignment="center" text="[param:author]"></text> 
      </panel>
   </class>
</classes>


<main>
   <panel name="main" width="100%" height="100%" background="#ffffff">
      <list name="json-results" datasource="default" width="85%" height="100%" align="center" orientation="vertical" paginate="no">
         <object class="jsonList" dataSourceIndex="[ds:dataSourceIndex]" headline="[ds:msg]" author="[ds:page_size]"></object>
      </list>
   </panel>
</main>


<actions>
   <action name="on" oninit="yes">
      <assign property="datasource:default.source" value="http://school.bitspayment.com/search_action/search_organization/1406863032/myapitestuserlatch/955b85e721749d8f3043898bb1691da0cea20f877528fa6776860f632dbb2ee5/%20/37.641654/-118.964568/0/10" />
   </action>
   <action name="complete" datasource="default" datasourceevent="querycomplete">
      <alert message="[datasource:default.0.content]"/>
   </action>
</actions>
</wire>

Thank you so much! The URL would be in this format 

http://school.bitspayment.com/search_action/search_organization/<timestamp>
/<user_latch>/<hash_value>/<search_keyword>/<search_latitude>/<search_longitue>/
<page_number_of_search_result>/<page_size_of_search_result>

in this format, an example URL would be http

://school.bitspayment.com/search_action/search_organization/1406863032/myapitestuserlatch
/955b85e721749d8f3043898bb1691da0cea20f877528fa6776860f632dbb2ee5/%20/37.641654/-118.964568/0/10
955b85e721749d8f3043898bb1691da0cea20f877528fa6776860f632dbb2ee5/%20/37.641654/-118.964568/0/10

Note the timestamp must be within +- current time in UNIX format. Is there also a way I can assign this to a variable in the action that uses this in the URL

something like 

<action name="on" oninit="yes">
/955b85e721749d8f3043898bb1691da0cea20f877528fa6776860f632dbb2ee5/%20/37.641654/-118.964568/0/10

With your code, I now understand what I needed to do to finish the program. Being thrown into a new language for a small project is sometimes tedious.

Although I am getting an error now when trying of invalid API user. This must be on our side I will have this looked into.

I have edited the code above to show you what I have tried to do with the timestamp


<action name="on" oninit="yes">
<assign property="var:time" value="[js:timeStamp()]"
(Note http is left out of the link)
<assign property="datasource.default.source" value="://school.bitspayment.com/search_action/search_organization/[var:time]/myapitestuserlatch
/955b85e721749d8f3043898bb1691da0cea20f877528fa6776860f632dbb2ee5/%20/37.641654/-118.964568/0/10"

I created an html file in order to try and capture the javascript function of the current epoch time but I cannot seem to make this work. Im not sure why it wouldn't. Is my syntax wrong again or am I just plain wrong?

<html>
<head>
<script type="text/javascript">
function timeStamp ()
{
var unix = Math.round(new Date().getTime()/1000.0);
return unix;
}
</script>
</head>
<body>
</body>
</html>

James,

That looks correct. Did you place this JS function in a file called functions.html at the root of your project? This is required for custom functions like this. 

Ahh yes that was the issue. Looks great now. Now just to look into the invalid API user on my part. I will come back with anymore questions if need be. Thank you so much. Great learning experience.

Wonderful. Let me know if you run into any issues. 

I have been provided an HTML file from the API developers. It contains a JavaScript function that generates the link based on a button pressed on the HTML webpage the code creates. I want to run this function to generate that link not by the button on the webpage, but the button on my app, and then create the list response. Basically, I want to return the link from the function provided, set the datasource source with the returned link and then populate and display the list with the response when the button is pressed.

The problem with this function is that it is recursive  and I'm not entirely sure on how I would call this function. The HTML itself is pulling the correct information from 3 sources. Here is the function. It is pulling data from an HTML table of input values and making the correct calculations as well. I want to do this with the button in RareWire without the recursion. Is there a way I could possibly do this?

Sorry for the tricky problem here. That function is quite over-cleverly done with the recursion. It would be much simpler if they made one function that got the job done instead of 3 functions in one. sigh..

<script type="text/javascript">
;(function($){
    $(function(){
        $("#gen_link").click(function(){
            var timestamp = Math.floor((new Date()).getTime() / 1000);
            var user_latch = $.trim($("#user_latch").val());
            var sec_code = $.trim($("#sec_code").val());
            var search_keyword = $.trim($("#search_keyword").val());
            var search_latitude = $.trim($("#search_latitude").val());
            var search_longitude = $.trim($("#search_longitude").val());
            var page_number_of_search_result = $.trim($("#page_number_of_search_result").val());
            var page_size_of_search_result = $.trim($("#page_size_of_search_result").val());
            
            var src_str = "" + timestamp + user_latch + sec_code + search_keyword + search_latitude + search_longitude + page_number_of_search_result +page_size_of_search_result; 
            console.log("src_str: '" + src_str + "'");
            
            var hash_obj = CryptoJS.SHA256(src_str);
            var hash_hex = hash_obj.toString(CryptoJS.enc.Hex);
            console.log("hash_hex: '"+hash_hex+"'");
            
            var search_type = $("input[name='search_type']:checked").val();
            
            if("" == search_keyword){
                search_keyword = " ";
            }


		<!-- I want to return this hyperlink -->
            var hyperlink = "http://school.bitspayment.com/search_action/search_" + timestamp + "/" + encodeURIComponent(user_latch) + "/" + hash_hex + "/" + encodeURIComponent(search_keyword) + "/" + encodeURIComponent(search_latitude) + "/" + encodeURIComponent(search_longitude) + "/" + encodeURIComponent(page_number_of_search_result) + "/" + encodeURIComponent(page_size_of_search_result);
		<!-- This generates the link when the button is pressed on the HTML page -->
            $("#generated_link").html('<a href="'+hyperlink+'" target="_blank">'+hyperlink+'</a>');
        });
    });
})(jQuery);

I don't see any recursion here - we just have functions wrapped in functions, in a very JQuery sort of way.  You should be able to just extract the code you want from the inner function, and use variables and functions to handle things the way you want to do it.

In your functions.html file, just put a function like:
function getUrl(user_latch, sec_code /*, ...*/ ) { 
   var timestamp = Math.floor((new Date()).getTime() / 1000);
   /* ... */
   return hyperlink;
}

And, in your wire, just do something like:
<assign property="var:hyperlink" value="[eval: getUrl('[var:userlatch]', '[var:seccode]', ... )]" />

Good luck,
Kevin

Ok for now I am disregarding the HTML and JavaScript.

My current problem I am having now is using buttons to get two different types of responses determined by 2 different API's in which I have one defined for now.
I am currently generating the link through the HTML and just grabbing it and manually inputting it into the Wire for now until another variant of the function is written.

here is the Wire, the alert message continuous loops and I have looked around the Wire definitions and tried to come up with something to make it stop looping and only display once but I couldn't quite figure it out.

<main>
    <panel name="main" alias="main" background="#e2e2e2" xpos="0%" ypos="0%" height="100%" width="100%" lxpos="38%" lypos="36%" lheight="4%" lwidth="6%">
        <panel name="button_panel" alias="button_panel" background="#6d6d6c" xpos="16%" ypos="41%" height="10%" width="68%" lxpos="37%" lypos="41%" lheight="4%" lwidth="6%"/>
          <toolbar name="button_toolbar" xpos="16%" ypos="41%" height="10%" width="68%" lxpos="37%" lypos="41%" lheight="4%" lwidth="6%">
              <button name="merchant" title="Search Merchant" onclick="merchant_on"/>
              <!-- Other buttons to be defined -->
        </toolbar>
    </panel>
</main>


<actions>
    <action name="merchant_on" datasource="merchant">
        <assign property="datasource:merchant.source" value="http://school.bitspayment.com/search_action/search_merchant/1407960853/myapitestuserlatch/2cc8f8c4ee34a1158de11225caacf7bb90138e2bfc388b3f4ae8be786fc43c96/%20/37.641654/-118.964568/0/10" />
    </action>
    
    <action name="merchant_complete" datasource="merchant" datasourceevent="querycomplete">
        <sync>
            <alert message="[datasource:merchant.0.content]" />
        </sync>
    </action>
    
    <!--<action name="organization_on" datasource="organization">
        <assign property="datasource:organzation.source" value="http://school.bitspayment.com/search_action/search_organization/1407954707/myapitestuserlatch/bc1f1bf26fca96c6c200892da5d622dd39993008d8a859779b4be678b034d774/%20/37.641654/-118.964568/0/10" />
    </action>
    
    <action name="organization_complete" datasource="organization" datasourceevent="querycomplete">
        <alert message="[datasource:organization.0.content]"/>
    </action> -->
    
</actions>

When you say:
<action name="merchant_on" datasource="merchant">


the engine defaults the datasourceevent to querycomplete.

This means that every time the datasource comes back, you're setting the source of the merchant datasource, and causing it to refresh. Once it's complete, it starts over again.

If you remove the datasource="merchant" portion of that line of code, and make it simply
<action name="merchant_on">, then your loop will not happen.