FEATURE: added font resizing

* removed test that didnt work
  * refactored user and user profile classes to better contain user logic
This commit is contained in:
walljm 2016-12-31 18:12:50 -05:00
parent 1c41a826c7
commit b09a73a581
10 changed files with 139 additions and 107 deletions

View File

@ -1,8 +1,8 @@
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<widget id="com.ionicframework.db572483" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>db</name>
<description>An awesome Ionic/Cordova app.</description>
<author email="hi@ionicframework" href="http://ionicframework.com/">Ionic Framework Team</author>
<name>Dynamic Bible</name>
<description>A bible app designed for bible study</description>
<author email="jason@walljm.com" href="http://dynamicbible.com/">Dynamic Bible</author>
<content src="index.html"/>
<access origin="*"/>
<allow-intent href="http://*/*"/>

View File

@ -1,24 +0,0 @@
import { Storage } from '@ionic/storage';
export class UserHelpers
{
constructor(public local: Storage)
{
}
public validate(u: User, t: User)
{
let updated = false;
for (var k in u)
{
if (t[k] === undefined)
{
t[k] = u[k];
updated = true;
}
}
if (updated)
this.local.set('profile', JSON.stringify(t));
}
}

View File

@ -0,0 +1,65 @@
import { Storage } from '@ionic/storage';
export class UserProfile
{
user: User;
constructor(u: User)
{
this.user = u;
}
public textSizeChanged()
{
$("html").css("font-size", this.user.font_size + "px");
}
public update(t: UserProfile, local: Storage)
{
let updated = false;
for (var k in this.user)
{
if (t[k] === undefined)
{
t[k] = this.user[k];
updated = true;
}
}
for (var k in this.user)
this.user[k] = t[k];
if (updated)
this.save(local);
this.textSizeChanged();
}
save(local: Storage)
{
local.set('profile', JSON.stringify(this.user));
}
reset(local: Storage)
{
this.user.strongs_modal = true;
this.user.clear_search_after_query = true;
this.user.items = [];
this.user.append_to_bottom = false;
this.user.insert_next_to_item = false;
this.user.font_size = 10;
this.save(local);
}
public static createDefaultUser(): User
{
return {
strongs_modal: true,
clear_search_after_query: true,
items: [],
append_to_bottom: false,
insert_next_to_item: false,
font_size: 10
};
}
}

View File

@ -1 +0,0 @@


View File

@ -1,13 +1,13 @@
<ion-header>
<ion-navbar>
<button menuToggle large>
<ion-icon name="menu"></ion-icon>
<button ion-button icon-only menuToggle left>
<ion-icon name="menu" large></ion-icon>
</button>
<ion-searchbar (search)="getQuery($event)" (input)="setQuery($event)" [showCancelButton]="true"></ion-searchbar>
</ion-navbar>
</ion-header>
<ion-content padding class="search-card">
<ion-card *ngFor="let item of user.items">
<ion-card *ngFor="let item of userProfile.user.items">
<passage *ngIf="isPassage(item.type)" [cardItem]="item" [item]="item.data" (onClose)="removeItem($event)" [dict]="item.dict" (onStrongsClicked)="getItemsNextToCard($event)"></passage>
<strongs *ngIf="isStrongs(item.type)" [cardItem]="item" [item]="item.data" (onClose)="removeItem($event)" (onPassageClicked)="getItemsNextToCard($event)"></strongs>
<words *ngIf="isWords(item.type)" [cardItem]="item" [item]="item.data" (onClose)="removeItem($event)" (onPassageClicked)="getItemsNextToCard($event)"></words>
@ -15,13 +15,13 @@
<ion-icon name="close-circle"></ion-icon>
<div>Close</div>
</button>
<button ion-button icon-left clear small>
<!--<button ion-button icon-left clear small>
<ion-icon name="text"></ion-icon>
<div>4 Notes</div>
</button>
<button ion-button icon-left clear small>
<ion-icon name="text"></ion-icon>
<div>8 Tags</div>
</button>
</button>-->
</ion-card>
</ion-content>

View File

@ -1,15 +1,15 @@
.search-card {
p {
margin: 20px 0;
line-height: 22px;
font-size: 16px;
margin: 1rem 0;
line-height: 1rem;
font-size: 1rem;
}
}
.search-card {
.title {
background-color: gainsboro;
font-size: 1.4em;
font-size: 2rem;
}
a {

View File

@ -7,7 +7,7 @@ import {StrongsService} from "../../strongs-service";
import {WordService} from "../../word-service";
import {StrongsModal} from "../../components/strongs-modal/strongs-modal.ts";
import {Storage} from '@ionic/storage';
import {UserHelpers} from '../../Helpers';
import {UserProfile} from '../../UserProfile';
class Item
{
@ -24,13 +24,7 @@ class Item
export class SearchPage
{
searchQuery: string = "";
user: User = {
strongs_modal: true,
clear_search_after_query: true,
items: [],
append_to_bottom: false,
insert_next_to_item: false
};
userProfile: UserProfile;
last: CardItem;
constructor(
@ -41,27 +35,28 @@ export class SearchPage
, public modalCtrl: ModalController
, public local: Storage)
{
this.userProfile = new UserProfile(UserProfile.createDefaultUser());
// Check if there is a profile saved in local storage
this.local.get('profile').then(profile =>
{
let t = this.user;
if (profile === null)
this.local.set('profile', JSON.stringify(this.user));
else
let t = this.userProfile;
if (profile !== null)
t = JSON.parse(profile);
new UserHelpers(local).validate(this.user, t);
this.userProfile.update(t, local);
this.initializeItems(t);
this.initializeItems(this.userProfile);
}).catch(error =>
{
console.log(error);
});
}
initializeItems(u: User)
initializeItems(u: UserProfile)
{
this.user = u;
this.userProfile = u;
}
presentStrongsModal(strongs: StrongsResult)
@ -81,11 +76,11 @@ export class SearchPage
removeItem(item)
{
let idx = this.user.items.indexOf(item);
this.user.items.splice(idx, 1);
let idx = this.userProfile.user.items.indexOf(item);
this.userProfile.user.items.splice(idx, 1);
// save the users settings.
this.saveSettings();
this.userProfile.save(this.local);
}
isPassage(t: string)
@ -102,33 +97,28 @@ export class SearchPage
{
return t === "Words";
}
saveSettings()
{
this.local.set('profile', JSON.stringify(this.user));
}
addItemToList(item)
{
if (this.user.append_to_bottom)
if (this.userProfile.user.append_to_bottom)
{
if (this.last != null && this.user.insert_next_to_item)
if (this.last != null && this.userProfile.user.insert_next_to_item)
{
let idx = this.user.items.indexOf(this.last);
this.user.items.splice(idx + 1, 0, item);
let idx = this.userProfile.user.items.indexOf(this.last);
this.userProfile.user.items.splice(idx + 1, 0, item);
}
else
this.user.items.push(item);
this.userProfile.user.items.push(item);
}
else
{
if (this.last != null && this.user.insert_next_to_item)
if (this.last != null && this.userProfile.user.insert_next_to_item)
{
let idx = this.user.items.indexOf(this.last);
this.user.items.splice(idx, 0, item);
let idx = this.userProfile.user.items.indexOf(this.last);
this.userProfile.user.items.splice(idx, 0, item);
}
else
this.user.items.unshift(item);
this.userProfile.user.items.unshift(item);
}
this.last = null;
}
@ -171,7 +161,7 @@ export class SearchPage
}
q = q.substring(1, q.length);
let result = this.strongsService.getResult(parseInt(q), dict);
if (this.user.strongs_modal)
if (this.userProfile.user.strongs_modal)
this.presentStrongsModal(result);
else
this.addItemToList({ data: result, type: "Strongs", dict: "na" });
@ -190,10 +180,10 @@ export class SearchPage
}
}
}
if (this.user.clear_search_after_query)
if (this.userProfile.user.clear_search_after_query)
$(".searchbar-input").val("");
this.saveSettings();
this.userProfile.save(this.local);
}
catch (error)
{

View File

@ -1,29 +1,39 @@
<ion-header>
<ion-navbar>
<button menuToggle item-left large>
<button ion-button icon-only menuToggle left>
<ion-icon name="menu"></ion-icon>
</button>
<ion-title>Settings</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<template [ngIf]="user">
<template [ngIf]="userProfile.user">
<ion-list>
<ion-list-header>
Adjust Text
</ion-list-header>
<ion-item>
<ion-range min="6" max="24" step="2" snaps="true" [(ngModel)]="userProfile.user.font_size" (ionChange)="textSizeChanged()">
<ion-label range-left class="small-text">A</ion-label>
<ion-label range-right>A</ion-label>
</ion-range>
</ion-item>
</ion-list>
<ion-item>
<ion-label>Show Strongs as Modal</ion-label>
<ion-toggle color="dark" [(ngModel)]="user.strongs_modal" (ionChange)="save()"></ion-toggle>
<ion-toggle color="dark" [(ngModel)]="userProfile.user.strong_modal" (ionChange)="save()"></ion-toggle>
</ion-item>
<ion-item>
<ion-label>Clear Search Bar after Query</ion-label>
<ion-toggle color="dark" [(ngModel)]="user.clear_search_after_query" (ionChange)="save()"></ion-toggle>
<ion-toggle color="dark" [(ngModel)]="userProfile.user.clear_search_after_query" (ionChange)="save()"></ion-toggle>
</ion-item>
<ion-item>
<ion-label>Append Results to the Bottom of List</ion-label>
<ion-toggle color="dark" [(ngModel)]="user.append_to_bottom" (ionChange)="save()"></ion-toggle>
<ion-toggle color="dark" [(ngModel)]="userProfile.user.append_to_bottom" (ionChange)="save()"></ion-toggle>
</ion-item>
<ion-item>
<ion-label>Insert Results Next To Item</ion-label>
<ion-toggle color="dark" [(ngModel)]="user.insert_next_to_item" (ionChange)="save()"></ion-toggle>
<ion-toggle color="dark" [(ngModel)]="userProfile.user.insert_next_to_item" (ionChange)="save()"></ion-toggle>
</ion-item>
<ion-item>
<button ion-button (click)="reset()">Reset Settings</button>

View File

@ -1,8 +1,9 @@
/// <reference path="../../types.ts" />
/// <reference path="../../../typings/browser/ambient/jquery/index.d.ts" />
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Storage } from '@ionic/storage';
import {UserHelpers} from '../../Helpers';
import { UserProfile } from '../../UserProfile';
@Component({
selector: 'settings',
@ -10,51 +11,41 @@ import {UserHelpers} from '../../Helpers';
})
export class SettingsPage
{
user: User = {
strongs_modal: true,
clear_search_after_query: true,
items: [],
append_to_bottom: false,
insert_next_to_item: false
};
textSize: number = 0;
userProfile: UserProfile;
constructor(public navCtrl: NavController, public local: Storage)
{
this.userProfile = new UserProfile(UserProfile.createDefaultUser());
// Check if there is a profile saved in local storage
this.local.get('profile').then(profile =>
{
let t = this.user;
let t = this.userProfile;
if (profile !== null)
t = JSON.parse(profile);
new UserHelpers(local).validate(this.user, t);
this.user = t;
this.userProfile.update(t, local);
}).catch(error =>
{
console.log(error);
});
}
textSizeChanged()
{
this.userProfile.textSizeChanged();
this.save();
}
save()
{
this.local.set('profile', JSON.stringify(this.user));
this.userProfile.save(this.local);
}
reset()
{
this.user = {
strongs_modal: true,
clear_search_after_query: true,
items: [],
append_to_bottom: false,
insert_next_to_item: false
};
this.save();
}
ionViewDidLoad()
{
console.log('Hello SettingsPage Page');
this.userProfile.reset(this.local);
}
}

View File

@ -22,7 +22,8 @@ type User = {
clear_search_after_query: boolean,
items: CardItem[],
append_to_bottom: boolean,
insert_next_to_item: boolean
insert_next_to_item: boolean,
font_size: number
}
type BiblePassage = {