Giter Club home page Giter Club logo

cordova-plugin-drawoverapps's Introduction

Draw Over All Apps plugin for Cordova

Android Cordova Plugin that uses draw over all apps feature to display a HTML Web view

This plugin was successfully tested on Android 5.1 , also on Marshmallow (Android 6.0).

Install

cordova plugin add cordova-plugin-drawoverapps

It is also possible to install via repo url directly

cordova plugin add https://github.com/ahmedwahba/cordova-plugin-drawoverapps

Functions

  • window.overApps.checkPermission
  • window.overApps.startOverApp
  • window.overApps.closeOverApp

window.overApps.checkPermission

This to check draw-over-apps permession and open system permission window to be granted

  window.overApps.checkPermission(function(msg){
         console.log(msg);
  });

window.overApps.startOverApp

start service function display the over-all head or the web view according to options. If successful the success is called, otherwise the failed is called instead.

window.overApps.startOverApp(options, success, failed);

Options

  • path: file path to display as view content, this file should be located in WWW root folder.
  • hasHead: display over app head image which open the view up on click , by default true.
  • dragToSide: enable auto move of head to screen side after dragging stop , by default true.
  • enableBackBtn: enable hardware back button to close view, by default true.
                            should be disabled to be able to use keyboard.
  • enableCloseBtn: whether to show native close btn or to hide it , by default true
  • verticalPosition: set vertical alignment of view , values are top - center - bottom , by default center.
  • horizontalPosition: set horizontal alignment of view , values are right - center - left , by default center.

Example

var options = {
      path: "test.html",          // file path to display as view content.
      hasHead: true,              // display over app head image which open the view up on click.
      dragToSide: false,          // enable auto move of head to screen side after dragging stop. 
      enableBackBtn: false,       // enable hardware back button to close view.
      enableCloseBtn: true,      //  whether to show native close btn or to hide it.
      verticalPosition: "top",    // set vertical alignment of view.
      horizontalPosition: "left"  // set horizontal alignment of view. 
 };
 
 window.overApps.startOverApp(options,function (success){
   		console.log(success);
 },function (err){
   		console.log(err);
 });

window.overApps.closeOverApp

It closes over app web view , called inside app itself only .

window.overApps.closeOverApp();

Control overApp WebView

Close WebView

It closes over app webview from one of the webview UI or event

OverApps.closeWebView();

Licence

Copyright (c) 2017 Ahmed Wahba & Mohamed Sayed

Permission is here by granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

cordova-plugin-drawoverapps's People

Contributors

ahmedlag avatar ahmedwahba avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

cordova-plugin-drawoverapps's Issues

Insufficient Overlay width

Hello Ahmed Wahba!

I want your plugin to display overlay fullwidth. is it possible?

And, can I use cordova plugins in this draw.html file?

photo_2021-09-21_16-34-44

Build Failed

Hello,
trying to use the plugin with Ionic6
in AndroidStudio getting error

Caused by: org.gradle.internal.metaobject.AbstractDynamicObject$CustomMessageMissingMethodException: Could not find method compile() for arguments [com.makeramen:roundedimageview:2.2.1] on object of type org.gradle.api.internal.artifacts.dsl.dependencies.DefaultDependencyHandler.

How to fix it?

How to use it with ionic 2 ?

Please can you show an example for how to use it in ionic 2 ?
i mean where exact i can add this plugin functions ? inside [ app.components ? ] or where and can you share this test.html file content example ?

thanks for this plugin

regards

App crashes when I call window.overApps.startOverApp

I have tried to use this plugin with PhoneGap build but I kept getting the error package R does not exist so I tried @hiroshi-iteya 's fork and it the build went successfully. However, when I lunch the App it crashes immediately when the window.overApps.startOverApp function is called.

Thanks in advance.

Draw over other app is not working properly!

I installed this plugin and used as shown in the documentation.
I think html file wasnt found.

Rounded icon appears at the beginning but when i click on that it shows me black square. Where did i made a mistake?

Can you Ahmed Wahba analyze my problem please?

RuntimeException: Unable to create service , BadTokenException: Unable to add window -- permission denied for window type 2002

Ive tried all suggestions over the forums.
made changes accordingly.

Project compiles ok now, but I get error when executing function : overApps.startOverApp

I grabbed the adb log for this:

[ 10-17 14:01:39.176 18486:18486 E/AndroidRuntime ]
FATAL EXCEPTION: main
Process: in.iocare.itm, PID: 18486
java.lang.RuntimeException: Unable to create service org.apache.cordova.overApps.Services.OverAppsService: android.view.WindowManager$BadTokenException: Unable to add window android.view.ViewRootImpl$W@117abfa -- permission denied for window type 2002
        at android.app.ActivityThread.handleCreateService(ActivityThread.java:3965)
        at android.app.ActivityThread.access$1500(ActivityThread.java:219)
        at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1875)
        at android.os.Handler.dispatchMessage(Handler.java:107)
        at android.os.Looper.loop(Looper.java:214)
        at android.app.ActivityThread.main(ActivityThread.java:7356)
        at java.lang.reflect.Method.invoke(Native Method)
        at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:492)
        at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:930)
Caused by: android.view.WindowManager$BadTokenException: Unable to add window android.view.ViewRootImpl$W@117abfa -- permission denied for window type 2002
        at android.view.ViewRootImpl.setView(ViewRootImpl.java:931)
        at android.view.WindowManagerGlobal.addView(WindowManagerGlobal.java:387)
        at android.view.WindowManagerImpl.addView(WindowManagerImpl.java:95)
        at org.apache.cordova.overApps.Services.OverAppsService.onCreate(OverAppsService.java:127)
        at android.app.ActivityThread.handleCreateService(ActivityThread.java:3953)
        ... 8 more

I have proper permission granted for app.

Originally posted by @bkrajendra in #1 (comment)

deviceready has not fired after 5 seconds.

I am running on [email protected] and [email protected] , the widget can be opened but I cant call any function on the new html page even a alert .
(OverApps.closeWebView(); This is work.)

I have checked the inspect on chrome dev tools , it shows

deviceready has not fired after 5 seconds.

This is my html . I think this plugin is work but the deviceready can be only fired once , anyone can help ?

<!DOCTYPE html>
<html>
    <head>
		<link rel="manifest" href="manifest.json">
        <title></title>
    </head>	
  <body>
		<button onclick="closeOverApp()">here</button>
		<button onclick="ss()">heresss</button>
                <script type="text/javascript" src="js/index.js"></script>
		<script type="text/javascript" src="js/script.js"></script>
		<script type="text/javascript" src="cordova.js"></script>
  </body>
</html>

error: cannot find symbol

Thanks for your great work here, @ahmedwahba ! :D

I'm trying to install it on my project. I followed the instructions, however, I get the following error when I try to build. Do you have any suggestions I could try?

Thanks!

K:\Development\QM-Docker\public.built\ionic\Modo\platforms\android\src\org\apache\cordova\o
verApps\Services\OverAppsService.java:79: error: cannot find symbol
         overAppsHead = inflater.inflate(R.layout.service_over_apps_head, null, false);
                                                 ^
  symbol:   variable service_over_apps_head
  location: class layout
K:\Development\QM-Docker\public.built\ionic\Modo\platforms\android\src\org\apache\cordova\o
verApps\Services\OverAppsService.java:80: error: cannot find symbol
         overAppsView = inflater.inflate(R.layout.service_over_apps_view, null, false);
                                                 ^
  symbol:   variable service_over_apps_view
  location: class layout
K:\Development\QM-Docker\public.built\ionic\Modo\platforms\android\src\org\apache\cordova\o
verApps\Services\OverAppsService.java:81: error: cannot find symbol
         webView = (WebView) overAppsView.findViewById(R.id.webView);
                                                           ^
  symbol:   variable webView
  location: class id
K:\Development\QM-Docker\public.built\ionic\Modo\platforms\android\src\org\apache\cordova\o
verApps\Services\OverAppsService.java:82: error: cannot find symbol
         imageHead = (ImageView) overAppsHead.findViewById(R.id.imageHead);
                                                               ^
  symbol:   variable imageHead
  location: class id
K:\Development\QM-Docker\public.built\ionic\Modo\platforms\android\src\org\apache\cordova\o
verApps\Services\OverAppsService.java:83: error: cannot find symbol
         imgClose = (ImageView) overAppsView.findViewById(R.id.imgClose);
                                                              ^
  symbol:   variable imgClose
  location: class id
K:\Development\QM-Docker\public.built\ionic\Modo\platforms\android\src\org\apache\cordova\o
verApps\Services\OverAppsService.java:211: error: cannot find symbol
             keyDispatureView = inflater.inflate(R.layout.key_dispature, null, false);
                                                         ^
  symbol:   variable key_dispature
  location: class layout
K:\Development\QM-Docker\public.built\ionic\Modo\platforms\android\src\org\apache\cordova\o
verApps\Services\OverAppsService.java:213: error: cannot find symbol
         rlKeyDispature = (KeyDispatchLayout) keyDispatureView.findViewById(R.id.tab_left);
                                                                                ^
  symbol:   variable tab_left
  location: class id

Cannot read property 'checkPermission' of undefined

I'm getting this error.
Cannot read property 'checkPermission' of undefined
Also tried in ionic 3 but get same error

### My package.json file is here.
{ "name": "DemoV3", "version": "0.0.1", "author": "Ionic Framework", "homepage": "https://ionicframework.com/", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/common": "~8.1.2", "@angular/compiler": "~8.1.2", "@angular/core": "~8.1.2", "@angular/forms": "~8.1.2", "@angular/platform-browser": "~8.1.2", "@angular/platform-browser-dynamic": "~8.1.2", "@angular/router": "~8.1.2", "@ionic-native/core": "^5.0.0", "@ionic-native/splash-screen": "^5.0.0", "@ionic-native/status-bar": "^5.0.0", "@ionic/angular": "^4.7.1", "cordova-android": "8.1.0", "cordova-plugin-drawoverapps": "^1.0.6", "core-js": "^2.5.4", "rxjs": "~6.5.1", "tslib": "^1.9.0", "zone.js": "~0.9.1" }, "devDependencies": { "@angular-devkit/architect": "~0.801.2", "@angular-devkit/build-angular": "~0.801.2", "@angular-devkit/core": "~8.1.2", "@angular-devkit/schematics": "~8.1.2", "@angular/cli": "~8.1.2", "@angular/compiler": "~8.1.2", "@angular/compiler-cli": "~8.1.2", "@angular/language-service": "~8.1.2", "@ionic/angular-toolkit": "~2.0.0", "@types/jasmine": "~3.3.8", "@types/jasminewd2": "~2.0.3", "@types/node": "~8.9.4", "codelyzer": "^5.0.0", "cordova-plugin-device": "^2.0.2", "cordova-plugin-ionic-keyboard": "^2.2.0", "cordova-plugin-ionic-webview": "^4.1.2", "cordova-plugin-splashscreen": "^5.0.2", "cordova-plugin-statusbar": "^2.4.2", "cordova-plugin-whitelist": "^1.3.3", "jasmine-core": "~3.4.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~4.1.0", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "~2.0.1", "karma-jasmine": "~2.0.1", "karma-jasmine-html-reporter": "^1.4.0", "protractor": "~5.4.0", "ts-node": "~7.0.0", "tslint": "~5.15.0", "typescript": "~3.4.3" }, "description": "An Ionic project", "cordova": { "plugins": { "cordova-plugin-whitelist": {}, "cordova-plugin-statusbar": {}, "cordova-plugin-device": {}, "cordova-plugin-splashscreen": {}, "cordova-plugin-ionic-webview": { "ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+" }, "cordova-plugin-ionic-keyboard": {} }, "platforms": [ "android" ] } }

Doesn't install with cordova-android 9.0.0

Hi!
The plugin seems to require a very old cordova-android version, is it possible to update,please? Thanks!

Installing "cordova-plugin-drawoverapps" for android
Installing "cordova-plugin-compat" for android
Plugin doesn't support this project's cordova-android version. cordova-android: 9.0.0, failed version requirement:
<6.3.0
Skipping 'cordova-plugin-compat' for android
Subproject Path: CordovaLib
Subproject Path: app
Failed to install 'cordova-plugin-drawoverapps': TypeError: Cannot read property 'PACKAGE_NAME'...

error: "package R does not exist" on several lines of OverAppsService.java

So after installing your plugin and its dependencies I attempted to run my app to do a test, I keep getting the error below which points to the OverAppsService.java file starting on line 77 telling me that the "package R does not exist". I tried importing R by adding the line
import org.apache.cordova.overApps.DrawOverApps.R; however this did not solve the issue. I've already tried all 3 forks of your plugin and all of them present the same problem.

I am using cordova 7.0.1, I know the last time this plugin was said to be successfully tested by yourself it was on cordova 6.5.0, but I have not yet downgraded to that version to test it. Do you think I should, or can you see any quick fix that might get this running with the latest versions of cordova?

I am no good at Java, which is the main reason I'm using cordova in the first place, so I would appreciate any help or insight.

Error: cmd: Command failed with exit code 1 Error output:
Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
C:\Users\admin\Desktop\neckSaver\CORDOVA\textNeckTest\platforms\android\src\org\apache\cordova\overApps\Services\OverAppsService.java:77: error: package R does not exist
         overAppsHead = inflater.inflate(R.layout.service_over_apps_head, null, false);
                                          ^
C:\Users\admin\Desktop\neckSaver\CORDOVA\textNeckTest\platforms\android\src\org\apache\cordova\overApps\Services\OverAppsService.java:78: error: package R does not exist
         overAppsView = inflater.inflate(R.layout.service_over_apps_view, null, false);
                                          ^
C:\Users\admin\Desktop\neckSaver\CORDOVA\textNeckTest\platforms\android\src\org\apache\cordova\overApps\Services\OverAppsService.java:79: error: package R does not exist
         webView = (WebView) overAppsView.findViewById(R.id.webView);
                                                        ^
C:\Users\admin\Desktop\neckSaver\CORDOVA\textNeckTest\platforms\android\src\org\apache\cordova\overApps\Services\OverAppsService.java:80: error: package R does not exist
         imageHead = (ImageView) overAppsHead.findViewById(R.id.imageHead);
                                                            ^
C:\Users\admin\Desktop\neckSaver\CORDOVA\textNeckTest\platforms\android\src\org\apache\cordova\overApps\Services\OverAppsService.java:81: error: package R does not exist
         imgClose = (ImageView) overAppsView.findViewById(R.id.imgClose);
                                                           ^
C:\Users\admin\Desktop\neckSaver\CORDOVA\textNeckTest\platforms\android\src\org\apache\cordova\overApps\Services\OverAppsService.java:209: error: package R does not exist
             keyDispatureView = inflater.inflate(R.layout.key_dispature, null, false);
                                                  ^
C:\Users\admin\Desktop\neckSaver\CORDOVA\textNeckTest\platforms\android\src\org\apache\cordova\overApps\Services\OverAppsService.java:211: error: package R does not exist
         rlKeyDispature = (KeyDispatchLayout) keyDispatureView.findViewById(R.id.tab_left);
                                                                             ^
Note: C:\Users\admin\Desktop\neckSaver\CORDOVA\textNeckTest\platforms\android\src\org\apache\cordova\overApps\Services\OverAppsService.java uses or overrides a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
7 errors

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':compileReleaseJavaWithJavac'.
> Compilation failed; see the compiler error output for details.

adding plugin causes build problem

Dear @ahmedwahba @MohamedSayed9392 .
FIRST THANK A LOT YOU FOR YOUR CONTRIBUTION .
I downgrade my cordova cli to

[email protected]
and so my cordova android version is 6.1.2

but I still face problem:
p>cordova build android --verbose
Executing script found in plugin cordova-plugin-drawoverapps for hook "before_build": plugins\cordova-plugin-drawoverapps\www\hookLayout.js

  • hook from plugins/cordova-plugin-drawoverapps/src/android/drawable/close.png to platforms/android/app/src/main/res/drawable/close.png
    Error: ENOENT: no such file or directory, mkdir 'platforms/android/app/src/main/res/drawable'
    at Object.mkdirSync (fs.js:757:3)
    at C:\Users\User\Desktop\quizner8\app\plugins\cordova-plugin-drawoverapps\www\hookLayout.js:30:16
    at Array.forEach ()
    at C:\Users\User\Desktop\quizner8\app\plugins\cordova-plugin-drawoverapps\www\hookLayout.js:22:22
    at Array.forEach ()
    at Object. (C:\Users\User\Desktop\quizner8\app\plugins\cordova-plugin-drawoverapps\www\hookLayout.js:21:13)
    at Module._compile (internal/modules/cjs/loader.js:776:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10)
    at Module.load (internal/modules/cjs/loader.js:653:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:593:12)

Build failed after adding plugin

Hello, i get his error when i run cordova build android.
Although, the plugin actually never finishes installation, after running cordova plugin add ,
its says installing cordova-plugin-drawoverapps for android, and it stops there. but the plugin shows in my plugins folder.
anyway, this is the error i get when i build android

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:processDebugResources'.
> Android resource linking failed
  C:\Users\user\donald\platforms\android\app\src\main\res\layout\service_over_apps_head.xml:7: AAPT: error: attribute riv_border_color (aka com.numbersaver.com:riv_border_color) not found.

  C:\Users\user\donald\platforms\android\app\src\main\res\layout\service_over_apps_head.xml:7: AAPT: error: attribute riv_border_width (aka com.numbersaver.com:riv_border_width) not found.

  C:\Users\user\donald\platforms\android\app\src\main\res\layout\service_over_apps_head.xml:7: AAPT: error: attribute riv_corner_radius (aka com.numbersaver.com:riv_corner_radius) not found.

  error: failed linking file resources.

Doesn't install with cordova-android 12.0.0

Description:

I'm facing an issue with the cordova-plugin-drawoverapps plugin in my Ionic project. The overApps object seems to be undefined, and I'm unable to access its functions.

Steps to Reproduce:

Create a new Ionic project.
Install the cordova-plugin-drawoverapps plugin using cordova plugin add cordova-plugin-drawoverapps (it did not install directly either so I tried a couple of step to get it working and updated the deprecated WebView functions)
Attempt to access the overApps object and its functions.
Expected Behavior:

The overApps object should be available, and I should be able to use its functions like startOverApp().

Actual Behavior:

The overApps object is undefined even after waiting for the platform.ready event. As a result, I'm unable to use any functions provided by the plugin.

Environment:

Ionic CLI version: 6.20.8
Cordova version: 12.0.0 ([email protected])
Platform(s): Android
Additional Information:

I've verified that the cordova-plugin-drawoverapps plugin is correctly installed in the project, and it's listed in the config.xml.
I've tried reinstalling the plugin and creating a new project, but the issue persists.

Code Sample:

import { Component } from '@angular/core';
import { Platform } from '@ionic/angular';
declare var window: any;

@Component({
  selector: 'app-root',
  templateUrl: 'app.component.html',
  styleUrls: ['app.component.scss']
})
export class AppComponent {
  constructor(private platform: Platform) {
    this.initializeApp();
  }

  initializeApp() {
    this.platform.ready().then(() => {
      this.setupOverApps();
    });
  }

  setupOverApps() {
    // Now you can use the overApps object here.
    if (overApps) {
      console.log('overApps object is available.');
      // Call window.overApps.startOverApp() and other functions here.
    } else {
      console.log('overApps object is not available.');
    }
  }
}

Please let me know if you need any further information or if there's anything else I can provide to help resolve this issue.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.