prototyp faq sidebar II

by mtenschert

HTML

<link rel="stylesheet" href="https://www.alpinresorts.com/assets/css/main.css">
<!--
> Crossbrowser
 - Edge und Safari hat nun styling probleme
 - Safari desktop muss besser getestet werden
 - Mobile Safari testen
> mit Robin
 - aus dem Link zur ContactForm, select-box, links diesen focus-kack entfernen (firefox, engge)
 - Schließen Funktion außerhalb der app funktioniert nicht
 - Safari Desktop Browser zeigen alle Kategorien an, wieso?
> Analytics-Tracking
 - sections muss von einer Id auf einen namen geändert werden
 - analytics events vorbereitet > ga_events einsetzen
-->

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<body>



</body>

JavaScript

$("body").append('<li><a id="help_center_a_link" style="cursor:pointer; font-size:200%;">Test</a></li>');

$("#help_center_a_link").on('click', function() {

  function renderHelpCenterExternalFiles() {

    // JS
    const scriptElementJS = document.createElement('script');
    scriptElementJS.type = 'text/javascript';
    scriptElementJS.src = "https://www.alpinresorts.com/uploads/marketing/zendesk/help_center.js";
    scriptElementJS.id = "help_center_js";

    scriptElementJS.onload = () => {
      console.log('successfull [' + scriptElementJS.src + ']');
    };

    scriptElementJS.onerror = (error) => {
      console.log('error [' + scriptElementJS.src + ']');
    };

    document.getElementsByTagName('body')[0].appendChild(scriptElementJS);

    // CSS
    const scriptElementCSS = document.createElement('link');
    scriptElementCSS.rel = 'stylesheet';
    scriptElementCSS.id = 'help_center_css';
    scriptElementCSS.href = "https://www.alpinresorts.com/uploads/marketing/zendesk/help_center.css";

    scriptElementCSS.onload = () => {
      console.log('successfull [' + scriptElementCSS.src + ']');
    };

    scriptElementCSS.onerror = (error) => {
      console.log('error [' + scriptElementCSS.src + ']');
    };

    document.getElementsByTagName('body')[0].appendChild(scriptElementCSS);

  }

  var script_for_remove_js = $('script#help_center_js');
  var script_for_remove_css = $('link#help_center_css');

  function render_help_center_dom() {

    var script_for_remove_js_length = script_for_remove_js.length; // no
    var script_for_remove_css_length = script_for_remove_css.length; // no

    var help_center_already_loaded = script_for_remove_js_length + script_for_remove_css_length; // no

    if (help_center_already_loaded === 0) {

      renderHelpCenterExternalFiles();

    } else {

      var app_FAQ_detail = $("app-FAQ-detail");
      app_FAQ_detail.fadeIn(); // start fadeIn process

    }
  }

  render_help_center_dom()
 ...