Does anyone know if there are any good libraries or plugins to accomplish a doodle poll similar to what is found on www.doodle.com where a given set of users can select from a group of future times / dates, and that information is tallied and shown to the event organizer? Thanks! This would be an advanced extension of the calendar date picker.
1 post - 1 participant
1 post - 1 participant
I am trying to download files using the filesystem API to my local storage, the data is converted to base64 from the back-end… From the console log I can see the base64 Data, the problem is that WriteFile returns “Undefined”. I am fairly new in programming your help will be appreciated.
this.content.downloadNative(this.file.publicId).subscribe({
async next(base64: Base64Data){
try{
const savedFile = await Filesystem.writeFile({
path: base64.Name,
data: base64.Data,
directory: Directory.Data,
})
1 post - 1 participant
please suggest any plugin or share any source code for widget integration. Thanks
1 post - 1 participant
I made new ionic v3 project with command
ionic start teethProject --type=ionic-angular
but just making project cause problem.
check python checking for Python executable "python2" in the PATH
gyp verb `which` failed Error: not found: python2
gyp verb `which` failed at getNotFoundError (/Users/pedrojung/Downloads/ionic-allteeth-master/temporal/newtemp/eiek/myApp/node_modules/which/which.js:13:12)
gyp verb `which` failed at F (/Users/pedrojung/Downloads/ionic-allteeth-master/temporal/newtemp/eiek/myApp/node_modules/which/which.js:68:19)
gyp verb `which` failed at E (/Users/pedrojung/Downloads/ionic-allteeth-master/temporal/newtemp/eiek/myApp/node_modules/which/which.js:80:29)
gyp verb `which` failed at /Users/pedrojung/Downloads/ionic-allteeth-master/temporal/newtemp/eiek/myApp/node_modules/which/which.js:89:16
gyp verb `which` failed at /Users/pedrojung/Downloads/ionic-allteeth-master/temporal/newtemp/eiek/myApp/node_modules/isexe/index.js:42:5
gyp verb `which` failed at /Users/pedrojung/Downloads/ionic-allteeth-master/temporal/newtemp/eiek/myApp/node_modules/isexe/mode.js:8:5
gyp verb `which` failed at FSReqCallback.oncomplete (fs.js:192:21)
gyp verb `which` failed python2 Error: not found: python2
gyp verb `which` failed at getNotFoundError (/Users/pedrojung/Downloads/ionic-allteeth-master/temporal/newtemp/eiek/myApp/node_modules/which/which.js:13:12)
gyp verb `which` failed at F (/Users/pedrojung/Downloads/ionic-allteeth-master/temporal/newtemp/eiek/myApp/node_modules/which/which.js:68:19)
gyp verb `which` failed at E (/Users/pedrojung/Downloads/ionic-allteeth-master/temporal/newtemp/eiek/myApp/node_modules/which/which.js:80:29)
gyp verb `which` failed at /Users/pedrojung/Downloads/ionic-allteeth-master/temporal/newtemp/eiek/myApp/node_modules/which/which.js:89:16
gyp verb `which` failed at /Users/pedrojung/Downloads/ionic-allteeth-master/temporal/newtemp/eiek/myApp/node_modules/isexe/index.js:42:5
gyp verb `which` failed at /Users/pedrojung/Downloads/ionic-allteeth-master/temporal/newtemp/eiek/myApp/node_modules/isexe/mode.js:8:5
gyp verb `which` failed at FSReqCallback.oncomplete (fs.js:192:21) {
gyp verb `which` failed code: 'ENOENT'
gyp verb `which` failed }
gyp verb check python checking for Python executable "python" in the PATH
gyp verb `which` failed Error: not found: python
what is weired is…
when I make project with ionic v4 it works,
but problem happend when I make project with v3.
I only have python3 installed. and seems that I can’t install python2 in m1 mac.
how can I deal with it ?
1 post - 1 participant
Hi folks my usage description strings for permissions are not getting picked up in the final build. I’m referring to the likes of NSMotionUsageDescription and NSCameraUsageDescription just as examples. I’ve tried setting them in multiple ways without any luck:
config.xml file:
<config-file>
<edit-config>
ios-camera-permissions plugin (for NSCameraUsageDescription, NSPhotoLibraryAddUsageDescription, and NSPhotoLibraryUsageDescription)I’m not sure what else to try, or why this is happening. Does anyone have any ideas? Thanks.
1 post - 1 participant
Hi.
I have a fairly advanced app built with cordova/ionic. We have a big database and do a lot of requests to it. cordova-sqlite-ext plugin is being used to work with the database.
This has started as an issue with app showing white screen and going back to home screen after a long session working with it. iOS only. Appeared that it is a memory leak.
From outside - it looks like just opening/closing specific screen/view it just takes more and more memory. We need to do around 50 such operations (with many other operations while on that screen) to see this.
Safari Web Inspector shows it as Page (yellow) category memory is growing.
That view mentioned above - it does a lot of work and reads significant amount of data in multiple requests to the database.
I suspect that memory leak is happening because of scripts posted by iOS to webkit while sending back a response from native SQLLite to JS. That is something like
cordova.require('cordova/exec').nativeCallback(...) posted by webKit.evaluateJavaScript.
Looks like those scripts, usually - pretty small, are never removed by garbage collector.
In some cases - we are getting 1-2-3 MBs from the database at once. And those request are repeated many times. Plus a lot of smaller requests. Isolated code doing just a requests to database - it shows similar behavior. 200-400-600 requests, even those that just return “nothing” create a memory leak.
Few questions here:
Cordova, ionic, webview, sqllite-ext, angular - all of that is latest or nearly latest. But if my understanding is correct - it will be irrelevant as this evaluateJavaScript looks to be a standard way for cordova’s native code to talk to JS.
Any help is appreciated, thanks!
1 post - 1 participant
Hello guys -
I am receiving this error when using my freshly compiled app on a physical iOS device on XCode. I’ve had a good google about this, but all the other questions seem to pertain to this error on Android, but this is iOS.
App compiles fine and loads. But upon my login, the HTTP request that gets the JWT gets this error:
{“headers”:{“normalizedNames”:{},“lazyUpdate”:null,“headers”:{}},“status”:0,“statusText”:“Unknown Error”,“url”:"",“ok”:false,“name”:“HttpErrorResponse”,“message”:“Http failure response for : 0 Unknown Error”,“error”:{“isTrusted”:true}}
I’ve seen it speculated in other threads that this is a CORS error. Which I will say is unlikely, given the same request works everywhere else on a whole plethora of devices and formats. EDIT: Also the same error when using https://cors-anywhere.herokuapp.com/, so, I think we can rule this out.
Help much appreciated, thanks
1 post - 1 participant
Hello, everyone.
I am Silas,
I used @ionic-native/email-composer and @awesome-cordova-plugins/email-composer in capacitor v3
But these are not working for me.
If you have solutions, please help me kindly.
Thank you
1 post - 1 participant
Hello guys -
I am receiving this error when using my freshly compiled app on a physical iOS device on XCode. I’ve had a good google about this, but all the other questions seem to pertain to this error on Android, but this is iOS.
App compiles fine and loads. But upon my login, the HTTP request that gets the JWT gets this error:
{“headers”:{“normalizedNames”:{},“lazyUpdate”:null,“headers”:{}},“status”:0,“statusText”:“Unknown Error”,“url”:"",“ok”:false,“name”:“HttpErrorResponse”,“message”:“Http failure response for : 0 Unknown Error”,“error”:{“isTrusted”:true}}
I’ve seen it speculated in other threads that this is a CORS error. Which I will say is unlikely, given the same request works everywhere else on a whole plethora of devices and formats. EDIT: Also the same error when using https://cors-anywhere.herokuapp.com/, so, I think we can rule this out.
Help much appreciated, thanks
Package.json:
{
"name": "store-scanner",
"version": "1.1",
"author": "Adam P. Wright",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"release-build-android": "ionic cap build android --prod --release"
},
"private": true,
"dependencies": {
"@angular/animations": "^12.2.4",
"@angular/cdk": "^12.2.6",
"@angular/cli": "^12.2.4",
"@angular/common": "^12.2.4",
"@angular/compiler": "^12.2.4",
"@angular/core": "^12.2.4",
"@angular/forms": "^12.2.4",
"@angular/platform-browser": "^12.2.4",
"@angular/platform-browser-dynamic": "^12.2.4",
"@angular/router": "^12.2.4",
"@capacitor-community/barcode-scanner": "^2.0.1",
"@capacitor/android": "3.3.1",
"@capacitor/app": "^1.0.3",
"@capacitor/core": "^3.2.4",
"@capacitor/haptics": "^1.0.3",
"@capacitor/ios": "3.3.1",
"@capacitor/keyboard": "^1.0.3",
"@capacitor/push-notifications": "^1.0.6",
"@capacitor/splash-screen": "^1.1.0",
"@capacitor/status-bar": "^1.0.3",
"@capacitor/storage": "^1.0.3",
"@ionic/angular": "6",
"@ionic/cli": "^6.17.1",
"@ionic/storage-angular": "^3.0.6",
"@swimlane/ngx-charts": "^19.0.1",
"date-fns": "^2.24.0",
"dateformat": "^5.0.1",
"global": "^4.4.0",
"install": "^0.13.0",
"jetifier": "^2.0.0",
"npm": "7.24.1",
"rxjs": "~6.6.0",
"tslib": "^2.3.1",
"zone.js": "~0.11.4"
},
"devDependencies": {
"@angular-devkit/build-angular": "^12.2.4",
"@angular-eslint/builder": "^12.2.4",
"@angular-eslint/eslint-plugin": "^12.2.4",
"@angular-eslint/eslint-plugin-template": "^12.2.4",
"@angular-eslint/template-parser": "^12.2.4",
"@angular/compiler": "^12.2.4",
"@angular/compiler-cli": "^12.2.4",
"@angular/language-service": "^12.2.4",
"@capacitor/cli": "^3.2.4",
"@ionic/angular-toolkit": "^4.0.0",
"@types/jasmine": "~3.6.0",
"@types/jasminewd2": "~2.0.3",
"@types/node": "^12.11.1",
"@typescript-eslint/eslint-plugin": "4.16.1",
"@typescript-eslint/parser": "4.16.1",
"eslint": "^7.6.0",
"eslint-plugin-import": "2.22.1",
"eslint-plugin-jsdoc": "30.7.6",
"eslint-plugin-prefer-arrow": "1.2.2",
"jasmine-core": "~3.8.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~6.3.2",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.0.3",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0",
"ts-node": "~8.3.0",
"typescript": "~4.2.4"
},
"description": "Vendor's Store Scanner for Wrightway Store"
}
1 post - 1 participant
It can be the dumbest question, but I think not.
Lets imagine you have an app that has a login, donwloads some data and then you can log out.
Lets imagine you have 2 pages. So you step on all of them and you get both pages loaded in the dom, one of them with ion-page-hidden. There you have a variable acessing some data that you know does exists because you did a login. The thing is that, when you are in the second page, you wipe some information, let’s say you do a logout. Then, as in the dom the first page is still loaded, and I assume reactivity is still “running”, there is an error on the first page because data can not be accessed.
That’s not how it is supposed to work in a regular webapp, because the complaining dom is not loaded and you don’t even want it to be.
I’ve read why is it done, but the question is how am I supposed to avoid this issue.
A v-if in the complaining page does not seem to do the job, either.
How to reproduce:
git clone [text](https://github.com/Pijuli/ionic-vue-pinia-fail)
npm ci
npm run serve
go to localhost:8080
Open navigator console
Navigate to the other page with the button
Wipe the data
What to expect:
See console complains
Again, this might be dumb, but I’m not seeing how to proceed with it.
Thank you <3
1 post - 1 participant
I need to do some stuff when the same option from the ion-select menu is selected. However, I can’t find a way to make it work.
There is no way to watch for value changes since there are no changes to the value and if I add @click to the option it doesn’t do anything.
Is there any way to detect when an option is being selected even if it is the same option?
5 posts - 4 participants
Hello,
can anyone tell me why the interpolation of the index property doesn’t work? the value remains fixed at 1.
.html
<swiper (slideChange)="onSlideChange($event)">
<ng-template *ngFor = "let image of this.images, let i = index" swiperSlide>
<ion-list style="align-items:center">
<ion-img class="image" [src]="image.data"></ion-img>
<ion-label>{{image.name}}</ion-label>
</ion-list>
</ng-template>
</swiper>
<ion-label>{{index}}/{{this.images.length}}</ion-label>
.ts
images = [....];
index = 1;
onSlideChange(event){
this.index = event[0].activeIndex+1;
console.log(this.index);
}
p.s the console prints the correct index value every (slideChange)
1 post - 1 participant
I am relatively new to ionic and vue, I created an application with a sidemenu, however I would like to hide this sidemenu on specified views lets say the login view, below is my code
<template>
<IonApp>
<IonSplitPane content-id="main-content">
<ion-menu content-id="main-content" type="push">
<ion-header :translucent="true">
<ion-toolbar>
<ion-title class="main-title">
<img src="/assets/images/logo.png" alt="Arms logo" />
<span class="ion-padding-start">Sample</span>
</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-list>
<ion-menu-toggle auto-hide="false" v-for="(p, i) in appPages" :key="i">
<ion-item @click="selectedIndex = i" router-direction="root" :router-link="p.url" lines="none"
detail="false" class="hydrated" :class="{ selected: selectedIndex === i }">
<ion-icon slot="start" :ios="p.iosIcon" :md="p.mdIcon" ></ion-icon>
<ion-label>{{ p.title }}</ion-label>
</ion-item>
</ion-menu-toggle>
</ion-list>
</ion-content>
</ion-menu>
<ion-router-outlet id="main-content"></ion-router-outlet>
</IonSplitPane>
</IonApp>
</template>
<script lang="ts">
import {
IonApp,
IonContent,
IonIcon,
IonItem,
IonList,
IonMenu,
IonMenuToggle,
IonRouterOutlet,
IonSplitPane,
IonTitle,
IonToolbar,
IonHeader,
IonLabel
} from "@ionic/vue";
import { defineComponent, ref } from "vue";
import { useRoute } from "vue-router";
import { Stores} from './register_store';
import {
heartOutline,
cogOutline,
appsOutline,
peopleOutline,
newspaperOutline,
bulbOutline,
} from "ionicons/icons";
export default defineComponent({
name: "App",
components: {
IonApp,
IonContent,
IonIcon,
IonItem,
IonList,
IonMenu,
IonMenuToggle,
IonRouterOutlet,
IonSplitPane,
IonTitle,
IonToolbar,
IonHeader,
IonLabel
},
provide: Stores,
setup() {
const showPane = ref(true)
const selectedIndex = ref(0);
const appPages = [
{
title: "Dashboard",
url: "/Dashboard",
mdIcon: appsOutline,
},
{
title: "Birth",
url: "/birth/landing",
mdIcon: peopleOutline,
},
{
title: "Death",
url: "/death/landing",
mdIcon: newspaperOutline,
},
{
title: "Configurations",
url: "/advanced/configurations",
mdIcon: cogOutline,
}
];
const path = window.location.pathname.split("views/")[1];
if (path !== undefined) {
selectedIndex.value = appPages.findIndex(
(page) => page.title.toLowerCase() === path.toLowerCase()
);
}
const route = useRoute();
if (route.name === "login") {
showPane.value = false
}
return {
showPane,
selectedIndex,
appPages,
heartOutline,
cogOutline,
appsOutline,
peopleOutline,
newspaperOutline,
bulbOutline,
isSelected: (url: string) => (url === route.path ? "selected" : ""),
};
},
});
</script>
Any help will be highly appreciated 
1 post - 1 participant
$ ionic serve
ng.cmd run app:serve --host=localhost --port=8100
[ng] Node packages may not be installed. Try installing with ‘npm install’.
[ng] Could not find the ‘@angular-devkit/build-angular:dev-server’ builder’s node package.
[ERROR] ng has unexpectedly closed (exit code 1).
The Ionic CLI will exit. Please check any output above for error details.
I what to open an Ionic source code on my PC, but got this error can anybody tell me what do I miss here?
1 post - 1 participant
ionic cordova build --release android generates aab file instead of apk
how to solve this issue
1 post - 1 participant
I have a simple file input which called selectFiles($event) on change. The files then passed to a FileReader. The exact same code below works well when on a desktop browser through >ionic serve. When debugging with Android Studio on my mobile phones, the reader.onloadend never got executed. Both READ_EXTERNAL_STORAGE and WRITE_EXTERNAL_STORAGE permission is added in the Manifest. Ran out of idea after tried several days.
selectFiles(event: any): void {
this.message = [];
this.progressInfos = [];
this.selectedFiles = event.target.files;
if (this.selectedFiles && this.selectedFiles[0]) {
const numberOfFiles = this.selectedFiles.length;
if (numberOfFiles > 8){
alert("Max 8 images");
}else{
for (let i = 0; i < numberOfFiles; i++) {
var reader = new FileReader();
reader.onloadend = (e: any) => {
const image = new Image();
image.src = e.target.result;
image.onload = () => {
let index = this.previews.findIndex(preview=>preview.img === '');
this.previews[index] = {img:e.target.result, width:image.width, height:image.height, data:this.selectedFiles[i], inProgress: false, progress: 0, id: null};
this.fileSelectTrigger.notify(true);
};
};
reader.readAsDataURL(this.selectedFiles[i]);
}
}
}
}
1 post - 1 participant
Using latest Ionic 6 and Capacitor 3.4 and following the instructions here: Native Audio | Cordova Native Audio Plugin for Audio Playback
Note: I am using a fresh install just to insure the plugins I need from my old Ionic4/Cordova project will still work with Capacitor. I have this same plugin installed on my older Ionic4/Cordova app which has been running for several years now.
The plugin installs and works without error however there is no sound from the device. No errors are produced either. I can preloadComplex() the audio file and no error response, all OK. I then play or loop and the response is “OK” but no sound from the device. Volume is 100% and the old app still works on same device.
JS Audio also works OK.
const audio = new Audio('assets/sounds/notification_triple_ding_loud.mp3');
audio.play();
Please advise and thank you for any assistance. I am really enjoying Capacitor over Cordova.
Ionic:
Ionic CLI : 6.19.0
Ionic Framework : @ionic/angular 6.0.0
@angular-devkit/build-angular : 13.2.3
@angular-devkit/schematics : not installed
@angular/cli : 13.2.3
@ionic/angular-toolkit : 6.0.0
Capacitor:
Capacitor CLI : 3.4.3
@capacitor/core : 3.4.3
System:
NodeJS : v12.20.2
npm : 6.14.11
OS : Windows 10 Pro 19044.1586
1 post - 1 participant
Hello everyone, I would like to report the following bug connected to the ion-virtual-scroll ionic element, and with it’s translate3d formula.
So, we have a list of users… Sometimes this list can contain up to 3k of elements. We decided to pass from a normal generation of the user’s list to a virtual loading one using ion-virtual-scroll.
Here is the header definition:
<ion-virtual-scroll [items]=“userList” approxItemHeight=“90px” approxHeaderHeight=“30px”
[itemHeight]=“itemHeightFn” [headerFn]=“myHeaderFn” [footerFn]=“myFooterFn” [headerHeight]=“headerHeightFn”>
So, indeed, as it was advised from the component’s documentation, we do set a height of the item. itemHeightFn is also 90px.
transform: translate3d(0, 0, 0). Starts from point Zero.
Everything works fine in normal use app.
The issue comes when you pass on Iphone in voiceover mode.
on right swipe… first element is border highlight well.
another swipe… the second element is being read but the voiceover selection contains the area of two elements. (second and third element)
another swipe… the third element is being read but the voiceover selection contains the area of three elements (starting from the third element down: an area associated to 3 - 4 - 5th element)
and so on… until the border selection area is higher than the phone screen area, and the scroll gets blocked.
In inspect, the elements have the correct height measure. Trying to work on the translate3d we notice that is the translate3d function that rules the border selection area.
We have tried to control the item height with various css rules, but no solution worked.
Please help!
1 post - 1 participant