Powerapps - Manual Loader Spinner Issue - caching

I have created a manual spinner in PowerApps in a SharePoint Integration App, with three different screens & respective forms.
Purpose: Loader should be visible when the PowerApps is loading data.
Steps I followed:
Add rectangle and Spinner Image as a group
Visibility of group = LoaderVisibility (variable declared below)
set(LoaderVisible,true) - onview property of SharePoint Integration
Add timer control, duration- 2000,Autostart- true, onTimerEnd- Set(LoaderVisible,false)
Issue: It is working fine when you are opening any of the item at first. But the spinner will go into infinite loop if you open another item in Edit/View mode without refreshing the browser. It seems like variable cache issue, because the spinner of View screen is impacting Edit screen as well though it has different spinner.
I tried clearing cache from browser and setting (LoaderVisble,Blank()) - to clear the variable at first before using it again but no luck.

Related

Binding updates to shell component pages delayed

So I have a Shell that has a home page and a settings page.
The settings page makes changes to a singleton service that the home's ViewModel is binded to (MVVM).
I have set up break points on the PropertyChangedEvents of elements on the Home page and they hit as soon as changes are made to the service's properties and their PropertyChanged is executed.
However, upon going back to the home page via the Shell, the page's UI only updates when the page is active and visible. This causes fields to flash when they change. But the breakpoints suggest that they should have updated before.
Is there a way to force refresh the UI before or are there any other alternatives?
For now I have made my view perform a Fade In animation so that changes to the ViewModel don't cause flashing.
Even I have a Xamarin Forms Shell app, and I also had the same issue, So what you can do is, Make the common properties Global as in make those properties in App.xaml.cs and mark them as static.
So when the User changes the property on settings change the App.PropertyName.
Then on the OnApearing method of homepage call a method on the ViewModel say LoadDataValues() and read the App.PropertyName and modify the UI as needed.
What this will do is just before the HomePage appears it will keep the UI of HomePage ready.
Let me know if you have further issues.

Change Sidedrawer content dynamically

I´m at that point on my app, where the user Logged in, receive the data from the server and now i need to make same changes. One of the changes is change the button that appears on my Sidedrawer saying Log In to Log Out and vice-versa when the user Logs Out...I could talk about other changes but i think the main thing is...
How do I access the Sidedrawer content in order to change/add buttons. I already entered the app-root.xml and made same testing adding the navigatingTo="onNavigatingTo" function and also in the .js file just to see if it responds, but it doesn´t...
How do i perform this?
You can show/hide your button via visibility, text binding or via a structural directive like *ngIf (if using Angular). For example, take a look here - I am showing/hiding a button based on whether the user is logged in or not (here is the related code-behind code).
The above example is using an Angular directive and can be applied only in Angular based applications, but with the same logic, you can substitute ****ngIf*** with visibility and achieve the same in TypeScript or plain JavaScript app.
The easiest way to do it is put the frame inside drawer content area, then navigate frame to another page.

jQuery mobile - after browser refresh page totally messed up

I'm developping a jqm application with spring mobile in the back-end.
Whenever I hit the browser refresh button on my mobile phone the page is completely devastated afterwards. Browsers back-button works properly.
The data are still available due prg pattern (flashAttributes in Spring) after refresh. Only the view is malformed.
Any ideas how to solve this problem?
From jQuery Mobile docs :
The simplest approach when building a jQuery Mobile site is to reference the same set of stylesheets and scripts in the head of every page. If you need to load in specific scripts or styles for a particular page, we recommend binding logic to the pageinit event (details below) to run necessary code when a specific page is created (which can be determined by its id attribute, or a number of other ways). Following this approach will ensure that the code executes if the page is loaded directly or is pulled in and shown via Ajax
So what happens is - in jQuery Mobile, the scripts and styles defined in the head are loaded only once. So, in normal conditions, it works fine, as all the pages will use the scripts loaded from the first page.
But. When you refresh a page in-between, it triggers a page-reload instead of the ajax navigation model thatjqm uses. So all the scripts and styles loaded from the first page will not be included from here on out.
What you need to do is "reference the same set of stylesheets and scripts in the head of every page", so that even if you hit refresh in the middle, the scripts and styles that had been loaded from the head of the first page are loaded again.
I recommend you read the docs from the above link fully to gain a better understanding.

Lotus Web Form Scroll and Popup issue

I am trying to create a web form in Lotus Notes that is web enabled. So far this has all worked fine, however there are 2 issues.
When Creating a Java Script Alert in the OnLoad Event, it Pops up everytime a user selects a radio button or dropdown option since this reloads the page. Is there any way to make this only for the initial opening of the form?
When a user selects an option, the form reloads and puts that form field on the top which is proving to be very disorrienting for users. Is there a way to have it not scroll on reload?
Thanks in advance!
The best advice would be: use XPages for web development that is "state of the art". If you can't, you have to code a lot of JavaScript to make the form not behave like "havoc".
First of all: the field property "refresh fields on keyword change" is the reason for the jumping / reload.
What does domino do?
All events / formulas that occur when you normally press F9 or use the Option above (that can be field values, input translations, hide whens, etc.) are not "converted" to HTML and javascript but are executed by the server. Therefor each change in a field with the option set submits the form and adds an &Seq=x to the url to keep track of the state. X increments on every reload. Of course this reload causes all events to be triggered again.
For you this means:
Option
disable the option to reload the form after keyword change.
Unfortunately you have to recode every dependency / calculation / hide when with javascript. Using a framework like jquery or dojo this is possible, but a lot of work.
If there IS no dependency then just disable the option...
Option
Live with the "jumping" and let your onload event check for the existance of an URL- parameter called seq... And only if it does not exist, then it is a "real" OnLoad...
Both options are not quite nice and not very easy to code...
That's one reason why IBM started XPages... There all this stuff is already handled by default...

Best way to load tabbed content

I'm working on changing member profile UI on one site. Project page: http://design.vitalbmx.com/user_menu/member_profile2.html
Goals:
Usability: page load time must be optimized, especially images in the active tab
SEO: pagination links within tabs must be crawlable
Assumptions:
Most users will go to "All" tab by default
Most users will rarely click other tabs except "All"
Most users will not send links to paginated tabs, only to 1st page of any given tab
Implementation scenarios:
Content of all tabs is loaded at once on the same page. Pagination via Ajax (with URL's to existing pages for crawlers). Possible issues - lag for loading images for tabs other than first tab if it's set in page URL (e.g. #videos)
Content of first tab ("All") to load first. Load content of other tabs only when they are clicked. Issues - extra HTTP calls and also lag for loading images for tabs other than first tab
Content of all tabs is loaded on the same page BUT image sources are replaced with a generic image for tabs other than current tab before images begin loading. When another tab is clicked (or after current tab images are loaded) image sources are reverted to original and begin loading (somewhat like Mashable.com but without the annoying fade-in effect)
Ajax-less - dedicated page for each tab. Makes more sense for SEO than for usability. Easy to copy-paste-send URL's with pagination.
Which one would be the best? Or am I missing something?
I think you should go with no. 4, because that one uses less load from server and client.

Resources