- This topic has 17 replies, 4 voices, and was last updated 11 years, 3 months ago by
.
-
Posts
-
Just wondering if it is possible to create a loyalty card (stamp card)
like the one in the images and if so can anyone help with where to find javascript and html codes
thanx in advanceYou can. To start off with you would need two images, one for not stamped and one for stamped.
Secondly, use local storage (not the most secure way, but probably the easiest) to store your loyalty ‘stamps’, you could load these into variables at startup
Then use a button that calls an input dialog box for the code.
If the code is correct it would set the corresponding stamp to stamped.I dont have any code for it as Im not on my dev system.
On startup (either form or screen) a function to check if any have been stamped, like
if(myStamped == 1)//has been stamped
{//set image 1 to stamped image
}
//etc with the other stampsand in the function to actually stamp one do a quick check to see if they have been stamped, like above, so you can stamp the next one.
Lastly, if all have been stamped you would need to have a function for that, like a new screen that shows the reward that can be used and then resets the myStamped variables.
If I get a chance I will do a sample project as I think this could be useful to people. But the internet is currently out at my house so it may be a few days.
Hi
Does anyone know of any example code to complete the above scenario.
Or what i should be researching to learn how to achieve this
any advice would be great
thanksHi adrog,
I think, the basic setup on the mobile device itself is easy. setting up five different images to appear after each stamp has been done. But, what is more challenging, is the actual stamp itself. I mean, it should be a secret key or similar to allow the next image to appear. just clicking on anything will not work, as the user can then just click by himself.
What process did you have in mind for that? Should there be a QR code scanning, should the BIZz rep enter a PIN or code? does the device need to be connected by WIFI, Bluetooth or Internet?
Voice recognition?
As soon as this is clear, you can think about how to implement it, but in the moment,…?My first thought was for biz rep to enter a secret pin then when correct pin entered it stamps. But then I would need a way to change the pin code often as staff might share the code.
The popup with the pin part I understand a bit but its the stamping part I have not got a clue to be honest.
When I google anything about stamping all I get is postal stamps or loyalty programs which charge for their APICheers thanks
Sorry I’m noob at this stuff only ever done basic web design!!!!
OK, here is an example.
Please look at the StampIt_custom.js file for all the functionality. I tried to comment as much as I can, but sometimes it is still not clear to others.
Basically, the push Button will call a comparison between a stored promo code and the input field. if that is OK, the imagename is increased by one and the next image is loaded.
please try the HTML files first. the .mobi file is also attached and you can play with the design, but it crashes on my computer in the test center. ( I seem to have a lot off issues with the test center lately….:-()
@Octavio: could you please have a look at the .mobi file and see why it crashes in the test center? there is almost nothing in there, but I only get a very short pop up of the loading window of the test center and nothing happenes….@profile
thanks for your time in creating the example, but it crashes mobione test centre as you said. No worries
This gives something to play with thank you again
Its exactly what i was looking for thank you very much sir!!!!!!!!!!! You are awesome.Just need to get it running in mobione hope someone can help with the issue.
Ok I loaded the mobi file and saved under another name and it ran in the test centre and also published as a web app though the project does not function. HMMMM not sure what..
if you save it under another name, you have to change all the references in the xxx_custom.js file in order to work properly.
can you tell me, if the original HTML file worked in Google Chrome? It did with me, only the test center crashed…
What also worked, was opening the test center without the mobi file loaded already, and then load the html file from the test center.Ok, I have another version, which works also in the test center.
It has something to do with the location of the original pictures in the folders, but I am not sure why.
unfortunately, I can not upload this to the server in the moment, as I get an Access forbidden……
Will do as soon as this is resoved.edit: can not upload, because file too big!!! only 1MB allowed. can I send it somewhere else?
it works in chrome great
i uploaded it to a test server if you like to take a look http://mobitest.host56.com
it needs some issues fixed bit its a great start thanks for awesome help@profile
ha you must of posted about other version as i replied.
yea sure you can send it somewhere.you can remove images if that will make it smaller file size and ill put them in if you like?
Ok fixed issue with not working on server
had images saved stamp1.png but code was for capital .PNG so works on test server nicely now.@adrog wrote:
@profile
ha you must of posted about other version as i replied.
yea sure you can send it somewhere.you can remove images if that will make it smaller file size and ill put them in if you like?
Actually, that caused the crashing somehow, because the thing worked fine, then I removed some images, which I thought were not used any longer, and the whole thing blew up…
replacing the images did not help….
I try to make them smallerNow to stretch my community friendship hahaha sorry
How to go about the promo code being removed after being stamped?
Also is there a way that it will reload at progress already made with stamps
or will that work once created into a native app?
thanks very much!!!! I owe you a beer or two for sure//////
