Google Custom Search - Geteilt mit Script Lab.

Google Custom Search.yaml

name: Google Custom Search
description: Google Custom Search
author: maninweb
host: EXCEL
api_set: {}
script:
    content: |
        //  Initialize...

        $(document).ready(function () {

                (function () {
                    var cx = '007558919630150775935:8fvd9kiqgku';
                    var gcse = document.createElement('script');
                    gcse.type = 'text/javascript';
                    gcse.async = true;
                    gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
                    var s = document.getElementsByTagName('script')[0];
                    s.parentNode.insertBefore(gcse, s);
                })();
                

        });
    language: typescript
template:
    content: |-
        <div class="app">
        <!-- Header  -->
          <div class="header">
            <h1>Google Custom Search</h1>
          </div>
        <!-- Content -->
          <div class="content">
            <p>Das ist ein Test, um Google Custom Search direkt in einem Aufgabenbereich einzubinden.<br /><br />Bitte beachten: es ist <strong>wirklich</strong> nur ein Test! Denn dieses läuft unter meinem Account bei Google.</p>
            <gcse:search> </gcse:search></div>>
        <!-- Footer -->  
          <div class="footer">
            <span>Version 1.00.171029 · &copy 2017 by Mourad Louha · All rights reserved</span>
          </div>
        </div>
    language: html
style:
    content: "@import url(\"https://netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.css\");\r\n\r\n* {\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n*, *:before, *:after {\r\n  box-sizing: border-box;\r\n}\r\n\r\nhtml, body {\r\n  height: 100%;\r\n}\r\n\r\n.app {\r\n  display: flex;\r\n  flex-direction: column;\r\n  overflow: hidden;\r\n  font: 12px/1 \"Segoe UI\";\r\n  color: #000;\r\n  height: 100%;\r\n  width: 100%;\r\n}\r\n\r\n.header {\r\n  flex: none;\r\n  padding: 10px;\r\n  background: #eee;\r\n  border-bottom: #ddd 1px solid;\r\n  white-space: nowrap;\r\n}\r\n\r\n.header h1 {\r\n  display: inline;\r\n  font-size: 18px;\r\n  font-weight: bold;\r\n  margin: 0px;\r\n}\r\n\r\n.content {\r\n  flex: auto;\r\n  background-color: #fff;\r\n  overflow-x: hidden;\r\n  overflow-y: scroll;\r\n  padding: 10px;\r\n}\r\n\r\n.content h2 {\r\n  font-size: 14px;\r\n  font-weight: bold;\r\n  margin: 10px 0px 0px 0px;\r\n}\r\n\r\n.content p {\r\n  font-size: 14px;\r\n  margin: 10px 0px 0px 0px;\r\n  line-height: 1.25em;\r\n  text-align: justify;\r\n}\r\n\r\n.options {\r\n  width: 100%;\r\n\tmargin: 10px 0px 0px 0px;\r\n}\r\n\r\n.options input[type=checkbox] {\r\n  border: #ddd 1px solid;\r\n  cursor: pointer;\r\n}\r\n\r\n.options label {\r\n  padding: 0px 5px;\r\n  cursor: pointer;\r\n  font-size: 14px;\r\n  font-weight: normal;\r\n}\r\n\r\n.results {\r\n  background-color: #ddd;\r\n  margin: 10px 0px 0px 0px;\r\n  font-size: 14px;\r\n  font-weight: normal;\r\n  width: 100%;\r\n  min-height: 100px;\r\n}\r\n\r\n.search {\r\n  width:100%;\r\n  display:inline-block;\r\n  position: relative;\r\n  margin: 10px 0px 0px 0px;\r\n}\r\n\r\n.search button {\r\n  text-align: center;\r\n  font: 12px fontawesome;\r\n  border: 1px solid #ddd;\r\n  background-color: #eee;\r\n  width: 25px;\r\n  height: 28px;\r\n  cursor: pointer;\r\n  position:absolute;\r\n  right:0px;\r\n}\r\n\r\n.search textarea {\r\n  background-color: #fff;\r\n  border: 1px solid #ddd;\r\n  margin: 0;\r\n  padding: 5px 0px 0px 5px;\r\n  width: 100%;\r\n  height: 28px;\r\n  overflow: hidden;\r\n}\r\n\r\n.footer {\r\n  flex: none;\r\n  padding: 5px 10px;\r\n  background: #eee;\r\n  border-top: #ddd 1px solid;\r\n  font-size: 11px;\r\n  white-space: nowrap;\r\n  color:#666;\r\n}\r\n\r\n.information {\r\n  padding: 0 0 5px 0;\r\n  display: none;\r\n  color: #333;\r\n}\r\n"
    language: css
libraries: |-
    # Office.js
    https://appsforoffice.officeapps.live.com/afo/lib/beta/hosted/office.js

    # Google

    https://www.google.com/jsapi

    # CSS Libraries
    office-ui-fabric-js@1.4.0/dist/css/fabric.min.css
    office-ui-fabric-js@1.4.0/dist/css/fabric.components.min.css

    # NPM libraries
    core-js@2.4.1/client/core.min.js
    @microsoft/office-js-helpers@0.6.0/dist/office.helpers.min.js
    # Previous = jquery@3.1.1
    jquery@3.2.1
    whatwg-fetch

    # IntelliSense: @types/library or node_modules paths or URL to d.ts files
    @types/office-js
    @types/core-js
    @microsoft/office-js-helpers/dist/office.helpers.d.ts
    @types/jquery
    @types/whatwg-fetch
    @types/whatwg-streams