From 7b0b2cc93e8f40e52abd89010b18afdcab9d74c3 Mon Sep 17 00:00:00 2001
From: ogerly <landmatrosen@googlemail.com>
Date: Wed, 4 Dec 2019 15:14:57 +0100
Subject: [PATCH] rename checkedBlur to blurImage, testing checkbox

---
 .../ContributionForm/ContributionForm.spec.js |   7 +-
 .../ContributionForm/ContributionForm.vue     |  46 +----
 webapp/pages/moderation/images.vue            | 173 ------------------
 webapp/pages/post/_id/_slug/index.vue         |   6 +-
 .../checkbox-set-blank-checked-line.png       | Bin 1742 -> 0 bytes
 5 files changed, 13 insertions(+), 219 deletions(-)
 delete mode 100644 webapp/pages/moderation/images.vue
 delete mode 100644 webapp/static/img/checkbox/checkbox-set-blank-checked-line.png

diff --git a/webapp/components/ContributionForm/ContributionForm.spec.js b/webapp/components/ContributionForm/ContributionForm.spec.js
index e8f5eef9a..889995595 100644
--- a/webapp/components/ContributionForm/ContributionForm.spec.js
+++ b/webapp/components/ContributionForm/ContributionForm.spec.js
@@ -244,10 +244,13 @@ describe('ContributionForm.vue', () => {
 
         describe('questionable images should be blurred', () => {
           it('questionable images unset be blurred', async () => {
-         
+            expectedParams.variables.imageUpload = imageUpload
+            wrapper.find(TeaserImage).vm.$emit('addTeaserImage', imageUpload)
+            expect(wrapper.find('.images-set-blur').exists()).toBe(false)
             await wrapper.find('input[type="checkbox"]').trigger('click')
             expect(wrapper.find('input[type="checkbox"]').exists()).toBe(true)
-            expect(wrapper.find('img.img-blur-in').exists()).toBe(true)
+            expect(wrapper.find('.images-set-blur').exists()).toBe(true)
+           
           })
         })
 
diff --git a/webapp/components/ContributionForm/ContributionForm.vue b/webapp/components/ContributionForm/ContributionForm.vue
index 25be9d753..7831d8fe0 100644
--- a/webapp/components/ContributionForm/ContributionForm.vue
+++ b/webapp/components/ContributionForm/ContributionForm.vue
@@ -40,12 +40,12 @@
         <ds-text align="right">
           <label for="blur_img">{{ $t('contribution.shockingPicture') }}</label>
           <input
-            name="blurImage"
+            name="checkbox"
             class="blurImageCheckbox"
             type="checkbox"
             id="blur_img"
-            :checked="checkedBlur"
-            @change="(checkedBlur = !checkedBlur), (form.checkbox = !checkedBlur)"
+            v-model="checkedBlur"
+            @change="form.checkbox = checkedBlur"
           />
 
           <label for="blur_img"><span class=""></span></label>
@@ -227,8 +227,7 @@ export default {
   created() {},
   mounted() {
     if (this.contribution && this.contribution.blurImage === true) {
-      this.checkedChange()
-      this.$el.querySelector('.hc-attachments-upload-area-post img').classList.add('img-blur-in')
+      this.checkedBlur = true
     }
   },
   computed: {
@@ -242,28 +241,7 @@ export default {
   methods: {
     unBlur() {
       if (this.checkedBlur) {
-        this.checkedChange()
-      }
-    },
-    checkedChange() {
-      if (this.$el) {
-        console.log(this.$el.querySelector('.crop-overlay'))
-        console.log(document.querySelector('.crop-overlay'))
-        this.elem = this.$el.querySelector('img')
-      } else {
-      }
-      if (this.checkedBlur) {
-        this.elem.classList.remove('img-blur-in')
-        document.querySelector('.crop-overlay').classList.remove('images-set-blur')
         this.checkedBlur = false
-        this.form.checkbox = false
-      } else {
-        if (this.elem != null) {
-          
-          this.elem.classList.add('img-blur-in')
-        }
-        this.checkedBlur = true
-        this.form.checkbox = true
       }
     },
     submit() {
@@ -362,7 +340,7 @@ export default {
   -o-transition: all ease 0.2s;
   transition: all ease 0.2s;
 }
-.images-set-blur img{
+.images-set-blur img {
   -webkit-filter: blur(32px);
   -moz-filter: blur(32px);
   -ms-filter: blur(32px);
@@ -417,18 +395,4 @@ export default {
     cursor: default;
   }
 }
-input[type='checkbox'] {
-  display: none;
-}
-input[type='checkbox'] + label span {
-  display: inline-block;
-  width: 29px;
-  height: 27px;
-  vertical-align: middle;
-  background: url(../../static/img/checkbox/checkbox-set-blank-checked-line.png) left top no-repeat;
-  cursor: pointer;
-}
-input[type='checkbox']:checked + label span {
-  background: url(../../static/img/checkbox/checkbox-set-blank-checked-line.png) -30px top no-repeat;
-}
 </style>
diff --git a/webapp/pages/moderation/images.vue b/webapp/pages/moderation/images.vue
deleted file mode 100644
index 86e222f0e..000000000
--- a/webapp/pages/moderation/images.vue
+++ /dev/null
@@ -1,173 +0,0 @@
-<template>
-  <ds-card space="small">
-    <ds-heading tag="h3">User Images</ds-heading>
-      <template>
-
-  <ds-space :margin-bottom="{ base: 'small', md: 'base', lg: 'large' }">
-       <div>
-    <ds-button :secondary="blurTrueImages" @click="changeShowImages" >All Blur Images </ds-button>
-    <ds-button :secondary="!blurTrueImages"  @click="changeShowImages" >All Images</ds-button>
-  </div>
-    </ds-space>
-</template>
-   <template v-if="hasResults">
-  <div>
-    <ds-grid gap="x-small"   >
-      <ds-grid-item v-for="post in posts" :key="post.id" :row-span="10">
-           <img            
-           :src="postImage(post.image)" 
-           @click="showImages(post)" style="width:100%"/>
-          <div>{{post.createdAt}}</div>
-          <a :href="'/post/'+ post.id" target="_blank">{{post.title}}</a>
-          </ds-grid-item>
- 
-    </ds-grid>
-  </div>
-</template>
-
-
-    <div>
-    <ds-modal 
-      v-if="isOpen"
-      v-model="isOpen"
-       :title="title" 
-      force
-      extended
-      confirm-label="Ok"
-      cancel-label="cancel"
-    >
-      <p>
-           <img           
-           :src="imagePath"           
-           style="width:100%"/>
-        <small>Dieses Bild ist vom User Blured</small>
-          <div>
-    <ds-button danger @click="deleteImage()"  >Bild löschen! </ds-button>
-    <ds-button v-if="!blurTrueImages" secondary @click="moderatorBlurImage()"  > Bild unkenntlich machen! </ds-button>
-     <a :href="contributionlink" target="_blank"><ds-button primary >Beitrag aufrufen </ds-button></a>
-    
-    
-  </div>
-      </p>
-   
-    </ds-modal>
-  </div>
-  </ds-card>
-
-
-</template>
-
-
-
-
-<script>
- import gql from 'graphql-tag'
-
- 
-export default {
-
-  data() {
-      return {
-      posts: [],
-      blurTrueImages: true,
-      isOpen: false,
-      imagePath: null,
-      imageID: null,
-      title: '',
-      contributionlink: '',
-    }
-  },
-   computed: {
-    hasResults() {
-      return this.$apollo.loading || (this.posts && this.posts.length > 0)
-    },
-  
-},
- methods: {
-    
-     postImage(image) {
-         // console.log("image1", image)
-         // console.log("image.match('uploads/') ", image.match('uploads/') )
-         if (image && image.match('uploads/') != null ) {
-           // console.log("image ist API", image)
-            return '/api' + image 
-              
-         } else {
-             //  console.log("image ist LINK", image)
-            return '' + image 
-         }
-     },
-    changeShowImages(){
-      console.log("this.blurTrueImages is", this.blurTrueImages) 
-        if ( this.blurTrueImages ) {
-            this.blurTrueImages = false
-            this.loadBlurFalseImages()
-        } else {
-            this.blurTrueImages = true
-            this.loadBlurTrueImages()
-            
-        }
-        console.log("this.blurTrueImages new", this.blurTrueImages)    
-    },
-    showImages(post){
-        console.log("showImages(post)", post)  
-           console.log(" this.blurTrueImages",  this.blurTrueImages)  
-           
-         this.isOpen = true
-        this.imagePath = this.postImage(post.image)       
-        this.title = post.title
-        this.contributionlink = '/post/'+ post.id
-    },
-    moderatorBlurImage(post){
-       console.log("moderatorBlurImage(post)", post)  
-    },
-    deleteImage(id){
-        if (this.imageID !== id) return
-        console.log("DELETE IMAGE, austauschen mit einem hinweisbild durch die moderation", id)
-    },
-      loadBlurFalseImages() {
-         
-      this.$apollo
-        .query({
-          query: gql`
-           query {
-          Post(blurImage: false){id, title, blurImage, image, imageUpload, createdAt }
-        } 
-          `,
-        })
-        .then(({ data: { Post } }) => {
-         this.posts = Post
-        })
-    },
-     loadBlurTrueImages() {
-         
-      this.$apollo
-        .query({
-          query: gql`
-           query {
-          Post(blurImage: true){id, title, blurImage, image, imageUpload, createdAt }
-        } 
-          `,
-        })
-        .then(({ data: { Post } }) => {
-         this.posts = Post
-        })
-    },
- },
- apollo: {
-    Post: {
-      query() {
-        return gql`
-       query {
-          Post(blurImage: true){id, title, blurImage, image, imageUpload, createdAt }
-        }        `
-      },   
-      result({ data: { Post } }) {
-        this.posts = Post
-      },
-    },
-     },
-}
-
-
-</script>
diff --git a/webapp/pages/post/_id/_slug/index.vue b/webapp/pages/post/_id/_slug/index.vue
index 769b978b8..7331daf6d 100644
--- a/webapp/pages/post/_id/_slug/index.vue
+++ b/webapp/pages/post/_id/_slug/index.vue
@@ -12,21 +12,21 @@
     >
       <ds-text align="right" class="blurBox">
         <ds-button
-          v-show="post.blurImage"
+          v-if="post.blurImage"
           class="bluricon-post"
           icon="eye"
           primary
           @click.prevent="unBlur"
         ></ds-button>
         <ds-button
-          v-show="blur"
+          v-if="blur"
           class="bluricon-post"
           icon="eye-slash"
           primary
           @click.prevent="Blur"
         ></ds-button>
         <img
-          v-show="post.blurImage"
+          v-if="post.blurImage"
           :src="post.image | proxyApiUrl"
           class="blurImgPreview"
           @click.prevent="unBlur"
diff --git a/webapp/static/img/checkbox/checkbox-set-blank-checked-line.png b/webapp/static/img/checkbox/checkbox-set-blank-checked-line.png
deleted file mode 100644
index 5411a44368d8dd45fc4fc6efb4883ac0a058f96a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1742
zcmeHG`)kc%7=LDEtc>4?c0`HNEPGp0b{fVk9GaCa*Ra?9(jm98<<{Dw!-Ss3Bz`cL
z9l6%TC_lJ7R@iYlcA+rRvBb{YAD{R87x>8!^49tGea`bdpXc-WJny$+dLXw~a{pu^
z>XkPsC!Z)`CEm~WNW^nWc55G^M4CROU;;uSLu84VNQl%$#*ndOn2eB7m$ZhgCCg-m
zth!n@#Fm(eg;-sy7!pguBtoJ<A~mFzlu3mY0k8oLEHtB9-5htUF>H(&qi!rBYmH@N
z#aMMLkYsC^4U1uQq);o?2pbV23XW(sYK^i{F^Z{R4KR=fOVC0NgMkfbV4+!^AQ$7X
zwPLM0eHe>~*|JzxCl@S`6t*H(6zV|=wN}}xScN?J0h;KB9ncRFPzcrl18J~CDR^Ko
zumKG$b<VjoVjN*sXC(AtEFuvWg|Cnc7D%!RD}030FaW$z4x^zKR>BX^L^tdJCkTc@
zum%`NqZ72i1A~DLXmu-c)kq`8QEUuGLLbH=5>>ZAZ~cyiw^6rGZ%K}n=et|4XQkul
zx#PC&33ik{4Q}}!EvLYn1ZZ3bYzgK;lQ+t{iGTf3ym?D1J`P%!AD96e|K#~oQwQAP
zWvK1BW>V2wqLf?imvCTs$^fEnOY(BY7Hm8mi;fLE&!+4L%|p9BZrw7lt^9pc#j(uF
zgpw1#Mtp0n+}M3*>ELR98K2l550`DzyT{`hE%WZ*`@Xx_-|xu5j?!WC3YVuRWp;Eu
z|Lk8_pSq{@weQ^Hn$<~1n>y19{be7QuB)%jdQnv3@Aou<j+BP-fwRNc#?+n8dKHXy
z?yEnU^)?uL_w`Fb$?Zt=)A~8FL4B8p!!`ROzTnyT=0~k>PG!AX6e}(nx%JGZCSR~F
zem*VI-Znh-Qu*N@E2f1y->fRCjqkm%p(^)7s5)L9-O=bD@}#+|rL;0SzEP)U#JYZ>
z?Rq?;<1$_r^geenwz^^Nm4=_ARxBR%=yc1o`#0Y{m~|uMYp=>p3Y7(Xy{DxenVj;h
zvH8%<tE1aO!5UpNtaeWR)f4OUVpY*0mnJVe)HLG%AAjh_!}L{=%!<#u!XbBQ^Ckpx
J>c-9A{u_Uxgg*cP