Add dropdowns to Dialogue
This commit is contained in:
parent
9c28638fa7
commit
103a23a5d6
3 changed files with 57 additions and 0 deletions
|
@ -59,6 +59,22 @@
|
|||
}
|
||||
}
|
||||
|
||||
&__dropdown {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background: linear-gradient(180deg, #FFF 0%, #EEE 50%, #E5E5E5 50%) #FFF;
|
||||
border: 1px solid #CCC;
|
||||
box-shadow: inset #DDD 0 0 5px;
|
||||
padding: 3px 4px;
|
||||
vertical-align: middle;
|
||||
|
||||
&-container {
|
||||
border-top: 1px solid #9475b2;
|
||||
margin-top: 2px;
|
||||
padding-top: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
&__title {
|
||||
margin: -4px;
|
||||
background: linear-gradient(90deg, rgba(148, 117, 178, .7), rgba(148, 117, 178, 0)) #C2AFFE;
|
||||
|
|
|
@ -8,6 +8,8 @@ namespace Sakura
|
|||
private Callbacks: Dictionary<DialogueButton, Function> = new Dictionary<DialogueButton, Function>();
|
||||
public static Container: string = "dialogues";
|
||||
public Reference: HTMLDivElement;
|
||||
public DropDownItems: Dictionary<string, string> = new Dictionary<string, string>();
|
||||
public DropDownSelected: KeyValuePair<string, string> = null;
|
||||
|
||||
public SetType(type: DialogueType): void
|
||||
{
|
||||
|
@ -64,6 +66,34 @@ namespace Sakura
|
|||
DOM.Append(text, DOM.Text(this.Text));
|
||||
DOM.Append(container, text);
|
||||
|
||||
var selectCount: number = this.DropDownItems.Count();
|
||||
|
||||
if (selectCount > 0) {
|
||||
var ddContainer: HTMLDivElement = <HTMLDivElement>DOM.Create('div', DOM.BEM('dialogue', 'dropdown-container')),
|
||||
dropdown: HTMLSelectElement = <HTMLSelectElement>DOM.Create('select', DOM.BEM('dialogue', 'dropdown'));
|
||||
|
||||
for (var i in this.DropDownItems.Keys) {
|
||||
var ddItem: KeyValuePair<string, string> = this.DropDownItems.Get(this.DropDownItems.Keys[i]),
|
||||
itemElement: HTMLOptionElement = <HTMLOptionElement>DOM.Create('option', DOM.BEM('dialogue', 'dropdown-item'));
|
||||
|
||||
if (this.DropDownSelected === null) {
|
||||
this.DropDownSelected = ddItem;
|
||||
}
|
||||
|
||||
itemElement.value = ddItem.Key;
|
||||
itemElement.innerText = ddItem.Value;
|
||||
|
||||
DOM.Append(dropdown, itemElement);
|
||||
}
|
||||
|
||||
dropdown.addEventListener("change", (ev: any) => {
|
||||
this.DropDownSelected = this.DropDownItems.Get(ev.target.value);
|
||||
});
|
||||
|
||||
DOM.Append(ddContainer, dropdown);
|
||||
DOM.Append(container, ddContainer);
|
||||
}
|
||||
|
||||
var firstBtn: HTMLButtonElement = null;
|
||||
|
||||
for (var btnId in buttons) {
|
||||
|
|
|
@ -15,6 +15,12 @@ namespace Sakura
|
|||
this.Values.push(value);
|
||||
}
|
||||
|
||||
public AddObject(object: Object): void {
|
||||
// this method is disgusting
|
||||
this.Keys = this.Keys.concat(<any>Object.keys(object));
|
||||
this.Values = this.Values.concat(<any>(<any>Object).values(object));
|
||||
}
|
||||
|
||||
public Remove(key: TKey): void
|
||||
{
|
||||
var index: number = this.Keys.indexOf(key);
|
||||
|
@ -53,5 +59,10 @@ namespace Sakura
|
|||
this.Values[index] = value;
|
||||
}
|
||||
}
|
||||
|
||||
public Count(): number
|
||||
{
|
||||
return this.Keys.length;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Reference in a new issue