@extends('layouts.admin')
@section('content')

<div style="width: 70%; margin:0 auto;" class="card card-primary">
    <div class="card-header">
        {{ trans('global.send_notice') }}
    </div>

    <div class="card-body">
        <form action="{{ route('admin.send.web-notification') }}" method="POST">
            @csrf
            <div class="mb-3">
              <label for="title" class="form-label">{{ trans('global.title') }}</label>
              <input name="title" required="true" type="text" class="form-control" id="title">
              
            </div>
          
            <div class="form-floating">
                <label for="floatingTextarea">{{trans('global.description')}}</label>
                <textarea class="form-control" placeholder="Description..." name="body" id="floatingTextarea"></textarea>
                
            </div>
           
            <button type="submit" class="btn btn-primary mt-2">Send</button>
          </form>
    </div>
</div>



@endsection
@section('scripts')
@parent
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.23.0/firebase.js"></script>
<script>
    var firebaseConfig = {
        apiKey: "AIzaSyB5Q7mHAYvPNtTdXmTNRZGQXRi0NBmsr9E",
        authDomain: "noipunno-227bb.firebaseapp.com",
        projectId: "noipunno-227bb",
        storageBucket: "noipunno-227bb.appspot.com",
        messagingSenderId: "210702169077",
        appId: "1:210702169077:web:81e7e5bed11799f5aee6bc",
        measurementId: "G-QTQZPXSNCF"
    };

    firebase.initializeApp(firebaseConfig);
    const messaging = firebase.messaging();

    messaging.onMessage(function(payload) {
        const noteTitle = payload.notification.title;
        const noteOptions = {
            body: payload.notification.body,
            icon: payload.notification.icon,
        };
        new Notification(noteTitle, noteOptions);
    });
</script>

@endsection