Skip to content

Commit

Permalink
html front, and testing session
Browse files Browse the repository at this point in the history
  • Loading branch information
techwebb committed Apr 6, 2019
1 parent 2c25f7a commit 3ea7431
Show file tree
Hide file tree
Showing 7 changed files with 484 additions and 10 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
composer.phar
/vendor/
api/.env

# Commit your application's lock file https://getcomposer.org/doc/01-basic-usage.md#commit-your-composer-lock-file-to-version-control
# You may choose to ignore a library lock file http://getcomposer.org/doc/02-libraries.md#lock-file
Expand Down
3 changes: 2 additions & 1 deletion api/Controller.php
Original file line number Diff line number Diff line change
Expand Up @@ -5,10 +5,11 @@ class Controller{
function __construct(){ }

public function getOne($request, $id){
$_SESSION['tes'] = $id;
echo "getting one $id";
}
public function getAll($request){
echo "getting all";
echo "getting all".$_SESSION['test'];
}
public function createOne($request){
echo "createing one";
Expand Down
1 change: 1 addition & 0 deletions api/index.php
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
<?php
require '../vendor/autoload.php';
session_start();

use App\Controller;

Expand Down
137 changes: 137 additions & 0 deletions components.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,137 @@
const newForm = Vue.component('add-new-form',{
data(){
return {
itemText: '',
placeholderText: [
'Do the thing!',
'Take a nap!',
'Eat some food',
'Burn off that food',
'Make that thing!',
'Write it down!',
'What needs fixing',
'What wouldst thou deau?',
],
placeholderToShow: null,
}
},
mounted(){
this.pickNewPlaceholder();
},
template: `
<div>
<input
class="newItemInput"
:placeholder="placeholderText[placeholderToShow]"
v-model="itemText"
@keydown.enter="addNewTodo" />
<button
class="newItemButton"
type="button"
@click="addNewTodo">
Add
</button>
</div>
`,
methods:{
pickNewPlaceholder(){
this.placeholderToShow = Math.floor(Math.random()*this.placeholderText.length);
},
addNewTodo(){
if(this.itemText.trim() == '') return;
this.$emit("new-todo-item", this.itemText);
this.itemText = '';
this.pickNewPlaceholder();
}
}
});
const todoItem = Vue.component('todo-item', {
props: ['todo'],
data(){
return{
mouseIn: false,
isEditText: false,
deleteStatus: 0,
timer: null,
newText: '',
}
},
mounted(){
this.newText = this.todo.text;
},
computed: {
colorHash(){
//awesome hash function I found!
var hash = 0;
if (this.todo.text.length == 0) return hash;
for(char in this.todo.text.split('')){
hash = char.charCodeAt(0) + ((hash << 3) - hash);
hash = hash & hash;
}
return `hsl(${hash % 360},${this.todo.completed==null?85:25}%,70%)`;
},
isDone(){
return this.todo.completed != null;
}
},
template: `
<div class="todoItem"
@mouseover="mouseIn = true"
@mouseout="mouseIn=false"
:style="{backgroundColor:colorHash, color: isDone?'grey':'black'}">
<div :class="{todoItemText: true, todoItemDone: isDone}">
<div style="padding: 4px 5px;"
@dblclick="showEdit"
v-show="!isEditText">
{{todo.text}}
</div>
<textarea type="text" class="editTodoTextInput"
style="width:100%; padding: 0px 5px; margin: 4px 0px;"
ref="editTodoText"
v-model="newText"
@keydown.enter="updateValue"
@blur="updateValue"
v-show="isEditText"/>
</div>
<div class="todoItemActions">
<span class="todoItemCheck" v-show="!isDone && mouseIn" @click="completeMe">
<i class="material-icons">check</i>
</span>
<span v-show="isDone && mouseIn" @click="deleteMe">
<i :class="{'material-icons':true, 'deleteWarn':deleteStatus==1}">delete</i>
</span>
</div>
</div>
`,
methods:{
showEdit(){
this.isEditText=true;
this.$nextTick(() => {
this.$refs.editTodoText.focus();
this.$refs.editTodoText.style.height = this.$refs.editTodoText.scrollHeight+"px";
});
},
updateValue(){
this.isEditText = false;
this.$set(this.todo, 'text', this.newText);
},
completeMe(){
this.$set(this.todo, 'completed', +new Date());
},
deleteMe(){
clearTimeout(this.timer);
if(this.deleteStatus == 1){
this.deleteStatus = 0;
this.$emit('delete', this.todo.id);
}else{
this.timer = setTimeout(() => {
this.deleteStatus = 0;
}, 800);
this.deleteStatus = 1;
}
}
},
});
3 changes: 2 additions & 1 deletion composer.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
{
"require": {
"php": "^7.2"
"php": "^7.2",
"vlucas/phpdotenv": "^3.3"
},
"autoload": {
"psr-4": {
Expand Down
165 changes: 163 additions & 2 deletions composer.lock

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading

0 comments on commit 3ea7431

Please sign in to comment.