Updating multiple assets from one page

(Eric) #1

Hi all, I am having a bit of brain freeze and hoping someone can help.

 

I am building a new feature for our website and not sure what is the best approach using Matrix. There will be 2 parts to it display part (that one is always easy with Matrix) and Update part (this one giving me a headache)

 

Background

 

We have 26 parks with most of them having more than one sporting field and I am trying to show sports ground availability on our website. There are various solutions I can think of, but the one I decided to go with is having asset for each park with metadata applied for open/close/stand by options. Reason for separate assets is ability to link individual park info in other places later on as well as possible personalisation.

 

Need help with...

 

I need to build interface for an update of this information and an ideal scenario is to have a page listing all parks/fields with radio buttons for each field so that once the button is clicked that assets metadata field is updated (thinking AJAX or JS API, but I really don't know how it works).

 

One of the issues is that there is more than one person updating this information at the same time and we eventually want this to be done from a mobile device.

 

Any suggestions? Any other ways of doing it?

 

(Anthony Barnes) #2

The JS API sounds like the way to go, it can certainly handle updating multiple assets on the one page. The manuals have some good information on getting the JS API setup so I'd suggest starting there before trying to configure something. Once you've got it up and running I've done a quick proof of concept using jQuery to help get you started: http://jsfiddle.net/rGkac/

 

It really is quite easy with a bit of javascript knowledge to build these sorts of interfaces. Just a quick tip, make sure you secure the JS API asset you create and any pages that bring it in with Matrix permissions. There is no need to expose all of this as publicly accessible, you'd want to limit the amount and types of users that could access this sort of interface. The JS API will, of course, respect any permissions you configure.

 

If the people updating this information are editors on the site you might consider using Easy Edit which has a ready made interface built on top of the JS API. It's already possible to use Easy Edit to navigate to these assets and update the metadata without any additional work to create interfaces of your own.

(Eric) #3

Thanks Anthony, I'll give it a go. I know Easy Edit can do it, but it's not an option for us as people that would eventually update this would be holticulturalists that don't (want to) know how to retrieve SMS and if we ever get them to do this it would be in a field on a phone or tablet at 6:00am on Saturday...

(Eric) #4

Hi Anthony, I am stuck a little. I thought I understood the example you gave me and it works, but doesn't actualy change metadata value on an asset. Igot all the right ID's printing out. Is there any way to troubleshoot it? I am not sure if I configured JS Api correctly. We using 4.10.1

I am traversing manuals, but I think I have a little gap in understanding of how api key comes in to it and where it is being called.

(Eric) #5

Update: We soted it out works a treat. Thanks again.

(Anthony Barnes) #6

Update: We soted it out works a treat. Thanks again.

 

Great! did you find a 'gotcha' with the JS API, or possibly my mock function call wasn't accurate to the actual JS API function?

(Eric) #7

It was my first work with JS API so I wasn't sure how whole thing fit togather, and left out reference to JS API asset itself, also it took a little time to wrap my head about a way to insert it into asset listing that  needed.

(Pomster09) #8

Hi Eric, I'm looking at a similar type function for a page full of results and I want to set the status level of each from the one view. I've never used the JS API yet, and would love if you can share your example in more details, or even the link to the page you have it working on.

 

Cheers

(Eric) #9

This was my first time too. That page is an admin so I can't show it, but what do you want to know?

 

 

I have setup asset listing to list assets, in my case I am updating metadata field then insert this code in page content

<textarea id="output-status" cols="50" rows="10"></textarea>

%asset_listing%

<script type=“text/javascript” src=“YOUR_URL_TO.js”> //this is a url of your JS API asset

</script>

<script>

var options = new Array();

options[‘key’] = ‘MATRIX-API-KEY’;// JS API security key

var js_api = new Squiz_Matrix_API(options);


// Bind clicks using jQuery

var clickTimeout = null;

$(’.list-item input’).click(function(){

// Prevent rapid multiple clicks with timeout

var $input = $(this);

clearTimeout(clickTimeout);

setTimeout(function(){

var value = $input.val();

var assetid = $input.parents(’.list-item’).data(‘assetid’);

js_api.setMetadata({

asset_id: assetid,

field_id: 123456, // The id of the metadata field to set

field_val: value

});

}, 100);


clearTimeout(clickTimeout);

setTimeout(function(){

var assetid = $input.parents(’.list-item’).data(‘assetid’);

js_api.getMetadata({

asset_id: assetid,

dataCallback: function(response) {

$(’.result-’ + assetid).html(JSON.stringify(response.ww_status)); // replace ww_status with name of your metadata

}

});

}, 1000);


});

</script>

setup fields in type format. Thats pretty much it.