Saving settings on Phonegap/Javascript app - caching

I have an Android Phonegap app made with HTML5/Javascript/CSS. I'd like to suggest the users to choose between light and dark themes at the very first start of the app. When the user once chooses one of them this chose should be saved and relevant theme should be set as default at evry further start of the app. I have read some posts on this theme and am not sure which solution to take: Cache, cookies or HTML5 local storage (I am not familiar with any of them). Which one fits better to my app?
Thank you all!

localStorage wins, simply for persistence and ease-of-use:
// set the selected theme
localStorage.setItem("appTheme") = "dark";
...
var lsTheme = localStorage.getItem("appTheme"),
theme = (typeof lsTheme !== "undefined" ? lsTheme : "bright");
// do something with the selected theme; "bright" is default if no preference stored.

localStorage is the simplest and most effective solution like Kerri Shotts said however the setItem methods syntax is different to that displayed in her answer. As it takes to parameters one being the keyName the other being the keyValue like so: storage.setItem(keyName, keyValue); This then retrieved using the getItem method like so: var aValue = storage.getItem(keyName);.
e.g.
localStorage.setItem('bgcolor', 'red');
localStorage.setItem('font', 'Helvetica');
localStorage.setItem('image', 'myCat.png');
var currentColor = localStorage.getItem('bgcolor');
var currentFont = localStorage.getItem('font');
var currentImage = localStorage.getItem('image');

Related

nativescript - change variable on exitEvent

I need to be able to change some variable's value, when app is closed.
I'm using exitEvent described here:
https://docs.nativescript.org/core-concepts/application-lifecycle
Also, i'm using local-storage plugin that works similar to javasctip's localstorage.
https://github.com/NathanaelA/nativescript-localstorage
My simple code looks like this:
var Observable = require("data/observable").Observable;
require("nativescript-dom");
var LS = require("nativescript-localstorage");
const application = require("tns-core-modules/application");
var page = require("ui/page");
exports.load = function (args) {
var page = args.object;
var model = new Observable();
var frame = require('ui/frame');
var ff = frame.getFrameById("dashboard");
var topmost = frame.topmost();
// This is exit event
application.on(application.exitEvent, (args) => {
LS.setItem('XX','111')
});
// What i will exit app, and run app again this will newer become 111,
it's null all the time
console.log(LS.getItem('XX'));
}
So, my question is - is possible to set any flag on app exit - it do not have to be localstorage (i've tested global variables to), to detect if exit was made, and based on this i can make a decisions that will help me ?
One of scenarios may be - i'm holding some flag in Localstorage that is TURE is user tapped "rememebr me" on the login screen.
So on exit i can check if he want's to be rememebered, if not i want to send user to login page and not dashboard when app is lauching....
Thank you.
EDIT:
I've tried applications-settings too, it will not work.
application.on(application.exitEvent, (args) => {
applicationSettings.setString("Name", "John Doe");
});
console.log(applicationSettings.getString("Name")); // not working
I suspect it's the issue with the nativescript-localstorage plugin. It writes the changes to file after a 250ms delay. At exit event you will give you very limited amount of time before your app is completely killed by system.
May be the Author had a reason for setting up this delay but I think its too much of time at least in this particular scenario so the changes are never written to file. You may raise a issue at the plugin's Github repo.
If you are looking for an immediate workaround, copy localstorage.js to your app and export internalSaveData from the file, so you could directly call it right after you finish setting your values.

Save multiple images with one function - AS3 ADOBE AIR

I've got an Array with 17 web links of images
var products:Array;
trace(products)
// Ouput :
"http://www.myWebsite.com/zootopia.jpg"
"http://www.myWebsite.com/james.jpg"
"http://www.myWebsite.com/tom.jpg"
..etc
If I do products[10].movieimage; the output will be the 9th link (something like : "http://www.myWebsite.com/lalaland.jpg")
I'm looking for downloading every images without a dialog box.
I manage to do so for 1 image with the specific link, like that :
function saveImage (event:Event):void {
var stream:URLStream = new URLStream();
var image1:File = File.documentsDirectory.resolvePath("test.jpg");
var fileStream:FileStream = new FileStream();
stream.load(new URLRequest("http://www.myWebsite.com/lalaland.jpg"));
stream.addEventListener(Event.COMPLETE, writeComplete);
        
function writeComplete(evt:Event):void  {
                var fileData:ByteArray = new ByteArray();
                stream.readBytes(fileData,0,stream.bytesAvailable);
                fileStream.openAsync(image1, FileMode.UPDATE);
                fileStream.writeBytes(fileData,0,fileData.length);
                fileStream.close();
trace("writeComplete");
trace(image1.url);
        }
}
Question : Is there a way to download all the images with the web links of my products array ? (and if images already exist, replace them. I could use if (image1.exists){ if (image2.exists){ ..etc for each image. But maybe there is a simplier solution)
If you could show me how, with a bit of code, I could that.
Also, note that I'd like to load the images then in Uiloader, like that :
function loadImages():void {
uiloader1.source = image1.url;
uiloader2.source = image2.url;
etc...
}
Don't over think it. You have your array of images. You have your tested routine for saving one image. Now put it together:
Some function initializes things and kicks it off.
Either splice out (or pop out) an item on the array – OR use a index var to access an item in the array
Pass that to your download function.
When the download completes either pop another item off the array OR increment your index. But first you would test if array.length== 0 OR `index > array.length. If either is true (depending on which method you use), then you are done.
If you want to get fancy you can show a progress bar and update it each time your download completes.

Xamarin Android : Retain data on activity change and come back

I'm developing an app in Xamarin.android where in I want to retain the data of Edit Text, spinners etc. whenever i revisit to that activity. E.g.
Activity A contains Edit Text, Spinners.
I navigate to Activity B from Activity A, and whenever I come back to Activity A from B I want to retain those values of Edit Text and Spinners.
I tried using Put Extra and Get Extra, but as there are multiple values this approach seems to be wrong.
var activity2 = new Intent (this, typeof(Activity2));
activity2.PutExtra ("MyData", "Data from Activity1");
StartActivity (activity2);
Also OnSaveInstanceState and OnRestoreInstanceState is not working out for me as I'm using Fragments in my Activity A
Please Guide
Can't your fragments save their own data using Fragment.onSaveInstanceState ?
in your case you need to save this temp data in Shared Preference
here is example
ISharedPreferences prefs = PreferenceManager.GetDefaultSharedPreferences(this);
ISharedPreferencesEditor editor = prefs.Edit();
editor.PutInt(("number_of_times_accessed", accessCount++);
editor.PutString("date_last_accessed", DateTime.Now.ToString("yyyy-MMM-dd"));
editor.Apply();
save what ever you want int or string
and when you load you activity retrieve this data and set it to your views
ISharedPreferences prefs = PreferenceManager.GetDefaultSharedPreferences(this);
string passedString = prefs.GetString(key, defValue);
// here set retured data to your view
// Ex : YourEditText.Text = passedString
hope this help

SystemMediaTransportControls - setting properties not working

I'm trying to use the SystemMediaTransportControls in an background audio app. I am using the MediaPlayer class to play the audio. Setting the music properties, thumbnail all seems to work fine, but setting the control buttons (i.e. "next" button) is not working at all. My use case is somewhat unique in that I can't get a complete playlist at once, the next track is only available through a internal method call.
Here is what I am doing:
This part is working fine, the volume control shows all the audio information and thumbnail correctly:
var playbackItem = new MediaPlaybackItem(source);
var displayProperties = playbackItem.GetDisplayProperties();
displayProperties.Type = Windows.Media.MediaPlaybackType.Music;
displayProperties.Thumbnail = RandomAccessStreamReference.CreateFromUri(new Uri(_currentTrack.AlbumArtUrl));
displayProperties.MusicProperties.AlbumArtist = displayProperties.MusicProperties.Artist = _currentTrack.Artist;
displayProperties.MusicProperties.Title = _currentTrack.SongTitle;
displayProperties.MusicProperties.AlbumTitle = _currentTrack.Album;
playbackItem.CanSkip = true;
playbackItem.ApplyDisplayProperties(displayProperties);
_player.Source = playbackItem;
This part is not working, the "Next" button is still disabled, the "Record" button is not showing.
var smtc = _player.SystemMediaTransportControls;
smtc.ButtonPressed += OnSMTCButtonPressed;
smtc.IsEnabled = true;
smtc.IsNextEnabled = true;
smtc.IsRecordEnabled = true;
I've been trying to look for answers online but was unable to find anything useful. Any answer is appreciated.
In UWP, apart SMTC, there is something like CommandManager - to properly work with your SMTC you will have to disable it. Just put the line:
mediaPlayer.CommandManager.IsEnabled = false;
once you initialize the player and it should work. You will find more information at MSDN:
If you are using MediaPlayer to play media, you can get an instance of the SystemMediaTransportControls class by accessing the MediaPlayer.SystemMediaTransportControls property. If you are going to manually control the SMTC, you should disable the automatic integration provided by MediaPlayer by setting the CommandManager.IsEnabled property to false.

Fabric JS still including default values

I tried to set the includeDefaultValues:false every time I create an object, however, the save string for an image is still:
[{"type":"image","originX":"center","originY":"center","left":396.16,"top":108.16,"width":2475,"height":675,"fill":"rgb(0,0,0)","overlayFill":null,"stroke":null,"strokeWidth":1,"strokeDashArray":null,"strokeLineCap":"butt","strokeLineJoin":"miter","strokeMiterLimit":10,"scaleX":0.32,"scaleY":0.32,"angle":0,"flipX":false,"flipY":false,"opacity":1,"selectable":true,"hasControls":true,"hasBorders":true,"hasRotatingPoint":true,"transparentCorners":true,"perPixelTargetFind":false,"shadow":null,"visible":true,"clipTo":null,"src":"http://localhost/fabricjstest/designs/images/ds130814014834.png?t=1376502517","filters":[]}],"background":"#FFF"}
I am pretty sure most of those are default values, so how can I get it to work?
Maybe I am saving wrong, so this is my save code:
var obj = canvas.toObject();
var jsn = JSON.stringify(obj);
alert(jsn);
Here is the version directly from the js file: var fabric=fabric||{version:"1.2.9"};
So the question is: How do I disable default values.

Resources