manually parse json

This commit is contained in:
smilerz 2021-03-15 15:56:44 -05:00
parent 25fb41baed
commit 71e02c0916
6 changed files with 306 additions and 339 deletions

View File

@ -1,16 +1,16 @@
import json
import re
from json.decoder import JSONDecodeError
from bs4 import BeautifulSoup
from bs4.element import Tag
# from cookbook.helper.ingredient_parser import parse as parse_ingredient
from cookbook.helper import recipe_url_import as helper
from cookbook.helper.scrapers.scrapers import text_scraper
from json import JSONDecodeError
from recipe_scrapers._utils import get_host_name, normalize_string
from urllib.parse import unquote
def get_recipe_from_source(text, url, space):
# %%
# %%
def get_from_raw(text):
def build_node(k, v):
if isinstance(v, dict):
node = {
@ -26,8 +26,8 @@ def get_recipe_from_source(text, url, space):
}
else:
node = {
'name': k + ": " + normalize_string(str(v)),
'value': normalize_string(str(v))
'name': k + ": " + str(v),
'value': str(v)
}
return node
@ -52,14 +52,13 @@ def get_recipe_from_source(text, url, space):
kid_list.append(build_node(k, v))
else:
kid_list.append({
'name': normalize_string(str(kid)),
'value': normalize_string(str(kid))
'name': kid,
'value': kid
})
return kid_list
recipe_json = {
'name': '',
'url': '',
'description': '',
'image': '',
'keywords': [],
@ -68,51 +67,26 @@ def get_recipe_from_source(text, url, space):
'servings': '',
'prepTime': '',
'cookTime': ''
}
}
recipe_tree = []
temp_tree = []
parse_list = []
html_data = []
images = []
text = unquote(text)
try:
parse_list.append(remove_graph(json.loads(text)))
if not url and 'url' in parse_list[0]:
url = parse_list[0]['url']
scrape = text_scraper("<script type='application/ld+json'>" + text + "</script>", url=url)
parse_list.append(json.loads(text))
except JSONDecodeError:
soup = BeautifulSoup(text, "html.parser")
html_data = get_from_html(soup)
images += get_images_from_source(soup, url)
for el in soup.find_all('script', type='application/ld+json'):
el = remove_graph(el)
if not url and 'url' in el:
url = el['url']
if type(el) == list:
for le in el:
parse_list.append(le)
elif type(el) == dict:
parse_list.append(el)
parse_list.append(el)
for el in soup.find_all(type='application/json'):
el = remove_graph(el)
if type(el) == list:
for le in el:
parse_list.append(le)
elif type(el) == dict:
parse_list.append(el)
scrape = text_scraper(text, url=url)
recipe_json = helper.get_from_scraper(scrape, space)
parse_list.append(el)
# first try finding ld+json as its most common
for el in parse_list:
temp_tree = []
if isinstance(el, Tag):
try:
el = json.loads(el.string)
except TypeError:
continue
if isinstance(el, Tag):
el = json.loads(el.string)
for k, v in el.items():
if isinstance(v, dict):
node = {
@ -128,66 +102,22 @@ def get_recipe_from_source(text, url, space):
}
else:
node = {
'name': k + ": " + normalize_string(str(v)),
'value': normalize_string(str(v))
'name': k + ": " + str(v),
'value': str(v)
}
temp_tree.append(node)
if '@type' in el and el['@type'] == 'Recipe':
if ('@type' in el and el['@type'] == 'Recipe'):
recipe_json = helper.find_recipe_json(el, None)
recipe_tree += [{'name': 'ld+json', 'children': temp_tree}]
else:
recipe_tree += [{'name': 'json', 'children': temp_tree}]
return recipe_json, recipe_tree, html_data, images
temp_tree = []
# overide keyword structure from dict to list
kws = []
for kw in recipe_json['keywords']:
kws.append(kw['text'])
recipe_json['keywords'] = kws
def get_from_html(soup):
INVISIBLE_ELEMS = ('style', 'script', 'head', 'title')
html = []
for s in soup.strings:
if ((s.parent.name not in INVISIBLE_ELEMS) and (len(s.strip()) > 0)):
html.append(s)
return html
def get_images_from_source(soup, url):
sources = ['src', 'srcset', 'data-src']
images = []
img_tags = soup.find_all('img')
if url:
site = get_host_name(url)
prot = url.split(':')[0]
urls = []
for img in img_tags:
for src in sources:
try:
urls.append(img[src])
except KeyError:
pass
for u in urls:
u = u.split('?')[0]
filename = re.search(r'/([\w_-]+[.](jpg|jpeg|gif|png))$', u)
if filename:
if (('http' not in u) and (url)):
# sometimes an image source can be relative
# if it is provide the base url
u = '{}://{}{}'.format(prot, site, u)
if 'http' in u:
images.append(u)
return images
def remove_graph(el):
# recipes type might be wrapped in @graph type
if isinstance(el, Tag):
try:
el = json.loads(el.string)
if '@graph' in el:
for x in el['@graph']:
if '@type' in x and x['@type'] == 'Recipe':
el = x
except TypeError:
pass
return el
return recipe_json, recipe_tree

View File

@ -1,5 +1,6 @@
import random
import re
from json import JSONDecodeError
from isodate import parse_duration as iso_parse_duration
from isodate.isoerror import ISO8601Error
@ -63,6 +64,8 @@ def find_recipe_json(ld_json, url):
if 'recipeIngredient' in ld_json:
ld_json['recipeIngredient'] = parse_ingredients(ld_json['recipeIngredient'])
else:
ld_json['recipeIngredient'] = ""
try:
servings = scrape.yields()
@ -90,22 +93,40 @@ def find_recipe_json(ld_json, url):
if 'recipeCategory' in ld_json:
keywords += listify_keywords(ld_json['recipeCategory'])
if 'recipeCuisine' in ld_json:
keywords += listify_keywords(ld_json['keywords'])
ld_json['keywords'] = parse_keywords(list(set(map(str.casefold, keywords))))
keywords += listify_keywords(ld_json['recipeCuisine'])
try:
ld_json['keywords'] = parse_keywords(list(set(map(str.casefold, keywords))))
except TypeError:
pass
if 'recipeInstructions' in ld_json:
ld_json['recipeInstructions'] = parse_instructions(ld_json['recipeInstructions'])
else:
ld_json['recipeInstructions'] = ""
if 'image' in ld_json:
ld_json['image'] = parse_image(ld_json['image'])
else:
ld_json['image'] = ""
if 'description' not in ld_json:
ld_json['description'] = ""
if 'cookTime' in ld_json:
ld_json['cookTime'] = parse_cooktime(ld_json['cookTime'])
else:
ld_json['cookTime'] = 0
if 'prepTime' in ld_json:
ld_json['prepTime'] = parse_cooktime(ld_json['prepTime'])
else:
ld_json['prepTime'] = 0
ld_json['servings'] = 1
if 'servings' in ld_json:
if type(ld_json['servings']) == str:
ld_json['servings'] = int(re.search(r'\d+', ld_json['servings']).group())
else:
ld_json['servings'] = 1
try:
if 'recipeYield' in ld_json:
if type(ld_json['recipeYield']) == str:
@ -118,7 +139,7 @@ def find_recipe_json(ld_json, url):
for key in list(ld_json):
if key not in [
'prepTime', 'cookTime', 'image', 'recipeInstructions',
'keywords', 'name', 'recipeIngredient', 'servings'
'keywords', 'name', 'recipeIngredient', 'servings', 'description'
]:
ld_json.pop(key, None)
@ -136,6 +157,12 @@ def parse_name(name):
def parse_ingredients(ingredients):
# some pages have comma separated ingredients in a single array entry
try:
if type(ingredients[0]) == dict:
return ingredients
except (KeyError, IndexError):
pass
if (len(ingredients) == 1 and type(ingredients) == list):
ingredients = ingredients[0].split(',')
elif type(ingredients) == str:
@ -216,50 +243,59 @@ def parse_instructions(instructions):
instructions = re.sub(r'\n\s*\n', '\n\n', instructions)
instructions = re.sub(' +', ' ', instructions)
instructions = instructions.replace('<p>', '')
instructions = instructions.replace('</p>', '')
return instruction_text
instructions = re.sub('</p>', '\n', instructions)
instructions = re.sub('<[^<]+?>', '', instructions)
return instructions
def parse_image(image):
# check if list of images is returned, take first if so
if (type(image)) == list:
if type(image[0]) == str:
image = image[0]
elif 'url' in image[0]:
image = image[0]['url']
if type(image) == list:
for pic in image:
if (type(pic) == str) and (pic[:4] == 'http'):
image = pic
elif 'url' in pic:
image = pic['url']
# ignore relative image paths
if 'http' not in image:
if image[:4] != 'http':
image = ''
return image
def parse_cooktime(cooktime):
try:
if (type(cooktime) == list and len(cooktime) > 0):
cooktime = cooktime[0]
cooktime = round(parse_duration(cooktime).seconds / 60)
except TypeError:
cooktime = 0
if type(cooktime) != int or float:
cooktime = 0
if type(cooktime) not in [int, float]:
try:
cooktime = float(re.search(r'\d+', cooktime).group())
except (ValueError, AttributeError):
try:
cooktime = round(iso_parse_duration(cooktime).seconds / 60)
except ISO8601Error:
try:
if (type(cooktime) == list and len(cooktime) > 0):
cooktime = cooktime[0]
cooktime = round(parse_duration(cooktime).seconds / 60)
except AttributeError:
cooktime = 0
return cooktime
def parse_preptime(preptime):
try:
if (type(preptime) == list and len(preptime) > 0):
preptime = preptime[0]
preptime = round(
parse_duration(
preptime
).seconds / 60
)
except TypeError:
preptime = 0
if type(preptime) != int or float:
preptime = 0
if type(preptime) not in [int, float]:
try:
preptime = float(re.search(r'\d+', preptime).group())
except ValueError:
try:
preptime = round(iso_parse_duration(preptime).seconds / 60)
except ISO8601Error:
try:
if (type(preptime) == list and len(preptime) > 0):
preptime = preptime[0]
preptime = round(parse_duration(preptime).seconds / 60)
except AttributeError:
preptime = 0
return preptime
@ -277,6 +313,11 @@ def parse_keywords(keyword_json):
def listify_keywords(keyword_list):
# keywords as string
try:
if type(keyword_list[0]) == dict:
return keyword_list
except KeyError:
pass
if type(keyword_list) == str:
keyword_list = keyword_list.split(',')

View File

@ -1,3 +1,4 @@
<!--I PROBLABLY DON'T NEED THIS??-->
{% extends "base.html" %}
{% load crispy_forms_filters %}
{% load i18n %}
@ -24,7 +25,7 @@
<div v-if="!parsed">
<h2>{% trans 'Import From Source' %}</h2>
<div class="input-group input-group-lg">
<textarea class="form-control" v-model="raw_recipe" rows="12" style="font-size: 12px"></textarea>
<textarea class="form-control" v-model="html_recipe" rows="12" style="font-size: 12px"></textarea>
</div>
<small class="text-muted">Simply paste a web page source or JSON document into this textarea and click import.</small>
<br>
@ -51,18 +52,17 @@
<template scope="_">
<div class="container-fluid" >
<div class="col" @click.ctrl="customItemClickWithCtrl">
<div class="row clearfix" style="width:50%" >
<div class="col-md-12" >
<div class="row clearfix" style="width:95%" >
<div class="col">
<i :class="_.vm.themeIconClasses" role="presentation" v-if="!_.model.loading"></i>
{% verbatim %}
[[_.model.name]]
{% endverbatim %}
</div>
<div class="col-es" style="align-right">
<div class="col-es-auto" style="align-right">
<button style="border: 0px; background-color: transparent; cursor: pointer;"
@click="deleteNode(_.vm, _.model, $event)"><i class="fas fa-minus-square" style="color:red"></i></button>
</div>
</div>
</div>
</div>
@ -93,7 +93,7 @@
delimiters: ['[[', ']]'],
el: '#app',
data: {
raw_recipe: '',
html_recipe: '',
keywords: [],
keywords_loading: false,
units: [],
@ -137,7 +137,7 @@
this.error = undefined
this.parsed = true
this.loading = true
this.$http.post("{% url 'api_recipe_from_raw' %}", {'raw_text': this.raw_recipe}, {emulateJSON: true}).then((response) => {
this.$http.post("{% url 'api_recipe_from_html' %}", {'html_text': this.html_recipe}, {emulateJSON: true}).then((response) => {
console.log(response.data)
this.recipe_data = response.data['recipe_data'];
this.recipe_tree = response.data['recipe_tree'];
@ -278,7 +278,7 @@
e.stopPropagation()
var index = node.parentItem.indexOf(item)
node.parentItem.splice(index, 1)
},
},
}
});
</script>

View File

@ -1,3 +1,4 @@
<!--I PROBLABLY DON'T NEED THIS??-->
{% extends "base.html" %}
{% load crispy_forms_filters %}
{% load i18n %}
@ -24,7 +25,7 @@
<div v-if="!parsed">
<h2>{% trans 'Import From Source' %}</h2>
<div class="input-group input-group-lg">
<textarea class="form-control" v-model="raw_recipe" rows="12" style="font-size: 12px"></textarea>
<textarea class="form-control" v-model="html_recipe" rows="12" style="font-size: 12px"></textarea>
</div>
<small class="text-muted">Simply paste a web page source or JSON document into this textarea and click import.</small>
<br>
@ -94,7 +95,7 @@
delimiters: ['[[', ']]'],
el: '#app',
data: {
raw_recipe: '',
html_recipe: '',
keywords: [],
keywords_loading: false,
units: [],
@ -151,7 +152,7 @@
this.error = undefined
this.parsed = true
this.loading = true
this.$http.post("{% url 'api_recipe_from_raw' %}", {'raw_text': this.raw_recipe}, {emulateJSON: true}).then((response) => {
this.$http.post("{% url 'api_recipe_from_html' %}", {'html_text': this.html_recipe}, {emulateJSON: true}).then((response) => {
console.log(response.data)
this.recipe_data = response.data['recipe_data'];
this.recipe_tree = response.data['recipe_tree'];

View File

@ -8,6 +8,7 @@
{% include 'include/vue_base.html' %}
<script src="{% static 'js/jquery-3.5.1.min.js' %}"></script>
<script src="{% static 'js/vue-jstree.js' %}"></script>
<script src="{% static 'js/vue-multiselect.min.js' %}"></script>
<link rel="stylesheet" href="{% static 'css/vue-multiselect.min.css' %}">
<style>
@ -25,13 +26,15 @@
<nav class="nav nav-pills flex-sm-row" style="margin-bottom:10px">
<a class="nav-link active" href="#nav-url" data-toggle="tab" role="tab" aria-controls="nav-url" aria-selected="true">URL</a>
<a class="nav-link" href="#nav-ldjson" data-toggle="tab" role="tab" aria-controls="nav-ldjson">ld+json</a>
<a class="nav-link disabled" href="#nav-json" data-toggle="tab" role="tab" aria-controls="nav-json">json</a>
<a class="nav-link" href="#nav-json" data-toggle="tab" role="tab" aria-controls="nav-json">json</a>
<a class="nav-link disabled" href="#nav-html" data-toggle="tab" role="tab" aria-controls="nav-html">HTML</a>
<a class="nav-link disabled" href="#nav-text" data-toggle="tab" role="tab" aria-controls="nav-text">text</a>
<a class="nav-link disabled" href="#nav-pdf" data-toggle="tab" role="tab" aria-controls="nav-pdf">PDF</a>
</nav>
<div class="tab-content" id="nav-tabContent">
<!-- Import URL -->
<div class="row tab-pane fade show active" id="nav-url" role="tabpanel">
<div class="col-md-12">
<div class="input-group mb-3">
@ -45,10 +48,11 @@
</div>
</div>
<!-- Automatically import LD+JSON -->
<div class="row tab-pane fade show" id="nav-ldjson" role="tabpanel">
<div class="col-md-12">
<div class="input-group input-group-lg">
<textarea class="form-control input-group-append" v-model="json_data" rows=10; placeholder="{% trans 'Paste ld+json here' %}">
<textarea class="form-control input-group-append" v-model="json_data" rows=10 placeholder="{% trans 'Paste ld+json here to parse recipe automatically.' %}" style="font-size: 12px">
</textarea>
</div>
<br>
@ -58,15 +62,31 @@
</div>
</div>
<div class="row tab-pane fade show" id="nav-html" role="tabpanel">
<!-- Manually import from JSON -->
<div class="row tab-pane fade show" id="nav-json" role="tabpanel">
<div class="col-md-12">
<div class="input-group input-group-lg">
<textarea class="form-control input-group-append" v-model="html_data" rows=10; placeholder="{% trans 'Paste html source here' %}">
<textarea class="form-control input-group-append" v-model="html_data" rows=10
placeholder="{% trans 'To parse recipe manually: Paste JSON document here or a web page source that contains one or more JSON elements here.' %}" style="font-size: 12px">
</textarea>
</div>
<br>
<button @click="loadRecipeJson()" class="btn btn-primary shadow-none" type="button"
id="id_btn_html"><i class="fas fa-code"></i> {% trans 'Import' %}
<button @click="loadPreviewRaw()" class="btn btn-primary shadow-none" type="button"
id="id_btn_raw"><i class="fas fa-code"></i> {% trans 'Preview Import' %}
</button>
</div>
</div>
<!-- Manually import from HTML -->
<div class="row tab-pane fade show" id="nav-html" role="tabpanel">
<div class="col-md-12">
<div class="input-group input-group-lg">
<textarea class="form-control input-group-append" v-model="html_data" rows=10 placeholder="{% trans 'Paste html source here to parse recipe manually.' %}" style="font-size: 12px">
</textarea>
</div>
<br>
<button @click="loadPreviewHTML()" class="btn btn-primary shadow-none" type="button"
id="id_btn_HTML"><i class="fas fa-code"></i> {% trans 'Preview Import' %}
</button>
</div>
</div>
@ -80,11 +100,12 @@
<i class="fas fa-spinner fa-spin fa-8x"></i>
</div>
<!-- recipe preview before Import -->
<div class="container-fluid" v-if="preview" id="manage_tree">
<!-- recipe preview on HTML Import -->
<div class="container-fluid" v-if="parsed" id="manage_tree">
<h2></h2>
<div class="row">
<div class="col" style="max-width:50%">
<!-- start of preview card -->
<div class="card card-border-primary" >
<div class="card-header">
<h3>{% trans 'Preview Recipe Data' %}</h3>
@ -93,70 +114,54 @@
<div class="card-body p-2">
<div class="card mb-2">
<div class="card-header" v-b-toggle.collapse-name>
<div class="row px-3" style="justify-content:space-between;">
{% trans 'Name' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="recipe_json.name=''" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="small text-muted">{% trans 'Text dragged here will be appended to the name.'%}</div>
<div class="card-header" style="display:flex; justify-content:space-between;">
{% trans 'Name' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="deletePreview('name')" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="card-body drop-zone" @drop="replacePreview('name', $event)" @dragover.prevent @dragenter.prevent>
<div class="card-text">[[recipe_json.name]]</div>
</div>
<b-collapse id="collapse-name" visible class="mt-2">
<div class="card-body drop-zone" @drop="replacePreview('name', $event)" @dragover.prevent @dragenter.prevent>
<div class="card-text">[[recipe_json.name]]</div>
</div>
</b-collapse>
</div>
<div class="card mb-2">
<div class="card-header" v-b-toggle.collapse-description>
<div class="row px-3" style="justify-content:space-between;">
{% trans 'Description' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="recipe_json.description=''" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="small text-muted">{% trans 'Text dragged here will be appended to the description.'%}</div>
<div class="card-header" style="display:flex; justify-content:space-between;">
{% trans 'Description' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="deletePreview('description')" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="card-body drop-zone" @drop="replacePreview('description', $event)" @dragover.prevent @dragenter.prevent>
<div class="card-text">[[recipe_json.description]]</div>
</div>
<b-collapse id="collapse-description" visible class="mt-2">
<div class="card-body drop-zone" @drop="replacePreview('description', $event)" @dragover.prevent @dragenter.prevent>
<div class="card-text">[[recipe_json.description]]</div>
</div>
</b-collapse>
</div>
<div class="card mb-2">
<div class="card-header" v-b-toggle.collapse-kw>
<div class="row px-3" style="justify-content:space-between;">
{% trans 'Keywords' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="recipe_json.keywords=[]" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="small text-muted">{% trans 'Keywords dragged here will be appended to current list'%}</div>
<div class="card-header" style="display:flex; justify-content:space-between;">
{% trans 'Keywords' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="deletePreview('keywords')" title="{% trans 'Clear Contents'%}"></i>
</div>
<b-collapse id="collapse-kw" visible class="mt-2">
<div class="card-body drop-zone" @drop="replacePreview('keywords', $event)" @dragover.prevent @dragenter.prevent>
<div v-for="kw in recipe_json.keywords">
<div class="card-text">[[kw.text]] </div>
</div>
<div class="card-body drop-zone" @drop="replacePreview('keywords', $event)" @dragover.prevent @dragenter.prevent>
<div v-for="kw in recipe_json.keywords">
<div class="card-text">[[kw]] </div>
</div>
</b-collapse>
</div>
</div>
<div class="card mb-2">
<div class="card-header" v-b-toggle.collapse-image style="display:flex; justify-content:space-between;">
<div class="card-header" style="display:flex; justify-content:space-between;">
{% trans 'Image' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="recipe_json.image=''" title="{% trans 'Clear Contents'%}"></i>
<i class="fas fa-eraser" style="cursor:pointer;" @click="deletePreview('image')" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="card-body m-0 p-0 drop-zone" @drop="replacePreview('image', $event)" @dragover.prevent @dragenter.prevent>
<img class="card-img" v-bind:src="[[recipe_json.image]]" alt="Recipe Image">
</div>
<b-collapse id="collapse-image" visible class="mt-2">
<div class="card-body m-0 p-0 drop-zone" @drop="replacePreview('image', $event)" @dragover.prevent @dragenter.prevent>
<img class="card-img" v-bind:src="[[recipe_json.image]]" alt="Recipe Image">
</div>
</b-collapse>
</div>
<div class = "row mb-2">
<div class="col">
<div class="card">
<div class="card-header p-1" style="display:flex; justify-content:space-between;">
<div class="card" >
<div class="card-header p-1" style="display:flex; justify-content:space-between;">
{% trans 'Servings' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="recipe_json.servings=''" title="{% trans 'Clear Contents'%}"></i>
<i class="fas fa-eraser" style="cursor:pointer;" @click="deletePreview('servings')" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="card-body p-2 drop-zone" @drop="replacePreview('servings', $event)" @dragover.prevent @dragenter.prevent>
<div class="card-text">[[recipe_json.servings]]</div>
@ -167,7 +172,7 @@
<div class="card">
<div class="card-header p-1" style="display:flex; justify-content:space-between;">
{% trans 'Prep Time' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="recipe_json.prepTime=''" title="{% trans 'Clear Contents'%}"></i>
<i class="fas fa-eraser" style="cursor:pointer;" @click="deletePreview('prepTime')" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="card-body p-2 drop-zone" @drop="replacePreview('prepTime', $event)" @dragover.prevent @dragenter.prevent>
<div class="card-text">[[recipe_json.prepTime]]</div>
@ -178,7 +183,7 @@
<div class="card">
<div class="card-header p-1" style="display:flex; justify-content:space-between;">
{% trans 'Cook Time' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="recipe_json.cookTime=''" title="{% trans 'Clear Contents'%}"></i>
<i class="fas fa-eraser" style="cursor:pointer;" @click="deletePreview('cookTime')" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="card-body p-2 drop-zone" @drop="replacePreview('cookTime', $event)" @dragover.prevent @dragenter.prevent>
<div class="card-text">[[recipe_json.cookTime]]</div>
@ -188,96 +193,45 @@
</div>
<div class="card mb-2">
<div class="card-header" v-b-toggle.collapse-ing>
<div class="row px-3" style="display:flex; justify-content:space-between;">
{% trans 'Ingredients' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="recipe_json.recipeIngredient=[]" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="small text-muted">{% trans 'Ingredients dragged here will be appended to current list.'%}</div>
<div class="card-header" style="display:flex; justify-content:space-between;">
{% trans 'Ingredients' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="deletePreview('ingredients')" title="{% trans 'Clear Contents'%}"></i>
</div>
<b-collapse id="collapse-ing" visible class="mt-2">
<div class="card-body drop-zone" @drop="replacePreview('ingredients', $event)" @dragover.prevent @dragenter.prevent>
<ul class="list-group list-group">
<div v-for="i in recipe_json.recipeIngredient">
<li class="row border-light" >
<div class="col-sm-1 border">[[i.amount]]</div>
<div class="col-sm border">[[i.unit.text]]</div>
<div class="col-sm border">[[i.ingredient.text]]</div>
<div class="col-sm border">[[i.note]]</div>
</li>
</div>
</ul>
<div class="card-body drop-zone" @drop="replacePreview('ingredients', $event)" @dragover.prevent @dragenter.prevent>
<div v-for="i in recipe_json.recipeIngredient">
<div class="card-text">[[i.amount]] [[i.unit.text]] [[i.ingredient.text]] [[i.note]]</div>
</div>
</b-collapse>
</div>
</div>
<div class="card mb-2">
<div class="card-header" v-b-toggle.collapse-instructions>
<div class="row px-3" style="justify-content:space-between;">
<div class="card-header" style="display:flex; justify-content:space-between;">
{% trans 'Instructions' %}
<i class="fas fa-eraser" style="cursor:pointer;" @click="recipe_json.recipeInstructions=''" title="{% trans 'Clear Contents'%}"></i>
<i class="fas fa-eraser" style="cursor:pointer;" @click="deletePreview('instructions')" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="small text-muted">{% trans 'Recipe instructions dragged here will be appended to current instructions.'%}</div>
<div class="card-body drop-zone" @drop="replacePreview('instructions', $event)" @dragover.prevent @dragenter.prevent>
<div class="card-text">[[recipe_json.recipeInstructions]]</div>
</div>
<b-collapse id="collapse-instructions" visible class="mt-2">
<div class="card-body drop-zone" @drop="replacePreview('instructions', $event)" @dragover.prevent @dragenter.prevent>
<div class="card-text">[[recipe_json.recipeInstructions]]</div>
</div>
</b-collapse>
</div>
</div>
</div>
<br/>
<!-- end of preview card -->
<button @click="showRecipe()" class="btn btn-primary shadow-none" type="button"
<button @click="loadRecipeHTML()" class="btn btn-primary shadow-none" type="button"
id="id_btn_json"><i class="fas fa-code"></i> {% trans 'Import' %}
</button>
</div>
<!-- start of source data -->
<div class="col" style="max-width:50%">
<div class="card card-border-primary">
<div class="card-header">
<div class="card-header">
<h3>{% trans 'Discovered Attributes' %}</h3>
<div class='small text-muted'>
{% trans 'Drag recipe attributes from below into the appropriate box on the left. Click any node to display its full properties.' %}
</div>
</div>
<div class="btn-group btn-group-toggle" data-toggle="buttons">
<label class="btn btn-outline-info btn-sm active" @click="preview_type='json'">
<input type="radio" autocomplete="off" checked> json
</label>
<label class="btn btn-outline-info btn-sm" @click="preview_type='html'">
<input type="radio" autocomplete="off"> html
</label>
<label class="btn btn-outline-info btn-sm" @click="preview_type='image'">
<input type="radio" autocomplete="off"> images
</label>
</div>
<i :class="[show_blank ? 'fa-chevron-up' : 'fa-chevron-down', 'fas']"
style="cursor:pointer;"
@click="show_blank=!show_blank"
title="{% trans 'Show Blank Field' %}"></i>
<div class="card-body p-1">
<div class="card card-border-primary" v-if="show_blank">
<div class="card-header">
<div class="row px-3" style="justify-content:space-between;">
{% trans 'Blank Field' %}
<i class="fas fa-eraser justify-content-end" style="cursor:pointer;" @click="blank_field=''" title="{% trans 'Clear Contents'%}"></i>
</div>
<div class="small text-muted">{% trans 'Items dragged to Blank Field will be appended.'%}</div>
</div>
<div class="card-body drop-zone"
@drop="replacePreview('blank', $event)"
@dragover.prevent
@dragenter.prevent
draggable
@dragstart="htmlDragStart($event)">
[[blank_field]]
</div>
</div>
<!-- start of json data -->
<v-jstree v-if="preview_type=='json'" :data="recipe_tree"
<div class="card-body">
<v-jstree :data="recipe_tree"
text-field-name="name"
collapse:true
draggable
@ -301,37 +255,13 @@
</template>
</v-jstree>
<!-- start of html data -->
<div v-if="preview_type=='html'">
<ul class="list-group list-group-flush" v-for="(txt, key) in recipe_html">
<div class="list-group-item bg-light m-0 small"
draggable
@dragstart="htmlDragStart($event)"
style="display:flex; justify-content:space-between;">
[[txt]]
<i class="fas fa-minus-square" style="cursor:pointer; color:red" @click="$delete(recipe_html, key)" title="{% trans 'Delete Text'%}"></i>
</div>
</ul>
</div>
<!-- start of images -->
<div v-if="preview_type=='image'">
<ul class="list-group list-group-flush" v-for="(img, key) in images">
<div class="list-group-item bg-light m-0 small"
draggable
@dragstart="imageDragStart($event)"
style="display:flex; justify-content:space-between;">
<img class="card-img" v-bind:src=[[img]] alt="Image">
<i class="fas fa-minus-square" style="cursor:pointer; color:red" @click="$delete(images, key)" title="{% trans 'Delete image'%}"></i>
</div>
</ul>
</div>
</div>
</div>
</div>
<!-- end of json tree -->
</div>
</div>
<!-- end of recipe preview before Import -->
<!-- end of recipe preview on HTML Import -->
<template v-if="recipe_data !== undefined">
@ -582,20 +512,13 @@
recipe_data: undefined,
error: undefined,
loading: false,
preview: false,
preview_type: 'json',
parsed: false,
all_keywords: false,
importing_recipe: false,
recipe_json: undefined,
recipe_tree: undefined,
recipe_html: undefined,
automatic: true,
show_blank: false,
blank_field: '',
recipe_app: 'DEFAULT',
recipe_files: [],
images: [],
mode: 'url'
recipe_tree1: undefined,
html_data: undefined,
},
directives: {
tabindex: {
@ -673,6 +596,58 @@
this.makeToast(gettext('Error'), gettext('There was an error loading a resource!') + err.bodyText, 'danger')
})
},
loadRecipeJson: function () {
this.recipe_data = undefined
this.error = undefined
this.loading = true
this.$http.post("{% url 'api_recipe_from_json' %}", {'json': this.json_data}, {emulateJSON: true}).then((response) => {
console.log(response.data)
this.recipe_data = response.data;
this.loading = false
}).catch((err) => {
this.error = err.data
this.loading = false
console.log(err)
this.makeToast(gettext('Error'), gettext('There was an error loading a resource!') + err.bodyText, 'danger')
})
},
loadPreviewRaw: function () {
this.recipe_json = undefined
this.recipe_tree = undefined
this.error = undefined
this.loading = true
this.$http.post("{% url 'api_recipe_from_html' %}", {'html_data': this.html_data}, {emulateJSON: true}).then((response) => {
console.log(response.data)
this.recipe_json = response.data['recipe_json'];
this.recipe_tree1 = JSON.stringify(response.data['recipe_tree'], null, 2);
this.recipe_tree = response.data['recipe_tree'];
this.loading = false
this.parsed = true
}).catch((err) => {
this.error = err.data
this.loading = false
this.parsed = false
console.log(err)
this.makeToast(gettext('Error'), gettext('There was an error loading a resource!') + err.bodyText, 'danger')
})
},
loadRecipeHTML: function () {
this.error = undefined
this.loading = true
this.parsed = false
this.recipe_json['@type'] = "Recipe"
this.$http.post("{% url 'api_recipe_from_json' %}", {'json': JSON.stringify(this.recipe_json)}, {emulateJSON: true}).then((response) => {
console.log(response.data)
this.recipe_data = response.data;
this.loading = false
}).catch((err) => {
this.error = err.data
this.loading = false
console.log(err)
this.makeToast(gettext('Error'), gettext('There was an error loading a resource!') + err.bodyText, 'danger')
})
},
importRecipe: function () {
if (this.recipe_data.name.length > 128) {
this.makeToast(gettext('Error'), gettext('Recipe name is longer than 128 characters'), 'danger')
@ -806,6 +781,37 @@
var index = node.parentItem.indexOf(item)
node.parentItem.splice(index, 1)
},
deletePreview: function(field) {
switch (field) {
case 'name':
this.recipe_json.name=""
break;
case 'description':
this.recipe_json.description=""
break;
case 'image':
this.recipe_json.image=""
break;
case 'keywords':
this.recipe_json.keywords=[]
break;
case 'servings':
this.recipe_json.servings=""
break;
case 'prepTime':
this.recipe_json.prepTime=""
break;
case 'cookTime':
this.recipe_json.cookTime=""
break;
case 'ingredients':
this.recipe_json.recipeIngredient=[]
break;
case 'instructions':
this.recipe_json.recipeInstructions=""
break;
}
},
itemClick: function (node, item, e) {
this.makeToast(gettext('Details'), node.model.value, 'info')
},
@ -816,14 +822,6 @@
e.dataTransfer.setData('value', node.model.value)
},
htmlDragStart: function (e) {
console.log(e.target.innerText)
e.dataTransfer.setData('value', e.target.innerText)
},
imageDragStart: function (e) {
console.log(e.target.src)
e.dataTransfer.setData('value', e.target.src)
},
replacePreview: function(field, e) {
v = e.dataTransfer.getData('value')
if (e.dataTransfer.getData('hasChildren')) {
@ -832,20 +830,19 @@
}
switch (field) {
case 'name':
this.recipe_json.name = [this.recipe_json.name, v].filter(Boolean).join(" ");
this.recipe_json.name=v
break;
case 'description':
this.recipe_json.description = [this.recipe_json.description, v].filter(Boolean).join(" ");
this.recipe_json.description=v
break;
case 'image':
this.recipe_json.image=v
break;
case 'keywords':
let new_keyword = {'text': v, 'id': null}
this.recipe_json.keywords.push(new_keyword)
this.recipe_json.keywords.push(v)
break;
case 'servings':
this.recipe_json.servings=parseInt(v.match(/\b\d+\b/)[0])
this.recipe_json.servings=v
break;
case 'prepTime':
this.recipe_json.prepTime=v
@ -854,29 +851,18 @@
this.recipe_json.cookTime=v
break;
case 'ingredients':
this.$http.post('{% url 'api_ingredient_from_string' %}', {text: v}, {emulateJSON: true}).then((response) => {
console.log(response)
let new_ingredient={
unit: {id: Math.random() * 1000, text: response.body.unit},
amount: String(response.body.amount),
ingredient: {id: Math.random() * 1000, text: response.body.food},
note: response.body.note,
original: v
let new_ingredient={
unit: {id: Math.random() * 1000, text: ""},
amount: "",
ingredient: {id: Math.random() * 1000, text: v}
}
this.recipe_json.recipeIngredient.push(new_ingredient)
}).catch((err) => {
console.log(err)
this.makeToast(gettext('Error'), gettext('Something went wrong.'), 'danger')
})
this.recipe_json.recipeIngredient=[new_ingredient]
break;
case 'instructions':
this.recipe_json.recipeInstructions = [this.recipe_json.recipeInstructions, v].filter(Boolean).join("\n\n");
break;
case 'blank':
this.blank_field = [this.blank_field, v].filter(Boolean).join(" ");
this.recipe_json.recipeInstructions=this.recipe_json.recipeInstructions.concat(v)
break;
}
},
}
}
});
</script>

View File

@ -36,7 +36,7 @@ from cookbook.helper.permission_helper import (CustomIsAdmin, CustomIsGuest,
CustomIsShared, CustomIsUser,
group_required)
from cookbook.helper.recipe_url_import import get_from_html, find_recipe_json
from cookbook.helper.recipe_html_import import get_from_html
from cookbook.helper.recipe_html_import import get_from_raw
from cookbook.models import (CookLog, Food, Ingredient, Keyword, MealPlan,
MealType, Recipe, RecipeBook, ShoppingList,
ShoppingListEntry, ShoppingListRecipe, Step,
@ -700,11 +700,20 @@ def recipe_from_url(request):
@group_required('user')
def recipe_from_html(request):
html_data = request.POST['html_data']
recipe_json, recipe_tree = get_from_html(html_data)
return JsonResponse({
'recipe_tree': recipe_tree,
'recipe_json': recipe_json
})
recipe_json, recipe_tree = get_from_raw(html_data)
if len(recipe_tree) == 0 and len(recipe_json) == 0:
return JsonResponse(
{
'error': True,
'msg': _('The requested page refused to provide any information (Status Code 403).') # noqa: E501
},
status=400
)
else:
return JsonResponse({
'recipe_tree': recipe_tree,
'recipe_json': recipe_json
})
@group_required('admin')