From: Jason Woofenden Date: Wed, 20 Feb 2013 22:54:52 +0000 (-0500) Subject: change layout, factor out css, use lesscss X-Git-Url: https://jasonwoof.com/gitweb/?p=hexbog.git;a=commitdiff_plain;h=5c9ec279c15c135b7e84501a5b2426e8f06fde60 change layout, factor out css, use lesscss --- diff --git a/.gitignore b/.gitignore index a378fb8..71ea8f6 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,7 @@ +index.html +index.html.gz main.js -all_min.js +main_min.js +style.css wordlist_compressed.js -index.html +wordlist_min.js diff --git a/Makefile b/Makefile index 1aba240..9807ae8 100644 --- a/Makefile +++ b/Makefile @@ -9,15 +9,21 @@ wordlist_compressed.js: compress.coffee wordlist.txt main.js: main.coffee coffee -bc main.coffee -all_min.js: wordlist_compressed.js main.js - cat /usr/share/javascript/jquery/jquery.min.js main.js wordlist_compressed.js | uglifyjs -nc -o all_min.js +main_min.js: wordlist_compressed.js main.js + cat /usr/share/javascript/jquery/jquery.min.js main.js | uglifyjs -nc -o $@ -index.html: all_min.js main.html - (head -n -2 main.html; echo ''; tail -n 2 main.html) > index.html +wordlist_min.js: wordlist_compressed.js main.js + cat wordlist_compressed.js | uglifyjs -nc -o $@ + +style.css: style.less + lessc style.less style.css + +index.html: main_min.js wordlist_min.js main.html style.css + bash combine.bash main.html > $@ || (rm -f $@; exit 1) index.html.gz: index.html gzip --best -c $< > $@ clean: - rm -f main.js all_min.js wordlist_compressed.js index.html index.html.gz + rm -f main.js main_min.js wordlist_compressed.js wordlist_min.js style.css index.html index.html.gz diff --git a/combine.bash b/combine.bash new file mode 100644 index 0000000..d46217c --- /dev/null +++ b/combine.bash @@ -0,0 +1,11 @@ +#!/bin/bash + +cat "$1" | while read x +do + if [ "${x:0:4}" = 'cat ' ] + then + cat "${x:4}" || exit $? + else + echo "$x" + fi +done diff --git a/main.coffee b/main.coffee index 5c1fab7..a4bd416 100644 --- a/main.coffee +++ b/main.coffee @@ -243,12 +243,7 @@ init_board = -> $selection_display = null # initialized by init_html_board $score_display = null # initialized by init_html_board -$definition_word = null # initialized by init_html_board -$definition_link = null # initialized by init_html_board -$definition_type = null # initialized by init_html_board -$definition_language = null # initialized by init_html_board -$definition_text = null # initialized by init_html_board -$definition_credit = null # initialized by init_html_board +$definition_body = null # initialized by init_html_board update_selection_display = -> word = selected_word() $selection_display.html word @@ -356,19 +351,15 @@ activate_selection = -> look_up_definition word -definition_credited = false show_definition = (word, type, definition, language) -> - if language is 'English' - $definition_language.html '' - else - $definition_language.html " (#{language})" - $definition_type.html type - $definition_link.attr 'href', "http://en.wiktionary.org/wiki/#{word}" - $definition_word.html word.substr(0, 1).toUpperCase() + word.substr(1) - $definition_text.html definition - unless definition_credited - definition_credited = true - $definition_credit.html "Definitions © wiktionary.org CC-BY-SA" + html = "" + html += "#{word.substr(0, 1).toUpperCase() + word.substr(1)}, #{type}" + if language isnt 'English' + html += " (#{language})" + html += ': ' + html += definition + html += '
Definition ©wiktionary.org CC-BY-SA
' + $definition_body.html html select_tile = (num) -> @@ -421,12 +412,7 @@ init_html_board = -> $selection_display = $('#selection') $score_display = $('#score') $score_display.html score - $definition_word = $('#definition_word') - $definition_type = $('#definition_type') - $definition_language = $('#definition_language') - $definition_link = $('#definition_link') - $definition_text = $('#definition_text') - $definition_credit = $('#definition_credit') + $definition_body = $('#definition_body') $board = $('#board') # make html for board tile_number = 0 @@ -576,6 +562,19 @@ init_start_over_link = -> if confirm "Are you sure you want to start over? There is no undo." start_over() +cur_tab = 'instructions' +tabtab_height = 20 +tab_height = 150 +init_tab = (t) -> + $('#' + t).click -> + return if t is cur_tab + $('#' + cur_tab).removeClass('selected-tab').addClass('tab').animate({height: tabtab_height}, 1000) + $('#' + t).removeClass('tab').addClass('selected-tab').animate({height: tab_height}, 1000) + cur_tab = t +init_tabs = -> + for t in ['instructions', 'definition', 'logtab', 'restart'] + init_tab t + $log = undefined init_log = -> $log = $('#log') @@ -585,6 +584,9 @@ log = (msg) -> init_game = -> init_log() + if $(window).height() >= 440 + $('#centerer').css('margin-top', '25px') + init_tabs() init_board() init_html_board() init_start_over_link() diff --git a/main.html b/main.html index 7a4c4c4..fd8573b 100644 --- a/main.html +++ b/main.html @@ -5,197 +5,80 @@ -
-
-
-
- J -
-
-
-
-
-
-
-
+
+
+
+
+
+ J +
+
+
+
+
+
+
+
+
+
Loading...
-
Loading...
+
+