javascript存储
In my previous article I was quite excited about starting my first AIR application, called Harpoon, using only HTML, CSS, and JavaScript. One of the features I ran out of time to discuss was the way you can use an XML file to store and retrieve application preferences.
在上一篇文章中,我仅使用HTML,CSS和JavaScript来启动我的第一个AIR应用程序(称为Harpoon)感到非常兴奋。 我没有时间讨论的功能之一是使用XML文件存储和检索应用程序首选项的方式。
If you downloaded and installed Harpoon you may have noticed the Preferences panel with the select list.
如果您下载并安装了Harpoon,则可能会注意到带有选择列表的“首选项”面板。
Here’s the HTML for that field and its label:
这是该字段HTML及其标签:
<label>Refresh every (minutes)</label>
<select id="pref_refresh" name="pref_refresh">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
...
<option value="10">10</option>
</select>
If you recall, Harpoon is destined to be an auction watching application for the Flippa site. Eventually this will control how often Flippa is checked for new auctions matching your query. Of course you’d want Harpoon to remember this setting, so we’ll store the selected value in an XML file.
如果您还记得,鱼叉注定是Flippa网站的拍卖观看应用程序。 最终,这将控制检查Flippa进行与您的查询匹配的新拍卖的频率。 当然,您希望Harpoon记住此设置,因此我们会将所选值存储在XML文件中。
Our task is this:
我们的任务是这样的:
This sounds way more complicated than it really is. Let’s dive in so I can show you.
这听起来比实际要复杂得多。 让我们潜入,以便我向您展示。
First some adjustments to our Harpoon
object. (If you need to prod your memory, take a detour and refer back to my previous article.) We want to store the refresh value, and a couple of other important values within the Harpoon
object:
首先,对我们的Harpoon
对象进行一些调整。 (如果需要提高记忆力,请绕行并参考我的上一篇文章 。)我们要在Harpoon
对象中存储刷新值和其他两个重要值:
var Harpoon = {
...
prefsFile : null,
storePath : null,
prefs : {
refresh : 10
}
}
I’ll address prefsFile
and storePath
in a moment, but you can also see the prefs
object that has one property called refresh
. This is where we’ll store the refresh value, and it’ll be accessible within our application from Harpoon.prefs.refresh
.
我将在稍后介绍prefsFile
和storePath
,但您还可以看到具有一个称为refresh
属性的prefs
对象。 这是我们存储刷新值的地方,可以在我们的应用程序中从Harpoon.prefs.refresh
进行访问。
Now we come back to the prefsFile
and storePath
properties. For security reasons each AIR application is given its own storage directory from which it can read and write files. This is where our preferences file will reside. These two properties will store the path to the application storage directory and the path to the preferences file.
现在,我们回到prefsFile
和storePath
属性。 出于安全原因,每个AIR应用程序都有其自己的存储目录,可以从中读取和写入文件。 这是我们的首选项文件所在的位置。 这两个属性将存储应用程序存储目录的路径和首选项文件的路径。
If you remember from the previous article Harpoon has an init
function for initialisation, where we placed that call to the setupWindow
function. We’ll add a few lines of code to that:
如果您还记得上一篇文章,Harpoon有一个用于初始化的init
函数,我们将该调用放置在setupWindow
函数中。 我们将在其中添加几行代码:
init : function() {
Harpoon.setupWindow();
Harpoon.storePath = air.File.applicationStorageDirectory;
Harpoon.prefsFile = Harpoon.storePath.resolvePath("prefs.xml");
Harpoon.getPrefs();
...
},
We use the air.File.applicationStorageDirectory
to obtain Harpoon’s storage directory. Then we use the resolvePath
method to retrieve the path to the preferences file prefs.xml
and store it as a File
object. The next line, Harpoon.getPrefs()
, is a call to a new function we shall write.
我们使用air.File.applicationStorageDirectory
获取鱼叉的存储目录。 然后,我们使用resolvePath
方法检索首选项文件prefs.xml
的路径,并将其存储为File
对象。 下一行Harpoon.getPrefs()
是对我们将要编写的新函数的调用。
The getPrefs
function will retrieve the application preferences from the file if it exists, otherwise it will create a new one. The default preferences file will look like this:
getPrefs
函数将从文件中检索应用程序首选项(如果存在),否则将创建一个新的首选项。 默认首选项文件如下所示:
<?xml version="1.0" encoding="utf-8"?>
<preferences>
<refresh>10</refresh>
</preferences>
Here’s the getPrefs
function:
这是getPrefs
函数:
getPrefs : function() {
if (Harpoon.prefsFile.exists) {
...
} else {
...
}
},
First we check to see if the preferences file exists, using the conveniently named exists
property of the File
object we stored back in our init
function. If it does exist, then we read the contents using a custom function you’ll see in a moment called readXML
— basically it takes a file path and returns an XML document:
首先,我们使用方便存储的init
函数命名的File
对象的exists
属性,检查首选项文件是否存在。 如果确实存在,那么我们使用您将在稍后看到的名为readXML
的自定义函数读取内容-基本上,它采用文件路径并返回XML文档:
if (Harpoon.prefsFile.exists) {
var xml = Harpoon.readXML(Harpoon.prefsFile);
We next find the first refresh
element in our XML document using some jQuery selector magic and store its text value as an integer in our Harpoon
object:
接下来,我们使用一些jQuery选择器魔术在XML文档中找到第一个refresh
元素,并将其文本值作为整数存储在Harpoon
对象中:
Harpoon.prefs.refresh = parseInt($(xml).find('refresh:eq(0)').text());
In jQuery :eq(index)
is a selector filter that matches the element by its index. In the above code refresh:eq(0)
will match the first refresh
element.
在jQuery中:eq(index)
是一个选择器过滤器,通过其索引匹配该元素。 在上面的代码中, refresh:eq(0)
将匹配第一个refresh
元素。
The final step in this branch is to set the select field’s value, again using jQuery:
该分支的最后一步是再次使用jQuery设置选择字段的值:
$('#pref_refresh option[value=' + Harpoon.prefs.refresh + ']').attr("selected","selected");
On the other hand, if there’s no preferences file then we want to create one:
另一方面,如果没有首选项文件,那么我们要创建一个:
} else {
Harpoon.savePrefs();
}
The savePrefs
function is another one of our custom functions:
savePrefs
函数是我们的另一个自定义函数:
savePrefs : function() {
var cr = air.File.lineEnding;
var prefsXML = '<?xml version="1.0" encoding="utf-8"?>' + cr
+ '<preferences>' + cr
+ ' <refresh>' + Harpoon.prefs.refresh + "</refresh>" + cr
+ '</preferences>';
Harpoon.writeXML(Harpoon.prefsFile, prefsXML);
},
It’s a simple function that builds a string representing the XML tags, and saves it to the preferences file using the as yet unseen writeXML
function. The current value of Harpoon.prefs.refresh
is concatenated into the XML string. You may notice the use of air.File.lineEnding
in the above function; it’s a property that represents the platform line-ending character which is different on Mac OS X, Windows, and Linux.
这是一个简单的函数,可构建表示XML标签的字符串,并使用尚未出现的writeXML
函数将其保存到首选项文件中。 Harpoon.prefs.refresh
的当前值被串联到XML字符串中。 您可能会注意到上面函数中使用了air.File.lineEnding
; 它是代表平台行尾字符的属性,在Mac OS X,Windows和Linux上是不同的。
Now to those previously named readXML
and writeXML
functions. In Adobe AIR, if you want to read and write files in JavaScript you need to use a FileStream
object. First, the readXML
file creates a new FileStream
object and opens the preference file from the File
object we pass into it, in read mode. The FileStream
is read as a string, stored in the xml
variable, and closed:
现在到那些以前命名的readXML
和writeXML
函数。 在Adobe AIR中,如果要使用JavaScript读写文件,则需要使用FileStream
对象。 首先, readXML
文件创建一个新的FileStream
对象,并以读取方式从传递给它的File
对象中打开首选项文件。 FileStream
作为字符串读取,存储在xml
变量中,并关闭:
readXML : function(path) {
var stream = new air.FileStream();
stream.open(path, air.FileMode.READ);
var xml = stream.readUTFBytes(stream.bytesAvailable);
stream.close();
Next we use aDOMParser
object to convert the string into an XML document and return it:The
writeXML
function also uses aFileStream
object, but opens it in write mode. This function takes aFile
object and the XML source string, and writes the string to the file:writeXML : function(path, xml) {
var stream = new air.FileStream();
stream.open(path, air.FileMode.WRITE);
stream.writeUTFBytes(xml);
stream.close();
},Have we forgotten anything? There's still one more task. When the user changes the preference value in the interface we want Harpoon to save that preference. All it takes is a simple event listener:
The above code binds a function to be executed every time the select list value is changed. The function stores the new preference value and calls the
savePrefs
function. We add this to thesetupWindow
function we created in the first article.And there we have it. Reading and writing preferences to an XML file using JavaScript in an Adobe AIR application: easy! The source code can be downloaded as well as the packaged application. Hopefully this has provided enough code for you to go and implement preferences in your own AIR application.
readXML : function(path) {
var stream = new air.FileStream();
stream.open(path, air.FileMode.READ);
var xml = stream.readUTFBytes(stream.bytesAvailable);
stream.close();
Next we use aDOMParser
object to convert the string into an XML document and return it:The
writeXML
function also uses aFileStream
object, but opens it in write mode. This function takes aFile
object and the XML source string, and writes the string to the file:writeXML : function(path, xml) {
var stream = new air.FileStream();
stream.open(path, air.FileMode.WRITE);
stream.writeUTFBytes(xml);
stream.close();
},Have we forgotten anything? There's still one more task. When the user changes the preference value in the interface we want Harpoon to save that preference. All it takes is a simple event listener:
The above code binds a function to be executed every time the select list value is changed. The function stores the new preference value and calls the
savePrefs
function. We add this to thesetupWindow
function we created in the first article.And there we have it. Reading and writing preferences to an XML file using JavaScript in an Adobe AIR application: easy! The source code can be downloaded as well as the packaged application . Hopefully this has provided enough code for you to go and implement preferences in your own AIR application.
翻译自: https://www.sitepoint.com/adobe-air-pref-javascript/
javascript存储
版权声明:本站所有资料均为网友推荐收集整理而来,仅供学习和研究交流使用。
工作时间:8:00-18:00
客服电话
电子邮件
admin@qq.com
扫码二维码
获取最新动态