Is it possible to use vue-flipclock with Nativescript Vue app - nativescript

I'm trying to build my first Nativescript vue app based on/complimenting a previously existing web app. In that app I use the FlipClock.js.
I'd like to find a way to continue using this library for simplicity and consistency on the UI in my native app. There is a vue-flipclock component, but it still generates HTML which creates errors in the NativeScript app.
CONSOLE LOG file:///app/vendor.js:34096:14: '{NSVue (Vue: 2.5.17 | NSVue: 2.2.0)} -> CreateElement(div)'
***** Fatal JavaScript exception - application has been terminated. *****
Is there someway I can make this work inside the NativeSCript app, or do I need to find a different component altogether?

No, you can't use any plugin that depends on browser specific features / HTML DOM in NativeScript environment where your UI is totally native.
You might use a WebView if you want to load simple web app that might showcase the flipclock.

Related

Why is web app not loading inside the MS-Teams

I have deployed a simple web app and deployed to https://rockdove.centralindia.cloudapp.azure.com:82/. This page has the link to teams app sdk and also has initialized the teams app. im trying to load it inside teams app in my organization using this manifest file. i can upload and install the app but the app is not loading. The index file and manifest used for test is attached here.
Here are a few things to look at:
I don't think you can pass anything to microsoftTeams.initialize(), so remove the 'window' parameter
I've not tested whether the 'validDomains' allows custom ports, but it might not - try put the entry without the ':82', and then also remove entries 2 & 3, so it's only 'rockdove.centralindia.cloudapp.azure.com'

Custom components can't access default NativeScript directives

I've been using NativeScript for a while in some projects. One think I noticed is that "default" NativeScript directives, such as nsRouterLink, tap and some others does not work with components that I created.
The only times those directives works are when they are using with its default" components such as GridLayout, Label, etc.
I've created a small PlayGround project to demonstrate my issue: https://play.nativescript.org/?template=play-ng&id=rZYQGP&v=3
I think I should import those directives into my custom components somehow, but I have no idea how.
Unfortunately it's not as same as Web with NativeScript, you have to attach the events to the actual element and not on the custom selectors. An alternative is that you can emit an event on your custom component when actual element is tapped.
There is a open feature request already.
I'm no expert but I had same issue recently and could make workaround.
NativeScript's pure component should be registered appropriate
ly on Angular environment to work properly.
This can be done with registerElement from nativescript-angular/element-registry.
By registering, the Angular Component should work like intended element.
Unfortunately, the property of the element can only be accessed with HostBinding
I have forked and applied workaround to PlayGround project you have provided: https://play.nativescript.org/?template=play-ng&id=SCLxVk

YUI 3.5 App Framework server routing

I am currently looking at implementing YUI 3.5 pr1 (and then the final version when released) in a fairly large application.
The backend is built with PHP and MySQL using a MVC structure with a front controller pattern. By it self, the server can process URLs (http://mysite.com/module/submodule/option) etc and return a fully rendered page.
I would like to implement the App Framework in YUI across the whole application so that javascript-enabled browser will effectively have something like a 1-page app with history management avaliable.
I am currently looking at the app framework docs on the staging site. Unfortunately, the docs aren't complete (in particular sections on routing coordination with server and progressively enhanced apps).
In any case, if a user visits http://mysite.com/modules/submodule/option with an HTML4 browser (all versions of IE), and he has javascript enabled, he would need to be redirected to http://mysite.com/#/modules/submodule/option.
Is this something that's built into the App Framework? I would prefer to utilise a solution that does not require the whole page to be rendered out and then redirected to the hashtaged URL and then rerendered again.
Finally, I have watched the intro video on the App Framework and it mentioned that they are using the Handlebars template engine. I am using Twig as my template engine on the server side. Is it possible to use an alternative template engine with the app framework? In particular the twig js engine.

Using PhoneGap and keeping the UI on the server

I'm continuing my research on solutions for our organization for our mobile app strategy. There's two somewhat conflicting requirements:
it should be a web app in that all updates for users are immediate as we update the app on the server
the app should leverage native UI widgets and native device features as much as possible
With PhoneGap, the process appears to be that you'd normally keep the UI on the device, as part of the compiled app, and you'd hit your server via AJAX to deal with the data updates and submissions. That then gives you access to the native device's UI widgets and features using the PhoneGap API into their hooks.
However, in doing that, we lose bullet point one.
My question is if one can, using PhoneGap, create a 'web view' within the app that would allow us to keep the UI on our server (the app then pretty much becomes a custom browser). And, if so, could our UI still access the device's native functionality via PhoneGap's API or is that only accessible if we compiled our UI code?
A similar question came up on the PhoneGap Google Group recently.
One thing that came up was that you are unlikely to pass app store certification if you are loading UI and core functionality from a remote server as this invalidates much of the purpose of certification.
If you're going to do this, you should set up web services that return the content you want to display to users. Then you can use jQuery Mobile and PhoneGap to take the content returned from the server and display it on the application with the appropriate native UI widgets and features that you want.
So use jQuery Mobile to hit your server for data using something like:
var fileUrl = "http://www.mywebserver.com/servedevice?data=current&selection=fresh";
$.ajax({
url: fileUrl,
dataType: "html",
success: function( html ) {
// If the call succeeds, do something with the return value here
}
});
There are many other ways you can handle it including JSONP methods. See the documentation for details:
http://api.jquery.com/jQuery.ajax/
Another approach would be to point your HTML file at a server for the JavaScript, just like a CDN file load. Then, your app's JavaScript would be loaded at runtime instead of bundled into the app. However, when it actually runs, it is running within the PhoneGap WebView so it has access to all of the PhoneGap APIs.
This is the jQuery Mobile example:
<script src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>

What has been the experience in making a mobile app using phonegap and CodeIgniter?

I'm looking at making a mobile app using phonegap. However, I would like to use CodeIgniter as well. What has been the community's experience in doing such? I have tried googling it but only seem to find resumes and job wanted ads! I intend to use CI with jquery-mobile. But I was wondering if i could use phonegap with it and package it as a android or iOS mobile app.
I assume you are using CI as your backend to deliver data back and forth between your mobile app built with phonegap + jquery mobile. If that is the case, whether you use CI or any other backend web framework, it should be pretty straight forward. You'll probably want to consider using JSON as your data format to keep data size down.
I would imagine RESTful web services would suit you well. Check out this guide on getting them working in concert with CI: http://net.tutsplus.com/tutorials/php/working-with-restful-services-in-codeigniter-2/
I personally am using a CI + phonegap + xuijs stack now and its pretty straight forward in terms of communication.

Resources