diff --git a/index.html b/index.html index c12351e..208f315 100644 --- a/index.html +++ b/index.html @@ -1,283 +1,435 @@ - - + + + Stardew Valley Community Checklist - - + + + - -
-

Stardew Valley Community Center Checklist

- -
-
- -
-
- - + +
+
+
+
+
+
+

Stardew Community Checklist

 +
+
+
+ + + + + + Save + + + + + + + + Load + +
+
+
+
+ -
-
-
-
-
-
- - + + + + + + + +
+
+
+
+ +
+
+

{{ static.bundles[active_bundle].name }}

+ +
+
+
+
+

+ {{ item.name }} +

+
+
+
+
+
+
{{ item.source }}
+
+
- -
-
-
- +
+
+ + + {{ season.name }} + +
+
+
+
+ + + {{ skill.name }} + +
+
+
+
+
+
-
-
- - - -
-
- -
-
- - - -
-
- -
-
-

I wanted to have an easy way to keep track of my community center bundles since it is a pain to - do it in game. Here it is. This will be a better explanation when I actually write it.

-

{{ user_data | json }}

+ +
+
+
+
+
+
+ +
+
+ +
+
+
+
+
+

+ {{ item.name }} +

+
+
+
+
+
+
{{ item.source }}
+
+
+
+
+

+ + + + + {{ static.bundles[bundle_id].name }} + +

+
+
+
+
+ + + {{ season.name }} + +
+
+
+
+ + + {{ skill.name }} + +
+
+
+
+
-
- + + + +
+
+
+
+ +
+
+

{{ getSeasonName(active_season) }}

+ +
+
+
+
+

+ {{ item.name }} +

+
+
+
+
+
+
{{ item.source }}
+
+
+
+
+

+ + + + + {{ static.bundles[bundle_id].name }} + +

+
+
+
+
+ + + {{ season.name }} + +
+
+
+
+ + + {{ skill.name }} + +
+
+
+
+
+
+
+
+
+ + +
+
+
+
+ +
+
+

{{ getSkillName(active_skill) }}

+ +
+
+
+
+

+ {{ item.name }} +

+
+
+
+
+
+
{{ item.source }}
+
+
+
+
+

+ + + + + {{ static.bundles[bundle_id].name }} + +

+
+
+
+
+ + + {{ season.name }} + +
+
+
+
+ + + {{ skill.name }} + +
+
+
+
+
+
+
+
+
+ + - - + + - diff --git a/main.css b/main.css index 25add83..079e79a 100644 --- a/main.css +++ b/main.css @@ -1,101 +1,12 @@ -.just-padding { - padding: 15px; -} - -.list-group.list-group-root { - padding: 0; - overflow: hidden; -} - -.list-group.list-group-root .list-group { - margin-bottom: 0; -} - -.list-group.list-group-root .list-group-item { - border-radius: 0; - border-width: 1px 0 0 0; -} - -.list-group.list-group-root > .list-group-item:first-child { - border-top-width: 0; -} - -.list-group.list-group-root > .list-group > .list-group-item { - padding-left: 30px; -} - -.list-group.list-group-root > .list-group > .list-group > .list-group-item { - padding-left: 45px; -} - -.list-group-item .glyphicon { - margin-right: 5px; -} - -.row-eq-height, .row-eq-height > div[class*='col-']{ - display: -webkit-box; - display: -moz-box; - display: -ms-flexbox; - display: -webkit-flex; - display: flex; +.eq-line { flex: 1 0 auto; - flex-wrap: wrap; } -.panel { - display: flex; - flex-direction:column; - align-content:stretch; - flex-grow: 1; -} - -.panel-body{ - display: flex; +.card { flex-direction: column; - flex-grow: 1; } -.panel-body > p{ - flex-grow: 1; -} - -.panel-body > .button-area{ - display: flex; - flex-direction: row; - flex-wrap: wrap; -} - -.button-area > .btn{ - flex: 1 0 auto; - margin-top: 1rem; -} - -.panel-footer{ - display: flex; +.card-content{ flex-direction: column; - flex-wrap: wrap; -} - -.panel-footer-area{ - display: flex; - flex-direction: row; - flex: 1 0 auto; - justify-content: space-around; -} - -.footer-text-area{ - margin-left: 1rem; - flex: 1 0 auto; - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: space-around; -} - -.footer-text{ - flex-grow: 1; -} - -form{ - margin-bottom: 1rem; + justify-content: space-between; } diff --git a/main.js b/main.js index d7ef1f6..3158fa6 100644 --- a/main.js +++ b/main.js @@ -4,34 +4,132 @@ var v = new Vue({ debug: true, static: null, user_data: [], - btnChecked: 'btn-success', - btnUnchecked: 'btn-warning', - boxChecked: 'glyphicon-check', - boxUnchecked: 'glyphicon-unchecked' - }, - created: function(){ - this.fetchData(); + active_page: "bundles", + active_room: 0, + active_bundle: 0, + active_season: "spring", + active_skill: "farming", + save_mode: false, + load_mode: false }, ready: function(){ - $('.list-group-item').on('click', function() { - $('.glyphicon', this) - .toggleClass('glyphicon-chevron-right') - .toggleClass('glyphicon-chevron-down'); - }); + this.fetchData(); + new Clipboard('.copy'); + storedUserData = localStorage.getItem('user_data'); + if(storedUserData !== null){ + this.loadData(storedUserData); + } + }, + computed: { + user_data_serialized: function(){ + return JSON.stringify(this.user_data); + } }, methods: { fetchData: function(){ this.$http.get('bundles.json', function(data, status, response){ if(status == 200){ this.static = data; - for(var i = 0; i < this.static.items.length; i++){ - this.user_data.push(false); + if(this.user_data.length <= 0){ + for(i=0; i -1){ + return true; + } + else{ + return false; + } + }, + getSeasonName: function(seasonId){ + for(i = 0; i < this.static.seasons.length; i++){ + if(this.static.seasons[i].id === seasonId){ + return this.static.seasons[i].name; + } + } + return ""; + }, + getSkillName: function(skillId){ + for(i = 0; i < this.static.skills.length; i++){ + if(this.static.skills[i].id === skillId){ + return this.static.skills[i].name; + } + } + return ""; } } }); + +Vue.filter('inBundle', function(value, id){ + return value.filter(function(element){ + if(element.bundles.indexOf(id) > -1){ + return true; + } + else{ + return false; + } + }); +}); + +Vue.filter('filterByArray', function(array1, array2){ + return array1.filter(function(element){ + if(array2.indexOf(element.id) > -1){ + return true; + } + else{ + return false; + } + }); +});