Commits

Aaron Toth committed 306a0fd

Ready for 1.2.1

Comments (0)

Files changed (28)

.DS_Store

Binary file removed.
-APPNAME = me.aaront.pinnned
-VERSION = 1.2.0
+APPNAME = me.aaront.pinnned-beta
+VERSION = 1.2.1
 PACKAGEFILE = $(APPNAME)_$(VERSION)_all.ipk
 BUILDDIR = build/
 
 {
     "id" : "me.aaront.pinnned",
-    "version" : "1.2.0",
+    "version" : "1.2.1",
     "vendor" : "Aaron Toth",
     "vendorurl" : "http://aaront.me",
     "type" : "web",
     "styles/Pinnned.css",
     "styles/AccountsPanel.css",
     "styles/BookmarksPanel.css",
+    "styles/WebPanel.css",
     "styles/DefaultViewerPanel.css",
     "styles/Preferences.css",
     "styles/Welcome.css"

images/icon.png

Added
New image

images/progress-bar-inner.png

Added
New image

images/progress-bar.png

Added
New image
+{
+	"Recent": "Récents",
+	"By Tag": "Par tag",
+	"By Date": "Par date",
+	"recent": "récents",
+	"Tag": "Tag",
+	"tag": "tag",
+	"date": "date",
+	"From": "à partir",
+	"To": "au",
+	"Search Titles": "Titres recherche",
+	"Search": "Recherche",
+	"Open in Card": "Ouvrir dans une carte",
+	"Preferences & Accounts": "Préférences et comptes",
+	"Report a Problem...": "Signaler un problème...",
+	"Report a Problem": "Signaler un problème",
+	"About Pinnned...": "À propos Pinnned...",
+	"Pinnned Preferences": "Préférences Pinnned",
+	"Accounts": "Comptes",
+	"Delete": "Supprimer",
+	"Add New Account": "Ajouter un nouveau compte",
+	"Reading": "Préférences de Lecture",
+	"View bookmarks using": "Afficher des signets à l'aide",
+	"Done": "Terminé",
+	"Add an Account": "Ajouter un compte",
+	"Need an account?": "Besoin d'un compte?",
+	"Account Details": "Détails du compte",
+	"Username": "Nom d'utilisateur",
+	"Password": "Mot de passe",
+	"Service": "Service",
+	"Cancel": "Annuler",
+	"Submit": "Soumettre",
+	"Register for an Account": "Inscrire à un compte",
+	"Compatible Services": "Services compatibles",
+	"Hello!": "Salut!",
+	"<strong>Thanks for purchasing Pinnned</strong>, the premier social bookmarking client for the HP Touchpad!": "<strong>Merci d'avoir acheté Pinnned</strong>, le client bookmarking sociaux de premier pour le HP Touchpad!",
+	"<strong>Pinnned</strong> just needs one piece of information to get started: an account.": "<strong>Pinnned</strong> a juste besoin d'un élément d'information pour commencer: un compte.",
+	"Please type in your details below and click <strong>'Next'</strong> to see your bookmarks, or tap the <strong>'I Need an Account'</strong> button to to get an account.": "S'il vous plaît entrez vos coordonnées ci-dessous et cliquez sur <strong>'Suivant'</strong> pour voir vos signets, ou appuyez sur le <strong>'Je besoin d'un compte'</strong> bouton pour obtenir un compte.",
+	"I Need an Account": "Je besoin d'un compte",
+	"Next": "Suivant",
+	"Error": "D'Erreur",
+	"Report problem...": "Signaler...",
+	"OK": "OK",
+	"The request is invalid and cannot be processed": "La demande est invalide et ne peut pas être traitée",
+	"Your account login seems to be incorrect": "Votre compte semble être incorrect",
+	"What you're looking for wasn't found": "Qu'est-ce que vous recherchez n'a pas été trouvé",
+	"An unexpected server error occurred": "Une erreur de serveur inattendue s'est produite",
+	"Sorry, unable to process your request at this time. Wait a while and try again": "Désolé, impossible de traiter votre demande en ce moment. Attendez un peu et essayer à nouveau",
+	"This will send important information to me via email so I will be able to fix your issue sooner": "Ce sera d'envoyer des informations importantes pour moi par e-mail je vais donc être en mesure de résoudre votre problème plus tôt",
+	"Additional Details": "Détails supplémentaires",
+	"Information is required. Please describe your problem before sending.": "L'information est nécessaire. S'il vous plaît décrire votre problème avant l'envoi.",
+	"<strong>Required</strong>: ": "<strong>Obligatoires</strong>: ",
+	"<strong>Optional</strong>: ": "<strong>En option</strong>: ",
+	"Type what kind of account you were using, what you were trying to access, etc. Describe the problem as well as you can.": "Type de quel type de compte que vous utilisez, ce que vous essayez d'accéder, etc. Décrire le problème ainsi que vous le pouvez.",
+	"Hand-crafted by Aaron Toth in Ontario, Canada": "Faite à la main par Aaron Toth en Ontario, Canada",
+	"Licensed under the Apache License, Version 2.0": "Autorisé sous Apache License, Version 2.0",
+	"Licence Information": "Information sur la licence",
+	"Go to the Pinnned Website": "Allez au site web Pinnned"
+}
+{
+	"Recent": "Récents",
+	"By Tag": "Par tag",
+	"By Date": "Par date",
+	"recent": "récents",
+	"Tag": "Tag",
+	"tag": "tag",
+	"date": "date",
+	"From": "à partir",
+	"To": "au",
+	"Search Titles": "Titres recherche",
+	"Search": "Recherche",
+	"Open in Card": "Ouvrir dans une carte",
+	"Preferences & Accounts": "Préférences et comptes",
+	"Report a Problem...": "Signaler un problème...",
+	"Report a Problem": "Signaler un problème",
+	"About Pinnned...": "À propos Pinnned...",
+	"Pinnned Preferences": "Préférences Pinnned",
+	"Accounts": "Comptes",
+	"Delete": "Supprimer",
+	"Add New Account": "Ajouter un nouveau compte",
+	"Reading": "Préférences de Lecture",
+	"View bookmarks using": "Afficher des signets à l'aide",
+	"Done": "Terminé",
+	"Add an Account": "Ajouter un compte",
+	"Need an account?": "Besoin d'un compte?",
+	"Account Details": "Détails du compte",
+	"Username": "Nom d'utilisateur",
+	"Password": "Mot de passe",
+	"Service": "Service",
+	"Cancel": "Annuler",
+	"Submit": "Soumettre",
+	"Register for an Account": "Inscrire à un compte",
+	"Compatible Services": "Services compatibles",
+	"Hello!": "Salut!",
+	"<strong>Thanks for purchasing Pinnned</strong>, the premier social bookmarking client for the HP Touchpad!": "<strong>Merci d'avoir acheté Pinnned</strong>, le client bookmarking sociaux de premier pour le HP Touchpad!",
+	"<strong>Pinnned</strong> just needs one piece of information to get started: an account.": "<strong>Pinnned</strong> a juste besoin d'un élément d'information pour commencer: un compte.",
+	"Please type in your details below and click <strong>'Next'</strong> to see your bookmarks, or tap the <strong>'I Need an Account'</strong> button to to get an account.": "S'il vous plaît entrez vos coordonnées ci-dessous et cliquez sur <strong>'Suivant'</strong> pour voir vos signets, ou appuyez sur le <strong>'Je besoin d'un compte'</strong> bouton pour obtenir un compte.",
+	"I Need an Account": "Je besoin d'un compte",
+	"Next": "Suivant",
+	"Error": "D'Erreur",
+	"Report problem...": "Signaler...",
+	"OK": "OK",
+	"The request is invalid and cannot be processed": "La demande est invalide et ne peut pas être traitée",
+	"Your account login seems to be incorrect": "Votre compte semble être incorrect",
+	"What you're looking for wasn't found": "Qu'est-ce que vous recherchez n'a pas été trouvé",
+	"An unexpected server error occurred": "Une erreur de serveur inattendue s'est produite",
+	"Sorry, unable to process your request at this time. Wait a while and try again": "Désolé, impossible de traiter votre demande en ce moment. Attendez un peu et essayer à nouveau",
+	"This will send important information to me via email so I will be able to fix your issue sooner": "Ce sera d'envoyer des informations importantes pour moi par e-mail je vais donc être en mesure de résoudre votre problème plus tôt",
+	"Additional Details": "Détails supplémentaires",
+	"Information is required. Please describe your problem before sending.": "L'information est nécessaire. S'il vous plaît décrire votre problème avant l'envoi.",
+	"<strong>Required</strong>: ": "<strong>Obligatoires</strong>: ",
+	"<strong>Optional</strong>: ": "<strong>En option</strong>: ",
+	"Type what kind of account you were using, what you were trying to access, etc. Describe the problem as well as you can.": "Type de quel type de compte que vous utilisez, ce que vous essayez d'accéder, etc. Décrire le problème ainsi que vous le pouvez.",
+	"Hand-crafted by Aaron Toth in Ontario, Canada": "Faite à la main par Aaron Toth en Ontario, Canada",
+	"Licensed under the Apache License, Version 2.0": "Autorisé sous Apache License, Version 2.0",
+	"Licence Information": "Information sur la licence",
+	"Go to the Pinnned Website": "Allez au site web Pinnned"
+}
         ]},
         {kind: "AppMenu", components: [
             {kind: "EditMenu"},
-            {caption: "Preferences & Accounts", onclick: "showPreferences"},
+            {caption: $L("Preferences & Accounts"), onclick: "showPreferences"},
             {kind: "HelpMenu", target: "http://getsatisfaction.com/aaron_toth/products/aaron_toth_pinnned"},
-            {caption: "Report a Problem...",onclick: "reportProblem"},
-            {caption: "About Pinnned...", onclick: "showAbout"}
+            {caption: $L("Report a Problem..."), onclick: "reportProblem"},
+            {caption: $L("About Pinnned..."), onclick: "showAbout"}
         ]},
         {name: "aboutPopup", kind: "Popup", scrim: true, modal: true, className: "transitioner", width: "500px", components: [
-            {content: "Pinnned v.1.2.0", style: "font-size: 26px; padding: 6px;"},
-            {content: "Hand-crafted by Aaron Toth in Ontario, Canada", style: "font-size: 15px; padding: 6px;"},
-            {content: "Licensed under the Apache License, Version 2.0", style: "font-size: 15px; padding: 6px; color: #999;"},
-            {kind: "Button", flex: 1, caption: "Licence Information", style: "margin-top: 15px;", onclick: "showLicense"},
-            {kind: "Button", flex: 1, caption: "Go to the Pinnned Website", onclick: "visitHomepage"},
-            {kind: "Button", flex: 1, caption: "OK", onclick: "aboutOk", className: "enyo-button-affirmative", style: "margin-top: 15px;", isDefault: true}
+            {content: "Pinnned v.1.2.1", style: "font-size: 26px; padding: 6px;"},
+            {content: $L("Hand-crafted by Aaron Toth in Ontario, Canada"), style: "font-size: 15px; padding: 6px;"},
+            {content: $L("Licensed under the Apache License, Version 2.0"), style: "font-size: 15px; padding: 6px; color: #999;"},
+            {kind: "Button", flex: 1, caption: $L("Licence Information"), style: "margin-top: 15px;", onclick: "showLicense"},
+            {kind: "Button", flex: 1, caption: $L("Go to the Pinnned Website"), onclick: "visitHomepage"},
+            {kind: "Button", flex: 1, caption: $L("OK"), onclick: "aboutOk", className: "enyo-button-affirmative", style: "margin-top: 15px;", isDefault: true}
         ]},
         {name: "accountUtilities", kind: "me.aaront.AccountUtilities"},
         {kind: "ApplicationEvents", onWindowActivated: "showOrBypassWelcomeView"},
         {name: "reportProblem", kind: "me.aaront.Reporter", requiredDetails: true}
     ],
+    create: function() {
+        this.inherited(arguments);
+        this.currentLocale = enyo.g11n.currentLocale();
+    },
     openAppMenuHandler: function() {
         this.$.appMenu.open();
     },

source/dialogs/AddAccount.js

     },
     components: [
         {kind: "HFlexBox", style: "padding-top: 6px;", components: [
-            {content: "Add an Account", flex: 2, style: "font-size: 26px; padding: 6px;"},
-            {kind: "Button", flex: 1, caption: "Need an account?", onclick: "registerAccount"}
+            {content: $L("Add an Account"), flex: 4, style: "font-size: 20px; padding: 4px;"},
+            {kind: "Button", flex: 3, caption: $L("Need an account?"), onclick: "registerAccount"}
         ]},
-        {kind: "RowGroup", caption: "Service", components: [
-            {name: "service", kind: "ListSelector", value: 1}
-        ]},
-        {kind: "RowGroup", caption: "Account Details", components: [
-            {name: "username", kind: "Input", hint: "Username", autoCapitalize: "lowercase"},
-            {name: "password", kind: "PasswordInput", hint: "Password"}
+        {kind: "RowGroup", caption: $L("Account Details"), components: [
+            {name: "username", kind: "Input", hint: $L("Username"), autoCapitalize: "lowercase"},
+            {name: "password", kind: "PasswordInput", hint: $L("Password")},
+            {name: "service", kind: "ListSelector", label: $L("Service"), flex: 1, value: 1}
         ]},
         {kind: "HFlexBox", style: "padding-top: 6px;", components: [
-            {kind: "Button", flex: 1, caption: "Cancel", onclick: "doCancel"},
-            {name: "saveButton", kind: "ActivityButton", flex: 1, className: "enyo-button-affirmative", caption: "Submit", onclick: "submitAccount"}
+            {kind: "Button", flex: 1, caption: $L("Cancel"), onclick: "doCancel"},
+            {name: "saveButton", kind: "ActivityButton", flex: 1, className: "enyo-button-affirmative", caption: $L("Submit"), onclick: "submitAccount"}
         ]},
         {name: "accountUtilities", kind: "me.aaront.AccountUtilities"},
         {name: "bmarkAlchemy", kind: "me.aaront.BmarkAlchemy", onResults: "gotConfirmation", onErrorClosed: "errorClosed", onReportOpen: "reportClose"}
     ],
     create: function() {
         this.inherited(arguments);
-        this.$.service.setItems(this.$.accountUtilities.getListOfServices());
+        this.$.service.setItems(this.$.accountUtilities.getListOfServicesWithIcon());
     },
     service: function() {
         return this.$.service.getValue();
         this.$.password.setValue("");
     },
     registerAccount: function(inSender) {
-        this.doRegister();
+        enyo.nextTick(this, function() {
+            this.doRegister();
+        });
     },
     submitAccount: function(inSender) {
-        inSender.setActive(true);
-        this.$.bmarkAlchemy.get("info", "update", {
-            service: this.$.service.getValue(),
-            username: this.$.username.getValue(),
-            password: this.$.password.getValue()
+        enyo.nextTick(this, function() {
+            inSender.setActive(true);
+            this.$.bmarkAlchemy.get("info", "update", {
+                service: this.$.service.getValue(),
+                username: this.$.username.getValue(),
+                password: this.$.password.getValue()
+            });
         });
     },
     gotConfirmation: function(inSender, inResults) {

source/dialogs/Date.js

         onCancel: ""
     },
     components: [
-        {content: "By Date", style: "font-size: 26px; padding: 6px;"},
+        {content: $L("By Date"), style: "font-size: 26px; padding: 6px;"},
         {kind: "RowGroup", caption: "Date Range", components: [
             {kind: "HFlexBox", flex: 1, components: [
                 {kind: "Spacer", flex: 1},
-                {name: "fromDate", kind: "DatePicker", label: "From"}
+                {name: "fromDate", kind: "DatePicker", label: $L("From")}
             ]},
             {kind: "HFlexBox", flex: 1, components: [
                 {kind: "Spacer", flex: 1},
-                {name: "toDate", kind: "DatePicker", label: "To"}
+                {name: "toDate", kind: "DatePicker", label: $L("To")}
             ]}
         ]},
         {kind: "HFlexBox", style: "padding-top: 6px;", components: [
-            {kind: "Button", flex: 1, caption: "Cancel", onclick: "doCancel"},
+            {kind: "Button", flex: 1, caption: $L("Cancel"), onclick: "doCancel"},
             {kind: "Spacer"},
-            {kind: "Button", flex: 1, className: "enyo-button-affirmative", caption: "Submit", onclick: "doSubmit"}
+            {kind: "Button", flex: 1, className: "enyo-button-affirmative", caption: $L("Submit"), onclick: "doSubmit"}
         ]}
     ],
     fromDate: function() {

source/dialogs/Error.js

 enyo.kind({
     name: "me.aaront.Error",
     kind: enyo.ModalDialog,
-    caption: "Error",
+    caption: $L("Error"),
     lazy: false,
     width: "400px",
     events: {
     components: [
         {name: "errorContent", className: "enyo-text-error warning-icon"},
         {kind: "HFlexBox", flex: 1, components: [
-            {name: "reportButton", kind: "Button", flex: 1, caption: "Report problem...", onclick: "reportProblem"},
-            {name: "okButton", kind: "Button", flex: 1, caption: "OK", onclick: "closePopup", className: "enyo-button-negative"}
+            {name: "reportButton", kind: "Button", flex: 1, caption: $L("Report problem..."), onclick: "reportProblem"},
+            {name: "okButton", kind: "Button", flex: 1, caption: $L("OK"), onclick: "closePopup", className: "enyo-button-negative"}
         ]}
     ],
     errorParser: {
         this.inherited(arguments);
     },
     gotError: function(errorNumber, errorText) {
-        this.$.errorContent.setContent(this.errorParser.hasOwnProperty(errorNumber) ? this.errorParser[errorNumber] : "Error " + errorNumber.toString() + ": " +errorText);
+        this.$.errorContent.setContent(this.errorParser.hasOwnProperty(errorNumber) ? this.errorParser[errorNumber] : $L("Error") + " " + errorNumber.toString() + ": " +errorText);
     },
     closePopup: function(inSender) {
         this.doClose();

source/dialogs/RegisterAccount.js

         onCancel: ""
     },
     components: [
-        {content: "Register for an Account", flex: 2, style: "font-size: 26px; padding: 6px;"},
-        {kind: "RowGroup", caption: "Compatible Services", components: [
+        {content: $L("Register for an Account"), flex: 2, style: "font-size: 26px; padding: 6px;"},
+        {kind: "RowGroup", caption: $L("Compatible Services"), components: [
             {kind: "RowItem", onclick: "pinboard", tapHighlight: true, components: [
                 {kind: "Image", src: "images/pinboard.png", width: "40px", style: "float: left; padding-right: 20px;"},
                 {content: "Pinboard", flex: 1, style: "height: 30px; padding-top: 6px;"}
                 {content: "Delicious", flex: 1, style: "height: 30px; padding-top: 6px;"}
             ]}
         ]},
-        {kind: "Button", flex: 1, caption: "Cancel", onclick: "doCancel"}
+        {kind: "Button", flex: 1, caption: $L("Cancel"), onclick: "doCancel"}
     ],
     pinboard: function(inSender) {
-        this.register("http://pinboard.in/signup/");
+        enyo.nextTick(this, function() {
+            this.register("http://pinboard.in/signup/");
+        });
     },
     delicious: function(inSender) {
-        this.register("https://secure.delicious.com/register");
+        enyo.nextTick(this, function() {
+            this.register("https://secure.delicious.com/register");
+        });
     },
     register: function(url) {
         var service = new enyo.PalmService();

source/dialogs/Reporter.js

     name: "me.aaront.Reporter",
     kind: enyo.Popup,
     scrim: true,
+    modal: true,
     width: "500px",
-    lazy: true,
+    lazy: false,
     published: {
         errorText: "",
         requiredDetails: false
     },
     components: [
         {kind: "HFlexBox", style: "padding-top: 6px;", components: [
-            {content: "Report a Problem", flex: 1, style: "font-size: 26px; padding: 6px;"}
+            {content: $L("Report a Problem"), flex: 1, style: "font-size: 26px; padding: 6px;"}
         ]},
-        {content: "This will send important information to me via email so I will be able to fix your issue sooner", style: "font-size: 0.8em; color: #666; padding: 10px 15px;"},
-        {kind: "Group", caption: "Additional Details", components: [
+        {content: $L("This will send important information to me via email so I will be able to fix your issue sooner"), style: "font-size: 0.8em; color: #666; padding: 10px 15px;"},
+        {kind: "Group", caption: $L("Additional Details"), components: [
             {kind: "Scroller", height: "100px", components: [
-                {name: "additionalDetails", kind: "RichText", hint: "Type what kind of account you were using, what you were trying to access, etc. Describe your problem as well as you can.", flex: 1}
+                {name: "additionalDetails", kind: "RichText", hint: $L("Type what kind of account you were using, what you were trying to access, etc. Describe the problem as well as you can."), flex: 1}
             ]}
         ]},
-        {name: "errorText", content: "Information is required. Please describe your problem before sending.", style: "color: #800; font-size: 0.8em;"},
-        {name: "sendButton", kind: "Button", caption: "Send", onclick: "sendEmail", className: "enyo-button-negative"},
+        {name: "errorText", content: $L("Information is required. Please describe your problem before sending."), style: "color: #800; font-size: 0.8em;"},
+        {name: "sendButton", kind: "Button", caption: $L("Submit"), onclick: "sendEmail", className: "enyo-button-negative"},
         {name: "sendEmail", kind: "PalmService", service: "palm://com.palm.applicationManager", method: "open", subscribe: false}
     ],
     create: function() {
     },
     componentsReady: function() {
         this.$.errorText.hide();
-        var preface = this.requiredDetails === true ? "<strong>Required</strong>: " : "<strong>Optional</strong>: ";
+        var preface = this.requiredDetails === true ? $L("<strong>Required</strong>: ") : $L("<strong>Optional</strong>: ");
         this.$.additionalDetails.setHint(preface + this.$.additionalDetails.getHint());
-        this.$.additionalDetails.forceFocusEnableKeyboard();
     },
     sendEmail: function() {
-        var additionalComment = this.$.additionalDetails.getValue();
-        if (this.requiredDetails && additionalComment === "") {
-            this.$.errorText.show();
-        }
-        else {
-            additionalComment = additionalComment + "<br><br>---------------------------------------------------------<br><br>";
-            this.$.sendEmail.call({
-                 id: 'com.palm.app.email',
-                 params: {
-                     recipients: [{
-                       type: "email",
-                       role: 1,
-                       value: "pinnnederrors@aaront.me"
-                     }],
-                     summary: "Pinnned Error - " + new Date(),
-                     text: additionalComment + this.errorText
-                 }
-            });
-            this.close();
-        }
+        enyo.nextTick(this, function() {
+            var additionalComment = this.$.additionalDetails.getValue();
+            if (this.requiredDetails && additionalComment === "") {
+                this.$.errorText.show();
+            }
+            else {
+                additionalComment = additionalComment + "<br><br>---------------------------------------------------------<br><br>";
+                this.$.sendEmail.call({
+                     id: 'com.palm.app.email',
+                     params: {
+                         recipients: [{
+                           type: "email",
+                           role: 1,
+                           value: "pinnnederrors@aaront.me"
+                         }],
+                         summary: "Pinnned Error - " + new Date(),
+                         text: additionalComment + this.errorText
+                     }
+                });
+                this.$.additionalDetails.setValue("");
+                this.close();
+            }
+        });
     }
 });

source/dialogs/Tag.js

     },
     components: [
         {kind: "HFlexBox", flex: 1, components: [
-            {content: "By Tag", style: "font-size: 26px; padding: 6px;", flex: 1},
+            {content: $L("By Tag"), style: "font-size: 26px; padding: 6px;", flex: 1},
             {kind: "Spinner"}
         ]},
-        {name: "tagGroup", kind: "RowGroup", caption: "Tag", components: [
+        {name: "tagGroup", kind: "RowGroup", caption: $L("Tag"), components: [
             {name: "tag", kind: "CustomListSelector", items: this.tags}
         ]},
         {kind: "HFlexBox", style: "padding-top: 6px;", components: [
-            {kind: "Button", flex: 1, caption: "Cancel", onclick: "doCancel"},
+            {kind: "Button", flex: 1, caption: $L("Cancel"), onclick: "doCancel"},
             {kind: "Spacer"},
-            {kind: "Button", flex: 1, className: "enyo-button-affirmative", caption: "Submit", onclick: "doSubmit"}
+            {kind: "Button", flex: 1, className: "enyo-button-affirmative", caption: $L("Submit"), onclick: "doSubmit"}
         ]},
         {name: "bmarkAlchemy", kind: "me.aaront.BmarkAlchemy", onResults: "gotTags"}
     ],

source/panels/AccountsPanel.js

         this.$.accountsList.render();
         this.currentAccount = {};
         this.options = [
-            {description: "Recent", page: "recent"},
-            {description: "By Tag", page: "tag"},
-            {description: "By Date", page: "date"}
+            {description: $L("Recent"), page: "recent"},
+            {description: $L("By Tag"), page: "tag"},
+            {description: $L("By Date"), page: "date"}
         ];
     },
     setupAccountRow: function(inSender, inIndex) {
         }
     },
     selectAccount: function(inSender, inEvent) {
-        this.currentAccount = this.accounts[inEvent.rowIndex];
-        this.toggleDrawer(inEvent.rowIndex);
+        enyo.nextTick(this, function() {
+            this.currentAccount = this.accounts[inEvent.rowIndex];
+            this.toggleDrawer(inEvent.rowIndex);
+        });
     },
     toggleDrawer: function(inRowIndex) {
         this.animationCount = 1;
         }
     },
     accountOptionClicked: function(inSender, inEvent) {
-        var option = this.options[inEvent.rowIndex];
-        this.doSelectAccount({
-            username: this.currentAccount.username,
-            password: this.currentAccount.password,
-            service: this.currentAccount.service,
-            page: option.page
+        enyo.nextTick(this, function() {
+            var option = this.options[inEvent.rowIndex];
+            this.doSelectAccount({
+                username: this.currentAccount.username,
+                password: this.currentAccount.password,
+                service: this.currentAccount.service,
+                page: option.page
+            });
         });
     },
     receiveAccounts: function(accounts) {

source/panels/BookmarksPanel.js

             ]}
         ]},
         {name: "searchBar", kind: "Toolbar", className: "enyo-toolbar-light transitioner searchbar", components: [
-            {name: "searchBarInput", className: "searchbar-input", hint: "Search Titles", kind: "ToolSearchInput", flex: 1, autoCapitalize: "lowercase", onCancel: "reloadOldBookmarks", components: [
-                {content: "Search", kind: "Button", onclick: "searchBookmarks"}
+            {name: "searchBarInput", className: "searchbar-input", hint: $L("Search Titles"), kind: "ToolSearchInput", flex: 1, autoCapitalize: "lowercase", onCancel: "reloadOldBookmarks", components: [
+                {content: $L("Search"), kind: "Button", onclick: "searchBookmarks"}
             ]}
         ]},
         {kind: "Toolbar", components: [
             {kind: "GrabButton"},
             {kind: "Spacer"},
-            {kind: "IconButton", icon: "images/menu-icon-search.png", className: "no-background-button", onclick: "toggleSearchBar"},
-            {kind: "Spinner", className: "bookmarks-spinner"}
+            {kind: "IconButton", icon: "images/menu-icon-search.png", className: "no-background-button", onclick: "toggleSearchBar"}
         ]},
         {name: "bmarkAlchemy", kind: "me.aaront.BmarkAlchemy", onResults: "gotBookmarks", onErrorClosed: "errorClosed"},
         {name: "accountUtilities", kind: "me.aaront.AccountUtilities"}
         this.$.bookmarksList.render();
         this.currentSort = 0;
         this.searchBarShown = false;
+        this.dateFmt = new enyo.g11n.DateFmt({
+            date: "long",
+            time: "",
+            weekday: true
+        });
     },
     loadDataChanged: function() {
         if (this.loadData.username) {
             this.showBookmarks(this.loadData);
             this.$.serviceIcon.setSrc(this.$.accountUtilities.smallServiceIconFromNumber(this.loadData.service));
-            this.$.pageName.setContent(this.loadData.tag ? this.loadData.page + ": " + this.loadData.tag : this.loadData.page);
+            this.$.pageName.setContent(this.loadData.tag ? $L(this.loadData.page) + ": " + this.loadData.tag : $L(this.loadData.page));
             this.$.accountUsername.setContent(this.loadData.username);
         }
     },
             this.setupDivider(inIndex);
             this.$.item.applyStyle("background-color", inSender.isSelected(inIndex) ? "silver" : null);
             this.$.description.setContent(row.description);
-            this.$.time.setContent(row.time.toLocaleDateString());
+            this.$.time.setContent(this.dateFmt.formatRelativeDate(row.time, {
+                referenceDate: new Date(),
+                verbosity: false
+            }));
             return true;
         }
     },
             r1 = this.bookmarks[inIndex];
         if (this.currentSort === 0) {
             if (r0 && !r0.dateString) {
-                r0.dateString = r0.time.toLocaleDateString();
+                var ds = this.dateFmt.formatRelativeDate(r0.time, {
+                    referenceDate: new Date(),
+                    verbosity: false
+                });
+                r0.dateString = ds.charAt(0).toUpperCase() + ds.slice(1);
             }
             var a = r0 && r0.dateString;
             if (!r1.dateString) {
-                r1.dateString = r1.time.toLocaleDateString();
+                var ds = this.dateFmt.formatRelativeDate(r1.time, {
+                    referenceDate: new Date(),
+                    verbosity: false
+                });
+                r1.dateString = ds.charAt(0).toUpperCase() + ds.slice(1);
             }
             var b = r1.dateString;
             return a != b ? b : null;
         }
     },
     bookmarkClicked: function(inSender, inEvent) {
-        this.$.bookmarksList.select(inEvent.rowIndex);
-        var bookmark = this.bookmarks[inEvent.rowIndex];
-        this.doSelectBookmark(bookmark);
+        enyo.nextTick(this, function() {
+            this.$.bookmarksList.select(inEvent.rowIndex);
+            var bookmark = this.bookmarks[inEvent.rowIndex];
+            this.doSelectBookmark(bookmark);
+        });
     },
     showBookmarks: function(data) {
         this.$.searchBar.hide();
         }
     },
     toggleSearchBar: function(inSender) {
-        if (!this.searchBarShown && this.bookmarks.length > 0) {
-            this.$.searchBar.show();
-            this.bookmarksBackup = this.bookmarks.slice(0);
-            this.searchBarShown = true;
-        }
-        else {
-            this.$.searchBar.hide();
-            this.$.searchBarInput.setValue("");
-            this.reloadOldBookmarks();
-            this.searchBarShown = false;
-        }
+        enyo.nextTick(this, function() {
+            if (!this.searchBarShown && this.bookmarks.length > 0) {
+                this.$.searchBar.show();
+                this.bookmarksBackup = this.bookmarks.slice(0);
+                this.searchBarShown = true;
+            }
+            else {
+                this.$.searchBar.hide();
+                this.$.searchBarInput.setValue("");
+                this.reloadOldBookmarks();
+                this.searchBarShown = false;
+            }
+        });
     },
     searchBookmarks: function() {
-        var s = this.$.searchBarInput.getValue();
-        var b = this.bookmarksBackup.slice(0);
-        for (var i = 0; i < b.length; i++) {
-            if (b[i].description.toLowerCase().indexOf(s.toLowerCase()) === -1) {
-                b.splice(i, 1);
-                i--;
+        enyo.nextTick(this, function() {
+            var s = this.$.searchBarInput.getValue();
+            var b = this.bookmarksBackup.slice(0);
+            for (var i = 0; i < b.length; i++) {
+                if (b[i].description.toLowerCase().indexOf(s.toLowerCase()) === -1) {
+                    b.splice(i, 1);
+                    i--;
+                }
             }
-        }
-        this.bookmarks = b;
-        this.$.bookmarksList.punt();
-		this.$.bookmarksList.reset();
-        this.$.bookmarksList.refresh();
+            this.bookmarks = b;
+            this.$.bookmarksList.punt();
+    		this.$.bookmarksList.reset();
+            this.$.bookmarksList.refresh();
+        });
     },
     reloadOldBookmarks: function() {
         this.bookmarks = this.bookmarksBackup.slice(0);

source/panels/WebPanel.js

     published: {
         url: ""
     },
-    events: {
-        onPageLoading: "",
-        onPageFinished: ""
-    },
     components: [
         {kind: "HFlexBox", flex: 1, components: [
-            {name: "webView", kind: "WebView", flex: 1, className: "enyo-view", onPageTitleChanged: "newPage", onLoadStarted: "doPageLoading", onLoadComplete: "doPageFinished", onLoadStopped: "doPageFinished"}
+            {name: "webView", kind: "WebView", flex: 1, className: "enyo-view", onPageTitleChanged: "newPage", onLoadProgress: "loadProgress", onLoadStarted: "loadStarted"}
         ]},
+        {name: "progressBar", kind: "ProgressBar", className: "url-progress invisible", animatePosition: false},
         {kind: "Toolbar", components: [
-            {kind: "GrabButton"},
-            {kind: "Spacer", flex: 1},
+            {kind: "GrabButton", width: "47px", style: "position: relative;"},
             {kind: "ToolButtonGroup", components: [
                 {icon: "images/menu-icon-back.png", onclick: "goBack"},
-                {icon: "images/menu-icon-forward.png", onclick: "goForward"},
-                {icon: "images/menu-icon-refresh.png", onclick: "refresh"}
+                {icon: "images/menu-icon-forward.png", onclick: "goForward"}
             ]},
-            {caption: "Open in Tab", onclick: "openInCard"},
-            {kind: "Spacer", flex: 1}
+            {icon: "images/menu-icon-refresh.png", onclick: "refresh"},
+            {kind: "Spacer", flex: 1},
+            {caption: $L("Open in Card"), onclick: "openInCard"},
         ]},
         {name: "prefUtilities", kind: "me.aaront.PrefUtilities"}
     ],
         this.$.webView.setUrl(url);
     },
     openInCard: function() {
-        var currentUrl = this.url;
-        var service = new enyo.PalmService();
-        service.service = "palm://com.palm.applicationManager/";
-        service.method = "open";
-        service.call({target: currentUrl});
+        enyo.nextTick(this, function() {
+            var currentUrl = this.url;
+            var service = new enyo.PalmService();
+            service.service = "palm://com.palm.applicationManager/";
+            service.method = "open";
+            service.call({target: currentUrl});
+        });
     },
     newPage: function(inSender, inTitle, inUrl) {
         this.url = inUrl;
     },
-    startSpinner: function() {
-        this.$.spinner.show();
+    loadProgress: function(inSender, inProgress) {
+        if (this._lastProgress < inProgress) {
+            this.progress = inProgress;
+            this.progressChanged();
+            this._lastProgress = inProgress;
+
+            if (inProgress === 100) {
+                this._timeoutHandle = setTimeout(enyo.hitch(this, "clearProgress"), 1000);
+            }
+        }
     },
-    stopSpinner: function() {
-        this.$.spinner.hide();
+    progressChanged: function() {
+        this.$.progressBar.setPosition(this.progress);
+    },
+    clearProgress: function() {
+        this.progress = 0;
+        this.progressChanged();
+        this.loading = false;
+        this.loadingChanged();
+        this._timeoutHandle = null;
+    },
+    loadStarted: function() {
+        this._lastProgress = 0;
+        if (this._timeoutHandle != null) {
+            clearTimeout(this._timeoutHandle);
+            this._timeoutHandle = null;
+        }
+        this.loading = true;
+        this.loadingChanged();
+    },
+    loadingChanged: function() {
+        if (this.loading) {
+            if (this.$.progressBar.hasClass("invisible")) {
+                this.$.progressBar.removeClass("invisible");
+            }
+        } else {
+            if (!this.$.progressBar.hasClass("invisible")) {
+                this.$.progressBar.addClass("invisible"); 
+            }
+        }
     },
     goBack: function() {
         this.$.webView.goBack();
         this.$.webView.goForward();
     },
     refresh: function() {
-        this.$.webView.reloadPage();
+        enyo.nextTick(this, function() {
+            this.$.webView.reloadPage();
+        });
     },
     resize: function() {
         this.$.webView.resize();

source/services/accounts/AccountUtilities.js

        serviceList.push(service);
      }
      return serviceList;
+   },
+   getListOfServicesWithIcon: function() {
+     var serviceList = [];
+     for (var key in this.numberToServiceName) {
+       var service = {caption: this.numberToServiceName[key], value: parseInt(key), icon: this.numberToSmallServiceIcon[key]};
+       serviceList.push(service);
+     }
+     return serviceList;
    }
 });

source/services/bookmarks/BmarkAlchemy.js

     },
     reportError: function(inSender) {
         this.doReportOpen();
+        enyo.keyboard.setResizesWindow(true);
         this.$.reportProblem.setErrorText(this.requestText);
         this.$.reportProblem.open();
     }
             {name: "middle", kind: "SlidingView", width: "320px", peekWidth: 60, components: [
                 {name: "bookmarksPanel", kind: "me.aaront.BookmarksPanel", flex: 1, onSelectBookmark: "bookmarkSelected"}
             ]},
-            {name: "right", kind: "SlidingView", flex: 1, dismissable: true, onResize: "viewerResize", components: [
-                {name: "viewerPanel", kind: "me.aaront.Viewer", flex: 1, onPageLoading: "bookmarksSpinnerStart", onPageFinished: "bookmarksSpinnerStop"}
+            {name: "right", kind: "SlidingView", flex: 1, onResize: "viewerResize", components: [
+                {name: "viewerPanel", kind: "me.aaront.Viewer", flex: 1}
             ]}
         ]},
         {name: "tagPopup", kind: "Popup", scrim: true, modal: true, className: "transitioner", width: "350px", onOpen: "tagInit", components: [
     receivePrefs: function(prefs) {
         this.$.viewerPanel.receivePrefs(prefs);
     },
-    bookmarksSpinnerStart: function() {
-        this.$.bookmarksPanel.showSpinner();
-    },
-    bookmarksSpinnerStop: function() {
-        this.$.bookmarksPanel.hideSpinner();
-    },
     windowRotated: function() {
-        var orientation = enyo.getWindowOrientation();
-        if (orientation === "up" || orientation === "down") {
-            this.$.slider.selectViewByIndex(0);
-        }
-        else {
-            this.$.slider.selectViewByIndex(1);
-        }
+        enyo.nextTick(this, function() {
+            var orientation = enyo.getWindowOrientation();
+            if (orientation === "up" || orientation === "down") {
+                this.$.slider.selectViewByIndex(0);
+            }
+            else {
+                this.$.slider.selectViewByIndex(1);
+            }
+        });
     }
 });

source/views/Preferences.js

     },
     components: [
         {kind: "PageHeader", components: [
-            {content: "Pinnned Preferences", style: "width: 640px; margin: 0 auto;", flex: 1}
+            {content: $L("Pinnned Preferences"), style: "width: 600px; margin: 0 auto;", flex: 1}
         ]},
         {kind: "Scroller", flex: 1, components: [
-            {kind: "VFlexBox", style: "width: 650px; margin: 20px auto;", flex: 1, components: [
-                {kind: "RowGroup", name: "accountsList", caption: "Accounts"},
-                {kind: "RowGroup", name: "readingPrefs", caption: "Reading Preferences", style: "margin-top: 20px", components: [
+            {kind: "VFlexBox", style: "width: 610px; margin: 20px auto;", flex: 1, components: [
+                {kind: "RowGroup", name: "accountsList", caption: $L("Accounts")},
+                {kind: "RowGroup", name: "readingPrefs", caption: $L("Reading"), style: "margin-top: 20px", components: [
                     {kind: "RowItem", layoutKind: "HFlexLayout", components: [
-                        {content: "View bookmarks using <a href='http://www.instapaper.com/m'>Instapaper Mobilizer</a>", flex: 1},
+                        {content: $L("View bookmarks using") + " <a href='http://www.instapaper.com/m'>Instapaper Mobilizer</a>", flex: 1},
                         {name: "instapaper", kind: "ToggleButton"}
                     ]}
                 ]}
             ]}
         ]},
         {kind: "Toolbar", className: "enyo-toolbar-light", components: [
-            {name: "saveButton", kind: "Button", className: "enyo-button-affirmative", content: "Done", width: "300px", onclick: "saveClicked", isDefault: true}
+            {name: "saveButton", kind: "Button", className: "enyo-button-affirmative", content: $L("Done"), width: "300px", onclick: "saveClicked", isDefault: true}
         ]},
         {name: "addAccountPopup", kind: "Popup", scrim: true, modal: true, className: "transitioner", width: "500px", components: [
             {kind: "me.aaront.AddAccount", onCancel: "closePopup", onSubmit: "addAccountSubmitted", onRegister: "newAccountRegister"}
                 {name: "serviceIcon"+i, kind: "Image", src: this.$.accountUtilities.smallServiceIconFromNumber(this.accounts[i].service), className: "preferences-account-serviceicon"},
                 {name: "service"+i, content: this.$.accountUtilities.serviceNameFromNumber(this.accounts[i].service), className: "preferences-account-service"},
                 {kind: "Spacer", flex: 2},
-                {kind: "Button", className: "enyo-button-negative", caption: "Delete", onclick: "deleteAccount"}
+                {kind: "Button", className: "enyo-button-negative", caption: $L("Delete"), onclick: "deleteAccount"}
 
             ]});
         }
         componentsToAdd.push({kind: "RowItem", tapHighlight: true, layoutKind: "HFlexLayout", components: [
             {name: "addIcon", kind: "Image", src: "images/add.png", style: "margin-top: 3px; margin-left: 5px;"},
-            {name: i, content: "Add New Account", onclick: "addClicked", flex: 1, style: "color: #777; font-style: italic; margin-bottom: 5px; margin-left: 10px;"}
+            {name: i, content: $L("Add New Account"), onclick: "addClicked", flex: 1, style: "color: #777; font-style: italic; margin-bottom: 5px; margin-left: 10px;"}
         ]});
         this.$.accountsList.createComponents(componentsToAdd, {owner: this});
         this.$.accountsList.render();
         this.setupAccounts();
     },
     deleteAccount: function(inSender, inEvent) {
-        var index = parseInt(inEvent.dispatchTarget.container.components[0].name);
-        this.accounts.splice(index, 1);
-        this.setupAccounts();
+        enyo.nextTick(this, function() {
+            var index = parseInt(inEvent.dispatchTarget.container.components[0].name);
+            this.accounts.splice(index, 1);
+            this.setupAccounts();
+        });
     },
     addClicked: function(inSender) {
-        this.$.addAccountPopup.openAtCenter();
+        enyo.nextTick(this, function() {
+            this.$.addAccountPopup.openAtCenter();
+        });
     },
     saveClicked: function(inSender) {
-        this.$.accountUtilities.setAccounts(this.accounts);
-        this.prefs = {
-            instapaper: this.$.instapaper.getState()
-        };
-        this.$.prefUtilities.setPrefs(this.prefs);
-        this.doSave(this.accounts, this.prefs);
+        enyo.nextTick(this, function() {
+            this.$.accountUtilities.setAccounts(this.accounts);
+            this.prefs = {
+                instapaper: this.$.instapaper.getState()
+            };
+            this.$.prefUtilities.setPrefs(this.prefs);
+            this.doSave(this.accounts, this.prefs);
+        });
     },
     addAccountSubmitted: function(inSender) {
         inSender.setButtonActive(false);

source/views/Viewer.js

 enyo.kind({
     name: "me.aaront.Viewer",
     kind: enyo.VFlexBox,
-    events: {
-        onPageLoading: "",
-        onPageFinished: ""
-    },
     components: [
         {kind: "Pane", transitionKind: "enyo.transitions.LeftRightFlyin", flex: 1, components: [
             {name: "defaultViewerPanel", kind: "me.aaront.DefaultViewerPanel"},
-            {name: "webPanel", kind: "me.aaront.WebPanel", onPageLoading: "doPageLoading", onPageFinished: "doPageFinished"}
+            {name: "webPanel", kind: "me.aaront.WebPanel"}
         ]}
     ],
     create: function() {

source/views/Welcome.js

         onDone: ""
     },
     components: [
-        {kind: "PageHeader", content: "Welcome to Pinnned"},
-        {kind: "VFlexBox", flex: 1, style: "width: 600px; margin: 20px auto;", components: [
-            {name: "welcomeText",kind: "Drawer", components: [
-                {content: "Hey there!", className: "welcome-bigtext"},
-                {content: "Thanks for downloading Pinned, the premier social bookmarking client for the HP Touchpad!", className: "welcome-normaltext"},
-                {content: "We just need one piece of information to get started: an account.", className: "welcome-normaltext"},
-                {content: "Please type in your details below and click next to see your bookmarks, or "+
-                    "tap the 'I Need an Account' button to to get an account.", className: "welcome-normaltext"}
+        {kind: "PageHeader", components: [
+            {kind: "HFlexBox", className: "welcome-header", components: [
+                {kind: "Image", src: "mini-icon.png"},
+                {content: $L("Hello!"), className: "welcome-header-text", flex: 1}
+            ]}
+        ]},
+        {kind: "Scroller", flex: 1, components: [
+            {kind: "VFlexBox", flex: 1, style: "width: 600px; margin: 20px auto;", components: [
+                {name: "welcomeText",kind: "Drawer", components: [
+                    {content: $L("<strong>Thanks for purchasing Pinnned</strong>, the premier social bookmarking client for the HP Touchpad!"), className: "welcome-normaltext"},
+                    {content: $L("<strong>Pinnned</strong> just needs one piece of information to get started: an account."), className: "welcome-normaltext"},
+                    {content: $L("Please type in your details below and click <strong>'Next'</strong> to see your bookmarks, or tap the <strong>'I Need an Account'</strong> button to to get an account."), className: "welcome-normaltext"}
+                ]},
+                {kind: "RowGroup", caption: $L("Account Details"), components: [
+                    {name: "username", kind: "Input", hint: $L("Username"), autoCapitalize: "lowercase", onfocus: "hideWelcomeText"},
+                    {name: "password", kind: "PasswordInput", hint: $L("Password"), onfocus: "hideWelcomeText"},
+                    {name: "service", kind: "ListSelector", label: $L("Service"), flex: 1, value: 1}
+                ]},
+                {kind: "HFlexBox", pack: "end", style: "padding: 0 10px;", components: [
+                    {name: "registerButton", kind: "Button", content: $L("I Need an Account"), onclick: "registerAccount"},
+                    {kind: "Spacer"},
+                    {name: "saveButton", kind: "ActivityButton", className: "enyo-button-affirmative", content: $L("Next"), onclick: "addAccountSubmitted", isDefault: true}
+                ]}
             ]},
-            {kind: "RowGroup", caption: "Service", components: [
-                {name: "service", kind: "ListSelector", value: 1}
-            ]},
-            {kind: "RowGroup", caption: "Account Details", components: [
-                {name: "username", kind: "Input", hint: "Username", autoCapitalize: "lowercase", onfocus: "hideWelcomeText"},
-                {name: "password", kind: "PasswordInput", hint: "Password", onfocus: "hideWelcomeText"}
-            ]},
-            {kind: "HFlexBox", pack: "end", style: "padding: 0 10px;", components: [
-                {name: "registerButton", kind: "Button", content: "I Need an Account", onclick: "registerAccount"},
-                {kind: "Spacer"},
-                {name: "saveButton", kind: "ActivityButton", className: "enyo-button-affirmative", content: "Next", onclick: "addAccountSubmitted", isDefault: true}
-            ]}
         ]},
         {name: "registerAccountPopup", kind: "Popup", scrim: true, modal: true, className: "transitioner", width: "500px", components: [
             {kind: "me.aaront.RegisterAccount", onCancel: "closePopup", onDone: "registerDone"}
     create: function() {
         this.inherited(arguments);
         this.accounts = this.$.accountUtilities.getAccounts();
-        this.$.service.setItems(this.$.accountUtilities.getListOfServices());
+        this.$.service.setItems(this.$.accountUtilities.getListOfServicesWithIcon());
     },
     hideWelcomeText: function(inSender) {
         this.$.welcomeText.close();
     },
     registerAccount: function(inSender) {
-        this.$.registerAccountPopup.openAtCenter();
+        enyo.nextTick(this, function() {
+            this.$.registerAccountPopup.openAtCenter();
+        });
     },
     registerDone: function(inSender) {
         this.closePopup(inSender);
         inSender.container.close();
     },
     addAccountSubmitted: function() {
-        this.$.bmarkAlchemy.get("info", "update", {
-            service: this.$.service.getValue(),
-            username: this.$.username.getValue(),
-            password: this.$.password.getValue()
+        enyo.nextTick(this, function() {
+            this.$.bmarkAlchemy.get("info", "update", {
+                service: this.$.service.getValue(),
+                username: this.$.username.getValue(),
+                password: this.$.password.getValue()
+            });
+            this.$.saveButton.setActive(true);
         });
-        this.$.saveButton.setActive(true);
     },
     gotConfirmation: function(inSender, inResults) {
         var account = {

styles/AccountsPanel.css

 }
 
 .account-option-item {
-    border-top: none;
+    border: none;
     background: transparent url('../images/suboption-bottomfade.png') left bottom repeat-x;
     color: #444;
     padding: 8px 0 8px 13px;
 }
 
 .account-option-description {
-    padding-top: 8px;
+    padding-top: 12px;
     padding-bottom: 12px;
     font-size: 0.9em;
+    font-weight: bold;
     color: #999;
     padding-left: 55px;
 }
+.url-progress.enyo-progress-bar {
+	-webkit-border-image: none;
+	border-width: 0;
+	height: 4px;
+	background: url(../images/progress-bar.png) 0 0 repeat-x;
+	width: 100%;
+	z-index: 10;
+	top: 2px;
+	 
+	-webkit-transition: opacity 1s;
+	opacity: 1;
+}
+.progress-bar.completed {
+	opacity: 0;
+	display: none;
+}
+.url-progress .enyo-progress-bar-inner {
+	-webkit-border-image: none;
+	margin: 0;
+	height: 4px;
+	background: url(../images/progress-bar-inner.png) 0 0 repeat-x;
+}
+.url-progress.invisible {
+	opacity: 0;
+	height: 0;
+}
  *  limitations under the License.
  */
 
+.welcome-header {
+	width: 600px;
+	margin: 6px auto 0 auto;
+}
+
+.welcome-header-text {
+	padding-left: 10px;
+	padding-top: 10px;
+	font-size: 1.1em;
+}
+
 .welcome-bigtext {
     font-size: 1.1em;
     padding-bottom: 20px;