From 6f51b356a4c08f8ec3b452e92e301062c828dbc5 Mon Sep 17 00:00:00 2001
From: Juuso Lapinlampi <wub@partyvan.eu>
Date: Sat, 26 Sep 2015 11:29:20 +0000
Subject: Replace #upload-btn <a> element with <button>

Corrects semantics and increases accessibility.

The <a> element represents a hyperlink. A hyperlink is "a link from a
hypertext file or document to another location or file." This is not
what #upload-btn is, it's a button.

Ask yourself: "Does the element change the URL?" In our case, the upload
button does not so it is incorrect to use an <a> element here.

The idea to use <a> elements as buttons comes from years ago when you
couldn't style <button> elements in legacy browsers. Today you can, so
there's no reason to break the semantics.

Reference: http://blogs.ancestry.com/techroots/buttons-vs-anchors/
---
 pages/upload_form.swig   | 2 +-
 pages/upload_formca.swig | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/pages/upload_form.swig b/pages/upload_form.swig
index 91a28e8..126b3c4 100644
--- a/pages/upload_form.swig
+++ b/pages/upload_form.swig
@@ -19,6 +19,6 @@ IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
 CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 #}
 
-<a href="javascript:;" id="upload-btn" class="btn">Select <span>or drop </span> file(s)</a>
+<button href="javascript:;" id="upload-btn" class="btn" type="button">Select <span>or drop </span> file(s)</button>
 <input type="file" id="upload-input" name="files[]" multiple data-max-size="{{max_upload_size}}MiB">
 <ul id="upload-filelist"></ul>
diff --git a/pages/upload_formca.swig b/pages/upload_formca.swig
index c653f05..0bb4f7a 100644
--- a/pages/upload_formca.swig
+++ b/pages/upload_formca.swig
@@ -21,6 +21,6 @@ IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
 CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 #}
 
-<a href="javascript:;" id="upload-btn" class="btn">Selecciona <span>o arrastra</span> fitxers(s) ací</a>
+<button href="javascript:;" id="upload-btn" class="btn" type="button">Selecciona <span>o arrastra</span> fitxers(s) ací</button>
 <input type="file" id="upload-input" name="files[]" multiple data-max-size="{{max_upload_size}}MiB">
 <ul id="upload-filelist"></ul>
-- 
cgit v1.2.3