aproxima / htmlq Goto Github PK

View Code? Open in Web Editor NEW

35.0 14.0 33.0 610 KB

Q-method surveys in pure HTML5

License: MIT License

HTML 28.71% JavaScript 64.64% CSS 6.65%

htmlq's Introduction

HtmlQ

by aproxima Gesellschaft für Markt- und Sozialforschung Weimar.

Q-sorting tool in HTML5. Backwards compatible with settings files of FlashQ.

FAQ

You can find the FAQ here: https://github.com/aproxima/htmlq/wiki/FAQ

Features

Responsive layout for iPad and Android tablets
Compatible with Internet Explorer 8 and later
Compatible with settings files of FlashQ
Compatible with FlashQ PHP backend
Unique participant identifier can be passed via query paramater

Getting started

Download the latest release at https://github.com/aproxima/htmlq/releases
Extract the archive
Edit .xml files in the settings folder: Specify your statements, configure the map, change the translation, add a password...
While editing, you can try out the questionnaire at any time by opening index.html with Firefox

Once you're ready to start the survey:

Host the whole htmlq folder online using a web server such as Apache or nginx, or your web hosting company
Point your participants to the URL under which you made it available
If you want, you can add the FlashQ PHP backend to enable advanced functionality such as email export or CSV export

Settings

All .XML files in the settings subfolder are compatible with the settings files of FlashQ. A description of the settings files can be found at http://www.hackert.biz/flashq/faq/.

Additional settings (vs. FlashQ)

HtmlQ introduces a few new settings that were not available in FlashQ:

settings/config.xml:

    <!-- Disable the back button within the page. Users can always use the browser back button to navigate the survey anyway. -->
    <item id="disableBackButton">true</item>

    <!-- Make the font of the cards smaller so that users can read more of the text -->
    <item id="smallFont">false</item>

settings/language.xml:

    <!-- Label of the back button -->
    <item id="backButton">Back</item>

    <!-- Message that is shown to the user when not all required fields in step 5 were filled in -->
    <item id="fillInRequiredFields">Please fill in all required fields.</item>

    <!-- Warning that will be displayed to the user if they try to navigate away from the questionnaire and could lose their data -->
    <item id="leaveSiteWarning">Your answers will be lost.</item>

Creating unique participation links (UID)

If you want to send out unique links to a HtmlQ survey that will automatically fill in the UID/user code, you can create links in the following format: https://www.yourdomain.com/htmlq/#/?userCode=USERCODE. In the resulting CSV file, the user code will show up in the UID field. This allows you to identify participants without requiring them to log in.

Custom Logos

You can add up to three images (e.g. company logos) to the header by replacing the respective logo.jpg, logo_center.jpg and logo_right.jpg files.

Caveats

Trying out the survey offline by opening index.html will only work with some browsers, Firefox being the most popular. Google Chrome's security settings disallow executing the survey from your local hard drive. Google Chrome will work fine however when the site is hosted using a web server or web hosting company.

License

HtmlQ is released under the MIT License.

htmlq's People

Contributors

Stargazers

Watchers

htmlq's Issues

Adding images into statements?

Is it possible to add images into statements instead of texts?
I tried editing the statements in the statements.xml like the following

<statement id="1"><img src="images/1.png"/></statement>

but obviously something didn't go well and I only see a blank statement box.
If there is a way, I would greatly appreciate any kind of help.

How to skip popup (langage.xml) on htmlQ app ?

Hello,

I have encountered an issue : I want to skip a popup on htmlQ page and I don't know how to do it ?
this is the part of the code I don't want to be shown.

I've already tried to leave blank as specified but the message still shows up.

Thank you in advance for your assistance.

Size of the Font

Hello,

Everything is working well with HTMLQ except the size of the font during step 1. The size of the statements are too big for the boxes, the participants can't read all the statements properly. So I tried with this =

<item id="smallFont">false</item>

But It doesn't change anything.
So does someone know how to reduce the size of these statements? It would be really really helpful for my survey...

Submitting via post/get

I don't quite understand the part with submitting the data by URL. In the config.xml it sends data to some exe.php, which I can't find anywhere in the folder.
Do we have to make this file ourselves or is this file just lost somewhere?

Enlarge 'text boxes' on grid

Hi all,

I'm having a problem with HTMLq when using many statements. I am on a research team and am responsible for configuring our q surveys.

My research project calls for 46 statements, all quite long. In Step 2 after I place statements onto the grid, I unfortunately cannot read anything, even after I use smaller fonts. I anticipate that my survey participants will become frustrated when they're unable to read the text once they place it onto the grid.

Basically I do not want the program to compress the font size when I increase the array dimensions (we are using enough squares to cover 46 responses, ranging -5 to +5).

I'm not sure which file to edit directly to change this display. I suspect it's htmlq.js but I don't know Javascript really and am at a loss on what to do.

Any help is appreciated, thanks.

Blank card with brackets

On the main card sort, it is possible to drag a card between 2 spaces and it drops it onto the top card but places a blank card below with just brackets on it.

Issue in Safari 10.0.3

There seems to be a positioning issue in Safari 10.0.3 on macOS Sierra, i.e. the boxes are not placed correctly after reposition the boxes. (First move from bottom to matrix works well though)

Compare attached picture:

Tecnical Support

Can someone offer tech support with setting up htmlq?

firefox, chrome complain on closing

On OS X 10.11.4, Safari 9.1 works fine, but

Firefox 45.0.1
Chrome 49.0.2623.112 (64-bit)

both complain on closing the last window after submitting the data that data might be lost (see screenshots)

Might be related to this commit: 9f49a4c

Citation for htmlQ

Hi,
We plan to use htmlQ - for which we are very grateful. Is there a recommended citation for the software?
Thanks,
Anthony Staines

What's the best option to host my HTMLQ

Hello,
Im a beginner and I don't know how to put my survey online. I have a few simple questions.

First, do I have to pay a web server to put my survey online or are there any free options?

Second, if there are free options, what's the best? I read about apache but I don't really understand how to use it..

It would be really helpful if someone can enlighten me.
Thank you very much,

Antoine

How to store data

Hi,

thanks for sharing this excellent and very helpful code.
Since I am not an html expert at all, I wanted to ask how I can specify how (and where) the data will be stored after finishing the survey.

Thanks in advance and best,
Daniel