×

临时的简单主页UI开源分享

消耗积分:0 | 格式:zip | 大小:0.16 MB | 2022-12-29

李娓仑

分享资料个

描述

介绍

当我们开始 Casa Jasmina 项目时,我们清楚地想到了“家的意义是什么?”这个问题,数字时代在我们生活的私人、秘密场所发生的巨大变化使这个问题变得更有意义。

在这种情况下,对话式 UI 的兴起(或回归?)为有趣的语音交互做好了准备,让我们的眼睛从屏幕上解放出来。在语音平台中,Snips 提供了一个强大的替代主要谷歌/亚马逊主流产品的选择——我们喜欢这个,因为它更透明,可以在雾计算环境中离线工作。

Casa Jasmina 是/成为一个临时的家,一个由临时居民居住的展览空间,因此我们致力于为这个特定的目标群体开发解决方案。临时住所确实是新酒店,我们在考虑短期住宿甚至老年人需求的情况下进行了这项工作。特殊需求的特殊工具。

我们以一种非常天真的方式尝试创建一个简单的层来满足客人对家庭环境的可能要求。这也意味着技术驱动的解决方案,但这首先迫使我们规范存储、保持组织的位置。我们想创建一个通用的多语言家庭标签系统我们从定义英语/中文/意大利语词汇开始——请通过添加你的语言来贡献。我们后来准备了使用磁铁贴在家具上的标志(您可以自己做),我们希望简化语言选择器,让房东可以在他的城市/家中选择最相关的语言(柏林的房东可能会觉得意大利语不合适,并且会加上法语和西班牙语等……)

Node-Red、开放硬件和 Snips:无限机会

开源生态系统为家庭环境提供了许多具有挑战性和强大的机会。Home Assistant、OpenHab和许多其他软件的社区不断扩大和壮大。作为不同解决方案的集成商,桥接行业和 DIY 标准,我们选择在Node-Red 中实施我们的家庭自动化。

先决条件

为了完成这个项目,您将需要:

  • Snips.ai 设备和帐户
  • Node-RED 实例

Node-RED 是必需的,因为该应用程序将其用作数据库配置和自动化的 REST API。您可以将两者安装在同一台设备上,但如果您也将 Node-RED 用于其他流程,我建议您将它们分开。

基本安装

在存储库中,您会找到node-red-flow.json 此文件是首次设置数据库的基本模板。在里面你会发现数据库 http 请求流和一些注入,可以根据你自己的需要轻松更改数据库内容(例如更改用户名或类别的答案)。

您可以通过复制 Node-RED 实例的 url 并在浏览器的搜索栏中添加/simpleuidb来检查 http 调用是否有效,它应该会为您提供一个包含您设置的所有内容的 json 对象。

现在 Node-RED 端已完成并正常工作,我们可以切换到 Snips.ai 端。

打开您的 Web 浏览器并使用您的凭据连接到,在这里您将找到您到目前为止创建的所有助手。我们的应用程序在撰写本文时仅适用于英语,因此您需要英语助手才能使用它。

打开你的助手,你会看到你安装的应用程序;要安装一个新的,打开应用程序商店并寻找简单的用户界面或点击此链接。安装该应用程序,然后通过单击部署来部署您新培训的助手。

将命令粘贴到您的计算机终端,让 SAM 实用程序执行它的工作。片刻之后,安装过程将要求您输入数据库 url:复制并粘贴您用于检查数据库是否正常工作的 url ( http://:1880/simpleuidb )。现在系统已配置好,Snips 将回答“嘿 Snips,帮帮我!”。

高级使用和配置

该应用程序支持多种多样的用户集成和定制。通过在控制台上分叉它,您可以访问我们配置的所有意图,并且可以根据自己的需要修改它们。

简单的用户界面支持快捷方式。您不必每次都说“嘿 Snips 帮帮我”,而是使用类别的关键字来选择您想要的内容(例如“嘿 Snips,交通”为您提供交通信息)。您可以通过向意图添加示例来添加任何类型的快捷方式。

您可以通过在类别中定义 url 字段来向特定类别添加操作。

"transportation":{
   "categories":null 
   "transportation":"Check the dashboard to find the tourist guide, we                             are close to taxis and underground station",
   "url":"http://192.168.0.115:1880/callback" //add this field to add actions
}

这样,当 Snips 检测到意图时,它会向您指定的地址发出 http get 请求。

添加新类别非常简单。在数据库中,将您的新类别添加到类别数组中,并添加一个类别对象以明确是否存在子类别和答案。

{
...
"categories":["food","sleeping","bathroom","cleaning","temperature","emergency","transportation","NEW CATEGORY"],
...
"NEW CATEGORY":{"categories":null,
                "NEW CATEGORY":"SNIPS ANSWER"
                }
...
}

然后在意向控制台中,在 WhereIs 意向中添加与您添加的类别名称相匹配的示例。这样 Snips 将识别类别并且应用程序将正确路由它。

添加带有子类别的类别需要创建新意图并编辑操作脚本。在 Simple UI 应用程序中,为您的类别添加意图,您将子类别放在其中作为示例。参数字段必须称为“类别”。

在脚本中使用模板回调 (food_callback) 并根据您的配置更改参数。

   def NEWCATEGORY_callback(self, hermes, intent_message):
       global databaseurl
       #get categories from database
       good_category = requests.get(
           databaseurl).json().get("NEW CATEGORY").get("categories")
       category = None
       if intent_message.slots: #check is user request match subcategory
           category = intent_message.slots.category.first().value
           if category.encode("utf-8") not in good_category:
               category = None
       if category is None:
           Answer = "Sorry I didn't understand. Say " + \
               ", ".join(good_category) + " to get help."
           hermes.publish_continue_session(
               intent_message.session_id, Answer, ["casajasmina:INTENTNAME"])
       else:
           #get the answer from the database
           Answer = str(requests.get(
               databaseurl).json().get("NEW CATEGORY").get(category))
           hermes.publish_end_session(intent_message.session_id, Answer)

然后将其添加到与您的意图名称匹配的master_intent_callback elif 条件和whereIs_callback中。这样,助手将能够将您的请求路由到正确的流程。

#generic callback for every category in the database, handles single and multi category topics
   def whereIs_callback(self, hermes, intent_message):
.....
               #multi category handling
               Answer = "You asked for " + category + \
                   ", I can give you tips on " + ", ".join(subcategory)
               #add new intent here...
               hermes.publish_continue_session(intent_message.session_id, Answer, ["casajasmina:Food", "casajasmina:emergency","casajasmina:INTENTNAME]) 
.....
def master_intent_callback(self, hermes, intent_message):
       coming_intent = intent_message.intent.intent_name
       if coming_intent == 'casajasmina:WhereIs':
           self.whereIs_callback(hermes, intent_message)
       elif coming_intent == 'casajasmina:ConnectMe':
           self.askHelp_callback(hermes, intent_message)
       elif coming_intent == 'casajasmina:Food':
           self.food_callback(hermes, intent_message)
       elif coming_intent == 'casajasmina:emergency':
           self.emergency_callback(hermes, intent_message)
       elif coming_intent == 'casajasmina:INTENTNAME':
           self.NEWCATEGORY_callback(hermes, intent_message)

结论

该项目正在持续开发中。我们正在添加新功能,让助手感觉不那么机械和笨重,完善其结构和交互。下一个里程碑是发布多语言支持(最初是意大利语)并简化标签系统和 Snips 行为之间的集成。


声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉

评论(0)
发评论

下载排行榜

全部0条评论

快来发表一下你的评论吧 !

'+ '

'+ '

'+ ''+ '
'+ ''+ ''+ '
'+ ''+ '' ); $.get('/article/vipdownload/aid/'+webid,function(data){ if(data.code ==5){ $(pop_this).attr('href',"/login/index.html"); return false } if(data.code == 2){ //跳转到VIP升级页面 window.location.href="//m.obk20.com/vip/index?aid=" + webid return false } //是会员 if (data.code > 0) { $('body').append(htmlSetNormalDownload); var getWidth=$("#poplayer").width(); $("#poplayer").css("margin-left","-"+getWidth/2+"px"); $('#tips').html(data.msg) $('.download_confirm').click(function(){ $('#dialog').remove(); }) } else { var down_url = $('#vipdownload').attr('data-url'); isBindAnalysisForm(pop_this, down_url, 1) } }); }); //是否开通VIP $.get('/article/vipdownload/aid/'+webid,function(data){ if(data.code == 2 || data.code ==5){ //跳转到VIP升级页面 $('#vipdownload>span').text("开通VIP 免费下载") return false }else{ // 待续费 if(data.code == 3) { vipExpiredInfo.ifVipExpired = true vipExpiredInfo.vipExpiredDate = data.data.endoftime } $('#vipdownload .icon-vip-tips').remove() $('#vipdownload>span').text("VIP免积分下载") } }); }).on("click",".download_cancel",function(){ $('#dialog').remove(); }) var setWeixinShare={};//定义默认的微信分享信息,页面如果要自定义分享,直接更改此变量即可 if(window.navigator.userAgent.toLowerCase().match(/MicroMessenger/i) == 'micromessenger'){ var d={ title:'临时的简单主页UI开源分享',//标题 desc:$('[name=description]').attr("content"), //描述 imgUrl:'https://'+location.host+'/static/images/ele-logo.png',// 分享图标,默认是logo link:'',//链接 type:'',// 分享类型,music、video或link,不填默认为link dataUrl:'',//如果type是music或video,则要提供数据链接,默认为空 success:'', // 用户确认分享后执行的回调函数 cancel:''// 用户取消分享后执行的回调函数 } setWeixinShare=$.extend(d,setWeixinShare); $.ajax({ url:"//www.obk20.com/app/wechat/index.php?s=Home/ShareConfig/index", data:"share_url="+encodeURIComponent(location.href)+"&format=jsonp&domain=m", type:'get', dataType:'jsonp', success:function(res){ if(res.status!="successed"){ return false; } $.getScript('https://res.wx.qq.com/open/js/jweixin-1.0.0.js',function(result,status){ if(status!="success"){ return false; } var getWxCfg=res.data; wx.config({ //debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。 appId:getWxCfg.appId, // 必填,公众号的唯一标识 timestamp:getWxCfg.timestamp, // 必填,生成签名的时间戳 nonceStr:getWxCfg.nonceStr, // 必填,生成签名的随机串 signature:getWxCfg.signature,// 必填,签名,见附录1 jsApiList:['onMenuShareTimeline','onMenuShareAppMessage','onMenuShareQQ','onMenuShareWeibo','onMenuShareQZone'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2 }); wx.ready(function(){ //获取“分享到朋友圈”按钮点击状态及自定义分享内容接口 wx.onMenuShareTimeline({ title: setWeixinShare.title, // 分享标题 link: setWeixinShare.link, // 分享链接 imgUrl: setWeixinShare.imgUrl, // 分享图标 success: function () { setWeixinShare.success; // 用户确认分享后执行的回调函数 }, cancel: function () { setWeixinShare.cancel; // 用户取消分享后执行的回调函数 } }); //获取“分享给朋友”按钮点击状态及自定义分享内容接口 wx.onMenuShareAppMessage({ title: setWeixinShare.title, // 分享标题 desc: setWeixinShare.desc, // 分享描述 link: setWeixinShare.link, // 分享链接 imgUrl: setWeixinShare.imgUrl, // 分享图标 type: setWeixinShare.type, // 分享类型,music、video或link,不填默认为link dataUrl: setWeixinShare.dataUrl, // 如果type是music或video,则要提供数据链接,默认为空 success: function () { setWeixinShare.success; // 用户确认分享后执行的回调函数 }, cancel: function () { setWeixinShare.cancel; // 用户取消分享后执行的回调函数 } }); //获取“分享到QQ”按钮点击状态及自定义分享内容接口 wx.onMenuShareQQ({ title: setWeixinShare.title, // 分享标题 desc: setWeixinShare.desc, // 分享描述 link: setWeixinShare.link, // 分享链接 imgUrl: setWeixinShare.imgUrl, // 分享图标 success: function () { setWeixinShare.success; // 用户确认分享后执行的回调函数 }, cancel: function () { setWeixinShare.cancel; // 用户取消分享后执行的回调函数 } }); //获取“分享到腾讯微博”按钮点击状态及自定义分享内容接口 wx.onMenuShareWeibo({ title: setWeixinShare.title, // 分享标题 desc: setWeixinShare.desc, // 分享描述 link: setWeixinShare.link, // 分享链接 imgUrl: setWeixinShare.imgUrl, // 分享图标 success: function () { setWeixinShare.success; // 用户确认分享后执行的回调函数 }, cancel: function () { setWeixinShare.cancel; // 用户取消分享后执行的回调函数 } }); //获取“分享到QQ空间”按钮点击状态及自定义分享内容接口 wx.onMenuShareQZone({ title: setWeixinShare.title, // 分享标题 desc: setWeixinShare.desc, // 分享描述 link: setWeixinShare.link, // 分享链接 imgUrl: setWeixinShare.imgUrl, // 分享图标 success: function () { setWeixinShare.success; // 用户确认分享后执行的回调函数 }, cancel: function () { setWeixinShare.cancel; // 用户取消分享后执行的回调函数 } }); }); }); } }); } function openX_ad(posterid, htmlid, width, height) { if ($(htmlid).length > 0) { var randomnumber = Math.random(); var now_url = encodeURIComponent(window.location.href); var ga = document.createElement('iframe'); ga.src = 'https://www1.elecfans.com/www/delivery/myafr.php?target=_blank&cb=' + randomnumber + '&zoneid=' + posterid+'&prefer='+now_url; ga.width = width; ga.height = height; ga.frameBorder = 0; ga.scrolling = 'no'; var s = $(htmlid).append(ga); } } openX_ad(828, '#berry-300', 300, 250);