Creating Documents in HireHop – Documents as PDF and printing

Documents de devis de logiciels de location d'événementsHireHop has a very powerful document engine, enabling you to make professional and amazing looking documents, however even though it is powerful, it is very easy to use.

Documents are all standard HTML, and fully support CSS and JavaScript, even when HireHop converts them to a PDF.

There are numerous standard templates available, and every template can be customised if you are a paying HireHop subscriber.

Document Types

A document will only be available in certain appropriate places in the software, and in certain circumstances, for example a Job Quote document will only appear when you are in a job, and not when in Stock Management or a Project.  Another example is a job invoice document will only appear when an authorised invoice is selected in the Billing tab, so if the invoice is not authorised, the invoice document will not appear.

Document Templates

In Settings->Documents, you can add a new template document or edit existing documents.  All template documents have a padlock icon on the grid row, but if you edit one, it creates a copy as new document.  Template documents (the ones with padlock icons) are fine to delete as you can always easily add them back again.  Documents without the padlock icon are custom documents and cannot be retrieved once you delete them, so it is advised to keep backups.

Editing a Document

HireHop does have an inbuilt HTML editor, however this is very basic and it is recommended to use the « Source » view as much as possible.

HireHop documents have merge fields which are prefilled with the appropriate data by HireHop when you print, download or email a document.  The list of fields and explanation on how to use them can be found at https://myhirehop.com/modules/docmaker/fields.php.

Interfacing With The API

Instead or as well as using merge fields, documents in HireHop can also talk with the HireHop API, and pull data raw straight from the software.  Please note that this will not work for shared link documents for security reasons.  HireHop documents can also communicate with third party APIs and even load and use JavaScript frameworks.

As an example of a document getting its data using the API, copy the code from the document at https://myhirehop.com/docs/job_info.html, and paste it into a job document.  The output is not very interesting, it is just a dump of data received from the server using the API.

You can also post (send) data in a document, which is what the signature request document does.  Another example is the code below, so when you print or email a quote document, by adding the code below into the quote document, it will automatically create an archive every time the document is opened in a new tab, downloaded as a PDF or emailed as a PDF.

<script>
	// Save the supplying list as a quote once the document has finished loading
	window.onload = function() {
		var http = new XMLHttpRequest(),
		    job_id = document.getElementById("number").textContent,
		    now_str = (new Date()).toLocaleDateString(),
		    params = "job=" + job_id + "&desc=" + encodeURIComponent("Quote sent - " + now_str);
		http.open("POST", "/php_functions/archive_insert.php");
		http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
		http.send(params);
	}
</script>

Documents as PDFs

HireHop uses two engines to render documents as PDFs, being Chromium, which is used by Google Chrome and Microsoft Edge, or WebKit which is the base for the Apple Safari browser.  WebKit is far older and not maintained anymore, and does not support HTML5 as well as Chromium does, however it is a lot faster when creating PDF documents due to its simplicity, so if it looks fine using Webkit, it is advised to that.

Document Stationery

When printing or emailing PDF documents with HireHop, you can add stationery that the document will be overlaid onto.  Stationery is uploaded as PDF files in Depot Management, and so it is different for each depot (including virtual depots).

The stationery pages get added to each applicable page of a document, and the last stationery page is then repeated for all remaining document pages.  As an example, with a one page stationery document, it will be placed behind every page of the document.  If the stationery is a two page PDF, the first page of the stationery will appear behind page one of the document, and the second page behind page two, and all other subsequent document pages.  Stationery can have as many pages as you want.

Comment fonctionnent les webhooks dans HireHop

HireHop peut envoyer un message avec des données à d’autres applications lorsque certains événements sont déclenchés dans HireHop. Ce message s’appelle un webhook qui envoie automatiquement les données pertinentes à l’emplacement requis.

webhooksQu’est-ce qu’un webhook ?

Un webhook envoie/pousse un message, avec des données jointes au message, lorsque des choses spécifiques se produisent dans HireHop (un événement). Les webhooks sont envoyés via HTTP (appelle une adresse Web) et sont un moyen de transmettre des données à d’autres applications en temps réel. Les webhooks fournissent les données pertinentes à des applications spécifiques au fur et à mesure, ce qui signifie que l’application réceptrice obtient les données immédiatement après l’événement, ce qui est beaucoup plus efficace et plus rapide que l’interrogation des modifications de données.

Les webhooks HireHop peuvent être utilisés pour communiquer directement avec d’autres applications ou être envoyés à un connecteur comme Zapier, qui peut être fait pour formater les données et effectuer tous les appels d’API nécessaires vers HireHop ou vers une autre application.

Mise en place d’un webhook

Dans HireHop, allez dans « Paramètres » puis cliquez sur l’onglet « Paramètres de l’entreprise » et le bouton « Webhooks » en haut de la page. Dans la fenêtre contextuelle, cliquez sur le bouton « Nouveau » et ajoutez l’URL à laquelle le message du webhook doit être envoyé et sélectionnez chaque webhook auquel vous souhaitez que l’URL réponde. Vous pouvez ajouter autant de webhooks que vous le souhaitez, mais vous devez les limiter uniquement à ceux nécessaires auxquels l’URL spécifique répondra.

Un webhook HireHop publiera les données sur votre point de terminaison URL au format JSON et contiendra les données suivantes ou similaires.

{
    "time": "2022-03-29 07:50:42",
    "user_id": 1,
    "user_name": "John Smith",
    "user_email": "john@email.com",
    "company_id": 1,
    "export_key": "22u43mrjwe7u",
    "event": "invoice.status.updated",
    "data": { ... },
    "changes": {
        "FIELD_NAME": {
            "from": "vieille",
            "to": "nouveau"
        }, ...
    }
}

Dans l’exemple JSON ci-dessus, les champs suivants sont :

  • « time » est l’heure UTC et la date à laquelle le webhook a été envoyé.
  • « user_id » est l’ID de l’utilisateur qui a provoqué le déclenchement de l’événement.
  • « user_name » est leur nom d’utilisateur.
  • « company_id » est l’identifiant unique de l’entreprise pour laquelle l’utilisateur travaille.
  • « export_key » est la valeur de la clé d’exportation dans les paramètres de l’entreprise qui peut être utilisée comme contrôle de sécurité.
  • « event » est le nom de l’événement webhook qui a été déclenché.
  • « data » correspond aux données relatives à l’événement webhook.
  • « changes » sont les champs qui ont changé, étant ce qu’ils étaient par rapport à ce qu’ils ont été modifiés.

HireHop n’attendra pas de réponse de l’URL appelée ni ne signalera une erreur HTTP en l’appelant.

Exemple de code PHP pour un point de terminaison d’URL pour capturer les données du webhook :

<?php
	// Lire les données JSON
	$postdata = file_get_contents('php://input');
	// Convertir des données JSON en objet
	$data_str = json_decode($postdata);
?>

 

Posted in API

API HireHop Rest – Guide de démarrage

HireHop est construit sur une API, ce qui signifie que tout ce que vous voyez HireHop faire, vous pouvez également l’accomplir en utilisant l’API étendue. Tout ce dont vous avez besoin pour accéder à l’API Rest est un jeton utilisateur appliqué en tant que GET ou POST au point de terminaison d’URL pertinent.

Jetons API

Pour générer un token API, rendez-vous sur la page « Paramètres » et sélectionnez l’onglet « Utilisateurs ». Sélectionnez ou créez un utilisateur, puis pendant que cet utilisateur spécifique est sélectionné, cliquez sur le bouton « Menu » puis sur l’option « Jeton API » pour générer un jeton. Le jeton s’affichera alors et pourra être copié dans le presse-papiers à l’aide du bouton Copier.

Le jeton deviendra invalide si vous modifiez l’adresse e-mail ou le mot de passe de l’utilisateur sélectionné, ou si vous vous connectez par la suite à cet utilisateur. Pour éviter que cela ne se produise, vous devez créer un utilisateur API dédié et, pour des raisons de sécurité, lui donner les autorisations appropriées, le restreignant ainsi de tout ce pour quoi vous n’utiliserez pas l’API.

Pour des raisons de sécurité, vous ne devez pas utiliser le jeton dans le code JavaScript frontal, il ne doit être utilisé que côté serveur, car si un pirate informatique obtient le jeton, il peut modifier et accéder à vos données sur HireHop, alors gardez votre jeton secret. Si votre token est divulgué, changez simplement le mot de passe de l’utilisateur de l’API et générez un nouveau token.

Utiliser un Jeton

Un jeton doit être défini en tant que paramètre GET ou POST appelé « jeton ». Par exemple, pour charger les données de tâche pour la job numéro 52, HireHop appellera le point de terminaison de l’API :

https://myhirehop.com/php_functions/job_refresh.php?job=52

Si vous souhaitez appeler le même point de terminaison à l’aide d’un jeton, l’URL serait :

https://myhirehop.com/php_functions/job_refresh.php?job=52&token=dqwejk5GVT65909bHHBN7922pq5hxjm%207hmn

N’oubliez pas que lorsque vous passez le jeton via GET (un paramètre d’URL comme ci-dessus), vous devez d’abord encoder le jeton à l’aide d’un outil tel que https://meyerweb.com/eric/tools/dencoder.

Données de Publication

Pour créer ou modifier des données dans HireHop, vous devez utiliser un POST. Lors de la publication de données, vous devez définir uniquement les champs que vous souhaitez modifier, par exemple pour créer ou modifier un travail à l’aide du point de terminaison https://myhirehop.com/php_functions/job_save.php, en définissant le paramètre « job » sur « 0  » ou l’omettre créera un nouveau travail, tout le reste modifiera le numéro de travail correspondant. Ainsi, pour modifier le nom de la job dans le numéro de poste 52, les données de publication doivent être :

{
"job" : 52,
"name" : "New Name",
"token" : "dqwejk5GVT65909bHHBN7922pq5hxjm=-7hmn"
}

Points de terminaison de l’API

De nombreux points de terminaison d’API sont documentés dans la documentation de l’API, et bien d’autres suivront.  Pour établir le point de terminaison d’une tâche, dans l’application HireHop, utilisez la console du navigateur pour inspecter les appels réseau et les paramètres définis. Un guide complet sur les points de terminaison d’URL sera bientôt publié.

Limites de taux

HireHop permet à chaque utilisateur 60 demandes de connexion en 1 minute. S’il y en a plus de 60, une erreur « Avertissement de sécurité, trop de transactions » (327) est renvoyée.

Posted in API

Custom Fields – HireHop API

You can have an unlimited number of custom fields in HireHop specific to each record, a record being a job, project, test/service, asset, etc.  All custom fields can be used in documents, as long as they exist, otherwise they will just be blank.

Currently custom fields are only fully supported in Jobs and Projects. Custom fields can only be used using plugins.

Custom Fields Structure

When fetching a custom field for the currently edited record, there is a function called _get_custom_field_value(field) which will return NULL if the field is not set, a string, or a JavaScript object, depending on how you saved it.

You probably should save custom fields as a JavaScript object (like JSON) in the following format for more printing control, as if it is just a string, HireHop will treat it as a string:

"field_name" :
{
"value"  : "The value of the field",
"type"   : "The field type, default is text, it can also be number, currency, text, date, html and array"
"format" : "For date type only, eg "ddd, dddddd tt" // = "Mon, January 1 2017 12:00"
}

  • value is the value of the field in any format.
  • type tells HireHop how the field should be treated when merging it into a document. An array field will be displayed as JSON.
  • format tells HireHop how to format the field in the document, currently only available dates and is dependent on the users settings and how their date and time formats are set:
    • dddddd for a long date (like January 1 2018)
    • ddddd for a short date (like 01/01/2018)
    • dddd for the day of the week (like Monday)
    • ddd for the short day of the week (like Mon)
    • tt for the time (like 12:36 am).

The format part is only needed for dates and if it is not set, nothing will show.  You can merge formats together and add separators, for instance you can use dddd, dddddd tt which will give « Monday, January 1 2018 12:00 » if the user has set a date order as day month year. The value for a date type must be stored in the yyyy-mm-dd hh:mm format.

If you just save the field as a string and not a JavaScript object, that’s fine, HireHop will just treat it as a string.  Saving your custom fields as a JavaScript object will give you greater control, especially when HireHop prints them in a document.

Saving The Custom Fields

On all edit forms that support custom fields, there is a function called _save_custom_field_value(field, value).  This stores your fields to be saved later.  If you can’t find the function, please contact us.

Please note, that all changes must be written prior to saving.

When the custom fields are saved, they are merged with the existing fields, and any new fields passed with the same name as any existing ones, the new values will be set.

When saving the custom fields, for example using /php_functions.job_save.php directly as an API call, only parameters set will be updated, so if you only set the custom_fields post parameter, only the custom fields will change, all the other fields will stay as is.

Printing Custom Fields

All custom fields can be incorporated into documents just like normal fields and are prefixed with a single « _ » (underscore) character.  For example, for a custom field in a job called « field_name », you would load it by using the merge field « job:_field_name« .

Naming Custom Fields

Some custom fields in documents merge fields together, for example tests merge with an asset in some document fields, so be careful not to use the same field name in an asset and a test.  Also, other plugins maybe added in the future written by yourself or from another source, so add a prefix that denominates you, for example plugins written HireHop by use the « hh_ » prefix, so a field written in a plugin by us might be called « hh_NewName ».  Field names in document merges are not case sensitive, but they obviously are in JavaScript.

Searchable Custom Field

There is an additional field called CUSTOM_INDEX, that can be used for searching, filtering and listed in search results.  The field is a 45 character string value that can be set to NULL. To enable the field to be shown in the search results on the home page, change the allSearchCols global JavaScript variable by adding CUSTOM_INDEX to it:

if(allSearchCols.constructor===Array && doc_type==0 ) {
allSearchCols.push("CUSTOM_INDEX");
}

There is also a language setting for the custom field displayed name:

if(typeof(lang["customIndexTxt"])=="undefined" || lang["customIndexTxt"]=="") {
lang["customIndexTxt"] = "Custom field name";
}

The reason for the testing for undefined or blank above is just in case the user has set it in the language.

You can use the custom searchable field in the page by adding a lookup in the page or the editor.  On jobs there is a hidden tile that displays the  CUSTOM_INDEX field and can be shown and utilised like so in a plugin:

$("#job_tile_custom_index")
.show()
.click(function() {
window.open("https://www.my_external_app.com?id="+job_data["CUSTOM_INDEX"],"newwindow");
});

To save the CUSTOM_INDEX field in the relevant edit widget, using a custom plugin you can add a form element into the edit widget, for example like so:

// This adds the CUSTOM_INDEX field into the job edit widget
if(typeof($.custom.job_edit)!="undefined") {
// Redefine job_edit, move name to after telephone
$.widget("custom.job_edit", $.custom.job_edit, {
_init_main: function() {
// Call the old _init_main
this._super(arguments);
// Add an extra edit in the job edit
var table = this.default_disc.closest("table");
var tr = $("<tr>").appendTo( table);
$("<td>", { html: lang.customIndexTxt+ " :" }).appendTo(tr);
$("<input>", {
"name" : "custom_index", // Parameter to pass when saving
"class" : "data_cell",   // Setting class to data_cell tells HireHop it is a standard data field
"data-field" : "CUSTOM_INDEX", // Name of the field
"maxlength" : 45         // The CUSTOM_INDEX has a maximum length of 45 characters
})
.appendTo( $("<td>").appendTo(tr) );
// Change the memo height to compensate
this.job_edit_memo.height(110);
}
});
}

The CUSTOM_INDEX field is called xxx:custom_index in the document and is passed as a string into the document.

Global Custom Fields

Occasionally you might want to store a global counter, etc. for the whole company.  To read and store global custom fields use /php_functions/custom_fields_global_load.php and /php_functions/custom_fields_global_save.php.  Saving the data, you need to pass either a json string or json array:

$("#saving_dialog").dialog("open");
// This adds the CUSTOM_INDEX field into the job edit widget
$.ajax({
url: "/php_functions/custom_fields_global_save.php",
type: "post",
dataType: "json",
data: {
"fields":{"my_field":"any type of value"}
// or a json string
// "field":'{"my_field":"any type of value"}'
},
success: function(data)
{
$("#saving_dialog").dialog("close");
// HireHop reported an error
if(typeof(data.error) !== "undefined")
error_message(isNaN(parseInt(data.error)) ? data.error : lang.error[data.error]);
else
{
// All good, "data" is a javascript object (JSON) of all global custom fields
}
},
// Handle an http error
error: function(jqXHR, textStatus, errorThrown)
{
$("#saving_dialog").dialog("close");
error_message(lang.error[1]+" ("+errorThrown+").");
}
});

Posted in API

Cross Domain Fonts – Problème de chargement de la police CORS

De nombreux utilisateurs ont créé des documents étonnants à utiliser dans HireHop, en utilisant les fonctionnalités HTML5, JavaScript et CSS. Pour ces documents, les utilisateurs ont parfois besoin d’une police spéciale qu’ils stockent sur leur serveur, cependant, parfois, la police ne semble pas fonctionner dans le document HireHop. La raison en est due aux restrictions CORS (Cross-Origin Resource Sharing) dans les navigateurs.

Les polices ne se chargent pas dans les documents

La plupart des navigateurs Web n’autorisent pas les requêtes interdomaines, c’est à cause de la même politique de sécurité d’origine. Cela signifie que parfois, lors de l’utilisation de polices Web d’un autre domaine, des erreurs peuvent survenir et que la police ne se charge pas dans le navigateur ou dans les documents HireHop.

<style type="text/css">
@font-face {
    font-family: 'OpenSans';
    src: url('https://my_server.com/fonts/OpenSans.woff2') format('woff2');
}
html, body{
    font: normal 16px OpenSans, sans-serif;
}
</style>

La Solution

Pour corriger les restrictions d’origine croisée pour vos polices, la réponse du serveur distant qui héberge les fichiers de polices doit inclure l’en-tête Access-Control-Allow-Origin.

Si vous utilisez des services de polices comme Typekit ou Google Fonts, ou peut-être des réseaux de diffusion de contenu comme BootstrapCDN, CdnJS ou JsDelivr pour charger vos polices préférées, vous n’avez rien à faire, car l’en-tête Access-Control-Allow-Origin est déjà envoyés dans leur en-tête de réponse.

Apache

Pour configurer un serveur Web Apache, placez le code suivant dans le fichier httpd.conf ou .htaccess.

  1. Ajoutez les en-têtes de type mime sur Apache:
    AddType application/vnd.ms-fontobject    .eot
    AddType application/x-font-opentype      .otf
    AddType image/svg+xml                    .svg
    AddType application/x-font-ttf           .ttf
    AddType application/font-woff            .woff
    AddType application/font-woff2           .woff2
    
  2. Activez le partage de ressources cross-origin (CORS) sur Apache pour les types mime:
    <IfModule mod_headers.c>
      <FilesMatch ".(eot|otf|svg|ttf|woff2?)$">
        Header set Access-Control-Allow-Origin "*"
      </FilesMatch>
    </IfModule>
    

NGINX

Pour configurer un serveur Web NGINX, placez le code suivant dans le fichier /etc/nginx/nginx.conf ou dans votre fichier /etc/nginx/conf.d/custom.conf personnalisé.

  1. Ajoutez les en-têtes de type mime sur NGINX:
    application/vnd.ms-fontobject    eot;
    application/x-font-opentype      otf;
    image/svg+xml                    svg;
    application/x-font-ttf           ttf;
    application/font-woff            woff;
    application/font-woff2           woff2;
    
  2. Activez le partage de ressources cross-origin (CORS) sur NGINX pour les types mime:
    location ~* .(eot|otf|svg|ttf|woff|woff2)$ {
        add_header Access-Control-Allow-Origin *;
    }
    

IIS

Pour configurer Microsoft IIS, ajoutez le code suivant au fichier web.config system.webServer.

  • Activer le partage de ressources cross-origin (CORS) sur IIS
    <system.webServer>
      <httpProtocol>
        <customHeaders>
          <add name="access-control-allow-origin" value="*" />
          <add name="access-control-allow-headers" value="content-type" />
        </customHeaders>
      </httpProtocol>
    </system.webServer>
    

PHP

Si vous ne pouvez pas modifier les paramètres du serveur, vous pouvez toujours utiliser PHP pour fournir le fichier de police.

  • Utilisez un fichier de script serveur plutôt qu’un fichier de police physique
    <style type="text/css">
    @font-face {
        font-family: 'OpenSans';
        src: url('https://my_server.com/fonts/OpenSans.php') format('woff2');
    }
    html, body{
        font: normal 16px OpenSans, sans-serif;
    }
    </style>
    
  • Comment résoudre les problèmes cross-domain @ font-face avec PHP
    <?php
    // fonts.php
    header('Access-Control-Allow-Origin: *');
    header('Content-Type: application/font-woff2');
    echo @file_get_contents('/fonts/OpenSans.woff2');
    ?>
    
Posted in API

Comment configurer HireHop avec QuickBooks – Logiciel de location d’équipement HireHop + QuickBooks

Intégration QuickBooks + HireHopComment HireHop et QuickBooks s’intègrent-ils?

HireHop peut produire vos factures, notes de crédit, paiements et bons de commande. HireHop a également un carnet d’adresses qui contient des clients et des fournisseurs, ainsi que des travaux où le client est unique et ne figure pas dans le carnet d’adresses. HireHop garde également une trace de ce qui a été payé et crédité sur les factures, ainsi que du solde du compte d’un client.

QuickBooks a besoin de ces factures, notes de crédit, paiements, bons de commande et contacts créés dans HireHop à des fins de comptabilité. Avec notre intégration fonctionnant parfaitement en coulisses, HireHop informe QuickBooks quand ils sont créés ou mis à jour afin que vous n’ayez pas à le faire. À son tour, HireHop doit savoir quels paiements ou crédits ont été appliqués dans QuickBooks pour pouvoir enregistrer les factures comme étant payées ou non.

Quelles données HireHop envoie-t-il à QuickBooks?

Il existe deux modes pour synchroniser les données entre HireHop et QuickBooks – en direct ou en mémoire tampon:

  • En mode direct, dès que vous créez ou modifiez une facture, un avoir, un paiement ou un bon de commande, il est immédiatement envoyé à QuickBooks.
  • En mode tamponné, ils sont tous conservés dans un tampon jusqu’à ce que vous synchronisiez les données entre HireHop et QuickBooks. Toute facture, note de crédit, bon de commande ou paiement qui ne parvient pas à se synchroniser avec QuickBooks en mode Live sera automatiquement placé dans le tampon pour une synchronisation manuelle.  Toutes les factures et crédits mis en mémoire tampon peuvent être consultés dans le rapport Factures à exporter.

Les factures HireHop sont envoyées à QuickBooks une fois que le statut est passé à Approuvé ou supérieur. Si une facture approuvée est modifiée, elle est renvoyée pour être mise à jour dans QuickBooks. Il en va de même pour les bons de commande, les notes de crédit et les paiements.

Tous les nouveaux contacts utilisés dans les factures et les bons de commande sont automatiquement envoyés à QuickBooks depuis HireHop.

Dans QuickBooks, une entrée dans le carnet d’adresses ne peut pas être à la fois un client et un fournisseur, par conséquent, comme cette fonctionnalité est disponible dans HireHop, lorsque cela se produit, HireHop créera deux entrées dans le carnet d’adresses QuickBooks, une pour le carnet d’adresses client et un pour le carnet d’adresses du fournisseur.

Une fois que vous avez synchronisé ou connecté HireHop à QuickBooks, QuickBooks autorisera cette connexion pendant 3 mois, après quoi HireHop vous invitera à vous reconnecter la prochaine fois qu’une connexion sera nécessaire.

Quelles données QuickBooks envoie-t-il à HireHop?

Les contacts sont importés de QuickBooks dans HireHop dans Paramètres, vous permettant d’importer uniquement les contacts dont vous avez besoin afin que votre carnet d’adresses ne soit pas encombré.

Lorsqu’un paiement ou une note de crédit est appliqué à une facture dans QuickBooks, ils sont envoyés à HireHop et enregistrés sur la facture correspondante. Le statut de la facture est alors automatiquement marqué comme ayant été payé ou non.


How To Setup QuickBooks With HireHop

Configurer HireHop avec QuickBooks
  • Dans les paramètres HireHop, cliquez sur l’onglet Comptes.
  • Dans les Comptes, cliquez sur le bouton Nouveau à droite du tableau des progiciels de comptabilité en bas de l’écran et une nouvelle fenêtre de progiciel de comptes s’ouvrira.
  • Cliquez sur la première option intitulée «Intégrer avec» et sélectionnez «QuickBooks». Vous pouvez ensuite définir des préfixes et des numéros de départ pour les factures, les notes de crédit et les bons de commande. Vous pouvez également choisir de mettre les transactions en mémoire tampon et de les synchroniser lorsque vous décidez, au lieu d’avoir des mises à jour en direct et automatisées. Cliquez sur le bouton Suivant pour nontinuer.
  • La page «Comptes» vous permet de saisir des codes nominaux et des comptes bancaires. Cliquez sur le bouton Synchroniser et HireHop importera tous les comptes bancaires et les codes nominaux de votre compte QuickBooks. Vous devez supprimer tous ceux que vous n’utiliserez pas dans HireHop (vous pourrez les rajouter plus tard). Il y aura un compte bancaire et deux codes nominaux en gras, ce sont vos valeurs par défaut qui peuvent être modifiées. Les valeurs par défaut sont celles sélectionnées lorsque vous n’attribuez pas de valeur nominale à un élément. Une fois terminé, cliquez sur Suivant.
  • La page suivante est vos «Codes fiscaux», cliquez à nouveau sur le bouton Synchroniser et HireHop les importera de QuickBooks. Encore une fois, vous pouvez modifier et modifier les valeurs par défaut à partir de celles définies automatiquement. Une fois terminé, cliquez sur Suivant.
  • Enfin, la page «Contacts». Vous n’êtes pas obligé de les importer, mais si vous le faites, vous pouvez faire correspondre ceux qui sont déjà dans HireHop, en importer d’autres et supprimer ceux que vous n’utiliserez pas. Une fois terminé, cliquez sur le bouton Enregistrer.

Vous verrez maintenant QuickBooks dans le tableau des progiciels de comptabilité et quelques boutons rouges «Affecter» clignotants. Comme HireHop peut prendre en charge plusieurs packages de comptabilité dans la même installation, différents pour des dépôts individuels ou des groupes de dépôts, vous devez définir les dépôts qui utiliseront cette version de QuickBooks. HireHop a également des groupes fiscaux et nominaux, encore une fois, ceux-ci doivent être affectés à ceux de QuickBooks.

  • Cliquez sur le bouton Attribuer à côté du tableau «Paquets comptables», cliquez sur le dépôt et sélectionnez «QuickBooks » puis cliquez sur le bouton Enregistrer. Si un dépôt n’est pas défini, il utilisera le progiciel de comptabilité par défaut, si un dépôt virtuel n’est pas défini, il utilisera le progiciel de comptabilité du dépôt parent.
  • Cliquez sur le bouton Attribuer à côté du tableau «Groupes nominaux», cliquez sur la ligne QuickBooks et chaque colonne pour attribuer un code nominal à un groupe nominal. Une fois terminé, cliquez sur le bouton Enregistrer. Tout groupe nominal non défini recourra au code nominal de revenus ou de dépenses par défaut.
  • Enfin, cliquez sur le bouton Attribuer à côté du tableau «Groupes de taxes», cliquez sur les lignes de dépôt affectées à QuickBooks et cliquez dans chaque colonne pour attribuer les codes de taxe appropriés au dépôt, puis cliquez sur le bouton Enregistrer.

Vous avez maintenant configuré QuickBooks pour qu’il se synchronise avec HireHop.


En savoir plus et essayer gratuitement le logiciel de comptabilité QuickBooks.

Customisation & Customising Widgets – HireHop API NoHTML Framework

HireHop is completely customisable, you can even add custom fields, all done using the HireHop JavaScript injection method, in which JavaScript files that you have written are inserted into HireHop pages.  If you look at the page source of a HireHop page, you will see <!– PLUGINS –>, it is after here where the JavaScript for your plugins will be inserted.

HireHop has been built from the ground up, developing our own framework that we call NoHTML, amalgamating existing technology and methodology to produce a framework that is easy to use, extendable and enables fast page loading, even on slow internet connections.

Apart from the main part of the page, the main parts of HireHop are dynamically built on the client machine using JavaScript and jQuery widgets, similar to REACT and JSX, but more simple and of course using the familiar jQuery framework.  For instance, if you load a Job page and inspect the page (press F12 for the browser’s object inspector), you will see a <div> element at the bottom of the page structured like so:

<div id= »notes_tab« ></div>

As you can see the above <div> is just an empty div element. If you click on the « Notes » tab, suddenly the above element is populated with elements.  Looking at your browser’s inspector you will also notice that the only data loaded from the server was some JSON and not the code in the notes tab.  The notes tab was built dynamically on the client machine using a custom jQuery UI Widget called $.notes() (internally called $.custom.notes) that is defined in the file /js/notes.js, and that widget used an ajax call to the server to get the data to populate it.

All the widget files on HireHop are compressed for speed, however to see the expanded source just add a .MAX to the end of the file’s name, for instance /js/notes.MAX.js.

To inject JavaScript into your webpages, if you go to Settings->Company Settings, and in Plugins add the url of your JavaScript file, which should be on an https server.  You can add multiple URLs which you can separate with a « ; » (semi-colon).  All URLs must be to a secure https domain.

Extending A Widget

As these are jQuery UI Widgets, you can use a type of Object Orientated programming technique to overwrite parts of the HireHop widgets. For example, we are going to create a small plugin that adds a span element with the word Hello after the Refresh button on the notes widget.

First create a JavaScript file on your web server and add the following code

$(document).ready(function(){
// Check if the notes widget exists
if(typeof($.custom.notes)!= »undefined » && hh_api_version<=1) {
// Redefine notes widget
$.widget(« custom.notes« , $.custom.notes, {
_init_main: function() {
// Call the old _init_main
this._super(arguments);
// Add an hello after the refresh button
$(« <span>« ,{ html: » Hello » }).insertAfter(this.btnRefresh);
},
// Even add your own new functions into the widget if you want

new_function_name: function() { }
});
}
});

The above code is available in a file located at https://s.myhirehop.com/plugins/demo.js.

Explaining the code above line by line:

$(document).ready(function(){
First we wait for the document to be ready and all page elements and JavaScript files to be loaded.  In this case this is not necessary as the /js/notes.js file is loaded before the plugin script, however for this example we have left it in for reference.

if(typeof($.custom.notes)!= »undefined » && hh_api_version<=1) {
Next we test to see if the notes widget has been defined, if it has we will proceed to overwrite one part of it.  Here we are also testing the HireHop API version the user is using.  As new versions of HireHop are released, the user will have the option to use it and this makes sure that your plugin is compatible with that version.

$.widget(« custom.notes« , $.custom.notes, {
Here we are initiating merging of a new JavaScript object containing functions into the notes widget.

_init_main: function() {
By naming a function the same as an existing one, it will be overwritten.

this._super(arguments);
This calls the inherited function, being the function we are overwriting.

$(« <span> »,{ html: » Hello » }).insertAfter(this.btnRefresh);
We then add a simple span element containing the word « Hello » after the Refresh button. you could also use $(« <span> Hello</span> »).insertAfter(this.btnRefresh);. To address elements, you should always use the variables assigned to elements and never the element ID’s as most ID’s on HireHop are dynamically created and will be different with every instance.  If the element ID has numbers in it or is not nicely named, definitely don’t use it.

new_function_name: function() { }
Finally, this does nothing and is not necessary for what we need to do, it just demonstrates that you can even add your own functions into the widget.

When you reload the HireHop page, you will see the word Hello after the refresh button if you did everything correctly.

Versioning

A huge advantage of using the HireHop NoHTML framework is that all the JavaScript is cached, resulting in fast page loading as the browser uses the JavaScript files in its cache.  This can be problematic when you update your plugin, as all the users using it, their browsers won’t download the updated version, and instead use their cached version, that is unless they clear their browser cache.

To overcome this, when adding your JavaScript URLs to the Plugins options, you can use a versioning parameter, for example for https://www.mywebsite.com/plugin.js you would enter it as https://www.mywebsite.com/plugin.js?v=1. After an update you can then change it to read https://www.mywebsite.com/plugin.js?v=2 which will force all browsers to reload the JavaScript file from your server.  If you don’t have a server to store the code on, you can always use GIST or Google Open Source.

Posted in API